apteva 0.2.3 → 0.2.6

package/src/server.ts

@@ -4,8 +4,66 @@ import { serveStatic } from "./routes/static";
 import { join } from "path";
 import { homedir } from "os";
 import { mkdirSync, existsSync } from "fs";
-import { initDatabase, AgentDB, ProviderKeysDB } from "./db";
-import { ensureBinary, getBinaryPath, getBinaryStatus, getActualBinaryPath } from "./binary";
+import { initDatabase, AgentDB, ProviderKeysDB, McpServerDB, type McpServer, type Agent } from "./db";
+import { startMcpProcess } from "./mcp-client";
+import {
+  ensureBinary,
+  getBinaryPath,
+  getBinaryStatus,
+  getActualBinaryPath,
+  initVersionTracking,
+  checkForUpdates,
+  getInstalledVersion,
+  getAptevaVersion,
+  downloadLatestBinary,
+} from "./binary";
+
+// ============ SSE Telemetry Broadcast ============
+export interface TelemetryEvent {
+  id: string;
+  agent_id: string;
+  timestamp: string;
+  category: string;
+  type: string;
+  level: string;
+  trace_id?: string;
+  thread_id?: string;
+  data?: Record<string, unknown>;
+  duration_ms?: number;
+  error?: string;
+}
+
+class TelemetryBroadcaster {
+  private clients: Set<ReadableStreamDefaultController<string>> = new Set();
+
+  addClient(controller: ReadableStreamDefaultController<string>) {
+    this.clients.add(controller);
+  }
+
+  removeClient(controller: ReadableStreamDefaultController<string>) {
+    this.clients.delete(controller);
+  }
+
+  broadcast(events: TelemetryEvent[]) {
+    if (this.clients.size === 0) return;
+
+    const data = `data: ${JSON.stringify(events)}\n\n`;
+    for (const controller of this.clients) {
+      try {
+        controller.enqueue(data);
+      } catch {
+        // Client disconnected, remove it
+        this.clients.delete(controller);
+      }
+    }
+  }
+
+  get clientCount() {
+    return this.clients.size;
+  }
+}
+
+export const telemetryBroadcaster = new TelemetryBroadcaster();
 
 const PORT = parseInt(process.env.PORT || "4280");
 
@@ -33,8 +91,16 @@ if (await envFile.exists()) {
 // Initialize database (silently)
 initDatabase(DATA_DIR);
 
-// Reset all agents to stopped on startup (processes don't survive restart)
+// Initialize version tracking
+initVersionTracking(DATA_DIR);
+
+// Get agents and MCP servers that were running before restart (for auto-restart)
+const agentsToRestart = AgentDB.findRunning();
+const mcpServersToRestart = McpServerDB.findRunning();
+
+// Reset all agents and MCP servers to stopped on startup (processes don't survive restart)
 AgentDB.resetAllStatus();
+McpServerDB.resetAllStatus();
 
 // In-memory store for running agent processes only
 export const agentProcesses: Map<string, Subprocess> = new Map();
@@ -86,8 +152,9 @@ function link(url: string, text?: string): string {
 
 
 // Startup banner
+const aptevaVersion = getAptevaVersion();
 console.log(`
-  ${c.orange}${c.bold}>_ apteva${c.reset}
+  ${c.orange}${c.bold}>_ apteva${c.reset} ${c.gray}v${aptevaVersion}${c.reset}
   ${c.gray}Run AI agents locally${c.reset}
 `);
 
@@ -97,9 +164,28 @@ const binaryResult = await ensureBinary(BIN_DIR);
 // ensureBinary prints its own status when downloading/failing
 // We only need to print "ready" if binary already existed
 if (binaryResult.success && !binaryResult.downloaded) {
-  console.log(`${c.gray}binary ready${c.reset}`);
+  const installedVersion = getInstalledVersion();
+  console.log(`${c.gray}v${installedVersion || "unknown"} ready${c.reset}`);
 }
 
+// Check for updates in background (don't block startup)
+checkForUpdates().then(versions => {
+  const updates: string[] = [];
+  if (versions.apteva.updateAvailable) {
+    updates.push(`apteva: v${versions.apteva.installed} → v${versions.apteva.latest}`);
+  }
+  if (versions.agent.updateAvailable) {
+    updates.push(`agent: v${versions.agent.installed || "?"} → v${versions.agent.latest}`);
+  }
+  if (updates.length > 0) {
+    console.log(`\n  ${c.orange}Updates available:${c.reset}`);
+    updates.forEach(u => console.log(`  ${c.gray}• ${u}${c.reset}`));
+    console.log(`  ${c.gray}Update from Settings or run: npx apteva@latest${c.reset}\n`);
+  }
+}).catch(() => {
+  // Silently ignore version check failures
+});
+
 // Check database
 process.stdout.write(`  ${c.darkGray}Agents${c.reset}    `);
 console.log(`${c.gray}${AgentDB.count()} loaded${c.reset}`);
@@ -151,4 +237,82 @@ console.log(`
             ${c.darkGray}Click link or Cmd/Ctrl+C to copy${c.reset}
 `);
 
+// Auto-restart agents and MCP servers that were running before restart
+const hasRestarts = agentsToRestart.length > 0 || mcpServersToRestart.length > 0;
+
+if (hasRestarts) {
+  // Restart in background to not block startup
+  (async () => {
+    // Import startAgentProcess dynamically to avoid circular dependency
+    const { startAgentProcess } = await import("./routes/api");
+
+    // Restart MCP servers first (agents may depend on them)
+    if (mcpServersToRestart.length > 0) {
+      console.log(`  ${c.darkGray}MCP${c.reset}       ${c.gray}Restarting ${mcpServersToRestart.length} server(s)...${c.reset}`);
+
+      for (const server of mcpServersToRestart) {
+        try {
+          // Helper to substitute $ENV_VAR references with actual values
+          const substituteEnvVars = (str: string, env: Record<string, string>): string => {
+            return str.replace(/\$([A-Z_][A-Z0-9_]*)/g, (_, varName) => {
+              return env[varName] || '';
+            });
+          };
+
+          let cmd: string[];
+          const serverEnv = server.env || {};
+
+          if (server.command) {
+            cmd = server.command.split(" ");
+            if (server.args) {
+              const substitutedArgs = substituteEnvVars(server.args, serverEnv);
+              cmd.push(...substitutedArgs.split(" "));
+            }
+          } else if (server.package) {
+            cmd = ["npx", "-y", server.package];
+            if (server.args) {
+              const substitutedArgs = substituteEnvVars(server.args, serverEnv);
+              cmd.push(...substitutedArgs.split(" "));
+            }
+          } else {
+            console.log(`  ${c.gray}  ✗ ${server.name}: no command or package${c.reset}`);
+            continue;
+          }
+
+          const port = getNextPort();
+          const result = await startMcpProcess(server.id, cmd, serverEnv, port);
+
+          if (result.success) {
+            McpServerDB.setStatus(server.id, "running", port);
+            console.log(`  ${c.gray}  ✓ ${server.name} on :${port}${c.reset}`);
+          } else {
+            console.log(`  ${c.gray}  ✗ ${server.name}: ${result.error}${c.reset}`);
+          }
+        } catch (err) {
+          console.log(`  ${c.gray}  ✗ ${server.name}: ${err}${c.reset}`);
+        }
+      }
+    }
+
+    // Then restart agents
+    if (agentsToRestart.length > 0) {
+      console.log(`  ${c.darkGray}Agents${c.reset}    ${c.gray}Restarting ${agentsToRestart.length} agent(s)...${c.reset}`);
+
+      for (const agent of agentsToRestart) {
+        try {
+          const result = await startAgentProcess(agent, { silent: true });
+
+          if (result.success) {
+            console.log(`  ${c.gray}  ✓ ${agent.name} on :${result.port}${c.reset}`);
+          } else {
+            console.log(`  ${c.gray}  ✗ ${agent.name}: ${result.error}${c.reset}`);
+          }
+        } catch (err) {
+          console.log(`  ${c.gray}  ✗ ${agent.name}: ${err}${c.reset}`);
+        }
+      }
+    }
+  })();
+}
+
 // Note: Don't use "export default server" - it causes Bun to print "Started server" message

package/src/web/App.tsx

@@ -6,6 +6,9 @@ import "@apteva/apteva-kit/styles.css";
 import type { Agent, Provider, Route, NewAgentForm } from "./types";
 import { DEFAULT_FEATURES } from "./types";
 
+// Context
+import { TelemetryProvider } from "./context";
+
 // Hooks
 import { useAgents, useProviders, useOnboarding } from "./hooks";
 
@@ -20,6 +23,9 @@ import {
   CreateAgentModal,
   AgentsView,
   Dashboard,
+  TasksPage,
+  McpPage,
+  TelemetryPage,
 } from "./components";
 
 function App() {
@@ -33,6 +39,7 @@ function App() {
     runningCount,
     fetchAgents,
     createAgent,
+    updateAgent,
     deleteAgent,
     toggleAgent,
   } = useAgents(onboardingComplete === true);
@@ -48,6 +55,28 @@ function App() {
   const [selectedAgent, setSelectedAgent] = useState<Agent | null>(null);
   const [route, setRoute] = useState<Route>("dashboard");
   const [startError, setStartError] = useState<string | null>(null);
+  const [taskCount, setTaskCount] = useState(0);
+
+  // Fetch task count periodically
+  useEffect(() => {
+    if (onboardingComplete !== true) return;
+
+    const fetchTaskCount = async () => {
+      try {
+        const res = await fetch("/api/tasks?status=pending");
+        if (res.ok) {
+          const data = await res.json();
+          setTaskCount(data.count || 0);
+        }
+      } catch {
+        // Ignore errors
+      }
+    };
+
+    fetchTaskCount();
+    const interval = setInterval(fetchTaskCount, 15000);
+    return () => clearInterval(interval);
+  }, [onboardingComplete]);
 
   // Form state
   const [newAgent, setNewAgent] = useState<NewAgentForm>({
@@ -152,7 +181,7 @@ function App() {
   }
 
   return (
-    <div className="min-h-screen bg-[#0a0a0a] text-[#e0e0e0] font-mono flex flex-col">
+    <div className="h-screen bg-[#0a0a0a] text-[#e0e0e0] font-mono flex flex-col overflow-hidden">
       <Header
         onNewAgent={() => setShowCreate(true)}
         canCreateAgent={configuredProviders.length > 0}
@@ -166,6 +195,7 @@ function App() {
         <Sidebar
           route={route}
           agentCount={agents.length}
+          taskCount={taskCount}
           onNavigate={handleNavigate}
         />
 
@@ -177,10 +207,12 @@ function App() {
               agents={agents}
               loading={loading}
               selectedAgent={selectedAgent}
+              providers={providers}
               onSelectAgent={handleSelectAgent}
               onCloseAgent={() => setSelectedAgent(null)}
               onToggleAgent={handleToggleAgent}
               onDeleteAgent={handleDeleteAgent}
+              onUpdateAgent={updateAgent}
             />
           )}
 
@@ -194,6 +226,12 @@ function App() {
               onSelectAgent={handleSelectAgent}
             />
           )}
+
+          {route === "tasks" && <TasksPage />}
+
+          {route === "mcp" && <McpPage />}
+
+          {route === "telemetry" && <TelemetryPage />}
         </main>
       </div>
 
@@ -218,4 +256,8 @@ function App() {
 
 // Mount the app
 const root = createRoot(document.getElementById("root")!);
-root.render(<App />);
+root.render(
+  <TelemetryProvider>
+    <App />
+  </TelemetryProvider>
+);

package/src/web/components/agents/AgentCard.tsx

@@ -1,5 +1,6 @@
 import React from "react";
 import { MemoryIcon, TasksIcon, VisionIcon, OperatorIcon, McpIcon, RealtimeIcon } from "../common/Icons";
+import { useAgentActivity } from "../../context";
 import type { Agent, AgentFeatures } from "../../types";
 
 interface AgentCardProps {
@@ -21,6 +22,8 @@ const FEATURE_ICONS: { key: keyof AgentFeatures; icon: React.ComponentType<{ cla
 
 export function AgentCard({ agent, selected, onSelect, onToggle, onDelete }: AgentCardProps) {
   const enabledFeatures = FEATURE_ICONS.filter(f => agent.features?.[f.key]);
+  const mcpServers = agent.mcpServerDetails || [];
+  const { isActive, category, type } = useAgentActivity(agent.id);
 
   return (
     <div
@@ -32,14 +35,27 @@ export function AgentCard({ agent, selected, onSelect, onToggle, onDelete }: Age
       }`}
     >
       <div className="flex items-start justify-between mb-3">
-        <div>
-          <h3 className="font-semibold text-lg">{agent.name}</h3>
-          <p className="text-sm text-[#666]">
-            {agent.provider} / {agent.model}
-            {agent.port && <span className="text-[#444]"> · :{agent.port}</span>}
-          </p>
+        <div className="flex items-center gap-2">
+          {/* Activity indicator */}
+          {agent.status === "running" && (
+            <span
+              className={`w-2 h-2 rounded-full transition-all ${
+                isActive
+                  ? "bg-green-400 animate-pulse"
+                  : "bg-[#333]"
+              }`}
+              title={isActive ? `${category}: ${type}` : "Idle"}
+            />
+          )}
+          <div>
+            <h3 className="font-semibold text-lg">{agent.name}</h3>
+            <p className="text-sm text-[#666]">
+              {agent.provider} / {agent.model}
+              {agent.port && <span className="text-[#444]"> · :{agent.port}</span>}
+            </p>
+          </div>
         </div>
-        <StatusBadge status={agent.status} />
+        <StatusBadge status={agent.status} isActive={isActive && agent.status === "running"} activityType={type} />
       </div>
 
       {enabledFeatures.length > 0 && (
@@ -47,7 +63,7 @@ export function AgentCard({ agent, selected, onSelect, onToggle, onDelete }: Age
           {enabledFeatures.map(({ key, icon: Icon, label }) => (
             <span
               key={key}
-              className="inline-flex items-center gap-1 px-2 py-0.5 rounded bg-[#1a1a1a] text-[#888] text-xs"
+              className="inline-flex items-center gap-1 px-2 py-0.5 rounded bg-[#f97316]/10 text-[#f97316]/70 text-xs"
               title={label}
             >
               <Icon className="w-3 h-3" />
@@ -57,6 +73,26 @@ export function AgentCard({ agent, selected, onSelect, onToggle, onDelete }: Age
         </div>
       )}
 
+      {/* MCP Servers */}
+      {mcpServers.length > 0 && (
+        <div className="flex flex-wrap gap-1.5 mb-3">
+          {mcpServers.map((server) => (
+            <span
+              key={server.id}
+              className={`inline-flex items-center gap-1 px-2 py-0.5 rounded text-xs ${
+                server.status === "running"
+                  ? "bg-green-500/10 text-green-400"
+                  : "bg-[#222] text-[#666]"
+              }`}
+              title={`MCP: ${server.name} (${server.status})`}
+            >
+              <McpIcon className="w-3 h-3" />
+              {server.name}
+            </span>
+          ))}
+        </div>
+      )}
+
       <p className="text-sm text-[#666] line-clamp-2 mb-4">
         {agent.systemPrompt}
       </p>
@@ -83,7 +119,15 @@ export function AgentCard({ agent, selected, onSelect, onToggle, onDelete }: Age
   );
 }
 
-function StatusBadge({ status }: { status: Agent["status"] }) {
+function StatusBadge({ status, isActive, activityType }: { status: Agent["status"]; isActive?: boolean; activityType?: string }) {
+  if (status === "running" && isActive && activityType) {
+    return (
+      <span className="px-2 py-1 rounded text-xs font-medium bg-green-500/20 text-green-400 animate-pulse">
+        {activityType}
+      </span>
+    );
+  }
+
   return (
     <span
       className={`px-2 py-1 rounded text-xs font-medium ${