@nexus-ai-fs/tui 0.9.18

package/src/panels/zones/drift-view.tsx

@@ -0,0 +1,97 @@
+/**
+ * Drift view: shows the global drift reconciliation report
+ * from GET /api/v2/bricks/drift.
+ *
+ * Displays: total_bricks, drifted count, actions_taken, errors,
+ * last_reconcile_at, reconcile_count, and a table of drifted items.
+ */
+
+import React from "react";
+import type { DriftReportResponse } from "../../stores/zones-store.js";
+
+interface DriftViewProps {
+  readonly drift: DriftReportResponse | null;
+  readonly loading: boolean;
+}
+
+function formatEpoch(epoch: number | null): string {
+  if (epoch === null) return "never";
+  try {
+    return new Date(epoch * 1000).toLocaleString();
+  } catch {
+    return String(epoch);
+  }
+}
+
+export function DriftView({ drift, loading }: DriftViewProps): React.ReactNode {
+  if (loading) {
+    return (
+      <box height="100%" width="100%" justifyContent="center" alignItems="center">
+        <text>Loading drift report...</text>
+      </box>
+    );
+  }
+
+  if (!drift) {
+    return (
+      <box height="100%" width="100%" justifyContent="center" alignItems="center">
+        <text>No drift data available</text>
+      </box>
+    );
+  }
+
+  const hasDrifts = drift.drifts.length > 0;
+
+  return (
+    <scrollbox height="100%" width="100%">
+      <box height={1} width="100%">
+        <text>--- Drift Reconciliation Report ---</text>
+      </box>
+      <box height={1} width="100%">
+        <text>{`Total bricks:     ${drift.total_bricks}`}</text>
+      </box>
+      <box height={1} width="100%">
+        <text>{`Drifted:          ${drift.drifted}`}</text>
+      </box>
+      <box height={1} width="100%">
+        <text>{`Actions taken:    ${drift.actions_taken}`}</text>
+      </box>
+      <box height={1} width="100%">
+        <text>{`Errors:           ${drift.errors}`}</text>
+      </box>
+      <box height={1} width="100%">
+        <text>{`Reconcile count:  ${drift.reconcile_count}`}</text>
+      </box>
+      <box height={1} width="100%">
+        <text>{`Last reconcile:   ${formatEpoch(drift.last_reconcile_at)}`}</text>
+      </box>
+
+      {hasDrifts && (
+        <>
+          <box height={1} width="100%" marginTop={1}>
+            <text>--- Drifted Items ---</text>
+          </box>
+          <box height={1} width="100%">
+            <text>{"  BRICK NAME         SPEC STATE   ACTUAL STATE  ACTION       DETAIL"}</text>
+          </box>
+          <box height={1} width="100%">
+            <text>{"  -----------------  -----------  ------------  -----------  -------------------------"}</text>
+          </box>
+          {drift.drifts.map((item, i) => (
+            <box key={`drift-${i}`} height={1} width="100%">
+              <text>
+                {`  ${item.brick_name.padEnd(17)}  ${item.spec_state.padEnd(11)}  ${item.actual_state.padEnd(12)}  ${item.action.padEnd(11)}  ${item.detail}`}
+              </text>
+            </box>
+          ))}
+        </>
+      )}
+
+      {!hasDrifts && (
+        <box height={1} width="100%" marginTop={1}>
+          <text>No drift detected - all bricks in spec.</text>
+        </box>
+      )}
+    </scrollbox>
+  );
+}

package/src/panels/zones/mcp-mounts-tab.tsx

@@ -0,0 +1,38 @@
+/**
+ * MCP Mounts sub-tab for the Zones panel.
+ * Displays mounted MCP servers with selection highlighting and status icons.
+ */
+
+import React from "react";
+import type { McpMount } from "../../stores/mcp-store.js";
+
+interface McpMountsTabProps {
+  readonly mounts: readonly McpMount[];
+  readonly selectedIndex: number;
+  readonly loading: boolean;
+}
+
+export function McpMountsTab({
+  mounts,
+  selectedIndex,
+  loading,
+}: McpMountsTabProps): React.ReactNode {
+  if (loading) return <text>Loading MCP mounts...</text>;
+  if (mounts.length === 0)
+    return <text>No MCP servers mounted. Press 'n' to mount one.</text>;
+
+  return (
+    <scrollbox height="100%" width="100%">
+      {mounts.map((mount, i) => {
+        const isSelected = i === selectedIndex;
+        const prefix = isSelected ? "> " : "  ";
+        const statusIcon = mount.mounted ? "\u25CF" : "\u25CB";
+        return (
+          <box key={mount.name} height={1} width="100%">
+            <text>{`${prefix}${statusIcon} ${mount.name}  ${mount.transport}  ${mount.tool_count} tools  ${mount.last_sync ?? "never synced"}`}</text>
+          </box>
+        );
+      })}
+    </scrollbox>
+  );
+}

package/src/panels/zones/memories-tab.tsx

@@ -0,0 +1,37 @@
+/**
+ * Memories sub-tab for the Zones panel.
+ * Displays registered memory directories with selection highlighting.
+ */
+
+import React from "react";
+import type { MemoryInfo } from "../../stores/workspace-store.js";
+
+interface MemoriesTabProps {
+  readonly memories: readonly MemoryInfo[];
+  readonly selectedIndex: number;
+  readonly loading: boolean;
+}
+
+export function MemoriesTab({
+  memories,
+  selectedIndex,
+  loading,
+}: MemoriesTabProps): React.ReactNode {
+  if (loading) return <text>Loading memories...</text>;
+  if (memories.length === 0)
+    return <text>No memory directories registered. Press 'n' to register one.</text>;
+
+  return (
+    <scrollbox height="100%" width="100%">
+      {memories.map((mem, i) => {
+        const isSelected = i === selectedIndex;
+        const prefix = isSelected ? "> " : "  ";
+        return (
+          <box key={mem.path} height={1} width="100%">
+            <text>{`${prefix}${mem.name}  ${mem.path}  ${mem.scope}  ${mem.created_by ?? ""}`}</text>
+          </box>
+        );
+      })}
+    </scrollbox>
+  );
+}

package/src/panels/zones/reindex-status.tsx

@@ -0,0 +1,84 @@
+/**
+ * Reindex status sub-view for the Zones panel.
+ * Trigger and monitor index rebuild operations.
+ * Issue #2930.
+ */
+
+import React, { useState } from "react";
+import { useApi } from "../../shared/hooks/use-api.js";
+import { useKeyboard } from "../../shared/hooks/use-keyboard.js";
+
+interface ReindexResult {
+  readonly target: string;
+  readonly total: number;
+  readonly processed: number;
+  readonly errors: number;
+  readonly lastSequence: number;
+  readonly dryRun: boolean;
+}
+
+export function ReindexStatus(): React.ReactNode {
+  const client = useApi();
+  const [result, setResult] = useState<ReindexResult | null>(null);
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+
+  useKeyboard({
+    d: () => {
+      void triggerReindex("search", true);
+    },
+    s: () => {
+      void triggerReindex("search", false);
+    },
+    v: () => {
+      void triggerReindex("versions", false);
+    },
+  });
+
+  const triggerReindex = async (target: string, dryRun: boolean): Promise<void> => {
+    if (!client) return;
+    setLoading(true);
+    setError(null);
+    try {
+      const res = await client.post<ReindexResult>("/api/v2/admin/reindex", {
+        target,
+        dryRun,
+      });
+      setResult(res);
+    } catch (err) {
+      setError(err instanceof Error ? err.message : "Reindex failed");
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  return (
+    <box flexDirection="column" height="100%" width="100%">
+      <text>{"─── Reindex Operations ───"}</text>
+      <text> </text>
+      <text>{"  Remote targets: search | versions"}</text>
+      <text>{"  (semantic requires local CLI: nexus reindex --target semantic)"}</text>
+      <text>{"  Press 'd' dry-run search, 's' reindex search, 'v' reindex versions"}</text>
+      <text> </text>
+
+      {loading && <text>{"  Reindex in progress..."}</text>}
+
+      {error && <text>{`  Error: ${error}`}</text>}
+
+      {result && (
+        <box flexDirection="column">
+          <text>{`  Last Reindex ${result.dryRun ? "(dry run)" : ""}`}</text>
+          <text>{`  Target:     ${result.target}`}</text>
+          <text>{`  Total:      ${result.total} MCL records`}</text>
+          <text>{`  Processed:  ${result.processed}`}</text>
+          <text>{`  Errors:     ${result.errors}`}</text>
+          <text>{`  Last seq:   ${result.lastSequence}`}</text>
+        </box>
+      )}
+
+      {!result && !loading && !error && (
+        <text>{"  No reindex operations performed in this session."}</text>
+      )}
+    </box>
+  );
+}

package/src/panels/zones/workspaces-tab.tsx

@@ -0,0 +1,37 @@
+/**
+ * Workspaces sub-tab for the Zones panel.
+ * Displays registered workspace directories with selection highlighting.
+ */
+
+import React from "react";
+import type { WorkspaceInfo } from "../../stores/workspace-store.js";
+
+interface WorkspacesTabProps {
+  readonly workspaces: readonly WorkspaceInfo[];
+  readonly selectedIndex: number;
+  readonly loading: boolean;
+}
+
+export function WorkspacesTab({
+  workspaces,
+  selectedIndex,
+  loading,
+}: WorkspacesTabProps): React.ReactNode {
+  if (loading) return <text>Loading workspaces...</text>;
+  if (workspaces.length === 0)
+    return <text>No workspaces registered. Press 'n' to register one.</text>;
+
+  return (
+    <scrollbox height="100%" width="100%">
+      {workspaces.map((ws, i) => {
+        const isSelected = i === selectedIndex;
+        const prefix = isSelected ? "> " : "  ";
+        return (
+          <box key={ws.path} height={1} width="100%">
+            <text>{`${prefix}${ws.name}  ${ws.path}  ${ws.scope}  ${ws.created_by ?? ""}`}</text>
+          </box>
+        );
+      })}
+    </scrollbox>
+  );
+}

package/src/panels/zones/zone-list.tsx

@@ -0,0 +1,73 @@
+/**
+ * Zone list view: shows zones from GET /api/zones.
+ *
+ * Displays: zone_id, name, domain, phase, is_active, created_at.
+ */
+
+import React from "react";
+import type { ZoneResponse } from "../../stores/zones-store.js";
+import { EmptyState } from "../../shared/components/empty-state.js";
+
+interface ZoneListProps {
+  readonly zones: readonly ZoneResponse[];
+  readonly selectedIndex: number;
+  readonly loading: boolean;
+}
+
+function formatTimestamp(ts: string): string {
+  try {
+    return new Date(ts).toLocaleString();
+  } catch {
+    return ts;
+  }
+}
+
+function truncate(value: string, maxLen: number): string {
+  if (value.length <= maxLen) return value;
+  return `${value.slice(0, maxLen - 2)}..`;
+}
+
+export function ZoneList({
+  zones,
+  selectedIndex,
+  loading,
+}: ZoneListProps): React.ReactNode {
+  if (loading) {
+    return (
+      <box height="100%" width="100%" justifyContent="center" alignItems="center">
+        <text>Loading zones...</text>
+      </box>
+    );
+  }
+
+  if (zones.length === 0) {
+    return <EmptyState message="No zones found." hint="Press n to create a zone." />;
+  }
+
+  return (
+    <scrollbox height="100%" width="100%">
+      {/* Header */}
+      <box height={1} width="100%">
+        <text>{"  ZONE ID            NAME             DOMAIN           PHASE     ACTIVE  CREATED"}</text>
+      </box>
+      <box height={1} width="100%">
+        <text>{"  -----------------  ---------------  ---------------  --------  ------  -------------------------"}</text>
+      </box>
+
+      {/* Rows */}
+      {zones.map((zone, i) => {
+        const isSelected = i === selectedIndex;
+        const prefix = isSelected ? "> " : "  ";
+        const activeLabel = zone.is_active ? "yes" : "no";
+
+        return (
+          <box key={zone.zone_id} height={1} width="100%">
+            <text>
+              {`${prefix}${truncate(zone.zone_id, 17).padEnd(17)}  ${truncate(zone.name, 15).padEnd(15)}  ${truncate(zone.domain ?? "-", 15).padEnd(15)}  ${zone.phase.padEnd(8)}  ${activeLabel.padEnd(6)}  ${formatTimestamp(zone.created_at)}`}
+            </text>
+          </box>
+        );
+      })}
+    </scrollbox>
+  );
+}