project-compass 3.2.0 → 3.3.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "project-compass",
-  "version": "3.2.0",
+  "version": "3.3.0",
   "description": "Ink-based project explorer that detects local repos and lets you build/test/run them without memorizing commands.",
   "main": "src/cli.js",
   "type": "module",

package/src/cli.js

@@ -147,6 +147,24 @@ const Studio = memo(() => {
   );
 });
 
+const TaskManager = memo(({tasks, activeTaskId, renameMode, renameInput, renameCursor}) => {
+  return create(
+    Box,
+    {flexDirection: 'column', borderStyle: 'round', borderColor: 'yellow', padding: 1},
+    create(Text, {bold: true, color: 'yellow'}, '🛰️ Task Manager | Background Processes'),
+    create(Text, {dimColor: true, marginBottom: 1}, 'Up/Down: focus, Shift+K: Force Kill, Shift+R: Rename'),
+    ...tasks.map(t => create(
+      Box,
+      {key: t.id, marginBottom: 0, flexDirection: 'column'},
+      t.id === activeTaskId && renameMode 
+        ? create(Box, {flexDirection: 'row'}, create(Text, {color: 'cyan'}, '→ Rename to: '), create(CursorText, {value: renameInput, cursorIndex: renameCursor}))
+        : create(Text, {color: t.id === activeTaskId ? 'cyan' : 'white', bold: t.id === activeTaskId}, `${t.id === activeTaskId ? '→' : ' '} [${t.status.toUpperCase()}] ${t.name}`)
+    )),
+    !tasks.length && create(Text, {dimColor: true}, 'No active or background tasks.'),
+    create(Text, {marginTop: 1, dimColor: true}, 'Press Enter or Shift+T to return to Navigator.')
+  );
+});
+
 function CursorText({value, cursorIndex, active = true}) {
   const before = value.slice(0, cursorIndex);
   const charAt = value[cursorIndex] || ' ';
@@ -207,22 +225,27 @@ function Compass({rootPath, initialView = 'navigator'}) {
   const [stdinBuffer, setStdinBuffer] = useState('');
   const [stdinCursor, setStdinCursor] = useState(0);
   const [showHelp, setShowHelp] = useState(false);
-  const selectedProject = projects[selectedIndex] || null;
   const runningProcessMap = useRef(new Map());
   const lastCommandRef = useRef(null);
 
   const activeTask = useMemo(() => tasks.find(t => t.id === activeTaskId), [tasks, activeTaskId]);
   const running = activeTask?.status === 'running';
   const hasRunningTasks = useMemo(() => tasks.some(t => t.status === 'running'), [tasks]);
+  const selectedProject = useMemo(() => projects[selectedIndex] || null, [projects, selectedIndex]);
 
   const addLogToTask = useCallback((taskId, line) => {
-    setTasks(prev => prev.map(t => {
-      if (t.id !== taskId) return t;
+    setTasks(prev => {
+      const idx = prev.findIndex(t => t.id === taskId);
+      if (idx === -1) return prev;
+      const t = prev[idx];
       const normalized = typeof line === 'string' ? line : JSON.stringify(line);
-      const lines = normalized.split(/\r?\n/).filter(l => l.trim().length > 0);
-      const nextLogs = [...t.logs, ...lines];
-      return { ...t, logs: nextLogs.length > 500 ? nextLogs.slice(-500) : nextLogs };
-    }));
+      const newLines = normalized.split(/\r?\n/).filter(l => l.trim().length > 0);
+      const nextLogs = [...t.logs, ...newLines];
+      const updatedTask = { ...t, logs: nextLogs.length > 500 ? nextLogs.slice(-500) : nextLogs };
+      const nextTasks = [...prev];
+      nextTasks[idx] = updatedTask;
+      return nextTasks;
+    });
   }, []);
 
   const detailedIndexed = useMemo(() => buildDetailCommands(selectedProject, config).map((command, index) => ({
@@ -238,7 +261,7 @@ function Compass({rootPath, initialView = 'navigator'}) {
 
   const killAllTasks = useCallback(() => {
     runningProcessMap.current.forEach((proc) => {
-      try { proc.kill('SIGINT'); } catch { /* ignore */ }
+      try { proc.kill('SIGKILL'); } catch { /* ignore */ }
     });
     runningProcessMap.current.clear();
   }, []);
@@ -266,7 +289,8 @@ function Compass({rootPath, initialView = 'navigator'}) {
       const subprocess = execa(commandMeta.command[0], commandMeta.command.slice(1), {
         cwd: project.path,
         env: process.env,
-        stdin: 'pipe'
+        stdin: 'pipe',
+        cleanup: true
       });
       runningProcessMap.current.set(taskId, subprocess);
 
@@ -277,9 +301,9 @@ function Compass({rootPath, initialView = 'navigator'}) {
       setTasks(prev => prev.map(t => t.id === taskId ? {...t, status: 'finished'} : t));
       addLogToTask(taskId, kleur.green(`✓ ${commandLabel} finished`));
     } catch (error) {
-      if (error.isCanceled || error.killed) {
+      if (error.isCanceled || error.killed || error.signal === 'SIGKILL' || error.signal === 'SIGINT') {
         setTasks(prev => prev.map(t => t.id === taskId ? {...t, status: 'killed'} : t));
-        addLogToTask(taskId, kleur.yellow(`! Task killed by user`));
+        addLogToTask(taskId, kleur.yellow(`! Task killed forcefully`));
       } else {
         setTasks(prev => prev.map(t => t.id === taskId ? {...t, status: 'failed'} : t));
         addLogToTask(taskId, kleur.red(`✗ ${commandLabel} failed: ${error.shortMessage || error.message}`));
@@ -292,7 +316,7 @@ function Compass({rootPath, initialView = 'navigator'}) {
   const handleKillTask = useCallback((taskId) => {
     const proc = runningProcessMap.current.get(taskId);
     if (proc) {
-      proc.kill('SIGINT');
+      proc.kill('SIGKILL');
     } else {
       setTasks(prev => prev.filter(t => t.id !== taskId));
       if (activeTaskId === taskId) setActiveTaskId(null);
@@ -300,15 +324,16 @@ function Compass({rootPath, initialView = 'navigator'}) {
   }, [activeTaskId]);
 
   const exportLogs = useCallback(() => {
-    if (!activeTask || !activeTask.logs.length) return;
+    const taskToExport = tasks.find(t => t.id === activeTaskId);
+    if (!taskToExport || !taskToExport.logs.length) return;
     try {
-      const exportPath = path.resolve(process.cwd(), `compass-${activeTask.id}.txt`);
-      fs.writeFileSync(exportPath, activeTask.logs.join('\n'));
+      const exportPath = path.resolve(process.cwd(), `compass-${taskToExport.id}.txt`);
+      fs.writeFileSync(exportPath, taskToExport.logs.join('\n'));
       addLogToTask(activeTaskId, kleur.green(`✓ Logs exported to ${exportPath}`));
-    } catch (err) {
-      addLogToTask(activeTaskId, kleur.red(`✗ Export failed: ${err.message}`));
+    } catch {
+      addLogToTask(activeTaskId, kleur.red('✗ Export failed'));
     }
-  }, [activeTask, activeTaskId, addLogToTask]);
+  }, [tasks, activeTaskId, addLogToTask]);
 
     useInput((input, key) => {
     if (quitConfirm) {
@@ -320,13 +345,14 @@ function Compass({rootPath, initialView = 'navigator'}) {
     if (customMode) {
       if (key.return) {
         const raw = customInput.trim();
-        if (selectedProject && raw) {
+        const selProj = selectedProject;
+        if (selProj && raw) {
           const [labelPart, commandPart] = raw.split('|');
           const commandTokens = (commandPart || labelPart).trim().split(/\s+/).filter(Boolean);
           if (commandTokens.length) {
-            const label = commandPart ? labelPart.trim() : `Custom ${selectedProject.name}`;
+            const label = commandPart ? labelPart.trim() : `Custom ${selProj.name}`;
             setConfig((prev) => {
-              const projectKey = selectedProject.path;
+              const projectKey = selProj.path;
               const existing = prev.customCommands?.[projectKey] || [];
               const nextConfig = { ...prev, customCommands: { ...prev.customCommands, [projectKey]: [...existing, {label, command: commandTokens}] } };
               saveConfig(nextConfig);
@@ -430,11 +456,9 @@ function Compass({rootPath, initialView = 'navigator'}) {
       if (tasks.length > 0) {
         if (key.upArrow) { setActiveTaskId(prev => tasks[(tasks.findIndex(t => t.id === prev) - 1 + tasks.length) % tasks.length]?.id); return; }
         if (key.downArrow) { setActiveTaskId(prev => tasks[(tasks.findIndex(t => t.id === prev) + 1) % tasks.length]?.id); return; }
-        if (shiftCombo('k') && activeTaskId) {
-          handleKillTask(activeTaskId);
-          return;
-        }
+        if (shiftCombo('k') && activeTaskId) { handleKillTask(activeTaskId); return; }
         if (shiftCombo('r') && activeTaskId) { setRenameMode(true); setRenameInput(activeTask.name); setRenameCursor(activeTask.name.length); return; }
+        if (key.ctrl && input === 'c') { handleKillTask(activeTaskId); return; }
       }
       if (key.return) { setMainView('navigator'); return; }
       return;
@@ -442,7 +466,7 @@ function Compass({rootPath, initialView = 'navigator'}) {
 
     if (running && activeTaskId && runningProcessMap.current.has(activeTaskId)) {
       const proc = runningProcessMap.current.get(activeTaskId);
-      if (key.ctrl && input === 'c') { proc.kill('SIGINT'); setStdinBuffer(''); setStdinCursor(0); return; }
+      if (key.ctrl && input === 'c') { proc.kill('SIGKILL'); setStdinBuffer(''); setStdinCursor(0); return; }
       if (key.return) { proc.stdin?.write(stdinBuffer + '\n'); setStdinBuffer(''); setStdinCursor(0); return; }
       if (key.backspace || key.delete) {
         if (stdinCursor > 0) {
@@ -490,36 +514,12 @@ function Compass({rootPath, initialView = 'navigator'}) {
     }
   });
 
-  const projectCountLabel = `${projects.length} project${projects.length === 1 ? '' : 's'}`;
+  const projectCountLabel = useMemo(() => `${projects.length} project${projects.length === 1 ? '' : 's'}`, [projects.length]);
   const toggleHint = config.showHelpCards ? 'Shift+H hide help' : 'Shift+H show help';
   const statusHint = activeTask ? `[${activeTask.status.toUpperCase()}] ${activeTask.name}` : 'Idle Navigator';
   const orbitHint = mainView === 'tasks' ? 'Tasks View' : `Orbit: ${tasks.length} tasks`;
   const artHint = config.showArtBoard ? 'Shift+B hide art' : 'Shift+B show art';
 
-  if (quitConfirm) {
-    return create(Box, {flexDirection: 'column', borderStyle: 'round', borderColor: 'red', padding: 1}, create(Text, {bold: true, color: 'red'}, '⚠️ Confirm Exit'), create(Text, null, `There are ${tasks.filter(t=>t.status==='running').length} tasks still running in the background.`), create(Text, null, 'Are you sure you want to quit and stop all processes?'), create(Text, {marginTop: 1}, kleur.bold('Y') + ' to Quit, ' + kleur.bold('N') + ' to Cancel'));
-  }
-
-  if (mainView === 'studio') return create(Studio);
-
-  if (mainView === 'tasks') {
-    return create(
-      Box,
-      {flexDirection: 'column', borderStyle: 'round', borderColor: 'yellow', padding: 1},
-      create(Text, {bold: true, color: 'yellow'}, '🛰️ Task Manager | Background Processes'),
-      create(Text, {dimColor: true, marginBottom: 1}, 'Up/Down: focus, Shift+K: Kill/Delete, Shift+R: Rename'),
-      ...tasks.map(t => create(
-        Box,
-        {key: t.id, marginBottom: 0, flexDirection: 'column'},
-        t.id === activeTaskId && renameMode 
-          ? create(Box, {flexDirection: 'row'}, create(Text, {color: 'cyan'}, '→ Rename to: '), create(CursorText, {value: renameInput, cursorIndex: renameCursor}))
-          : create(Text, {color: t.id === activeTaskId ? 'cyan' : 'white', bold: t.id === activeTaskId}, `${t.id === activeTaskId ? '→' : ' '} [${t.status.toUpperCase()}] ${t.name}`)
-      )),
-      !tasks.length && create(Text, {dimColor: true}, 'No active or background tasks.'),
-      create(Text, {marginTop: 1, dimColor: true}, 'Press Enter or Shift+T to return to Navigator.')
-    );
-  }
-
   const projectRows = useMemo(() => {
     if (loading) return [create(Text, {key: 'scanning', dimColor: true}, 'Scanning projects…')];
     if (error) return [create(Text, {key: 'error', color: 'red'}, `Unable to scan: ${error}`)];
@@ -582,25 +582,26 @@ function Compass({rootPath, initialView = 'navigator'}) {
   const artTileNodes = useMemo(() => [
     {label: 'Pulse', detail: projectCountLabel, accent: 'magenta', icon: '●', subtext: `Workspace · ${path.basename(rootPath) || rootPath}`},
     {label: 'Focus', detail: selectedProject?.name || 'Selection', accent: 'cyan', icon: '◆', subtext: `${selectedProject?.type || 'Stack'}`},
-    {label: 'Orbit', detail: `${tasks.length} active tasks`, accent: 'yellow', icon: '■', subtext: running ? 'Busy streaming...' : 'Idle'}
+    {label: 'Orbit', detail: `${tasks.length} tasks`, accent: 'yellow', icon: '■', subtext: running ? 'Busy streaming...' : 'Idle'}
   ].map(tile => create(Box, {key: tile.label, flexDirection: 'column', padding: 1, marginRight: 1, borderStyle: 'single', borderColor: tile.accent, minWidth: 24},
     create(Text, {color: tile.accent, bold: true}, `${tile.icon} ${tile.label}`),
     create(Text, {bold: true}, tile.detail),
     create(Text, {dimColor: true}, tile.subtext)
   )), [projectCountLabel, rootPath, selectedProject, tasks.length, running]);
 
-  const artBoard = config.showArtBoard ? create(Box, {flexDirection: 'column', marginTop: 1, borderStyle: 'round', borderColor: 'gray', padding: 1},
-    create(Box, {flexDirection: 'row', justifyContent: 'space-between'}, create(Text, {color: 'magenta', bold: true}, 'Art-coded build atlas'), create(Text, {dimColor: true}, 'press ? for overlay help')),
-    create(Box, {flexDirection: 'row', marginTop: 1}, ...ART_CHARS.map((char, i) => create(Text, {key: i, color: ART_COLORS[i % ART_COLORS.length]}, char.repeat(2)))),
-    create(Box, {flexDirection: 'row', marginTop: 1}, ...artTileNodes)
-  ) : null;
-
   const helpCards = [
     {label: 'Navigation', color: 'magenta', body: ['↑ / ↓ move focus, Enter: details', 'Shift+↑ / ↓ scroll output', 'Shift+H toggle help cards', 'Shift+D detach from task']},
     {label: 'Commands', color: 'cyan', body: ['B / T / R build/test/run', '1-9 run detail commands', 'Shift+L rerun last command', 'Shift+X clear / Shift+E export']},
-    {label: 'Orbit & Studio', color: 'yellow', body: ['Shift+T task manager', 'Shift+A studio / Shift+B art board', 'Shift+C custom / Shift+Q quit']}
+    {label: 'Orbit & Studio', color: 'yellow', body: ['Shift+T task manager', 'Shift+A studio / Shift+B art board', 'Shift+S structure / Shift+Q quit']}
   ];
 
+  if (quitConfirm) {
+    return create(Box, {flexDirection: 'column', borderStyle: 'round', borderColor: 'red', padding: 1}, create(Text, {bold: true, color: 'red'}, '⚠️ Confirm Exit'), create(Text, null, `There are ${tasks.filter(t=>t.status==='running').length} tasks still running in the background.`), create(Text, null, 'Are you sure you want to quit and stop all processes?'), create(Text, {marginTop: 1}, kleur.bold('Y') + ' to Quit, ' + kleur.bold('N') + ' to Cancel'));
+  }
+
+  if (mainView === 'studio') return create(Studio);
+  if (mainView === 'tasks') return create(TaskManager, {tasks, activeTaskId, renameMode, renameInput, renameCursor});
+
   return create(Box, {flexDirection: 'column', padding: 1},
     create(Box, {justifyContent: 'space-between'},
       create(Box, {flexDirection: 'column'}, create(Text, {color: 'magenta', bold: true}, 'Project Compass'), create(Text, {dimColor: true}, `${projectCountLabel} detected in ${rootPath}`)),
@@ -609,7 +610,11 @@ function Compass({rootPath, initialView = 'navigator'}) {
         create(Text, {dimColor: true}, `${toggleHint} · ${orbitHint} · ${artHint} · Shift+Q: Quit`)
       )
     ),
-    artBoard,
+    config.showArtBoard && create(Box, {flexDirection: 'column', marginTop: 1, borderStyle: 'round', borderColor: 'gray', padding: 1},
+      create(Box, {flexDirection: 'row', justifyContent: 'space-between'}, create(Text, {color: 'magenta', bold: true}, 'Art-coded build atlas'), create(Text, {dimColor: true}, 'press ? for overlay help')),
+      create(Box, {flexDirection: 'row', marginTop: 1}, ...ART_CHARS.map((char, i) => create(Text, {key: i, color: ART_COLORS[i % ART_COLORS.length]}, char.repeat(2)))),
+      create(Box, {flexDirection: 'row', marginTop: 1}, ...artTileNodes)
+    ),
     create(Box, {marginTop: 1, flexDirection: 'row', alignItems: 'stretch', width: '100%', flexWrap: 'wrap'},
       create(Box, {flexGrow: 1, flexBasis: 0, minWidth: PROJECTS_MIN_WIDTH, marginRight: 1, borderStyle: 'round', borderColor: 'magenta', padding: 1}, create(Text, {bold: true, color: 'magenta'}, 'Projects'), create(Box, {flexDirection: 'column', marginTop: 1}, ...projectRows)),
       create(Box, {flexGrow: 1.3, flexBasis: 0, minWidth: DETAILS_MIN_WIDTH, borderStyle: 'round', borderColor: 'cyan', padding: 1, flexDirection: 'column'}, create(Text, {bold: true, color: 'cyan'}, 'Details'), ...detailContent)