terminal process naming, bug fix

jonathanlab · jonathanlab · commit 8e67db0db28b · 2025-11-25T18:39:22.000Z
diff --git a/apps/array/src/main/preload.ts b/apps/array/src/main/preload.ts
@@ -311,6 +311,8 @@ contextBridge.exposeInMainWorld("electronAPI", {
     ipcRenderer.invoke("shell:check", sessionId),
   shellDestroy: (sessionId: string): Promise<void> =>
     ipcRenderer.invoke("shell:destroy", sessionId),
+  shellGetProcess: (sessionId: string): Promise<string | null> =>
+    ipcRenderer.invoke("shell:get-process", sessionId),
   onShellData: (
     sessionId: string,
     listener: (data: string) => void,
diff --git a/apps/array/src/main/services/shell.ts b/apps/array/src/main/services/shell.ts
@@ -163,4 +163,19 @@ export function registerShellIpc(): void {
       sessions.delete(sessionId);
     },
   );
+
+  // Get foreground process name
+  ipcMain.handle(
+    "shell:get-process",
+    async (
+      _event: IpcMainInvokeEvent,
+      sessionId: string,
+    ): Promise<string | null> => {
+      const session = sessions.get(sessionId);
+      if (!session) {
+        return null;
+      }
+      return session.pty.process;
+    },
+  );
 }
diff --git a/apps/array/src/renderer/components/ui/sidebar/SidebarTreeItem.tsx b/apps/array/src/renderer/components/ui/sidebar/SidebarTreeItem.tsx
@@ -71,14 +71,10 @@ export function SidebarTreeItem({
           )}
           {line.tooltip ? (
             <Tooltip content={line.tooltip}>
-              <span style={{ color: line.customColor, fontSize: "13px" }}>
-                {line.label}
-              </span>
+              <span style={{ color: line.customColor }}>{line.label}</span>
             </Tooltip>
           ) : (
-            <span style={{ color: line.customColor, fontSize: "13px" }}>
-              {line.label}
-            </span>
+            <span style={{ color: line.customColor }}>{line.label}</span>
           )}
           {line.hasChildren && (
             <span style={{ display: "flex", alignItems: "center" }}>
diff --git a/apps/array/src/renderer/features/panels/store/panelLayoutStore.ts b/apps/array/src/renderer/features/panels/store/panelLayoutStore.ts
@@ -84,6 +84,7 @@ export interface PanelLayoutStore {
     tabId: string,
     metadata: Partial<Pick<Tab, "hasUnsavedChanges">>,
   ) => void;
+  updateTabLabel: (taskId: string, tabId: string, label: string) => void;
   setFocusedPanel: (taskId: string, panelId: string) => void;
   addTerminalTab: (taskId: string, panelId: string) => void;
   clearAllLayouts: () => void;
@@ -111,7 +112,7 @@ function createDefaultPanelTree(): PanelNode {
             },
             {
               id: DEFAULT_TAB_IDS.SHELL,
-              label: "Shell",
+              label: "Terminal",
               component: null,
               closeable: true,
               draggable: true,
@@ -375,6 +376,7 @@ export const usePanelLayoutStore = createWithEqualityFn<PanelLayoutStore>()(
                   content: {
                     ...panel.content,
                     tabs: remainingTabs,
+                    activeTabId: tabId,
                   },
                 };
               },
@@ -615,6 +617,37 @@ export const usePanelLayoutStore = createWithEqualityFn<PanelLayoutStore>()(
         );
       },
 
+      updateTabLabel: (taskId, tabId, label) => {
+        set((state) =>
+          updateTaskLayout(state, taskId, (layout) => {
+            const tabLocation = findTabInTree(layout.panelTree, tabId);
+            if (!tabLocation) return {};
+
+            const updatedTree = updateTreeNode(
+              layout.panelTree,
+              tabLocation.panelId,
+              (panel) => {
+                if (panel.type !== "leaf") return panel;
+
+                const updatedTabs = panel.content.tabs.map((tab) =>
+                  tab.id === tabId ? { ...tab, label } : tab,
+                );
+
+                return {
+                  ...panel,
+                  content: {
+                    ...panel.content,
+                    tabs: updatedTabs,
+                  },
+                };
+              },
+            );
+
+            return { panelTree: updatedTree };
+          }),
+        );
+      },
+
       setFocusedPanel: (taskId, panelId) => {
         set((state) =>
           updateTaskLayout(state, taskId, () => ({
@@ -634,7 +667,7 @@ export const usePanelLayoutStore = createWithEqualityFn<PanelLayoutStore>()(
                 if (panel.type !== "leaf") return panel;
                 return addTabToPanel(panel, {
                   id: tabId,
-                  label: "Shell",
+                  label: "Terminal",
                   component: null,
                   draggable: true,
                   closeable: true,
diff --git a/apps/array/src/renderer/features/task-detail/components/TaskShellPanel.tsx b/apps/array/src/renderer/features/task-detail/components/TaskShellPanel.tsx
@@ -1,7 +1,10 @@
+import { usePanelLayoutStore } from "@features/panels/store/panelLayoutStore";
 import { useTaskData } from "@features/task-detail/hooks/useTaskData";
 import { ShellTerminal } from "@features/terminal/components/ShellTerminal";
+import { useTerminalStore } from "@features/terminal/stores/terminalStore";
 import { Box } from "@radix-ui/themes";
 import type { Task } from "@shared/types";
+import { useEffect } from "react";
 
 interface TaskShellPanelProps {
   taskId: string;
@@ -12,6 +15,25 @@ interface TaskShellPanelProps {
 export function TaskShellPanel({ taskId, task, shellId }: TaskShellPanelProps) {
   const taskData = useTaskData({ taskId, initialTask: task });
   const stateKey = shellId ? `${taskId}-${shellId}` : taskId;
+  const tabId = shellId || "shell";
+
+  const processName = useTerminalStore(
+    (state) => state.terminalStates[stateKey]?.processName,
+  );
+  const startPolling = useTerminalStore((state) => state.startPolling);
+  const stopPolling = useTerminalStore((state) => state.stopPolling);
+  const updateTabLabel = usePanelLayoutStore((state) => state.updateTabLabel);
+
+  useEffect(() => {
+    startPolling(stateKey);
+    return () => stopPolling(stateKey);
+  }, [stateKey, startPolling, stopPolling]);
+
+  useEffect(() => {
+    if (processName) {
+      updateTabLabel(taskId, tabId, processName);
+    }
+  }, [processName, taskId, tabId, updateTabLabel]);
 
   return (
     <Box height="100%">
diff --git a/apps/array/src/renderer/features/terminal/stores/terminalStore.ts b/apps/array/src/renderer/features/terminal/stores/terminalStore.ts
@@ -4,25 +4,32 @@ import { persist } from "zustand/middleware";
 interface TerminalState {
   serializedState: string | null;
   sessionId: string | null;
+  processName: string | null;
 }
 
 interface TerminalStoreState {
   terminalStates: Record<string, TerminalState>;
+  pollingIntervals: Record<string, number>;
   getTerminalState: (key: string) => TerminalState | undefined;
   setSerializedState: (key: string, state: string) => void;
   setSessionId: (key: string, sessionId: string) => void;
+  setProcessName: (key: string, processName: string | null) => void;
   clearTerminalState: (key: string) => void;
+  startPolling: (key: string) => void;
+  stopPolling: (key: string) => void;
 }
 
 const DEFAULT_TERMINAL_STATE: TerminalState = {
   serializedState: null,
   sessionId: null,
+  processName: null,
 };
 
 export const useTerminalStore = create<TerminalStoreState>()(
   persist(
     (set, get) => ({
       terminalStates: {},
+      pollingIntervals: {},
 
       getTerminalState: (key: string) => {
         return get().terminalStates[key] || DEFAULT_TERMINAL_STATE;
@@ -52,18 +59,71 @@ export const useTerminalStore = create<TerminalStoreState>()(
         }));
       },
 
+      setProcessName: (key: string, processName: string | null) => {
+        set((prev) => ({
+          terminalStates: {
+            ...prev.terminalStates,
+            [key]: {
+              ...prev.terminalStates[key],
+              processName,
+            },
+          },
+        }));
+      },
+
       clearTerminalState: (key: string) => {
         set((prev) => {
           const newStates = { ...prev.terminalStates };
           delete newStates[key];
           return { terminalStates: newStates };
         });
       },
+
+      startPolling: (key: string) => {
+        const { pollingIntervals } = get();
+        if (pollingIntervals[key]) return;
+
+        const poll = async () => {
+          const state = get().terminalStates[key];
+          if (!state?.sessionId) return;
+
+          const processName = await window.electronAPI?.shellGetProcess(
+            state.sessionId,
+          );
+          if (processName !== state.processName) {
+            get().setProcessName(key, processName ?? null);
+          }
+        };
+
+        poll();
+        const interval = window.setInterval(poll, 500);
+        set((prev) => ({
+          pollingIntervals: { ...prev.pollingIntervals, [key]: interval },
+        }));
+      },
+
+      stopPolling: (key: string) => {
+        const { pollingIntervals } = get();
+        const interval = pollingIntervals[key];
+        if (interval) {
+          clearInterval(interval);
+          set((prev) => {
+            const newIntervals = { ...prev.pollingIntervals };
+            delete newIntervals[key];
+            return { pollingIntervals: newIntervals };
+          });
+        }
+      },
     }),
     {
       name: "terminal-store",
       partialize: (state) => ({
-        terminalStates: state.terminalStates,
+        terminalStates: Object.fromEntries(
+          Object.entries(state.terminalStates).map(([k, v]) => [
+            k,
+            { serializedState: v.serializedState, sessionId: v.sessionId },
+          ]),
+        ),
       }),
     },
   ),
diff --git a/apps/array/src/renderer/types/electron.d.ts b/apps/array/src/renderer/types/electron.d.ts
@@ -198,6 +198,7 @@ declare global {
     ) => Promise<void>;
     shellCheck: (sessionId: string) => Promise<boolean>;
     shellDestroy: (sessionId: string) => Promise<void>;
+    shellGetProcess: (sessionId: string) => Promise<string | null>;
     onShellData: (
       sessionId: string,
       listener: (data: string) => void,
