add a shell as well

Author: jonathanlab

package.json

@@ -79,11 +79,15 @@
     "@tiptap/react": "^3.6.6",
     "@tiptap/starter-kit": "^3.6.6",
     "@tiptap/suggestion": "^3.6.6",
+    "@xterm/addon-fit": "^0.10.0",
+    "@xterm/addon-web-links": "^0.11.0",
+    "@xterm/xterm": "^5.5.0",
     "ai": "^5.0.75",
     "axios": "^1.6.7",
     "clsx": "^2.1.0",
     "cmdk": "^1.1.1",
     "date-fns": "^3.3.1",
+    "node-pty": "1.1.0-beta37",
     "radix-themes-tw": "0.2.3",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",

pnpm-lock.yaml

@@ -14,6 +14,7 @@ import { registerFsIpc } from "./services/fs.js";
 import { registerOsIpc } from "./services/os.js";
 import { registerPosthogIpc } from "./services/posthog.js";
 import { registerRecordingIpc } from "./services/recording.js";
+import { registerShellIpc } from "./services/shell.js";
 
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = path.dirname(__filename);
@@ -182,3 +183,4 @@ registerOsIpc(() => mainWindow);
 registerAgentIpc(taskControllers, () => mainWindow);
 registerFsIpc();
 registerRecordingIpc();
+registerShellIpc();

src/main/index.ts

@@ -162,4 +162,28 @@ contextBridge.exposeInMainWorld("electronAPI", {
   getDesktopSources: async (options: { types: ("screen" | "window")[] }) => {
     return await ipcRenderer.invoke("desktop-capturer:get-sources", options);
   },
+  // Shell API
+  shellCreate: (sessionId: string, cwd?: string): Promise<void> =>
+    ipcRenderer.invoke("shell:create", sessionId, cwd),
+  shellWrite: (sessionId: string, data: string): Promise<void> =>
+    ipcRenderer.invoke("shell:write", sessionId, data),
+  shellResize: (sessionId: string, cols: number, rows: number): Promise<void> =>
+    ipcRenderer.invoke("shell:resize", sessionId, cols, rows),
+  shellDestroy: (sessionId: string): Promise<void> =>
+    ipcRenderer.invoke("shell:destroy", sessionId),
+  onShellData: (
+    sessionId: string,
+    listener: (data: string) => void,
+  ): (() => void) => {
+    const channel = `shell:data:${sessionId}`;
+    const wrapped = (_event: IpcRendererEvent, data: string) => listener(data);
+    ipcRenderer.on(channel, wrapped);
+    return () => ipcRenderer.removeListener(channel, wrapped);
+  },
+  onShellExit: (sessionId: string, listener: () => void): (() => void) => {
+    const channel = `shell:exit:${sessionId}`;
+    const wrapped = () => listener();
+    ipcRenderer.on(channel, wrapped);
+    return () => ipcRenderer.removeListener(channel, wrapped);
+  },
 });

src/main/preload.ts

@@ -0,0 +1,123 @@
+import * as os from "node:os";
+import { type IpcMainInvokeEvent, ipcMain, type WebContents } from "electron";
+import * as pty from "node-pty";
+
+interface ShellSession {
+  pty: pty.IPty;
+  webContents: WebContents;
+}
+
+const sessions = new Map<string, ShellSession>();
+
+function getDefaultShell(): string {
+  const platform = os.platform();
+
+  if (platform === "win32") {
+    return process.env.COMSPEC || "cmd.exe";
+  }
+
+  return process.env.SHELL || "/bin/bash";
+}
+
+export function registerShellIpc(): void {
+  // Create new shell session
+  ipcMain.handle(
+    "shell:create",
+    async (
+      event: IpcMainInvokeEvent,
+      sessionId: string,
+      cwd?: string,
+    ): Promise<void> => {
+      try {
+        // Clean up existing session if any
+        const existing = sessions.get(sessionId);
+        if (existing) {
+          existing.pty.kill();
+          sessions.delete(sessionId);
+        }
+
+        const shell = getDefaultShell();
+        const homeDir = os.homedir();
+
+        const ptyProcess = pty.spawn(shell, [], {
+          name: "xterm-256color",
+          cols: 80,
+          rows: 24,
+          cwd: cwd || homeDir,
+          env: process.env as Record<string, string>,
+        });
+
+        // Send data to renderer
+        ptyProcess.onData((data: string) => {
+          event.sender.send(`shell:data:${sessionId}`, data);
+        });
+
+        // Handle exit
+        ptyProcess.onExit(() => {
+          event.sender.send(`shell:exit:${sessionId}`);
+          sessions.delete(sessionId);
+        });
+
+        sessions.set(sessionId, {
+          pty: ptyProcess,
+          webContents: event.sender,
+        });
+
+        console.log(`Created shell session ${sessionId} with shell: ${shell}`);
+      } catch (error) {
+        console.error(`Failed to create shell session ${sessionId}:`, error);
+        throw error;
+      }
+    },
+  );
+
+  // Write data to shell
+  ipcMain.handle(
+    "shell:write",
+    async (
+      _event: IpcMainInvokeEvent,
+      sessionId: string,
+      data: string,
+    ): Promise<void> => {
+      const session = sessions.get(sessionId);
+      if (!session) {
+        throw new Error(`Shell session ${sessionId} not found`);
+      }
+
+      session.pty.write(data);
+    },
+  );
+
+  // Resize shell
+  ipcMain.handle(
+    "shell:resize",
+    async (
+      _event: IpcMainInvokeEvent,
+      sessionId: string,
+      cols: number,
+      rows: number,
+    ): Promise<void> => {
+      const session = sessions.get(sessionId);
+      if (!session) {
+        throw new Error(`Shell session ${sessionId} not found`);
+      }
+
+      session.pty.resize(cols, rows);
+    },
+  );
+
+  // Destroy shell session
+  ipcMain.handle(
+    "shell:destroy",
+    async (_event: IpcMainInvokeEvent, sessionId: string): Promise<void> => {
+      const session = sessions.get(sessionId);
+      if (!session) {
+        return; // Already destroyed
+      }
+
+      session.pty.kill();
+      sessions.delete(sessionId);
+      console.log(`Destroyed shell session ${sessionId}`);
+    },
+  );
+}