fix sidebar of companies

apps/dashboard/src/components/layout/Sidebar.tsx

@@ -2,7 +2,7 @@
 
 import Link from 'next/link'
 import { usePathname, useRouter } from 'next/navigation'
-import { useEffect, useState } from 'react'
+import { useEffect, useLayoutEffect, useState } from 'react'
 import {
   LayoutDashboard,
   Car,
@@ -33,6 +33,14 @@ interface BrandSettings {
   logoUrl: string | null
 }
 
+interface CompanySummary {
+  name: string
+  brand?: {
+    displayName?: string | null
+    logoUrl?: string | null
+  } | null
+}
+
 interface SidebarUser {
   displayName: string
   subtitle: string
@@ -81,6 +89,8 @@ const NAV_ITEMS = [
   { href: '/settings', key: 'settings', icon: Settings, minRole: 'OWNER' },
 ] as const
 
+const SIDEBAR_BRAND_KEY = 'dashboard_brand'
+
 const ROLE_RANK: Record<string, number> = { OWNER: 3, MANAGER: 2, AGENT: 1 }
 
 function hasMinRole(employeeRole: string, minRole: string): boolean {
@@ -93,7 +103,7 @@ function notifyParent(message: Record<string, unknown>) {
 }
 
 export default function Sidebar() {
-  const { dict, language, setLanguage } = useDashboardI18n()
+  const { dict, language, setLanguage, theme } = useDashboardI18n()
   const isRtl = language === 'ar'
   const pathname = usePathname()
   const appPath = toDashboardAppPath(pathname)
@@ -110,8 +120,54 @@ export default function Sidebar() {
 
   useEffect(() => { setMounted(true) }, [])
 
+  useLayoutEffect(() => {
+    try {
+      const cached = window.localStorage.getItem(SIDEBAR_BRAND_KEY)
+      if (!cached) return
+      const parsed = JSON.parse(cached) as Partial<BrandSettings>
+      if (typeof parsed.displayName === 'string' && parsed.displayName.trim()) {
+        setBrand({
+          displayName: parsed.displayName,
+          logoUrl: typeof parsed.logoUrl === 'string' ? parsed.logoUrl : null,
+        })
+      }
+    } catch {}
+  }, [])
+
   useEffect(() => {
-    apiFetch<BrandSettings>('/companies/me/brand').then(setBrand).catch(() => {})
+    const token = window.localStorage.getItem(EMPLOYEE_TOKEN_KEY)
+    if (!token) return
+
+    let cancelled = false
+
+    async function loadBrand() {
+      try {
+        const brandData = await apiFetch<BrandSettings | null>('/companies/me/brand')
+        if (cancelled) return
+        if (brandData?.displayName?.trim()) {
+          setBrand(brandData)
+          window.localStorage.setItem(SIDEBAR_BRAND_KEY, JSON.stringify(brandData))
+          return
+        }
+      } catch {}
+
+      try {
+        const company = await apiFetch<CompanySummary>('/companies/me')
+        if (cancelled) return
+
+        const resolvedBrand: BrandSettings = {
+          displayName: company.brand?.displayName?.trim() || company.name,
+          logoUrl: company.brand?.logoUrl ?? null,
+        }
+
+        setBrand(resolvedBrand)
+        window.localStorage.setItem(SIDEBAR_BRAND_KEY, JSON.stringify(resolvedBrand))
+      } catch {}
+    }
+
+    loadBrand()
+
+    return () => { cancelled = true }
   }, [])
 
   useEffect(() => {
@@ -218,7 +274,7 @@ export default function Sidebar() {
               <Car className="h-4 w-4 text-blue-950" />
             )}
           </div>
-          <span className="truncate text-sm font-bold tracking-wide text-white">
+          <span className={`truncate text-sm font-bold tracking-wide ${theme === 'light' ? 'text-blue-600' : 'text-white'}`}>
             {brand?.displayName ?? 'RentalDriveGo'}
           </span>
         </a>