project-compass 4.2.0 → 4.3.0

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "project-compass",
-  "version": "4.2.0",
-  "description": "Futuristic project navigator and runner for Node, Python, Rust, and Go",
+  "version": "4.3.0",
+  "description": "🧭 Futuristic TUI workspace navigator & runner - AI-powered project detection for Node, Python, Rust, Go, Java, PHP, Ruby, .NET",
   "main": "src/cli.js",
   "bin": {
     "project-compass": "src/cli.js"
@@ -17,10 +17,35 @@
     "navigator",
     "ink",
     "runner",
-    "projects"
+    "projects",
+    "tui",
+    "terminal",
+    "workspace",
+    "ai",
+    "detect",
+    "python",
+    "rust",
+    "node",
+    "java",
+    "php",
+    "ruby",
+    "dotnet",
+    "uv",
+    "fastapi",
+    "django",
+    "nextjs",
+    "react"
   ],
   "author": "Satyaa & Clawdy",
   "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/CrimsonDevil333333/project-compass"
+  },
+  "homepage": "https://github.com/CrimsonDevil333333/project-compass",
+  "bugs": {
+    "url": "https://github.com/CrimsonDevil333333/project-compass/issues"
+  },
   "dependencies": {
     "execa": "^9.5.2",
     "fast-glob": "^3.3.3",

package/src/cli.js

@@ -1,4 +1,5 @@
 #!/usr/bin/env node
+/* global setInterval, setTimeout, clearInterval, clearTimeout */
 import React, {useCallback, useEffect, useMemo, useRef, useState, memo} from 'react';
 import {render, Box, Text, useApp, useInput} from 'ink';
 import path from 'path';
@@ -123,22 +124,38 @@ const OutputPanel = memo(({activeTask, logOffset}) => {
   const logWindowEnd = Math.max(0, logs.length - logOffset);
   const visibleLogs = logs.slice(logWindowStart, logWindowEnd);
   
+  const statusColor = activeTask?.status === 'running' ? 'green' : 
+                     activeTask?.status === 'failed' ? 'red' :
+                     activeTask?.status === 'killed' ? 'yellow' : 'cyan';
+  
+  const scrollIndicator = logs.length > OUTPUT_WINDOW_SIZE 
+    ? ` ↕ ${Math.min(logs.length - logOffset, logs.length)}/${logs.length}`
+    : '';
+  
   const logNodes = visibleLogs.length 
-    ? visibleLogs.map((line, i) => create(Text, {key: i}, line)) 
-    : [create(Text, {key: 'empty', dimColor: true}, 'Select a task or run a command to see logs.')];
+    ? visibleLogs.map((line, i) => create(Text, {key: i, wrap: 'truncate'}, line)) 
+    : [create(Text, {key: 'empty', dimColor: true}, 'No logs yet. Run a command to see output here.')];
 
   return create(
     Box,
     {
       flexDirection: 'column',
-      borderStyle: 'round',
-      borderColor: 'yellow',
-      padding: 1,
+      borderStyle: activeTask?.status === 'running' ? 'double' : 'round',
+      borderColor: statusColor,
+      paddingX: 1,
+      paddingY: 0,
       minHeight: OUTPUT_WINDOW_HEIGHT,
       maxHeight: OUTPUT_WINDOW_HEIGHT,
       height: OUTPUT_WINDOW_HEIGHT,
       overflow: 'hidden'
     },
+    // Header with log count
+    logs.length > 0 && create(
+      Box,
+      { flexDirection: 'row', justifyContent: 'space-between', marginBottom: 0 },
+      create(Text, { dimColor: true, bold: true }, ` ${activeTask?.status?.toUpperCase() || 'IDLE'} `),
+      create(Text, { dimColor: true }, `Lines: ${logs.length}${scrollIndicator}`)
+    ),
     ...logNodes
   );
 });
@@ -164,9 +181,20 @@ function Compass({rootPath, initialView = 'navigator'}) {
   const [stdinBuffer, setStdinBuffer] = useState('');
   const [stdinCursor, setStdinCursor] = useState(0);
   const [showHelp, setShowHelp] = useState(false);
+  const [startup, setStartup] = useState(true);
+  const [startupTick, setStartupTick] = useState(0);
   const runningProcessMap = useRef(new Map());
   const lastCommandRef = useRef(null);
 
+  useEffect(() => {
+    if (!startup) return;
+    const timer = setInterval(() => {
+      setStartupTick(t => t + 1);
+    }, 80);
+    const hideTimer = setTimeout(() => setStartup(false), 2400);
+    return () => { clearInterval(timer); clearTimeout(hideTimer); };
+  }, [startup]);
+
   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]);
@@ -306,7 +334,7 @@ function Compass({rootPath, initialView = 'navigator'}) {
     }
     
     if (quitConfirm) {
-      if (input?.toLowerCase() === 'y') { killAllTasks(); process.stdout.write('\x1b[2J\x1b[0;0H'); exit(); return; }
+      if (input?.toLowerCase() === 'y') { killAllTasks(); exit(); return; }
       if (input?.toLowerCase() === 'n' || key.escape) { setQuitConfirm(false); return; }
       return;
     }
@@ -408,26 +436,24 @@ function Compass({rootPath, initialView = 'navigator'}) {
     const shiftCombo = (char) => key.shift && normalizedInput === char;
 
     const clearAndSwitch = (view) => {
-      console.clear();
       setMainView(view);
       setViewMode('list');
       setShowHelp(false);
     };
     
-    if (shiftCombo('h')) { console.clear(); setConfig(prev => { const next = {...prev, showHelpCards: !prev.showHelpCards}; saveConfig(next); return next; }); return; }
-    if (shiftCombo('s')) { console.clear(); setConfig(prev => { const next = {...prev, showStructureGuide: !prev.showStructureGuide}; saveConfig(next); return next; }); return; }
+    if (shiftCombo('h')) { setConfig(prev => { const next = {...prev, showHelpCards: !prev.showHelpCards}; saveConfig(next); return next; }); return; }
+    if (shiftCombo('s')) { setConfig(prev => { const next = {...prev, showStructureGuide: !prev.showStructureGuide}; saveConfig(next); return next; }); return; }
     if (shiftCombo('a')) { clearAndSwitch(mainView === 'navigator' ? 'studio' : 'navigator'); return; }
     if (shiftCombo('p')) { clearAndSwitch(mainView === 'navigator' ? 'registry' : 'navigator'); return; }
     if (shiftCombo('n')) { clearAndSwitch(mainView === 'navigator' ? 'architect' : 'navigator'); return; }
     if (shiftCombo('o')) { clearAndSwitch(mainView === 'navigator' ? 'ai' : 'navigator'); return; }
-    if (shiftCombo('x')) { console.clear(); setTasks(prev => prev.map(t => t.id === activeTaskId ? {...t, logs: []} : t)); setLogOffset(0); return; }
+    if (shiftCombo('x')) { setTasks(prev => prev.map(t => t.id === activeTaskId ? {...t, logs: []} : t)); setLogOffset(0); return; }
     if (shiftCombo('e')) { exportLogs(); return; }
-    if (shiftCombo('d')) { console.clear(); setActiveTaskId(null); return; }
-    if (shiftCombo('b')) { console.clear(); setConfig(prev => { const next = {...prev, showArtBoard: !prev.showArtBoard}; saveConfig(next); return next; }); return; }
+    if (shiftCombo('d')) { setActiveTaskId(null); return; }
+    if (shiftCombo('b')) { setConfig(prev => { const next = {...prev, showArtBoard: !prev.showArtBoard}; saveConfig(next); return next; }); return; }
     
     if (shiftCombo('t')) { 
       setMainView((prev) => {
-        console.clear();
         if (prev === 'tasks') return 'navigator';
         if (tasks.length > 0 && !activeTaskId) setActiveTaskId(tasks[0].id);
         return 'tasks';
@@ -502,7 +528,6 @@ function Compass({rootPath, initialView = 'navigator'}) {
         const next = prev - pageLimit;
         return next < 0 ? 0 : next;
       });
-      console.clear();
       return;
     }
     
@@ -516,24 +541,22 @@ function Compass({rootPath, initialView = 'navigator'}) {
         }
         return next;
       });
-      console.clear();
       return;
     }
     
 
-    if (normalizedInput === '?') { console.clear(); setShowHelp((prev) => !prev); return; }
+    if (normalizedInput === '?') { setShowHelp((prev) => !prev); return; }
     if (shiftCombo('l') && lastCommandRef.current) { runProjectCommand(lastCommandRef.current.commandMeta, lastCommandRef.current.project); return; }
 
-    if (key.upArrow && !key.shift && projects.length > 0) { console.clear(); setSelectedIndex((prev) => (prev - 1 + projects.length) % projects.length); return; }
-    if (key.downArrow && !key.shift && projects.length > 0) { console.clear(); setSelectedIndex((prev) => (prev + 1) % projects.length); return; }
+    if (key.upArrow && !key.shift && projects.length > 0) { setSelectedIndex((prev) => (prev - 1 + projects.length) % projects.length); return; }
+    if (key.downArrow && !key.shift && projects.length > 0) { setSelectedIndex((prev) => (prev + 1) % projects.length); return; }
     if (key.return) {
       if (!selectedProject) return;
-      console.clear();
       setViewMode((prev) => (prev === 'detail' ? 'list' : 'detail'));
       return;
     }
     if (shiftCombo('q') || isCtrlC) {
-      if (hasRunningTasks) setQuitConfirm(true); else { process.stdout.write('\x1b[2J\x1b[0;0H'); exit(); }
+      if (hasRunningTasks) setQuitConfirm(true); else { exit(); }
       return;
     }
     
@@ -630,9 +653,27 @@ function Compass({rootPath, initialView = 'navigator'}) {
       case 'registry': return create(PackageRegistry, {selectedProject, projects, onRunCommand: runProjectCommand, CursorText, onSelectProject: (idx) => setSelectedIndex(idx)});
       case 'architect': return create(ProjectArchitect, {rootPath, onRunCommand: runProjectCommand, CursorText, onReturn: () => setMainView('navigator')});
       case 'ai': return create(AIHorizon, {rootPath, selectedProject, onRunCommand: runProjectCommand, CursorText, config, setConfig, saveConfig});
-      default: {
+       default: {
+        const quickActions = selectedProject ? [
+          { key: 'B', label: 'Build', color: 'magenta' },
+          { key: 'T', label: 'Test', color: 'cyan' },
+          { key: 'R', label: 'Run', color: 'green' },
+          { key: 'I', label: 'Install', color: 'blue' },
+          { key: '0', label: 'AI', color: 'yellow' }
+        ] : [];
+        
         const navigatorBody = [
           create(Header, {projectCountLabel, rootPath, running, statusHint, toggleHint, orbitHint, artHint}),
+          // Quick Actions Bar
+          quickActions.length > 0 && create(Box, {key: 'quick-actions', flexDirection: 'row', marginBottom: 0, paddingX: 1, paddingY: 0, borderStyle: 'single', borderColor: 'cyan'},
+            create(Text, {dimColor: true}, 'Quick: '),
+            ...quickActions.map((action, idx) => 
+              create(Text, {key: action.key, color: action.color}, 
+                `${idx > 0 ? ' · ' : ''}[${action.key}] ${action.label}`
+              )
+            ),
+            create(Text, {dimColor: true}, ' · [?] Help')
+          ),
           config.showArtBoard && create(Box, {key: 'artboard', 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)))),
@@ -663,6 +704,35 @@ function Compass({rootPath, initialView = 'navigator'}) {
     }
   };
 
+  // Startup banner with animation
+  if (startup) {
+    const frame = startupTick % 240;
+    const progress = Math.min(frame / 240 * 100, 100);
+    const barLength = 30;
+    const filled = Math.floor(barLength * progress / 100);
+    const bar = '█'.repeat(filled) + '░'.repeat(barLength - filled);
+    const spinner = ['⠋', '⠙', '⠹', '⠸', '⠼', '⠴', '⠦', '⠧', '⠇', '⠏'][startupTick % 10];
+    
+    return create(Box, {flexDirection: 'column', alignItems: 'center', justifyContent: 'center', height: '100%'},
+      create(Box, {marginBottom: 1},
+        create(Text, {color: 'magenta', bold: true}, '🧭 '),
+        create(Text, {color: 'cyan', bold: true}, 'PROJECT COMPASS'),
+        create(Text, {color: 'magenta', bold: true}, ' 🧭')
+      ),
+      create(Box, {marginBottom: 1},
+        create(Text, {dimColor: true}, 'Initializing command center...')
+      ),
+      create(Box, {marginBottom: 1},
+        create(Text, {color: 'cyan'}, bar),
+        create(Text, {dimColor: true}, ` ${Math.floor(progress)}%`)
+      ),
+      create(Box, {},
+        create(Text, {color: 'yellow'}, ` ${spinner} `),
+        create(Text, {dimColor: true}, 'Scanning projects...')
+      )
+    );
+  }
+
   return create(Box, {flexDirection: 'column', padding: 1, width: '100%'}, renderView());
 }
 

package/src/components/Footer.js

@@ -1,25 +1,81 @@
-import React from 'react';
+/* global setInterval, clearInterval */
+import React, { useState, useEffect } from 'react';
 import { Box, Text } from 'ink';
 
+const PULSE = ['▱', '▰', '▱'];
+const ARROW = ['→', '⇒', '⇨', '⇒'];
+
 export default function Footer({ toggleHint, running, stdinBuffer, stdinCursor, CursorText }) {
+  const [pulse, setPulse] = useState(0);
+  
+  useEffect(() => {
+    if (!running) return;
+    const timer = setInterval(() => setPulse(p => p + 1), 500);
+    return () => clearInterval(timer);
+  }, [running]);
+  
+  const pulseChar = running ? PULSE[pulse % PULSE.length] : '';
+  const arrow = running ? ARROW[pulse % ARROW.length] : '→';
+  
   return React.createElement(
     Box,
     { flexDirection: 'column', marginTop: 1 },
+    // Status bar
     React.createElement(
       Box,
-      { flexDirection: 'row', justifyContent: 'space-between' },
-      React.createElement(Text, { dimColor: true }, running ? 'Type to feed stdin; Enter: submit.' : 'Run a command or press Shift+T to switch tasks.'),
-      React.createElement(Text, { dimColor: true }, `${toggleHint}, Shift+S: Structure Guide`)
+      { flexDirection: 'row', justifyContent: 'space-between', marginBottom: 0 },
+      React.createElement(
+        Box,
+        { flexDirection: 'row', alignItems: 'center' },
+        React.createElement(Text, { dimColor: true }, `${arrow} `),
+        React.createElement(Text, { dimColor: true }, 
+          running ? 'Type to feed stdin · Enter: submit' : 'Run a command or press Shift+T for tasks'
+        )
+      ),
+      React.createElement(
+        Box,
+        { flexDirection: 'row', alignItems: 'center' },
+        React.createElement(Text, { dimColor: true }, `${toggleHint}`),
+        React.createElement(Text, { dimColor: true }, ` · `),
+        React.createElement(Text, { dimColor: true }, `Shift+S: Guide`)
+      )
     ),
+    // Input area
     React.createElement(
       Box,
-      { marginTop: 1, flexDirection: 'row', borderStyle: 'round', borderColor: running ? 'green' : 'gray', paddingX: 1 },
-      React.createElement(Text, { bold: true, color: running ? 'green' : 'white' }, running ? ' Stdin buffer ' : ' Input ready '),
+      { 
+        marginTop: 0, 
+        flexDirection: 'row', 
+        borderStyle: running ? 'double' : 'round', 
+        borderColor: running ? 'green' : 'gray', 
+        paddingX: 1,
+        paddingY: 0
+      },
+      React.createElement(
+        Text, 
+        { bold: true, color: running ? 'green' : 'white' }, 
+        running ? ` ${pulseChar} Stdin ` : ' ○ Input '
+      ),
       React.createElement(
         Box,
-        { marginLeft: 1 },
-        React.createElement(CursorText, { value: stdinBuffer || (running ? '' : 'Start a command to feed stdin'), cursorIndex: stdinCursor, active: running })
+        { marginLeft: 1, flexGrow: 1 },
+        React.createElement(CursorText, { 
+          value: stdinBuffer || (running ? '' : 'Ready for commands…'), 
+          cursorIndex: stdinCursor, 
+          active: running 
+        })
+      ),
+      running && React.createElement(
+        Text,
+        { color: 'green', bold: true },
+        ' [Active]'
       )
+    ),
+    // Separator
+    React.createElement(
+      Box,
+      { marginTop: 0 },
+      React.createElement(Text, { dimColor: true }, '─'.repeat(50))
     )
   );
 }

package/src/components/Header.js

@@ -1,21 +1,60 @@
 import React from 'react';
 import { Box, Text } from 'ink';
+import path from 'path';
 
-export default function Header({ projectCountLabel, rootPath, running, statusHint, toggleHint, orbitHint, artHint }) {
+const SPARKS = ['✦', '✧', '✩', '✪', '✫'];
+
+export default function Header({ projectCountLabel, rootPath, running, toggleHint, orbitHint }) {
+  const time = new Date().toLocaleTimeString('en-US', { hour12: false });
+  const spark = SPARKS[Math.floor(Date.now() / 1000) % SPARKS.length];
+  
   return React.createElement(
     Box,
-    { justifyContent: 'space-between' },
+    { flexDirection: 'column', marginBottom: 1 },
+    // Top bar with logo and status
+    React.createElement(
+      Box,
+      { justifyContent: 'space-between', alignItems: 'center' },
+      React.createElement(
+        Box,
+        { flexDirection: 'row', alignItems: 'center' },
+        React.createElement(Text, { color: 'magenta', bold: true }, '🧭 '),
+        React.createElement(Text, { color: 'magenta', bold: true }, 'PROJECT COMPASS'),
+        React.createElement(Text, { color: 'cyan' }, ` ${spark}`)
+      ),
+      React.createElement(
+        Box,
+        { flexDirection: 'row', alignItems: 'center' },
+        React.createElement(Text, { 
+          color: running ? 'yellow' : 'green', 
+          bold: true 
+        }, running ? '⚡ ACTIVE' : '✓ IDLE'),
+        React.createElement(Text, { dimColor: true }, ` ${time}`)
+      )
+    ),
+    // Info bar
     React.createElement(
       Box,
-      { flexDirection: 'column' },
-      React.createElement(Text, { color: 'magenta', bold: true }, 'Project Compass'),
-      React.createElement(Text, { dimColor: true }, `${projectCountLabel} detected in ${rootPath}`)
+      { justifyContent: 'space-between', marginTop: 0 },
+      React.createElement(
+        Box,
+        { flexDirection: 'row' },
+        React.createElement(Text, { dimColor: true }, `${spark} `),
+        React.createElement(Text, { color: 'cyan' }, projectCountLabel),
+        React.createElement(Text, { dimColor: true }, ' in '),
+        React.createElement(Text, { color: 'white' }, path.basename(rootPath))
+      ),
+      React.createElement(
+        Box,
+        { flexDirection: 'row' },
+        React.createElement(Text, { dimColor: true }, `${toggleHint} · ${orbitHint}`)
+      )
     ),
+    // Separator
     React.createElement(
       Box,
-      { flexDirection: 'column', alignItems: 'flex-end' },
-      React.createElement(Text, { color: running ? 'yellow' : 'green' }, statusHint),
-      React.createElement(Text, { dimColor: true }, `${toggleHint} · ${orbitHint} · ${artHint} · Shift+Q: Quit`)
+      { marginTop: 0 },
+      React.createElement(Text, { dimColor: true }, '─'.repeat(50))
     )
   );
 }

package/src/components/Navigator.js

@@ -1,7 +1,11 @@
-import React, { useMemo } from 'react';
+/* global setInterval, clearInterval */
+import React, { useMemo, useState, useEffect } from 'react';
 import { Box, Text } from 'ink';
 import path from 'path';
 
+const SPINNER = ['⠋', '⠙', '⠹', '⠸', '⠼', '⠴', '⠦', '⠧', '⠇', '⠏'];
+const SELECTION_BAR = '█';
+
 export default function Navigator({ 
   projects, 
   selectedIndex, 
@@ -10,39 +14,89 @@ export default function Navigator({
   error, 
   maxVisibleProjects = 3 
 }) {
+  const [tick, setTick] = useState(0);
+  
+  useEffect(() => {
+    if (!loading) return;
+    const timer = setInterval(() => setTick(t => t + 1), 100);
+    return () => clearInterval(timer);
+  }, [loading]);
+  
   const page = Math.floor(selectedIndex / maxVisibleProjects);
   const start = page * maxVisibleProjects;
   const end = start + maxVisibleProjects;
   const visibleProjects = projects.slice(start, end);
-
+  
   const projectRows = useMemo(() => {
-    if (loading) return [React.createElement(Text, { key: 'scanning', dimColor: true }, 'Scanning projects…')];
-    if (error) return [React.createElement(Text, { key: 'error', color: 'red' }, `Unable to scan: ${error}`)];
-    if (projects.length === 0) return [React.createElement(Text, { key: 'empty', dimColor: true }, 'No recognizable project manifests found.')];
+    if (loading) {
+      const spinner = SPINNER[tick % SPINNER.length];
+      return [React.createElement(
+        Box,
+        { key: 'scanning', flexDirection: 'row', alignItems: 'center' },
+        React.createElement(Text, { color: 'cyan' }, ` ${spinner} `),
+        React.createElement(Text, { dimColor: true }, 'Scanning projects…'),
+        React.createElement(Text, { color: 'cyan' }, ' ●'.repeat(3 + (tick % 3)))
+      )];
+    }
+    if (error) return [React.createElement(
+      Box,
+      { key: 'error', flexDirection: 'row', alignItems: 'center' },
+      React.createElement(Text, { color: 'red', bold: true }, ' ✗ '),
+      React.createElement(Text, { color: 'red' }, `Unable to scan: ${error}`)
+    )];
+    if (projects.length === 0) return [React.createElement(
+      Box,
+      { key: 'empty', flexDirection: 'row', alignItems: 'center' },
+      React.createElement(Text, { color: 'yellow' }, ' ⚠ '),
+      React.createElement(Text, { dimColor: true }, 'No recognizable project manifests found.')
+    )];
 
     return visibleProjects.map((project, index) => {
       const absoluteIndex = start + index;
       const isSelected = absoluteIndex === selectedIndex;
-      const frameworkBadges = (project.frameworks || []).map((frame) => `${frame.icon} ${frame.name}`).join(', ');
+      const frameworkBadges = (project.frameworks || []).map((frame) => 
+        React.createElement(Text, { key: frame.name, color: 'cyan', dimColor: !isSelected }, ` ${frame.icon}${frame.name}`)
+      );
       const hasMissingRuntime = project.missingBinaries && project.missingBinaries.length > 0;
       
       return React.createElement(
         Box,
-        { key: project.id, flexDirection: 'column', marginBottom: 1, padding: 1 },
+        { 
+          key: project.id, 
+          flexDirection: 'column', 
+          marginBottom: 0,
+          borderStyle: isSelected ? 'bold' : 'single',
+          borderColor: isSelected ? 'cyan' : 'gray',
+          paddingX: 1,
+          paddingY: 0
+        },
         React.createElement(
           Box,
-          { flexDirection: 'row' },
-          React.createElement(Text, { color: isSelected ? 'cyan' : 'white', bold: isSelected }, `${project.icon} ${project.name}`),
-          hasMissingRuntime && React.createElement(Text, { color: 'red', bold: true }, '  ⚠️ Runtime missing')
+          { flexDirection: 'row', alignItems: 'center' },
+          React.createElement(Text, { 
+            color: isSelected ? 'cyan' : 'white', 
+            bold: isSelected 
+          }, `${isSelected ? SELECTION_BAR + ' ' : '  '}${project.icon} ${project.name}`),
+          hasMissingRuntime && React.createElement(Text, { color: 'red', bold: true }, '  ⚠ Runtime missing')
         ),
-        React.createElement(Text, { dimColor: true }, `  ${project.type} · ${path.relative(rootPath, project.path) || '.'}`),
-        frameworkBadges && React.createElement(Text, { dimColor: true }, `   ${frameworkBadges}`)
+        React.createElement(
+          Box,
+          { flexDirection: 'row', alignItems: 'center' },
+          React.createElement(Text, { dimColor: true }, `  ${project.type}`),
+          React.createElement(Text, { dimColor: true }, ` · ${path.relative(rootPath, project.path) || '.'}`)
+        ),
+        frameworkBadges.length > 0 && React.createElement(
+          Box,
+          { marginTop: 0 },
+          React.createElement(Text, { dimColor: true }, '  '),
+          ...frameworkBadges
+        )
       );
     });
-  }, [loading, error, projects.length, visibleProjects, selectedIndex, start, rootPath]);
+  }, [loading, error, projects.length, visibleProjects, selectedIndex, start, rootPath, tick]);
 
   const totalPages = Math.ceil(projects.length / maxVisibleProjects);
-
+  
   return React.createElement(
     Box,
     { flexDirection: 'column' },
@@ -50,7 +104,7 @@ export default function Navigator({
     projects.length > maxVisibleProjects && React.createElement(
       Box,
       { marginTop: 1, justifyContent: 'center' },
-      React.createElement(Text, { dimColor: true }, `Page ${page + 1} of ${totalPages} (Total: ${projects.length})`)
+      React.createElement(Text, { dimColor: true }, `${'-'.repeat(3)} Page ${page + 1}/${totalPages} (${projects.length} projects) ${'-'.repeat(3)}`)
     )
   );
 }

package/src/detectors/dotnet.js

@@ -1,13 +1,118 @@
+import fs from 'fs';
 import path from 'path';
-import { checkBinary } from './utils.js';
+import { checkBinary, hasProjectFile } from './utils.js';
+
+function parseCsProj(content) {
+  const metadata = {
+    name: '',
+    targetFramework: '',
+    dependencies: []
+  };
+  
+  const nameMatch = content.match(/<AssemblyName>([^<]+)<\/AssemblyName>/);
+  if (nameMatch) metadata.name = nameMatch[1];
+  
+  const frameworkMatch = content.match(/<TargetFramework>([^<]+)<\/TargetFramework>/);
+  if (frameworkMatch) metadata.targetFramework = frameworkMatch[1];
+  
+  const packageMatches = content.matchAll(/<PackageReference\s+Include="([^"]+)"[^/]*\/?>/g);
+  for (const match of packageMatches) {
+    if (match[1]) metadata.dependencies.push(match[1]);
+  }
+  
+  return metadata;
+}
+
+function detectDotnetFrameworks(deps) {
+  const frameworks = [];
+  const depStr = deps.join(' ').toLowerCase();
+  
+  if (depStr.includes('microsoft.aspnetcore') || depStr.includes('microsoft.aspnetcore.app')) frameworks.push({ name: 'ASP.NET Core', icon: '🔷' });
+  if (depStr.includes('blazor')) frameworks.push({ name: 'Blazor', icon: '🌀' });
+  if (depStr.includes('entityframework') || depStr.includes('efcore')) frameworks.push({ name: 'Entity Framework', icon: '🗄️' });
+  if (depStr.includes('newtonsoft.json')) frameworks.push({ name: 'Newtonsoft.Json', icon: '📄' });
+  if (depStr.includes('xunit')) frameworks.push({ name: 'xUnit', icon: '✅' });
+  if (depStr.includes('nunit')) frameworks.push({ name: 'NUnit', icon: '🔬' });
+  if (depStr.includes('mstest')) frameworks.push({ name: 'MSTest', icon: '🧪' });
+  if (depStr.includes('automapper')) frameworks.push({ name: 'AutoMapper', icon: '🔄' });
+  if (depStr.includes('mass transit') || depStr.includes('masstransit')) frameworks.push({ name: 'MassTransit', icon: '🚌' });
+  if (depStr.includes('grpc')) frameworks.push({ name: 'gRPC', icon: '🔌' });
+  
+  return frameworks;
+}
+
+function findCsProj(projectPath) {
+  try {
+    const files = fs.readdirSync(projectPath);
+    const csproj = files.find(f => f.endsWith('.csproj') || f.endsWith('.fsproj'));
+    if (csproj) return path.join(projectPath, csproj);
+  } catch { /* ignore */ }
+  return null;
+}
+
 export default {
-  type: 'dotnet', label: '.NET', icon: '🎯', priority: 65, files: ['*.csproj', '*.sln'], binaries: ['dotnet'],
+  type: 'dotnet',
+  label: '.NET',
+  icon: '🎯',
+  priority: 65,
+  files: ['*.csproj', '*.sln', '*.fsproj'],
+  binaries: ['dotnet'],
   async build(projectPath, manifest) {
     const missingBinaries = this.binaries.filter(b => !checkBinary(b));
+    let metadata = { name: '', targetFramework: '', dependencies: [] };
+    let frameworks = [];
+    
+    const csprojPath = findCsProj(projectPath);
+    if (csprojPath && fs.existsSync(csprojPath)) {
+      const content = fs.readFileSync(csprojPath, 'utf-8');
+      metadata = parseCsProj(content);
+      frameworks = detectDotnetFrameworks(metadata.dependencies);
+    }
+    
+    const commands = {
+      install: { label: 'Dotnet restore', command: ['dotnet', 'restore'], source: 'builtin' },
+      build: { label: 'Dotnet build', command: ['dotnet', 'build'], source: 'builtin' },
+      test: { label: 'Dotnet test', command: ['dotnet', 'test'], source: 'builtin' },
+      run: { label: 'Dotnet run', command: ['dotnet', 'run'], source: 'builtin' },
+      clean: { label: 'Dotnet clean', command: ['dotnet', 'clean'], source: 'builtin' },
+      publish: { label: 'Dotnet publish', command: ['dotnet', 'publish'], source: 'builtin' }
+    };
+    
+    if (hasProjectFile(projectPath, '*.sln')) {
+      commands['restore-sl'] = { label: 'Restore Solution', command: ['dotnet', 'restore'], source: 'builtin' };
+    }
+
+    const setupHints = [];
+    if (missingBinaries.length > 0) {
+      setupHints.push('Install .NET SDK: https://dot.net/');
+    }
+    if (metadata.targetFramework) {
+      setupHints.push(`Target Framework: ${metadata.targetFramework}`);
+    }
+    if (metadata.dependencies.length > 0) {
+      setupHints.push('Run dotnet restore to fetch dependencies');
+    }
+
     return {
-      id: `${projectPath}::dotnet`, path: projectPath, name: path.basename(projectPath), type: '.NET', icon: '🎯',
-      priority: this.priority, commands: { install: { label: 'dotnet restore', command: ['dotnet', 'restore'] } },
-      metadata: {}, manifest: path.basename(manifest), description: '', missingBinaries, extra: {}
+      id: `${projectPath}::dotnet`,
+      path: projectPath,
+      name: metadata.name || path.basename(projectPath),
+      type: '.NET',
+      icon: '🎯',
+      priority: this.priority,
+      commands,
+      metadata: {
+        ...metadata,
+        packageManager: 'dotnet'
+      },
+      manifest: path.basename(manifest),
+      description: frameworks.map(f => f.name).join(', ') || metadata.targetFramework,
+      missingBinaries,
+      frameworks,
+      extra: {
+        setupHints,
+        targetFramework: metadata.targetFramework
+      }
     };
   }
 };