apteva 0.4.56 → 0.7.0

package/src/web/context/ProjectContext.tsx

@@ -1,214 +0,0 @@
-import React, { createContext, useContext, useState, useEffect, useCallback, useMemo, type ReactNode } from "react";
-import { useAuth } from "./AuthContext";
-
-export interface Project {
-  id: string;
-  name: string;
-  description: string | null;
-  color: string;
-  agentCount: number;
-  createdAt: string;
-  updatedAt: string;
-}
-
-interface ProjectContextValue {
-  projects: Project[];
-  currentProjectId: string | null; // null = "All Projects", "unassigned" = unassigned agents
-  currentProject: Project | null;
-  isLoading: boolean;
-  error: string | null;
-  unassignedCount: number;
-  projectsEnabled: boolean; // Feature flag
-  metaAgentEnabled: boolean; // Feature flag
-  costTrackingEnabled: boolean; // Feature flag
-  setCurrentProjectId: (id: string | null) => void;
-  createProject: (data: { name: string; description?: string; color?: string }) => Promise<Project | null>;
-  updateProject: (id: string, data: { name?: string; description?: string; color?: string }) => Promise<Project | null>;
-  deleteProject: (id: string) => Promise<boolean>;
-  refreshProjects: () => Promise<void>;
-}
-
-const ProjectContext = createContext<ProjectContextValue | null>(null);
-
-export function useProjects(): ProjectContextValue {
-  const context = useContext(ProjectContext);
-  if (!context) {
-    throw new Error("useProjects must be used within a ProjectProvider");
-  }
-  return context;
-}
-
-interface ProjectProviderProps {
-  children: ReactNode;
-}
-
-const STORAGE_KEY = "apteva_current_project";
-
-export function ProjectProvider({ children }: ProjectProviderProps) {
-  const { authFetch, isAuthenticated, isLoading: authLoading } = useAuth();
-  const [projects, setProjects] = useState<Project[]>([]);
-  const [currentProjectId, setCurrentProjectIdState] = useState<string | null>(() => {
-    // Load from localStorage
-    if (typeof window !== "undefined") {
-      return localStorage.getItem(STORAGE_KEY);
-    }
-    return null;
-  });
-  const [isLoading, setIsLoading] = useState(true);
-  const [error, setError] = useState<string | null>(null);
-  const [unassignedCount, setUnassignedCount] = useState(0);
-  const [projectsEnabled, setProjectsEnabled] = useState(false);
-  const [metaAgentEnabled, setMetaAgentEnabled] = useState(false);
-  const [costTrackingEnabled, setCostTrackingEnabled] = useState(true);
-
-  // Fetch feature flags on mount
-  useEffect(() => {
-    fetch("/api/features")
-      .then(res => res.json())
-      .then(data => {
-        setProjectsEnabled(data.projects === true);
-        setMetaAgentEnabled(data.metaAgent === true);
-        setCostTrackingEnabled(data.costTracking !== false);
-      })
-      .catch(() => {
-        setProjectsEnabled(false);
-        setMetaAgentEnabled(false);
-        setCostTrackingEnabled(true);
-      });
-  }, []);
-
-  const setCurrentProjectId = useCallback((id: string | null) => {
-    setCurrentProjectIdState(id);
-    if (typeof window !== "undefined") {
-      if (id === null) {
-        localStorage.removeItem(STORAGE_KEY);
-      } else {
-        localStorage.setItem(STORAGE_KEY, id);
-      }
-    }
-  }, []);
-
-  const currentProject = projects.find(p => p.id === currentProjectId) || null;
-
-  const refreshProjects = useCallback(async () => {
-    // Don't fetch if projects feature is disabled
-    if (!projectsEnabled) {
-      setProjects([]);
-      setIsLoading(false);
-      return;
-    }
-
-    if (!isAuthenticated && !authLoading) {
-      setProjects([]);
-      setIsLoading(false);
-      return;
-    }
-
-    try {
-      setError(null);
-      const res = await authFetch("/api/projects");
-      if (!res.ok) {
-        throw new Error("Failed to fetch projects");
-      }
-      const data = await res.json();
-      setProjects(data.projects || []);
-      setUnassignedCount(data.unassignedCount || 0);
-
-      // If current project no longer exists, reset to all
-      if (currentProjectId && currentProjectId !== "unassigned" && !data.projects.find((p: Project) => p.id === currentProjectId)) {
-        setCurrentProjectId(null);
-      }
-    } catch (e) {
-      console.error("Failed to fetch projects:", e);
-      setError("Failed to load projects");
-    } finally {
-      setIsLoading(false);
-    }
-  }, [authFetch, isAuthenticated, authLoading, currentProjectId, setCurrentProjectId, projectsEnabled]);
-
-  const createProject = useCallback(async (data: { name: string; description?: string; color?: string }): Promise<Project | null> => {
-    try {
-      const res = await authFetch("/api/projects", {
-        method: "POST",
-        headers: { "Content-Type": "application/json" },
-        body: JSON.stringify(data),
-      });
-      if (!res.ok) {
-        const err = await res.json();
-        throw new Error(err.error || "Failed to create project");
-      }
-      const result = await res.json();
-      await refreshProjects();
-      return result.project;
-    } catch (e) {
-      console.error("Failed to create project:", e);
-      return null;
-    }
-  }, [authFetch, refreshProjects]);
-
-  const updateProject = useCallback(async (id: string, data: { name?: string; description?: string; color?: string }): Promise<Project | null> => {
-    try {
-      const res = await authFetch(`/api/projects/${id}`, {
-        method: "PUT",
-        headers: { "Content-Type": "application/json" },
-        body: JSON.stringify(data),
-      });
-      if (!res.ok) {
-        const err = await res.json();
-        throw new Error(err.error || "Failed to update project");
-      }
-      const result = await res.json();
-      await refreshProjects();
-      return result.project;
-    } catch (e) {
-      console.error("Failed to update project:", e);
-      return null;
-    }
-  }, [authFetch, refreshProjects]);
-
-  const deleteProject = useCallback(async (id: string): Promise<boolean> => {
-    try {
-      const res = await authFetch(`/api/projects/${id}`, {
-        method: "DELETE",
-      });
-      if (!res.ok) {
-        const err = await res.json();
-        throw new Error(err.error || "Failed to delete project");
-      }
-      if (currentProjectId === id) {
-        setCurrentProjectId(null);
-      }
-      await refreshProjects();
-      return true;
-    } catch (e) {
-      console.error("Failed to delete project:", e);
-      return false;
-    }
-  }, [authFetch, currentProjectId, setCurrentProjectId, refreshProjects]);
-
-  // Fetch projects when authenticated and feature is enabled
-  useEffect(() => {
-    if (!authLoading && projectsEnabled) {
-      refreshProjects();
-    }
-  }, [authLoading, projectsEnabled, refreshProjects]);
-
-  const value = useMemo<ProjectContextValue>(() => ({
-    projects,
-    currentProjectId,
-    currentProject,
-    isLoading,
-    error,
-    unassignedCount,
-    projectsEnabled,
-    metaAgentEnabled,
-    costTrackingEnabled,
-    setCurrentProjectId,
-    createProject,
-    updateProject,
-    deleteProject,
-    refreshProjects,
-  }), [projects, currentProjectId, currentProject, isLoading, error, unassignedCount, projectsEnabled, metaAgentEnabled, costTrackingEnabled, setCurrentProjectId, createProject, updateProject, deleteProject, refreshProjects]);
-
-  return <ProjectContext.Provider value={value}>{children}</ProjectContext.Provider>;
-}

package/src/web/context/TelemetryContext.tsx

@@ -1,299 +0,0 @@
-import React, { createContext, useContext, useEffect, useState, useCallback, useRef, useMemo } from "react";
-
-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;
-  cost?: number;
-  _receivedAt?: number; // Client-side timestamp when event was received via SSE
-}
-
-interface TelemetryContextValue {
-  connected: boolean;
-  events: TelemetryEvent[];
-  lastActivityByAgent: Record<string, { timestamp: string; category: string; type: string }>;
-  activeAgents: Record<string, { type: string; expiresAt: number }>;
-  statusChangeCounter: number;
-  taskChangeCounter: number;
-  notificationCounter: number;
-  clearEvents: () => void;
-  triggerRefresh: () => void;
-}
-
-const TelemetryContext = createContext<TelemetryContextValue | null>(null);
-
-const MAX_EVENTS = 200; // Keep last 200 events in memory
-
-export function TelemetryProvider({ children }: { children: React.ReactNode }) {
-  const [connected, setConnected] = useState(false);
-  const [events, setEvents] = useState<TelemetryEvent[]>([]);
-  const [lastActivityByAgent, setLastActivityByAgent] = useState<Record<string, { timestamp: string; category: string; type: string }>>({});
-  const [activeAgents, setActiveAgents] = useState<Record<string, { type: string; expiresAt: number }>>({});
-  const [statusChangeCounter, setStatusChangeCounter] = useState(0);
-  const [taskChangeCounter, setTaskChangeCounter] = useState(0);
-  const [notificationCounter, setNotificationCounter] = useState(0);
-  const eventSourceRef = useRef<EventSource | null>(null);
-  const reconnectTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);
-
-  // Clean up expired active states
-  useEffect(() => {
-    const interval = setInterval(() => {
-      const now = Date.now();
-      setActiveAgents(prev => {
-        const updated: Record<string, { type: string; expiresAt: number }> = {};
-        for (const [agentId, state] of Object.entries(prev)) {
-          if (state.expiresAt > now) {
-            updated[agentId] = state;
-          }
-        }
-        return updated;
-      });
-    }, 500);
-    return () => clearInterval(interval);
-  }, []);
-
-  const connect = useCallback(() => {
-    if (eventSourceRef.current) {
-      eventSourceRef.current.close();
-      eventSourceRef.current = null;
-    }
-
-    try {
-      const es = new EventSource("/api/telemetry/stream");
-      eventSourceRef.current = es;
-
-      es.onopen = () => {
-        setConnected(true);
-      };
-
-      es.onmessage = (event) => {
-        // Ignore keepalive pings (comments starting with :)
-        if (!event.data || event.data.trim() === "") return;
-
-        try {
-          const data = JSON.parse(event.data);
-
-          // Handle connection message
-          if (data.connected) {
-            setConnected(true);
-            return;
-          }
-
-          // Handle array of events
-          if (Array.isArray(data)) {
-            const now = Date.now();
-            const stamped = data.map((e: TelemetryEvent) => ({ ...e, _receivedAt: now }));
-            setEvents(prev => {
-              const combined = [...stamped, ...prev];
-              return combined.slice(0, MAX_EVENTS);
-            });
-
-            // Update last activity per agent
-            setLastActivityByAgent(prev => {
-              const updated = { ...prev };
-              for (const evt of data) {
-                const existing = updated[evt.agent_id];
-                if (!existing || new Date(evt.timestamp) > new Date(existing.timestamp)) {
-                  updated[evt.agent_id] = {
-                    timestamp: evt.timestamp,
-                    category: evt.category,
-                    type: evt.type,
-                  };
-                }
-              }
-              return updated;
-            });
-
-            // Set agents as active for 3 seconds (tracked in context, not component)
-            setActiveAgents(prev => {
-              const updated = { ...prev };
-              const expiresAt = Date.now() + 3000;
-              for (const evt of data) {
-                updated[evt.agent_id] = { type: evt.type, expiresAt };
-              }
-              return updated;
-            });
-
-            // Detect agent status change events (system-emitted)
-            if (data.some((e: TelemetryEvent) => e.category === "system" && (e.type === "agent_started" || e.type === "agent_stopped"))) {
-              setStatusChangeCounter(c => c + 1);
-            }
-
-            // Detect task change events
-            if (data.some((e: TelemetryEvent) => e.category === "TASK" && (e.type === "task_created" || e.type === "task_updated" || e.type === "task_deleted"))) {
-              setTaskChangeCounter(c => c + 1);
-            }
-
-            // Detect notification-worthy events (errors, agent crashes)
-            if (data.some((e: TelemetryEvent) => e.level === "error" || e.category === "ERROR" || (e.category === "system" && e.type === "agent_stopped"))) {
-              setNotificationCounter(c => c + 1);
-            }
-          }
-        } catch {
-          // Ignore parse errors (likely keepalive or empty message)
-        }
-      };
-
-      es.onerror = () => {
-        setConnected(false);
-        es.close();
-        eventSourceRef.current = null;
-
-        // Reconnect after 2 seconds
-        if (reconnectTimeoutRef.current) {
-          clearTimeout(reconnectTimeoutRef.current);
-        }
-        reconnectTimeoutRef.current = setTimeout(connect, 2000);
-      };
-    } catch {
-      // Failed to create EventSource, retry
-      setConnected(false);
-      if (reconnectTimeoutRef.current) {
-        clearTimeout(reconnectTimeoutRef.current);
-      }
-      reconnectTimeoutRef.current = setTimeout(connect, 2000);
-    }
-  }, []);
-
-  useEffect(() => {
-    connect();
-
-    return () => {
-      if (eventSourceRef.current) {
-        eventSourceRef.current.close();
-      }
-      if (reconnectTimeoutRef.current) {
-        clearTimeout(reconnectTimeoutRef.current);
-      }
-    };
-  }, [connect]);
-
-  const clearEvents = useCallback(() => {
-    setEvents([]);
-  }, []);
-
-  const triggerRefresh = useCallback(() => {
-    setStatusChangeCounter(c => c + 1);
-    setTaskChangeCounter(c => c + 1);
-  }, []);
-
-  const value = React.useMemo(() => ({
-    connected, events, lastActivityByAgent, activeAgents, statusChangeCounter, taskChangeCounter, notificationCounter, clearEvents, triggerRefresh,
-  }), [connected, events, lastActivityByAgent, activeAgents, statusChangeCounter, taskChangeCounter, notificationCounter, clearEvents, triggerRefresh]);
-
-  return (
-    <TelemetryContext.Provider value={value}>
-      {children}
-    </TelemetryContext.Provider>
-  );
-}
-
-// Hook to access all telemetry
-export function useTelemetryContext() {
-  const context = useContext(TelemetryContext);
-  if (!context) {
-    throw new Error("useTelemetryContext must be used within TelemetryProvider");
-  }
-  return context;
-}
-
-// Hook to filter telemetry for a specific agent or category
-export function useTelemetry(filter?: {
-  agent_id?: string;
-  category?: string;
-  limit?: number;
-}) {
-  const { connected, events, lastActivityByAgent } = useTelemetryContext();
-
-  const filteredEvents = React.useMemo(() => {
-    let result = events;
-
-    if (filter?.agent_id) {
-      result = result.filter(e => e.agent_id === filter.agent_id);
-    }
-    if (filter?.category) {
-      result = result.filter(e => e.category === filter.category);
-    }
-    if (filter?.limit) {
-      result = result.slice(0, filter.limit);
-    }
-
-    return result;
-  }, [events, filter?.agent_id, filter?.category, filter?.limit]);
-
-  const lastActivity = filter?.agent_id ? lastActivityByAgent[filter.agent_id] : undefined;
-
-  // Check if agent is "active" (had activity in last 10 seconds)
-  const isActive = React.useMemo(() => {
-    if (!lastActivity) return false;
-    const activityTime = new Date(lastActivity.timestamp).getTime();
-    const now = Date.now();
-    return now - activityTime < 10000; // 10 seconds
-  }, [lastActivity]);
-
-  return {
-    connected,
-    events: filteredEvents,
-    lastActivity,
-    isActive,
-  };
-}
-
-// Map raw telemetry event types to user-friendly labels
-export function getActivityLabel(type: string): string {
-  switch (type) {
-    case "llm_request": return "Thinking";
-    case "tool_invocation": return "Using tools";
-    case "tool_result": return "Using tools";
-    case "thread_activity": return "Working";
-    case "agent_started": return "Starting";
-    case "agent_stopped": return "Stopped";
-    default: return "Working";
-  }
-}
-
-// Hook for agent activity indicator - uses context-level tracking
-export function useAgentActivity(agentId: string) {
-  const { activeAgents } = useTelemetryContext();
-  const activity = activeAgents[agentId];
-
-  const isActive = !!activity;
-  const type = activity?.type;
-  return React.useMemo(() => ({
-    isActive,
-    type,
-    label: isActive ? getActivityLabel(type!) : undefined,
-  }), [isActive, type]);
-}
-
-// Hook to trigger agent list refetch on status changes (started/stopped/crashed)
-export function useAgentStatusChange(): number {
-  const { statusChangeCounter } = useTelemetryContext();
-  return statusChangeCounter;
-}
-
-// Hook to trigger task count refetch on task mutations
-export function useTaskChange(): number {
-  const { taskChangeCounter } = useTelemetryContext();
-  return taskChangeCounter;
-}
-
-// Hook to trigger notification badge refresh
-export function useNotificationChange(): number {
-  const { notificationCounter } = useTelemetryContext();
-  return notificationCounter;
-}
-
-// Hook to manually trigger data refresh (e.g. after meta agent tool calls)
-export function useTriggerRefresh(): () => void {
-  const { triggerRefresh } = useTelemetryContext();
-  return triggerRefresh;
-}

package/src/web/context/ThemeContext.tsx

@@ -1,90 +0,0 @@
-import React, { createContext, useContext, useState, useEffect, useCallback, useMemo, type ReactNode } from "react";
-import { themes, resolveTheme, type ThemeMode, type ThemeStyle, type Theme } from "../themes";
-
-interface ThemeContextValue {
-  mode: ThemeMode;
-  style: ThemeStyle;
-  theme: Theme; // resolved theme
-  setMode: (mode: ThemeMode) => void;
-  setStyle: (style: ThemeStyle) => void;
-}
-
-const ThemeContext = createContext<ThemeContextValue | null>(null);
-
-export function useTheme(): ThemeContextValue {
-  const context = useContext(ThemeContext);
-  if (!context) {
-    throw new Error("useTheme must be used within a ThemeProvider");
-  }
-  return context;
-}
-
-const MODE_KEY = "apteva_theme_mode";
-const STYLE_KEY = "apteva_theme_style";
-
-function getSystemPrefersDark(): boolean {
-  if (typeof window === "undefined") return true;
-  return window.matchMedia("(prefers-color-scheme: dark)").matches;
-}
-
-function applyTheme(theme: Theme, style: ThemeStyle) {
-  const root = document.documentElement;
-  for (const [key, value] of Object.entries(theme.colors)) {
-    root.style.setProperty(key, value);
-  }
-  root.setAttribute("data-theme", theme.id);
-  root.setAttribute("data-style", style);
-  // Set font directly as inline style — CSS variable alone gets overridden by Tailwind base
-  document.body.style.fontFamily = style === "professional"
-    ? "'Inter', system-ui, -apple-system, sans-serif"
-    : "'JetBrains Mono', monospace";
-}
-
-export function ThemeProvider({ children }: { children: ReactNode }) {
-  const [mode, setModeState] = useState<ThemeMode>(() => {
-    if (typeof window !== "undefined") {
-      const stored = localStorage.getItem(MODE_KEY);
-      if (stored === "dark" || stored === "light" || stored === "auto") return stored;
-    }
-    return "auto";
-  });
-
-  const [style, setStyleState] = useState<ThemeStyle>(() => {
-    if (typeof window !== "undefined") {
-      const stored = localStorage.getItem(STYLE_KEY);
-      if (stored === "classic" || stored === "professional") return stored;
-    }
-    return "classic";
-  });
-
-  const [prefersDark, setPrefersDark] = useState(getSystemPrefersDark);
-
-  // Listen for system theme changes
-  useEffect(() => {
-    const mq = window.matchMedia("(prefers-color-scheme: dark)");
-    const handler = (e: MediaQueryListEvent) => setPrefersDark(e.matches);
-    mq.addEventListener("change", handler);
-    return () => mq.removeEventListener("change", handler);
-  }, []);
-
-  const theme = useMemo(() => resolveTheme(mode, style, prefersDark), [mode, style, prefersDark]);
-
-  // Apply CSS variables + style attribute whenever theme or style changes
-  useEffect(() => {
-    applyTheme(theme, style);
-  }, [theme, style]);
-
-  const setMode = useCallback((newMode: ThemeMode) => {
-    setModeState(newMode);
-    localStorage.setItem(MODE_KEY, newMode);
-  }, []);
-
-  const setStyle = useCallback((newStyle: ThemeStyle) => {
-    setStyleState(newStyle);
-    localStorage.setItem(STYLE_KEY, newStyle);
-  }, []);
-
-  const value = useMemo(() => ({ mode, style, theme, setMode, setStyle }), [mode, style, theme, setMode, setStyle]);
-
-  return <ThemeContext.Provider value={value}>{children}</ThemeContext.Provider>;
-}

package/src/web/context/UIModeContext.tsx

@@ -1,49 +0,0 @@
-import React, { createContext, useContext, useState, useCallback, useMemo, type ReactNode } from "react";
-
-export type UIMode = "developer" | "business";
-
-interface UIModeContextValue {
-  mode: UIMode;
-  setMode: (mode: UIMode) => void;
-  isDev: boolean;
-  isBusiness: boolean;
-  t: (dev: string, biz: string) => string;
-}
-
-const UIModeContext = createContext<UIModeContextValue | null>(null);
-
-const STORAGE_KEY = "apteva_ui_mode";
-
-export function useUIMode(): UIModeContextValue {
-  const context = useContext(UIModeContext);
-  if (!context) {
-    throw new Error("useUIMode must be used within a UIModeProvider");
-  }
-  return context;
-}
-
-export function UIModeProvider({ children }: { children: ReactNode }) {
-  const [mode, setModeState] = useState<UIMode>(() => {
-    if (typeof window !== "undefined") {
-      const stored = localStorage.getItem(STORAGE_KEY);
-      if (stored === "developer" || stored === "business") return stored;
-    }
-    return "developer";
-  });
-
-  const setMode = useCallback((newMode: UIMode) => {
-    setModeState(newMode);
-    localStorage.setItem(STORAGE_KEY, newMode);
-  }, []);
-
-  const isDev = mode === "developer";
-  const isBusiness = mode === "business";
-
-  const t = useCallback((dev: string, biz: string) => {
-    return mode === "developer" ? dev : biz;
-  }, [mode]);
-
-  const value = useMemo(() => ({ mode, setMode, isDev, isBusiness, t }), [mode, setMode, isDev, isBusiness, t]);
-
-  return <UIModeContext.Provider value={value}>{children}</UIModeContext.Provider>;
-}

package/src/web/context/index.ts

@@ -1,12 +0,0 @@
-export { TelemetryProvider, useTelemetryContext, useTelemetry, useAgentActivity, useAgentStatusChange, useTaskChange, useNotificationChange, useTriggerRefresh } from "./TelemetryContext";
-export type { TelemetryEvent } from "./TelemetryContext";
-
-export { AuthProvider, useAuth, useAuthHeaders } from "./AuthContext";
-
-export { ProjectProvider, useProjects } from "./ProjectContext";
-export type { Project } from "./ProjectContext";
-
-export { ThemeProvider, useTheme } from "./ThemeContext";
-
-export { UIModeProvider, useUIMode } from "./UIModeContext";
-export type { UIMode } from "./UIModeContext";

package/src/web/hooks/index.ts

@@ -1,3 +0,0 @@
-export { useAgents } from "./useAgents";
-export { useProviders } from "./useProviders";
-export { useOnboarding } from "./useOnboarding";