feat: add folders to sidebar (#158)

<img width="220" height="289" alt="image" src="https://github.com/user-attachments/assets/1c6b60b0-a47f-484d-b856-7aa915dc8b72" />


We persist these folders in Application Support as well.

Will refactor the incredibly messy sidebar code when I do more work on it later on.

This also scaffolds some logic for application storage that it _outside_ local storage. For example, in application support, we now define a data folders where we maintain a list of folders in Array via `folders.json`. We could also start storing preferences etc in there. Stuff that should persist across installs basically.

Author: jonathanlab

apps/array/forge.config.ts

@@ -173,13 +173,11 @@ const config: ForgeConfig = {
     generateAssets: async () => {
       // Generate ICNS from source PNG
       if (existsSync("build/[email protected]")) {
-        console.log("Generating ICNS icon...");
         execSync("bash scripts/generate-icns.sh", { stdio: "inherit" });
       }
 
       // Compile liquid glass icon to Assets.car
       if (existsSync("build/icon.icon")) {
-        console.log("Compiling liquid glass icon...");
         execSync("bash scripts/compile-glass-icon.sh", { stdio: "inherit" });
       }
     },

apps/array/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "@poshog/array",
+  "name": "@posthog/array",
   "version": "0.4.0",
   "description": "Array - PostHog desktop task manager",
   "main": ".vite/build/index.js",

apps/array/src/main/index.ts

@@ -12,6 +12,8 @@ import {
 } from "electron";
 import { ANALYTICS_EVENTS } from "../types/analytics.js";
 import { registerAgentIpc, type TaskController } from "./services/agent.js";
+import { ensureDataDirectory } from "./services/data.js";
+import { registerFoldersIpc } from "./services/folders.js";
 import "./services/index.js";
 import { registerFsIpc } from "./services/fs.js";
 import { registerGitIpc } from "./services/git.js";
@@ -39,6 +41,9 @@ const taskControllers = new Map<string, TaskController>();
 // instead of ::1. This matches how the renderer already reaches the PostHog API.
 dns.setDefaultResultOrder("ipv4first");
 
+// Set app name to ensure consistent userData path across platforms
+app.setName("Array");
+
 function ensureClaudeConfigDir(): void {
   const existing = process.env.CLAUDE_CONFIG_DIR;
   if (existing) return;
@@ -170,9 +175,10 @@ function createWindow(): void {
   });
 }
 
-app.whenReady().then(() => {
+app.whenReady().then(async () => {
   createWindow();
   ensureClaudeConfigDir();
+  await ensureDataDirectory();
 
   // Initialize PostHog analytics
   initializePostHog();
@@ -205,4 +211,5 @@ registerOsIpc(() => mainWindow);
 registerGitIpc(() => mainWindow);
 registerAgentIpc(taskControllers, () => mainWindow);
 registerFsIpc();
+registerFoldersIpc();
 registerShellIpc();

apps/array/src/main/preload.ts

@@ -4,7 +4,10 @@ import type {
   OAuthTokenResponse,
   StoredOAuthTokens,
 } from "../shared/types/oauth";
-import type { ContextMenuResult } from "./services/contextMenu.types.js";
+import type {
+  FolderContextMenuResult,
+  TaskContextMenuResult,
+} from "./services/contextMenu.types.js";
 
 interface MessageBoxOptions {
   type?: "info" | "error" | "warning" | "question";
@@ -265,6 +268,36 @@ contextBridge.exposeInMainWorld("electronAPI", {
   showTaskContextMenu: (
     taskId: string,
     taskTitle: string,
-  ): Promise<ContextMenuResult> =>
+  ): Promise<TaskContextMenuResult> =>
     ipcRenderer.invoke("show-task-context-menu", taskId, taskTitle),
+  showFolderContextMenu: (
+    folderId: string,
+    folderName: string,
+  ): Promise<FolderContextMenuResult> =>
+    ipcRenderer.invoke("show-folder-context-menu", folderId, folderName),
+  folders: {
+    getFolders: (): Promise<
+      Array<{
+        id: string;
+        path: string;
+        name: string;
+        lastAccessed: string;
+        createdAt: string;
+      }>
+    > => ipcRenderer.invoke("get-folders"),
+    addFolder: (
+      folderPath: string,
+    ): Promise<{
+      id: string;
+      path: string;
+      name: string;
+      lastAccessed: string;
+      createdAt: string;
+    }> => ipcRenderer.invoke("add-folder", folderPath),
+    removeFolder: (folderId: string): Promise<void> =>
+      ipcRenderer.invoke("remove-folder", folderId),
+    updateFolderAccessed: (folderId: string): Promise<void> =>
+      ipcRenderer.invoke("update-folder-accessed", folderId),
+    clearAllData: (): Promise<void> => ipcRenderer.invoke("clear-all-data"),
+  },
 });

apps/array/src/main/services/contextMenu.ts

@@ -1,10 +1,15 @@
 import { Menu, type MenuItemConstructorOptions } from "electron";
 import { createIpcService } from "../ipc/createIpcService.js";
-import type { ContextMenuResult } from "./contextMenu.types.js";
+import type {
+  FolderContextMenuResult,
+  TaskContextMenuResult,
+} from "./contextMenu.types.js";
 
 export type {
-  ContextMenuAction,
-  ContextMenuResult,
+  FolderContextMenuAction,
+  FolderContextMenuResult,
+  TaskContextMenuAction,
+  TaskContextMenuResult,
 } from "./contextMenu.types.js";
 
 export const showTaskContextMenuService = createIpcService({
@@ -13,7 +18,7 @@ export const showTaskContextMenuService = createIpcService({
     _event,
     _taskId: string,
     _taskTitle: string,
-  ): Promise<ContextMenuResult> => {
+  ): Promise<TaskContextMenuResult> => {
     return new Promise((resolve) => {
       const template: MenuItemConstructorOptions[] = [
         {
@@ -38,3 +43,26 @@ export const showTaskContextMenuService = createIpcService({
     });
   },
 });
+
+export const showFolderContextMenuService = createIpcService({
+  channel: "show-folder-context-menu",
+  handler: async (
+    _event,
+    _folderId: string,
+    _folderName: string,
+  ): Promise<FolderContextMenuResult> => {
+    return new Promise((resolve) => {
+      const template: MenuItemConstructorOptions[] = [
+        {
+          label: "Remove folder",
+          click: () => resolve({ action: "remove" }),
+        },
+      ];
+
+      const menu = Menu.buildFromTemplate(template);
+      menu.popup({
+        callback: () => resolve({ action: null }),
+      });
+    });
+  },
+});

apps/array/src/main/services/contextMenu.types.ts

@@ -1,14 +1,20 @@
-export type ContextMenuAction = "rename" | "duplicate" | "delete" | null;
+export type TaskContextMenuAction = "rename" | "duplicate" | "delete" | null;
 
-export interface ContextMenuResult {
-  action: ContextMenuAction;
+export type FolderContextMenuAction = "remove" | null;
+
+export interface TaskContextMenuResult {
+  action: TaskContextMenuAction;
+}
+
+export interface FolderContextMenuResult {
+  action: FolderContextMenuAction;
 }
 
 declare global {
   interface IElectronAPI {
     showTaskContextMenu: (
       taskId: string,
       taskTitle: string,
-    ) => Promise<ContextMenuResult>;
+    ) => Promise<TaskContextMenuResult>;
   }
 }

apps/array/src/main/services/data.ts

@@ -0,0 +1,104 @@
+import fs from "node:fs";
+import path from "node:path";
+import { app } from "electron";
+
+const fsPromises = fs.promises;
+
+let dataDir: string | null = null;
+
+function isFileNotFoundError(error: unknown): boolean {
+  return (error as NodeJS.ErrnoException).code === "ENOENT";
+}
+
+function logAndThrowError(message: string, error: unknown): never {
+  console.error(message, error);
+  throw error;
+}
+
+async function cleanupTempFile(filePath: string): Promise<void> {
+  try {
+    await fsPromises.unlink(filePath);
+  } catch {
+    // Ignore cleanup errors
+  }
+}
+
+export function getDataDirectory(): string {
+  if (!dataDir) {
+    const userDataPath = app.getPath("userData");
+    dataDir = path.join(userDataPath, "data");
+  }
+  return dataDir;
+}
+
+export async function ensureDataDirectory(): Promise<void> {
+  const dir = getDataDirectory();
+  try {
+    await fsPromises.mkdir(dir, { recursive: true });
+  } catch (error) {
+    logAndThrowError("Failed to create data directory:", error);
+  }
+}
+
+export function getDataFilePath(filename: string): string {
+  return path.join(getDataDirectory(), filename);
+}
+
+export async function readDataFile<T>(filename: string): Promise<T | null> {
+  const filePath = getDataFilePath(filename);
+  try {
+    const content = await fsPromises.readFile(filePath, "utf-8");
+    return JSON.parse(content) as T;
+  } catch (error) {
+    if (isFileNotFoundError(error)) {
+      return null;
+    }
+    logAndThrowError(`Failed to read data file ${filename}:`, error);
+  }
+}
+
+export async function writeDataFile<T>(
+  filename: string,
+  data: T,
+): Promise<void> {
+  await ensureDataDirectory();
+  const filePath = getDataFilePath(filename);
+  const tempPath = `${filePath}.tmp`;
+
+  try {
+    await fsPromises.writeFile(
+      tempPath,
+      JSON.stringify(data, null, 2),
+      "utf-8",
+    );
+    await fsPromises.rename(tempPath, filePath);
+  } catch (error) {
+    await cleanupTempFile(tempPath);
+    logAndThrowError(`Failed to write data file ${filename}:`, error);
+  }
+}
+
+export async function deleteDataFile(filename: string): Promise<void> {
+  const filePath = getDataFilePath(filename);
+  try {
+    await fsPromises.unlink(filePath);
+  } catch (error) {
+    if (!isFileNotFoundError(error)) {
+      logAndThrowError(`Failed to delete data file ${filename}:`, error);
+    }
+  }
+}
+
+export async function clearDataDirectory(): Promise<void> {
+  const dir = getDataDirectory();
+  try {
+    const files = await fsPromises.readdir(dir);
+    await Promise.all(
+      files.map((file) => fsPromises.unlink(path.join(dir, file))),
+    );
+  } catch (error) {
+    if (!isFileNotFoundError(error)) {
+      logAndThrowError("Failed to clear data directory:", error);
+    }
+  }
+}