@aion0/forge 0.2.19 → 0.2.20

package/components/Dashboard.tsx

@@ -8,6 +8,7 @@ import SessionView from './SessionView';
 import NewTaskModal from './NewTaskModal';
 import SettingsModal from './SettingsModal';
 import TunnelToggle from './TunnelToggle';
+import MonitorPanel from './MonitorPanel';
 import type { Task } from '@/src/types';
 import type { WebTerminalHandle } from './WebTerminal';
 
@@ -44,6 +45,7 @@ export default function Dashboard({ user }: { user: any }) {
   const [activeTaskId, setActiveTaskId] = useState<string | null>(null);
   const [showNewTask, setShowNewTask] = useState(false);
   const [showSettings, setShowSettings] = useState(false);
+  const [showMonitor, setShowMonitor] = useState(false);
   const [usage, setUsage] = useState<UsageSummary[]>([]);
   const [providers, setProviders] = useState<ProviderInfo[]>([]);
   const [projects, setProjects] = useState<ProjectInfo[]>([]);
@@ -200,6 +202,16 @@ export default function Dashboard({ user }: { user: any }) {
             >
               Pipelines
             </button>
+            <button
+              onClick={() => setViewMode('sessions')}
+              className={`text-[11px] px-2.5 py-0.5 rounded transition-colors ${
+                viewMode === 'sessions'
+                  ? 'bg-[var(--bg-secondary)] text-[var(--text-primary)] shadow-sm'
+                  : 'text-[var(--text-secondary)] hover:text-[var(--text-primary)]'
+              }`}
+            >
+              Sessions
+            </button>
             <button
               onClick={() => setViewMode('preview')}
               className={`text-[11px] px-2.5 py-0.5 rounded transition-colors ${
@@ -238,8 +250,8 @@ export default function Dashboard({ user }: { user: any }) {
             </span>
           )}
           <button
-            onClick={() => setViewMode('sessions')}
-            className={`text-xs ${viewMode === 'sessions' ? 'text-[var(--text-primary)]' : 'text-[var(--text-secondary)] hover:text-[var(--text-primary)]'}`}
+            onClick={() => setShowMonitor(true)}
+            className="text-xs text-[var(--text-secondary)] hover:text-[var(--text-primary)]"
           >
             Monitor
           </button>
@@ -414,6 +426,8 @@ export default function Dashboard({ user }: { user: any }) {
         />
       )}
 
+      {showMonitor && <MonitorPanel onClose={() => setShowMonitor(false)} />}
+
       {showSettings && (
         <SettingsModal onClose={() => { setShowSettings(false); fetchData(); }} />
       )}

package/components/SessionView.tsx

@@ -32,16 +32,6 @@ interface Watcher {
   createdAt: string;
 }
 
-interface MonitorData {
-  processes: {
-    nextjs: { running: boolean; pid: string };
-    terminal: { running: boolean; pid: string };
-    telegram: { running: boolean; pid: string };
-    tunnel: { running: boolean; pid: string; url: string };
-  };
-  sessions: { name: string; created: string; attached: boolean; windows: number }[];
-  uptime: string;
-}
 
 export default function SessionView({
   projectName,
@@ -63,7 +53,6 @@ export default function SessionView({
   const [watchers, setWatchers] = useState<Watcher[]>([]);
   const [batchMode, setBatchMode] = useState(false);
   const [selectedIds, setSelectedIds] = useState<Map<string, Set<string>>>(new Map());
-  const [monitor, setMonitor] = useState<MonitorData | null>(null);
   const bottomRef = useRef<HTMLDivElement>(null);
 
   // Load cached sessions tree
@@ -91,17 +80,10 @@ export default function SessionView({
     } catch {}
   }, []);
 
-  const refreshMonitor = useCallback(() => {
-    fetch('/api/monitor').then(r => r.json()).then(setMonitor).catch(() => {});
-  }, []);
-
   useEffect(() => {
     loadTree(true);
     loadWatchers();
-    refreshMonitor();
-    const timer = setInterval(refreshMonitor, 5000);
-    return () => clearInterval(timer);
-  }, [loadTree, loadWatchers, refreshMonitor]);
+  }, [loadTree, loadWatchers]);
 
   // Auto-expand project if only one or if pre-selected
   useEffect(() => {
@@ -347,46 +329,6 @@ export default function SessionView({
           </div>
         )}
 
-        {/* Monitor — always visible */}
-        {monitor && (
-          <div className="border-b border-[var(--border)] px-2 py-2 space-y-1.5">
-            <div className="flex items-center justify-between">
-              <span className="text-[9px] font-semibold text-[var(--text-secondary)] uppercase">Processes</span>
-              {monitor.uptime && (
-                <span className="text-[8px] text-[var(--text-secondary)]">up {monitor.uptime}</span>
-              )}
-            </div>
-            {[
-              { label: 'Next.js', ...monitor.processes.nextjs },
-              { label: 'Terminal', ...monitor.processes.terminal },
-              { label: 'Telegram', ...monitor.processes.telegram },
-              { label: 'Tunnel', ...monitor.processes.tunnel },
-            ].map(p => (
-              <div key={p.label} className="flex items-center gap-1.5 text-[10px]">
-                <span className={p.running ? 'text-green-400' : 'text-gray-500'}>●</span>
-                <span className="text-[var(--text-primary)]">{p.label}</span>
-                <span className="text-[var(--text-secondary)] font-mono ml-auto">{p.running ? `pid:${p.pid}` : 'stopped'}</span>
-              </div>
-            ))}
-            {monitor.processes.tunnel.running && monitor.processes.tunnel.url && (
-              <div className="text-[9px] text-[var(--accent)] truncate pl-4">{monitor.processes.tunnel.url}</div>
-            )}
-
-            {monitor.sessions.length > 0 && (
-              <div className="pt-1">
-                <span className="text-[9px] font-semibold text-[var(--text-secondary)] uppercase">Tmux ({monitor.sessions.length})</span>
-                {monitor.sessions.map(s => (
-                  <div key={s.name} className="flex items-center gap-1.5 text-[10px] mt-0.5">
-                    <span className={s.attached ? 'text-green-400' : 'text-yellow-500'}>●</span>
-                    <span className="font-mono text-[var(--text-primary)] truncate flex-1">{s.name}</span>
-                    <span className="text-[8px] text-[var(--text-secondary)]">{s.attached ? 'attached' : 'detached'}</span>
-                  </div>
-                ))}
-              </div>
-            )}
-          </div>
-        )}
-
         {/* Tree */}
         <div className="flex-1 overflow-y-auto">
           {Object.keys(sessionTree).length === 0 && (

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aion0/forge",
-  "version": "0.2.19",
+  "version": "0.2.20",
   "description": "Unified AI workflow platform — multi-model task orchestration, persistent sessions, web terminal, remote access",
   "type": "module",
   "scripts": {