refactor: streamline Electron API integration and enhance UI components

- Removed unused Electron API methods and simplified the main process.
- Introduced a new workspace picker modal for improved project selection.
- Enhanced error handling for authentication issues across various components.
- Updated UI styles for dark mode support and added new CSS variables.
- Refactored session management to utilize a centralized API access method.
- Added server routes for workspace management, including directory listing and configuration checks.

apps/server/src/routes/fs.ts

@@ -217,5 +217,103 @@ export function createFsRoutes(_events: EventEmitter): Router {
     }
   });
 
+  // Save image to .automaker/images directory
+  router.post("/save-image", async (req: Request, res: Response) => {
+    try {
+      const { data, filename, mimeType, projectPath } = req.body as {
+        data: string;
+        filename: string;
+        mimeType: string;
+        projectPath: string;
+      };
+
+      if (!data || !filename || !projectPath) {
+        res.status(400).json({
+          success: false,
+          error: "data, filename, and projectPath are required",
+        });
+        return;
+      }
+
+      // Create .automaker/images directory if it doesn't exist
+      const imagesDir = path.join(projectPath, ".automaker", "images");
+      await fs.mkdir(imagesDir, { recursive: true });
+
+      // Decode base64 data (remove data URL prefix if present)
+      const base64Data = data.replace(/^data:image\/\w+;base64,/, "");
+      const buffer = Buffer.from(base64Data, "base64");
+
+      // Generate unique filename with timestamp
+      const timestamp = Date.now();
+      const ext = path.extname(filename) || ".png";
+      const baseName = path.basename(filename, ext);
+      const uniqueFilename = `${baseName}-${timestamp}${ext}`;
+      const filePath = path.join(imagesDir, uniqueFilename);
+
+      // Write file
+      await fs.writeFile(filePath, buffer);
+
+      // Add project path to allowed paths if not already
+      addAllowedPath(projectPath);
+
+      res.json({ success: true, path: filePath });
+    } catch (error) {
+      const message = error instanceof Error ? error.message : "Unknown error";
+      res.status(500).json({ success: false, error: message });
+    }
+  });
+
+  // Serve image files
+  router.get("/image", async (req: Request, res: Response) => {
+    try {
+      const { path: imagePath, projectPath } = req.query as {
+        path?: string;
+        projectPath?: string;
+      };
+
+      if (!imagePath) {
+        res.status(400).json({ success: false, error: "path is required" });
+        return;
+      }
+
+      // Resolve full path
+      const fullPath = path.isAbsolute(imagePath)
+        ? imagePath
+        : projectPath
+          ? path.join(projectPath, imagePath)
+          : imagePath;
+
+      // Check if file exists
+      try {
+        await fs.access(fullPath);
+      } catch {
+        res.status(404).json({ success: false, error: "Image not found" });
+        return;
+      }
+
+      // Read the file
+      const buffer = await fs.readFile(fullPath);
+
+      // Determine MIME type from extension
+      const ext = path.extname(fullPath).toLowerCase();
+      const mimeTypes: Record<string, string> = {
+        ".png": "image/png",
+        ".jpg": "image/jpeg",
+        ".jpeg": "image/jpeg",
+        ".gif": "image/gif",
+        ".webp": "image/webp",
+        ".svg": "image/svg+xml",
+        ".bmp": "image/bmp",
+      };
+
+      res.setHeader("Content-Type", mimeTypes[ext] || "application/octet-stream");
+      res.setHeader("Cache-Control", "public, max-age=3600");
+      res.send(buffer);
+    } catch (error) {
+      const message = error instanceof Error ? error.message : "Unknown error";
+      res.status(500).json({ success: false, error: message });
+    }
+  });
+
   return router;
 }

apps/server/src/routes/setup.ts

@@ -11,9 +11,46 @@ import fs from "fs/promises";
 
 const execAsync = promisify(exec);
 
-// Storage for API keys (in-memory for now, should be persisted)
+// Storage for API keys (in-memory cache)
 const apiKeys: Record<string, string> = {};
 
+// Helper to persist API keys to .env file
+async function persistApiKeyToEnv(key: string, value: string): Promise<void> {
+  const envPath = path.join(process.cwd(), ".env");
+
+  try {
+    let envContent = "";
+    try {
+      envContent = await fs.readFile(envPath, "utf-8");
+    } catch {
+      // .env file doesn't exist, we'll create it
+    }
+
+    // Parse existing env content
+    const lines = envContent.split("\n");
+    const keyRegex = new RegExp(`^${key}=`);
+    let found = false;
+    const newLines = lines.map((line) => {
+      if (keyRegex.test(line)) {
+        found = true;
+        return `${key}=${value}`;
+      }
+      return line;
+    });
+
+    if (!found) {
+      // Add the key at the end
+      newLines.push(`${key}=${value}`);
+    }
+
+    await fs.writeFile(envPath, newLines.join("\n"));
+    console.log(`[Setup] Persisted ${key} to .env file`);
+  } catch (error) {
+    console.error(`[Setup] Failed to persist ${key} to .env:`, error);
+    throw error;
+  }
+}
+
 export function createSetupRoutes(): Router {
   const router = Router();
 
@@ -301,13 +338,16 @@ export function createSetupRoutes(): Router {
 
       apiKeys[provider] = apiKey;
 
-      // Also set as environment variable
-      if (provider === "anthropic") {
+      // Also set as environment variable and persist to .env
+      if (provider === "anthropic" || provider === "anthropic_oauth_token") {
         process.env.ANTHROPIC_API_KEY = apiKey;
+        await persistApiKeyToEnv("ANTHROPIC_API_KEY", apiKey);
       } else if (provider === "openai") {
         process.env.OPENAI_API_KEY = apiKey;
+        await persistApiKeyToEnv("OPENAI_API_KEY", apiKey);
       } else if (provider === "google") {
         process.env.GOOGLE_API_KEY = apiKey;
+        await persistApiKeyToEnv("GOOGLE_API_KEY", apiKey);
       }
 
       res.json({ success: true });

apps/server/src/routes/workspace.ts

@@ -0,0 +1,113 @@
+/**
+ * Workspace routes
+ * Provides API endpoints for workspace directory management
+ */
+
+import { Router, type Request, type Response } from "express";
+import fs from "fs/promises";
+import path from "path";
+import { addAllowedPath } from "../lib/security.js";
+
+export function createWorkspaceRoutes(): Router {
+  const router = Router();
+
+  // Get workspace configuration status
+  router.get("/config", async (_req: Request, res: Response) => {
+    try {
+      const workspaceDir = process.env.WORKSPACE_DIR;
+
+      if (!workspaceDir) {
+        res.json({
+          success: true,
+          configured: false,
+        });
+        return;
+      }
+
+      // Check if the directory exists
+      try {
+        const stats = await fs.stat(workspaceDir);
+        if (!stats.isDirectory()) {
+          res.json({
+            success: true,
+            configured: false,
+            error: "WORKSPACE_DIR is not a valid directory",
+          });
+          return;
+        }
+
+        // Add workspace dir to allowed paths
+        addAllowedPath(workspaceDir);
+
+        res.json({
+          success: true,
+          configured: true,
+          workspaceDir,
+        });
+      } catch {
+        res.json({
+          success: true,
+          configured: false,
+          error: "WORKSPACE_DIR path does not exist",
+        });
+      }
+    } catch (error) {
+      const message = error instanceof Error ? error.message : "Unknown error";
+      res.status(500).json({ success: false, error: message });
+    }
+  });
+
+  // List directories in workspace
+  router.get("/directories", async (_req: Request, res: Response) => {
+    try {
+      const workspaceDir = process.env.WORKSPACE_DIR;
+
+      if (!workspaceDir) {
+        res.status(400).json({
+          success: false,
+          error: "WORKSPACE_DIR is not configured",
+        });
+        return;
+      }
+
+      // Check if directory exists
+      try {
+        await fs.stat(workspaceDir);
+      } catch {
+        res.status(400).json({
+          success: false,
+          error: "WORKSPACE_DIR path does not exist",
+        });
+        return;
+      }
+
+      // Add workspace dir to allowed paths
+      addAllowedPath(workspaceDir);
+
+      // Read directory contents
+      const entries = await fs.readdir(workspaceDir, { withFileTypes: true });
+
+      // Filter to directories only and map to result format
+      const directories = entries
+        .filter((entry) => entry.isDirectory() && !entry.name.startsWith("."))
+        .map((entry) => ({
+          name: entry.name,
+          path: path.join(workspaceDir, entry.name),
+        }))
+        .sort((a, b) => a.name.localeCompare(b.name));
+
+      // Add each directory to allowed paths
+      directories.forEach((dir) => addAllowedPath(dir.path));
+
+      res.json({
+        success: true,
+        directories,
+      });
+    } catch (error) {
+      const message = error instanceof Error ? error.message : "Unknown error";
+      res.status(500).json({ success: false, error: message });
+    }
+  });
+
+  return router;
+}