fix: update sidebar rendering logic and enhance credit package success toast

- Updated DashboardSidebar to conditionally render SidebarMain based on loading state.
- Modified CreditPackages to trigger a refresh of credits data and show success toast with a delay to avoid React lifecycle conflicts.

src/components/dashboard/dashboard-sidebar.tsx

@@ -68,7 +68,7 @@ export function DashboardSidebar({
       </SidebarHeader>
 
       <SidebarContent>
-        <SidebarMain items={filteredSidebarLinks} />
+        {!isPending && mounted && <SidebarMain items={filteredSidebarLinks} />}
       </SidebarContent>
 
       <SidebarFooter className="flex flex-col gap-4">

src/components/settings/credits/credit-packages.tsx

@@ -30,7 +30,7 @@ export function CreditPackages() {
   const t = useTranslations('Dashboard.settings.credits.packages');
   const [loadingCredits, setLoadingCredits] = useState(true);
   const [credits, setCredits] = useState<number | null>(null);
-  const { refreshTrigger } = useTransactionStore();
+  const { refreshTrigger, triggerRefresh } = useTransactionStore();
   const currentUser = useCurrentUser();
   const searchParams = useSearchParams();
   const router = useLocaleRouter();
@@ -61,11 +61,13 @@ export function CreditPackages() {
   useEffect(() => {
     const sessionId = searchParams.get('session_id');
     if (sessionId) {
-      // Show success toast
-      toast.success(t('creditsAdded'));
+      // Show success toast (delayed to avoid React lifecycle conflicts)
+      setTimeout(() => {
+        toast.success(t('creditsAdded'));
+      }, 0);
 
       // Refresh credits data to show updated balance
-      fetchCredits();
+      triggerRefresh();
 
       // Clean up URL parameters
       const url = new URL(window.location.href);