gitea +

frontend/components/layout/sidebar.tsx

@@ -1,4 +1,4 @@
-import { useState } from 'react'
+import { useState, useEffect } from 'react'
 import Link from 'next/link'
 import { usePathname, useRouter } from 'next/navigation'
 import { useQuery } from '@tanstack/react-query'
@@ -86,8 +86,15 @@ export function Sidebar({ isOpen, onClose }: SidebarProps = {}) {
         },
     })
 
+    const [mounted, setMounted] = useState(false)
+
+    useEffect(() => {
+        setMounted(true)
+    }, [])
+
     // Default to stored user plan from localStorage if API fails or is loading
     const getStoredPlan = () => {
+        if (!mounted) return 'free'
         if (typeof window !== 'undefined') {
             try {
                 const userStr = localStorage.getItem('user');
@@ -98,8 +105,8 @@ export function Sidebar({ isOpen, onClose }: SidebarProps = {}) {
     }
 
     // Capitalize plan name
-    const planName = (settingsData?.plan || getStoredPlan() || 'free').charAt(0).toUpperCase() +
-        (settingsData?.plan || getStoredPlan() || 'free').slice(1);
+    const currentPlan = settingsData?.plan || getStoredPlan() || 'free'
+    const planName = currentPlan.charAt(0).toUpperCase() + currentPlan.slice(1);
 
     // Determine badge color
     const getBadgeVariant = (plan: string) => {