orbital-command 0.1.0

package/src/hooks/useTransitionReadiness.ts

@@ -0,0 +1,53 @@
+import { useEffect, useState, useCallback } from 'react';
+import { socket } from '../socket';
+import type { ScopeReadiness, QualityGate, OrbitalEvent } from '../types';
+
+export function useTransitionReadiness(scopeId: number | null) {
+  const [readiness, setReadiness] = useState<ScopeReadiness | null>(null);
+  const [loading, setLoading] = useState(false);
+
+  const fetchReadiness = useCallback(async () => {
+    if (scopeId == null) {
+      setReadiness(null);
+      return;
+    }
+    setLoading(true);
+    try {
+      const res = await fetch(`/api/orbital/scopes/${scopeId}/readiness`);
+      if (res.ok) setReadiness(await res.json());
+    } catch {
+      // Server may not be running
+    } finally {
+      setLoading(false);
+    }
+  }, [scopeId]);
+
+  useEffect(() => {
+    fetchReadiness();
+  }, [fetchReadiness]);
+
+  // Re-fetch when gates or relevant events change
+  useEffect(() => {
+    function onGateUpdated(_gate: QualityGate) {
+      fetchReadiness();
+    }
+    function onNewEvent(event: OrbitalEvent) {
+      // Re-fetch when events affect this scope
+      if (
+        event.scope_id === scopeId ||
+        ['VIOLATION', 'OVERRIDE', 'SCOPE_STATUS_CHANGED'].includes(event.type)
+      ) {
+        fetchReadiness();
+      }
+    }
+
+    socket.on('gate:updated', onGateUpdated);
+    socket.on('event:new', onNewEvent);
+    return () => {
+      socket.off('gate:updated', onGateUpdated);
+      socket.off('event:new', onNewEvent);
+    };
+  }, [scopeId, fetchReadiness]);
+
+  return { readiness, loading, refetch: fetchReadiness };
+}

package/src/hooks/useVersion.ts

@@ -0,0 +1,155 @@
+import { useEffect, useState, useCallback } from 'react';
+import { socket } from '../socket';
+import { useReconnect } from './useReconnect';
+
+interface VersionInfo {
+  version: string;
+  commitSha: string;
+  branch: string;
+}
+
+interface UpdateCheck {
+  updateAvailable: boolean;
+  behindCount: number;
+  localSha: string;
+  remoteSha: string;
+  branch: string;
+}
+
+type UpdateStage = 'idle' | 'checking' | 'pulling' | 'installing' | 'done' | 'error';
+
+interface UseVersionReturn {
+  version: VersionInfo | null;
+  updateAvailable: boolean;
+  behindCount: number;
+  updateStage: UpdateStage;
+  updateError: string | null;
+  loading: boolean;
+  checkForUpdate: () => Promise<void>;
+  performUpdate: () => Promise<void>;
+}
+
+export function useVersion(): UseVersionReturn {
+  const [version, setVersion] = useState<VersionInfo | null>(null);
+  const [updateAvailable, setUpdateAvailable] = useState(false);
+  const [behindCount, setBehindCount] = useState(0);
+  const [updateStage, setUpdateStage] = useState<UpdateStage>('idle');
+  const [updateError, setUpdateError] = useState<string | null>(null);
+  const [loading, setLoading] = useState(true);
+
+  const fetchVersionInfo = useCallback(async () => {
+    try {
+      const res = await fetch('/api/orbital/version');
+      if (!res.ok) throw new Error(`HTTP ${res.status}`);
+      const data: VersionInfo = await res.json();
+      setVersion(data);
+    } catch {
+      // Version endpoint unavailable — badge will show fallback
+    } finally {
+      setLoading(false);
+    }
+  }, []);
+
+  const doCheckForUpdate = useCallback(async () => {
+    const res = await fetch('/api/orbital/version/check');
+    if (!res.ok) throw new Error(`HTTP ${res.status}`);
+    const data: UpdateCheck = await res.json();
+    setUpdateAvailable(data.updateAvailable);
+    setBehindCount(data.behindCount);
+  }, []);
+
+  // Fetch current version
+  useEffect(() => {
+    fetchVersionInfo();
+  }, []);
+
+  useReconnect(fetchVersionInfo);
+
+  // Poll for updates every 5 minutes
+  useEffect(() => {
+    const interval = setInterval(async () => {
+      try {
+        await doCheckForUpdate();
+      } catch { /* polling failure is non-fatal */ }
+    }, 5 * 60 * 1000);
+
+    return () => clearInterval(interval);
+  }, []);
+
+  // Socket listeners for update progress
+  useEffect(() => {
+    function onUpdating(payload: { stage: string }) {
+      setUpdateStage(payload.stage as UpdateStage);
+    }
+    function onUpdated(payload: { success: boolean; error?: string }) {
+      if (payload.success) {
+        setUpdateStage('done');
+        setUpdateAvailable(false);
+        setBehindCount(0);
+        fetchVersionInfo();
+      } else {
+        setUpdateStage('error');
+        setUpdateError(payload.error ?? 'Unknown error');
+      }
+    }
+
+    socket.on('version:updating', onUpdating);
+    socket.on('version:updated', onUpdated);
+    return () => {
+      socket.off('version:updating', onUpdating);
+      socket.off('version:updated', onUpdated);
+    };
+  }, []);
+
+  const checkForUpdate = useCallback(async () => {
+    setUpdateStage('checking');
+    setUpdateError(null);
+    try {
+      await doCheckForUpdate();
+      setUpdateStage('idle');
+    } catch (err) {
+      setUpdateStage('error');
+      setUpdateError((err as Error).message);
+    }
+  }, [doCheckForUpdate]);
+
+  const performUpdate = useCallback(async () => {
+    setUpdateStage('pulling');
+    setUpdateError(null);
+    try {
+      const res = await fetch('/api/orbital/version/update', {
+        method: 'POST',
+        headers: { 'X-Orbital-Action': 'update' },
+      });
+      if (!res.ok) {
+        const data = await res.json().catch(() => ({ error: `HTTP ${res.status}` }));
+        setUpdateStage('error');
+        setUpdateError(data.error ?? 'Update failed');
+        return;
+      }
+      // HTTP success is authoritative — don't rely solely on socket
+      const data = await res.json().catch(() => null);
+      if (data?.success) {
+        setUpdateStage('done');
+        setUpdateAvailable(false);
+        setBehindCount(0);
+        fetchVersionInfo();
+      }
+      // Socket events still provide real-time progress during the request
+    } catch (err) {
+      setUpdateStage('error');
+      setUpdateError((err as Error).message);
+    }
+  }, [fetchVersionInfo]);
+
+  return {
+    version,
+    updateAvailable,
+    behindCount,
+    updateStage,
+    updateError,
+    loading,
+    checkForUpdate,
+    performUpdate,
+  };
+}

package/src/hooks/useViolations.ts

@@ -0,0 +1,65 @@
+import { useEffect, useState, useCallback } from 'react';
+import { socket } from '../socket';
+import { useReconnect } from './useReconnect';
+import type { OrbitalEvent } from '../types';
+
+interface ViolationsByRule {
+  rule: string;
+  count: number;
+  last_seen: string;
+}
+
+interface ViolationsByFile {
+  file: string;
+  count: number;
+}
+
+interface Override {
+  rule: string;
+  reason: string;
+  date: string;
+}
+
+interface ViolationsSummary {
+  byRule: ViolationsByRule[];
+  byFile: ViolationsByFile[];
+  overrides: Override[];
+  totalViolations: number;
+  totalOverrides: number;
+}
+
+export function useViolations() {
+  const [summary, setSummary] = useState<ViolationsSummary>({
+    byRule: [], byFile: [], overrides: [],
+    totalViolations: 0, totalOverrides: 0,
+  });
+  const [loading, setLoading] = useState(true);
+
+  const fetchSummary = useCallback(async () => {
+    try {
+      const res = await fetch('/api/orbital/events/violations/summary');
+      if (res.ok) setSummary(await res.json());
+    } catch {
+      // Silently fail — CC server may not be running
+    } finally {
+      setLoading(false);
+    }
+  }, []);
+
+  useEffect(() => { fetchSummary(); }, [fetchSummary]);
+
+  useReconnect(fetchSummary);
+
+  // Real-time: re-fetch when new VIOLATION or OVERRIDE events arrive
+  useEffect(() => {
+    function onNewEvent(event: OrbitalEvent) {
+      if (event.type === 'VIOLATION' || event.type === 'OVERRIDE') {
+        fetchSummary();
+      }
+    }
+    socket.on('event:new', onNewEvent);
+    return () => { socket.off('event:new', onNewEvent); };
+  }, [fetchSummary]);
+
+  return { ...summary, loading, refetch: fetchSummary };
+}

package/src/hooks/useWorkflow.tsx

@@ -0,0 +1,125 @@
+import { createContext, useContext, useState, useEffect, useCallback, type ReactNode } from 'react';
+import { WorkflowEngine } from '../../shared/workflow-engine';
+import { isWorkflowConfig } from '../../shared/workflow-config';
+import { socket } from '../socket';
+
+// ─── Context ──────────────────────────────────────────────
+
+interface WorkflowContextValue {
+  engine: WorkflowEngine;
+}
+
+const WorkflowContext = createContext<WorkflowContextValue | null>(null);
+
+// ─── Provider ─────────────────────────────────────────────
+
+interface WorkflowProviderProps {
+  children: ReactNode;
+}
+
+export function WorkflowProvider({ children }: WorkflowProviderProps) {
+  const [engine, setEngine] = useState<WorkflowEngine | null>(null);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState<string | null>(null);
+
+  const loadConfig = useCallback(async () => {
+    const maxRetries = 3;
+    const backoffMs = [500, 1000, 2000];
+    const controller = new AbortController();
+
+    for (let attempt = 0; attempt <= maxRetries; attempt++) {
+      try {
+        const res = await fetch('/api/orbital/workflow', { signal: controller.signal });
+        if (!res.ok) throw new Error(`Failed to load workflow: HTTP ${res.status}`);
+        const json = await res.json() as { success: boolean; data?: unknown };
+        const config: unknown = json.data ?? json;
+        if (!isWorkflowConfig(config)) throw new Error('Invalid workflow config from server');
+        setEngine(new WorkflowEngine(config));
+        setError(null);
+        setLoading(false);
+        return;
+      } catch (err) {
+        if (controller.signal.aborted) return;
+        if (attempt < maxRetries) {
+          await new Promise(r => setTimeout(r, backoffMs[attempt]));
+          continue;
+        }
+        setError(err instanceof Error ? err.message : 'Failed to load workflow');
+        setLoading(false);
+      }
+    }
+  }, []);
+
+  // Initial fetch
+  useEffect(() => {
+    loadConfig();
+  }, [loadConfig]);
+
+  // Hot-reload: re-fetch when server config changes (scope 110 emits this)
+  useEffect(() => {
+    const handler = () => { loadConfig(); };
+    socket.on('workflow:changed', handler);
+    return () => { socket.off('workflow:changed', handler); };
+  }, [loadConfig]);
+
+  // Re-fetch on socket reconnect (covers server restarts)
+  useEffect(() => {
+    const handler = () => { setLoading(true); loadConfig(); };
+    socket.on('connect', handler);
+    return () => { socket.off('connect', handler); };
+  }, [loadConfig]);
+
+  // Inject CSS variables from engine config onto document root
+  useEffect(() => {
+    if (!engine) return;
+    const cssText = engine.generateCSSVariables();
+    for (const line of cssText.split('\n')) {
+      const match = line.match(/^(--[\w-]+):\s*(.+);$/);
+      if (match) {
+        document.documentElement.style.setProperty(match[1], match[2]);
+      }
+    }
+  }, [engine]);
+
+  if (loading) {
+    return (
+      <div className="flex h-screen items-center justify-center bg-background">
+        <div className="flex flex-col items-center gap-3">
+          <div className="h-8 w-8 animate-spin rounded-full border-2 border-primary border-t-transparent" />
+          <span className="text-xs text-muted-foreground">Loading workflow...</span>
+        </div>
+      </div>
+    );
+  }
+
+  if (error || !engine) {
+    return (
+      <div className="flex h-screen items-center justify-center bg-background">
+        <div className="flex flex-col items-center gap-3 max-w-sm text-center">
+          <span className="text-sm text-destructive">Workflow Error</span>
+          <span className="text-xs text-muted-foreground">{error ?? 'Unknown error'}</span>
+          <button
+            onClick={() => { setLoading(true); loadConfig(); }}
+            className="mt-2 rounded bg-primary px-3 py-1.5 text-xs text-primary-foreground hover:bg-primary/90"
+          >
+            Retry
+          </button>
+        </div>
+      </div>
+    );
+  }
+
+  return (
+    <WorkflowContext.Provider value={{ engine }}>
+      {children}
+    </WorkflowContext.Provider>
+  );
+}
+
+// ─── Hook ─────────────────────────────────────────────────
+
+export function useWorkflow(): WorkflowContextValue {
+  const ctx = useContext(WorkflowContext);
+  if (!ctx) throw new Error('useWorkflow must be used within a WorkflowProvider');
+  return ctx;
+}

package/src/hooks/useZoomModifier.ts

@@ -0,0 +1,19 @@
+import { type Modifier } from '@dnd-kit/core';
+import { useMemo } from 'react';
+import { useSettings } from './useSettings';
+
+export function useZoomModifier(): Modifier[] {
+  const { settings } = useSettings();
+
+  return useMemo(() => {
+    if (settings.fontScale === 1) return [];
+
+    const zoomModifier: Modifier = ({ transform }) => ({
+      ...transform,
+      x: transform.x / settings.fontScale,
+      y: transform.y / settings.fontScale,
+    });
+
+    return [zoomModifier];
+  }, [settings.fontScale]);
+}