Merge branch 'main' of https://github.com/AutoMaker-Org/automaker into feature/codex-cli

apps/ui/src/hooks/use-project-settings-loader.ts

@@ -0,0 +1,84 @@
+import { useEffect, useRef } from 'react';
+import { useAppStore } from '@/store/app-store';
+import { getHttpApiClient } from '@/lib/http-api-client';
+
+/**
+ * Hook that loads project settings from the server when the current project changes.
+ * This ensures that settings like board backgrounds are properly restored when
+ * switching between projects or restarting the app.
+ */
+export function useProjectSettingsLoader() {
+  const currentProject = useAppStore((state) => state.currentProject);
+  const setBoardBackground = useAppStore((state) => state.setBoardBackground);
+  const setCardOpacity = useAppStore((state) => state.setCardOpacity);
+  const setColumnOpacity = useAppStore((state) => state.setColumnOpacity);
+  const setColumnBorderEnabled = useAppStore((state) => state.setColumnBorderEnabled);
+  const setCardGlassmorphism = useAppStore((state) => state.setCardGlassmorphism);
+  const setCardBorderEnabled = useAppStore((state) => state.setCardBorderEnabled);
+  const setCardBorderOpacity = useAppStore((state) => state.setCardBorderOpacity);
+  const setHideScrollbar = useAppStore((state) => state.setHideScrollbar);
+
+  const loadingRef = useRef<string | null>(null);
+  const currentProjectRef = useRef<string | null>(null);
+
+  useEffect(() => {
+    currentProjectRef.current = currentProject?.path ?? null;
+
+    if (!currentProject?.path) {
+      return;
+    }
+
+    // Prevent loading the same project multiple times
+    if (loadingRef.current === currentProject.path) {
+      return;
+    }
+
+    loadingRef.current = currentProject.path;
+    const requestedProjectPath = currentProject.path;
+
+    const loadProjectSettings = async () => {
+      try {
+        const httpClient = getHttpApiClient();
+        const result = await httpClient.settings.getProject(requestedProjectPath);
+
+        // Race condition protection: ignore stale results if project changed
+        if (currentProjectRef.current !== requestedProjectPath) {
+          return;
+        }
+
+        if (result.success && result.settings) {
+          const bg = result.settings.boardBackground;
+
+          // Apply boardBackground if present
+          if (bg?.imagePath) {
+            setBoardBackground(requestedProjectPath, bg.imagePath);
+          }
+
+          // Settings map for cleaner iteration
+          const settingsMap = {
+            cardOpacity: setCardOpacity,
+            columnOpacity: setColumnOpacity,
+            columnBorderEnabled: setColumnBorderEnabled,
+            cardGlassmorphism: setCardGlassmorphism,
+            cardBorderEnabled: setCardBorderEnabled,
+            cardBorderOpacity: setCardBorderOpacity,
+            hideScrollbar: setHideScrollbar,
+          } as const;
+
+          // Apply all settings that are defined
+          for (const [key, setter] of Object.entries(settingsMap)) {
+            const value = bg?.[key as keyof typeof bg];
+            if (value !== undefined) {
+              (setter as (path: string, val: typeof value) => void)(requestedProjectPath, value);
+            }
+          }
+        }
+      } catch (error) {
+        console.error('Failed to load project settings:', error);
+        // Don't show error toast - just log it
+      }
+    };
+
+    loadProjectSettings();
+  }, [currentProject?.path]);
+}

apps/ui/src/routes/__root.tsx

@@ -29,6 +29,7 @@ import { ThemeOption, themeOptions } from '@/config/theme-options';
 import { SandboxRiskDialog } from '@/components/dialogs/sandbox-risk-dialog';
 import { SandboxRejectionScreen } from '@/components/dialogs/sandbox-rejection-screen';
 import { LoadingState } from '@/components/ui/loading-state';
+import { useProjectSettingsLoader } from '@/hooks/use-project-settings-loader';
 
 const logger = createLogger('RootLayout');
 
@@ -76,6 +77,9 @@ function RootLayoutContent() {
   const isAuthenticated = useAuthStore((s) => s.isAuthenticated);
   const { openFileBrowser } = useFileBrowser();
 
+  // Load project settings when switching projects
+  useProjectSettingsLoader();
+
   const isSetupRoute = location.pathname === '/setup';
   const isLoginRoute = location.pathname === '/login';
   const isLoggedOutRoute = location.pathname === '/logged-out';