fix(workspaces): show load error before setup prompt

src/context/WorkspaceContext.tsx

@@ -30,6 +30,8 @@ export const WorkspaceProvider = ({ children }: { children: ReactNode }) => {
   const [workspaces, setWorkspaces] = useState<Workspace[]>([])
   const [activeWorkspace, setActiveWorkspaceState] = useState<Workspace | null>(null)
   const [isLoading, setIsLoading] = useState(true)
+  const [hasLoadedWorkspaces, setHasLoadedWorkspaces] = useState(false)
+  const [workspaceLoadError, setWorkspaceLoadError] = useState(false)
   const [newWorkspaceName, setNewWorkspaceName] = useState("")
   const [isCreatingFirst, setIsCreatingFirst] = useState(false)
 
@@ -38,16 +40,20 @@ export const WorkspaceProvider = ({ children }: { children: ReactNode }) => {
 
   const refreshWorkspaces = async () => {
     if (!isAuthenticated || isRateLimitActive()) {
+      setHasLoadedWorkspaces(false)
+      setWorkspaceLoadError(false)
       setIsLoading(false)
       return
     }
 
     try {
       setIsLoading(true)
+      setWorkspaceLoadError(false)
       const response = await fetchWorkspaces()
 
       const data = Array.isArray(response) ? response : (response?.results || [])
       setWorkspaces(data)
+      setHasLoadedWorkspaces(true)
 
       if (data.length > 0) {
         const storedId = localStorage.getItem("activeWorkspaceId")
@@ -64,6 +70,8 @@ export const WorkspaceProvider = ({ children }: { children: ReactNode }) => {
       }
     } catch (error) {
       console.error(error)
+      setWorkspaceLoadError(true)
+      setHasLoadedWorkspaces(false)
     } finally {
       setIsLoading(false)
     }
@@ -71,6 +79,8 @@ export const WorkspaceProvider = ({ children }: { children: ReactNode }) => {
 
   useEffect(() => {
     if (!isAuthenticated || rateLimited) {
+      setHasLoadedWorkspaces(false)
+      setWorkspaceLoadError(false)
       setIsLoading(false)
       return
     }
@@ -92,6 +102,8 @@ export const WorkspaceProvider = ({ children }: { children: ReactNode }) => {
       setIsCreatingFirst(true)
       const newWs = await createWorkspace({ name, description: "" }) 
       setWorkspaces((prev) => [...prev, newWs])
+      setHasLoadedWorkspaces(true)
+      setWorkspaceLoadError(false)
       setActiveWorkspace(newWs)
       toast.success(t.workspace?.successCreate || t.workspace?.toast?.successCreate || "Workspace created!")
     } catch (error) {
@@ -103,8 +115,29 @@ export const WorkspaceProvider = ({ children }: { children: ReactNode }) => {
     }
   }
 
+  if (!rateLimited && !isLoading && isAuthenticated && workspaceLoadError) {
+    return (
+      <div className="min-h-screen flex items-center justify-center bg-slate-50 dark:bg-slate-900 px-4">
+        <div className="w-full max-w-md bg-white dark:bg-slate-800 p-8 rounded-xl shadow-lg border border-slate-200 dark:border-slate-700">
+          <h2 className="text-2xl font-bold text-slate-900 dark:text-white mb-2">
+            {t.workspace?.fetchError || "Failed to load workspace data"}
+          </h2>
+          <p className="text-slate-600 dark:text-slate-400 mb-6">
+            {t.workspace?.loadErrorDescription || "The backend service may be unavailable. Please try again in a moment."}
+          </p>
+          <Button
+            onClick={() => void refreshWorkspaces()}
+            className="w-full bg-blue-600 hover:bg-blue-700 text-white"
+          >
+            {t.workspace?.retry || "Try again"}
+          </Button>
+        </div>
+      </div>
+    )
+  }
+
   // Force workspace creation if authenticated but none exist
-  if (!rateLimited && !isLoading && isAuthenticated && workspaces.length === 0) {
+  if (!rateLimited && !isLoading && isAuthenticated && hasLoadedWorkspaces && workspaces.length === 0) {
     return (
       <div className="min-h-screen flex items-center justify-center bg-slate-50 dark:bg-slate-900 px-4">
         <div className="w-full max-w-md bg-white dark:bg-slate-800 p-8 rounded-xl shadow-lg border border-slate-200 dark:border-slate-700">