smithers-orchestrator 0.2.8 → 0.2.10

package/dist/bin/cli.js

@@ -60651,7 +60651,7 @@ function createRoot(renderer) {
 }
 
 // src/tui/App.tsx
-var import_react34 = __toESM(require_react(), 1);
+var import_react31 = __toESM(require_react(), 1);
 
 // src/tui/utils/colors.ts
 var colors = {
@@ -60816,19 +60816,53 @@ function StatusBar({ isConnected, error: error2, dbPath }) {
   }, undefined, true, undefined, this);
 }
 
-// src/tui/components/views/ExecutionTimeline.tsx
-var import_react17 = __toESM(require_react(), 1);
-
 // src/tui/hooks/usePollEvents.ts
+init_hooks();
+
+// src/tui/state.ts
+init_reactive_sqlite();
+init_reactive_sqlite();
 var import_react16 = __toESM(require_react(), 1);
+var tuiDb = new ReactiveDatabase(":memory:");
+tuiDb.exec("CREATE TABLE IF NOT EXISTS tui_state (key TEXT PRIMARY KEY, value TEXT)");
+function parseValue(raw, fallback) {
+  if (!raw)
+    return fallback;
+  try {
+    return JSON.parse(raw);
+  } catch {
+    return fallback;
+  }
+}
+function readTuiState(key, fallback) {
+  const row = tuiDb.queryOne("SELECT value FROM tui_state WHERE key = ?", [key]);
+  return row ? parseValue(row.value, fallback) : fallback;
+}
+function writeTuiState(key, value) {
+  const jsonValue = JSON.stringify(value);
+  tuiDb.run("INSERT INTO tui_state (key, value) VALUES (?, ?) ON CONFLICT(key) DO UPDATE SET value = ?", [key, jsonValue, jsonValue]);
+}
+function useTuiState(key, fallback) {
+  const { data: raw } = useQueryValue(tuiDb, "SELECT value FROM tui_state WHERE key = ?", [key]);
+  const value = parseValue(raw, fallback);
+  const setValue = import_react16.useCallback((next) => {
+    const resolved = typeof next === "function" ? next(readTuiState(key, fallback)) : next;
+    writeTuiState(key, resolved);
+  }, [key, fallback]);
+  return [value, setValue];
+}
+
+// src/tui/hooks/usePollEvents.ts
+var EVENTS_KEY = "tui:timeline:events";
+var EMPTY_EVENTS = [];
 function usePollEvents(db) {
-  const [events, setEvents] = import_react16.useState([]);
-  import_react16.useEffect(() => {
+  const [events, setEvents] = useTuiState(EVENTS_KEY, EMPTY_EVENTS);
+  useEffectOnValueChange(db, () => {
     const pollEvents = () => {
       try {
         const execution = db.execution.current();
         if (!execution) {
-          setEvents([]);
+          setEvents(EMPTY_EVENTS);
           return;
         }
         const phases = db.query("SELECT id, name, status, created_at as timestamp FROM phases WHERE execution_id = ? ORDER BY created_at DESC LIMIT 20", [execution.id]);
@@ -60868,7 +60902,7 @@ function usePollEvents(db) {
     pollEvents();
     const interval = setInterval(pollEvents, 500);
     return () => clearInterval(interval);
-  }, [db]);
+  }, [setEvents]);
   return events;
 }
 
@@ -60911,15 +60945,27 @@ function formatValue(value) {
 }
 
 // src/tui/components/views/ExecutionTimeline.tsx
+init_hooks();
 var jsx_dev_runtime5 = __toESM(require_jsx_dev_runtime(), 1);
 function ExecutionTimeline({ db, height }) {
   const events = usePollEvents(db);
-  const [selectedIndex, setSelectedIndex] = import_react17.useState(0);
-  const [scrollOffset, setScrollOffset] = import_react17.useState(0);
+  const [selectedIndex, setSelectedIndex] = useTuiState("tui:timeline:selectedIndex", 0);
+  const [scrollOffset, setScrollOffset] = useTuiState("tui:timeline:scrollOffset", 0);
   const visibleHeight = height - 4;
+  const clampKey = `${events.length}:${visibleHeight}`;
+  useEffectOnValueChange(clampKey, () => {
+    const maxIndex = Math.max(0, events.length - 1);
+    if (selectedIndex > maxIndex) {
+      setSelectedIndex(maxIndex);
+    }
+    const maxOffset = Math.max(0, events.length - visibleHeight);
+    if (scrollOffset > maxOffset) {
+      setScrollOffset(maxOffset);
+    }
+  }, [events.length, visibleHeight, selectedIndex, scrollOffset, setSelectedIndex, setScrollOffset]);
   useKeyboard((key) => {
     if (key.name === "j" || key.name === "down") {
-      const newIndex = Math.min(selectedIndex + 1, events.length - 1);
+      const newIndex = Math.min(selectedIndex + 1, Math.max(0, events.length - 1));
       setSelectedIndex(newIndex);
       if (newIndex >= scrollOffset + visibleHeight) {
         setScrollOffset(newIndex - visibleHeight + 1);
@@ -60934,7 +60980,7 @@ function ExecutionTimeline({ db, height }) {
       setSelectedIndex(0);
       setScrollOffset(0);
     } else if (key.name === "G" || key.shift && key.name === "g") {
-      setSelectedIndex(events.length - 1);
+      setSelectedIndex(Math.max(0, events.length - 1));
       setScrollOffset(Math.max(0, events.length - visibleHeight));
     }
   });
@@ -61028,11 +61074,16 @@ function getTypeColor(type) {
 }
 
 // src/tui/hooks/useRenderFrames.ts
-var import_react19 = __toESM(require_react(), 1);
+init_hooks();
+var import_react18 = __toESM(require_react(), 1);
+var EMPTY_FRAMES = [];
 function useRenderFrames(db, executionId) {
-  const [frames, setFrames] = import_react19.useState([]);
-  const [currentIndex, setCurrentIndex] = import_react19.useState(0);
-  import_react19.useEffect(() => {
+  const framesKey = executionId ? `tui:renderFrames:${executionId}:frames` : "tui:renderFrames:frames";
+  const indexKey = executionId ? `tui:renderFrames:${executionId}:index` : "tui:renderFrames:index";
+  const [frames, setFrames] = useTuiState(framesKey, EMPTY_FRAMES);
+  const [currentIndex, setCurrentIndex] = useTuiState(indexKey, 0);
+  const pollKey = import_react18.useMemo(() => ({ db, executionId }), [db, executionId]);
+  useEffectOnValueChange(pollKey, () => {
     const pollFrames = () => {
       try {
         const allFrames = executionId ? db.renderFrames.listForExecution(executionId) : db.renderFrames.list();
@@ -61044,21 +61095,27 @@ function useRenderFrames(db, executionId) {
     pollFrames();
     const interval = setInterval(pollFrames, 500);
     return () => clearInterval(interval);
-  }, [db, executionId]);
-  const goToFrame = import_react19.useCallback((index) => {
+  }, [db, executionId, setFrames]);
+  useEffectOnValueChange(frames.length, () => {
+    const maxIndex = Math.max(0, frames.length - 1);
+    if (currentIndex > maxIndex) {
+      setCurrentIndex(maxIndex);
+    }
+  }, [frames.length, currentIndex, setCurrentIndex]);
+  const goToFrame = import_react18.useCallback((index) => {
     const clampedIndex = Math.max(0, Math.min(index, frames.length - 1));
     setCurrentIndex(clampedIndex);
-  }, [frames.length]);
-  const nextFrame = import_react19.useCallback(() => {
+  }, [frames.length, setCurrentIndex]);
+  const nextFrame = import_react18.useCallback(() => {
     goToFrame(currentIndex + 1);
   }, [currentIndex, goToFrame]);
-  const prevFrame = import_react19.useCallback(() => {
+  const prevFrame = import_react18.useCallback(() => {
     goToFrame(currentIndex - 1);
   }, [currentIndex, goToFrame]);
-  const goToLatest = import_react19.useCallback(() => {
+  const goToLatest = import_react18.useCallback(() => {
     goToFrame(frames.length - 1);
   }, [frames.length, goToFrame]);
-  const goToFirst = import_react19.useCallback(() => {
+  const goToFirst = import_react18.useCallback(() => {
     goToFrame(0);
   }, [goToFrame]);
   const currentFrame = frames[currentIndex] ?? null;
@@ -61179,11 +61236,9 @@ function RenderFrameInspector({ db, height }) {
   }, undefined, true, undefined, this);
 }
 
-// src/tui/components/views/DatabaseExplorer.tsx
-var import_react22 = __toESM(require_react(), 1);
-
 // src/tui/hooks/usePollTableData.ts
-var import_react21 = __toESM(require_react(), 1);
+init_hooks();
+var import_react20 = __toESM(require_react(), 1);
 var ALLOWED_TABLES2 = [
   "executions",
   "phases",
@@ -61202,13 +61257,18 @@ var ALLOWED_TABLES2 = [
   "snapshots",
   "reviews"
 ];
+var EMPTY_COLUMNS = [];
+var EMPTY_DATA = [];
 function usePollTableData(db, tableName) {
-  const [columns, setColumns] = import_react21.useState([]);
-  const [data, setData] = import_react21.useState([]);
-  import_react21.useEffect(() => {
+  const columnsKey = `tui:table:${tableName}:columns`;
+  const dataKey = `tui:table:${tableName}:rows`;
+  const [columns, setColumns] = useTuiState(columnsKey, EMPTY_COLUMNS);
+  const [data, setData] = useTuiState(dataKey, EMPTY_DATA);
+  const pollKey = import_react20.useMemo(() => ({ db, tableName }), [db, tableName]);
+  useEffectOnValueChange(pollKey, () => {
     if (!ALLOWED_TABLES2.includes(tableName)) {
-      setColumns([]);
-      setData([]);
+      setColumns(EMPTY_COLUMNS);
+      setData(EMPTY_DATA);
       return;
     }
     const poll = () => {
@@ -61219,18 +61279,19 @@ function usePollTableData(db, tableName) {
         setData(tableData);
       } catch (err) {
         console.debug("[usePollTableData] Polling error:", err);
-        setColumns([]);
-        setData([]);
+        setColumns(EMPTY_COLUMNS);
+        setData(EMPTY_DATA);
       }
     };
     poll();
     const interval = setInterval(poll, 500);
     return () => clearInterval(interval);
-  }, [db, tableName]);
+  }, [setColumns, setData, tableName, db]);
   return { columns, data };
 }
 
 // src/tui/components/views/DatabaseExplorer.tsx
+init_hooks();
 var jsx_dev_runtime7 = __toESM(require_jsx_dev_runtime(), 1);
 var TABLES = [
   "executions",
@@ -61251,11 +61312,18 @@ var TABLES = [
   "reviews"
 ];
 function DatabaseExplorer({ db, height }) {
-  const [selectedTable, setSelectedTable] = import_react22.useState(0);
-  const [rowOffset, setRowOffset] = import_react22.useState(0);
-  const [isTableListFocused, setIsTableListFocused] = import_react22.useState(true);
+  const [selectedTable, setSelectedTable] = useTuiState("tui:db:selectedTable", 0);
+  const [rowOffset, setRowOffset] = useTuiState("tui:db:rowOffset", 0);
+  const [isTableListFocused, setIsTableListFocused] = useTuiState("tui:db:isTableListFocused", true);
   const tableName = TABLES[selectedTable] ?? "executions";
   const { columns, data: tableData } = usePollTableData(db, tableName);
+  const visibleRowsCount = height - 8;
+  useEffectOnValueChange(`${tableData.length}:${visibleRowsCount}`, () => {
+    const maxOffset = Math.max(0, tableData.length - visibleRowsCount);
+    if (rowOffset > maxOffset) {
+      setRowOffset(maxOffset);
+    }
+  }, [rowOffset, setRowOffset, tableData.length, visibleRowsCount]);
   const handleSelectTable = (index) => {
     setSelectedTable(index);
     setRowOffset(0);
@@ -61271,13 +61339,14 @@ function DatabaseExplorer({ db, height }) {
       }
     } else {
       if (key.name === "j" || key.name === "down") {
-        setRowOffset((prev) => Math.min(prev + 1, Math.max(0, tableData.length - 5)));
+        const maxOffset = Math.max(0, tableData.length - visibleRowsCount);
+        setRowOffset((prev) => Math.min(prev + 1, maxOffset));
       } else if (key.name === "k" || key.name === "up") {
         setRowOffset((prev) => Math.max(prev - 1, 0));
       }
     }
   });
-  const visibleRows = tableData.slice(rowOffset, rowOffset + height - 8);
+  const visibleRows = tableData.slice(rowOffset, rowOffset + visibleRowsCount);
   return /* @__PURE__ */ jsx_dev_runtime7.jsxDEV("box", {
     style: { flexDirection: "row", width: "100%", height: "100%" },
     children: [
@@ -61371,10 +61440,10 @@ function DatabaseExplorer({ db, height }) {
 }
 
 // src/tui/components/views/ChatInterface.tsx
-var import_react25 = __toESM(require_react(), 1);
+var import_react23 = __toESM(require_react(), 1);
 
 // src/tui/hooks/useClaudeChat.ts
-var import_react24 = __toESM(require_react(), 1);
+var import_react22 = __toESM(require_react(), 1);
 
 // src/tui/services/claude-assistant.ts
 var SYSTEM_PROMPT = `You are an observability assistant for Smithers orchestrator.
@@ -61454,13 +61523,17 @@ ${contextSummary}`;
 }
 
 // src/tui/hooks/useClaudeChat.ts
+var MESSAGES_KEY = "tui:chat:messages";
+var LOADING_KEY = "tui:chat:loading";
+var ERROR_KEY = "tui:chat:error";
+var EMPTY_MESSAGES = [];
 function useClaudeChat(db) {
-  const [messages, setMessages] = import_react24.useState([]);
-  const [isLoading, setIsLoading] = import_react24.useState(false);
-  const [error2, setError] = import_react24.useState(null);
+  const [messages, setMessages] = useTuiState(MESSAGES_KEY, EMPTY_MESSAGES);
+  const [isLoading, setIsLoading] = useTuiState(LOADING_KEY, false);
+  const [error2, setError] = useTuiState(ERROR_KEY, null);
   const isAvailable = !!process.env["ANTHROPIC_API_KEY"];
-  const assistant = createClaudeAssistant(db);
-  const sendMessage = import_react24.useCallback(async (content) => {
+  const assistant = import_react22.useMemo(() => createClaudeAssistant(db), [db]);
+  const sendMessage = import_react22.useCallback(async (content) => {
     if (!isAvailable) {
       setError("ANTHROPIC_API_KEY not set. Claude chat is unavailable.");
       return;
@@ -61470,11 +61543,13 @@ function useClaudeChat(db) {
       content,
       timestamp: new Date().toISOString()
     };
-    setMessages((prev) => [...prev, userMessage]);
+    const history = readTuiState(MESSAGES_KEY, EMPTY_MESSAGES);
+    const nextMessages = [...history, userMessage];
+    setMessages(nextMessages);
     setIsLoading(true);
     setError(null);
     try {
-      const response = await assistant.chat([...messages, userMessage]);
+      const response = await assistant.chat(nextMessages);
       const assistantMessage = {
         role: "assistant",
         content: response,
@@ -61486,11 +61561,11 @@ function useClaudeChat(db) {
     } finally {
       setIsLoading(false);
     }
-  }, [messages, isAvailable, assistant]);
-  const clearHistory = import_react24.useCallback(() => {
+  }, [assistant, isAvailable, setError, setIsLoading, setMessages]);
+  const clearHistory = import_react22.useCallback(() => {
     setMessages([]);
     setError(null);
-  }, []);
+  }, [setMessages, setError]);
   return {
     messages,
     isLoading,
@@ -61505,9 +61580,9 @@ function useClaudeChat(db) {
 var jsx_dev_runtime8 = __toESM(require_jsx_dev_runtime(), 1);
 function ChatInterface({ db }) {
   const { messages, isLoading, error: error2, isAvailable, sendMessage, clearHistory } = useClaudeChat(db);
-  const [inputValue, setInputValue] = import_react25.useState("");
-  const [isInputFocused, setIsInputFocused] = import_react25.useState(true);
-  const handleSubmit = import_react25.useCallback(async () => {
+  const [inputValue, setInputValue] = useTuiState("tui:chat:input", "");
+  const [isInputFocused, setIsInputFocused] = useTuiState("tui:chat:focus", true);
+  const handleSubmit = import_react23.useCallback(async () => {
     if (!inputValue.trim())
       return;
     const message = inputValue.trim();
@@ -61519,7 +61594,7 @@ function ChatInterface({ db }) {
       clearHistory();
     }
     if (key.name === "tab") {
-      setIsInputFocused(!isInputFocused);
+      setIsInputFocused((prev) => !prev);
     }
   });
   if (!isAvailable) {
@@ -61627,32 +61702,36 @@ function ChatInterface({ db }) {
 }
 
 // src/tui/components/views/HumanInteractionHandler.tsx
-var import_react28 = __toESM(require_react(), 1);
+var import_react26 = __toESM(require_react(), 1);
 
 // src/tui/hooks/useHumanRequests.ts
-var import_react27 = __toESM(require_react(), 1);
+init_hooks();
+var import_react25 = __toESM(require_react(), 1);
 function useHumanRequests(db) {
-  const [pendingRequests, setPendingRequests] = import_react27.useState([]);
-  const [selectedIndex, setSelectedIndex] = import_react27.useState(0);
-  const refreshRequests = import_react27.useCallback(() => {
+  const [pendingRequests, setPendingRequests] = useTuiState("tui:human:pendingRequests", []);
+  const [selectedIndex, setSelectedIndex] = useTuiState("tui:human:selectedIndex", 0);
+  const refreshRequests = import_react25.useCallback(() => {
     try {
       const pending = db.human.listPending();
       setPendingRequests(pending);
-      if (selectedIndex >= pending.length && pending.length > 0) {
-        setSelectedIndex(pending.length - 1);
-      }
     } catch {}
-  }, [db, selectedIndex]);
-  import_react27.useEffect(() => {
+  }, [db, setPendingRequests]);
+  useEffectOnValueChange(db, () => {
     refreshRequests();
     const interval = setInterval(refreshRequests, 500);
     return () => clearInterval(interval);
   }, [refreshRequests]);
-  const selectRequest = import_react27.useCallback((index) => {
+  useEffectOnValueChange(pendingRequests.length, () => {
+    const maxIndex = Math.max(0, pendingRequests.length - 1);
+    if (selectedIndex > maxIndex) {
+      setSelectedIndex(maxIndex);
+    }
+  }, [pendingRequests.length, selectedIndex, setSelectedIndex]);
+  const selectRequest = import_react25.useCallback((index) => {
     const clampedIndex = Math.max(0, Math.min(index, pendingRequests.length - 1));
     setSelectedIndex(clampedIndex);
-  }, [pendingRequests.length]);
-  const approveRequest = import_react27.useCallback((response) => {
+  }, [pendingRequests.length, setSelectedIndex]);
+  const approveRequest = import_react25.useCallback((response) => {
     const request = pendingRequests[selectedIndex];
     if (!request)
       return;
@@ -61661,7 +61740,7 @@ function useHumanRequests(db) {
       refreshRequests();
     } catch {}
   }, [db, pendingRequests, selectedIndex, refreshRequests]);
-  const rejectRequest = import_react27.useCallback((response) => {
+  const rejectRequest = import_react25.useCallback((response) => {
     const request = pendingRequests[selectedIndex];
     if (!request)
       return;
@@ -61683,6 +61762,7 @@ function useHumanRequests(db) {
 }
 
 // src/tui/components/views/HumanInteractionHandler.tsx
+init_hooks();
 var jsx_dev_runtime9 = __toESM(require_jsx_dev_runtime(), 1);
 function HumanInteractionHandler({ db }) {
   const {
@@ -61693,9 +61773,15 @@ function HumanInteractionHandler({ db }) {
     approveRequest,
     rejectRequest
   } = useHumanRequests(db);
-  const [responseText, setResponseText] = import_react28.useState("");
-  const [selectedOption, setSelectedOption] = import_react28.useState(0);
-  const handleApprove = import_react28.useCallback(() => {
+  const [responseText, setResponseText] = useTuiState("tui:human:responseText", "");
+  const [selectedOption, setSelectedOption] = useTuiState("tui:human:selectedOption", 0);
+  useEffectOnValueChange(selectedRequest?.options?.length ?? 0, () => {
+    const maxIndex = Math.max(0, (selectedRequest?.options?.length ?? 0) - 1);
+    if (selectedOption > maxIndex) {
+      setSelectedOption(maxIndex);
+    }
+  }, [selectedOption, selectedRequest?.options?.length, setSelectedOption]);
+  const handleApprove = import_react26.useCallback(() => {
     if (selectedRequest?.options && selectedRequest.options.length > 0) {
       approveRequest(selectedRequest.options[selectedOption]);
     } else if (responseText.trim()) {
@@ -61708,7 +61794,7 @@ function HumanInteractionHandler({ db }) {
   useKeyboard((key) => {
     if (key.name === "j" || key.name === "down") {
       if (selectedRequest?.options && selectedRequest.options.length > 0) {
-        setSelectedOption((prev) => Math.min(prev + 1, selectedRequest.options.length - 1));
+        setSelectedOption((prev) => Math.min(prev + 1, Math.max(0, selectedRequest.options.length - 1)));
       } else {
         selectRequest(selectedIndex + 1);
       }
@@ -61879,11 +61965,8 @@ function HumanInteractionHandler({ db }) {
   }, undefined, true, undefined, this);
 }
 
-// src/tui/components/views/ReportViewer.tsx
-var import_react31 = __toESM(require_react(), 1);
-
 // src/tui/hooks/useReportGenerator.ts
-var import_react30 = __toESM(require_react(), 1);
+var import_react28 = __toESM(require_react(), 1);
 
 // src/tui/services/report-generator.ts
 function gatherMetrics(db) {
@@ -62030,25 +62113,17 @@ ${analysis}` : metricsReport;
 }
 
 // src/tui/hooks/useReportGenerator.ts
+init_hooks();
 var REPORT_INTERVAL_MS = 10 * 60 * 1000;
+var REPORTS_KEY = "tui:reports:list";
+var GENERATING_KEY = "tui:reports:generating";
+var LAST_GENERATED_KEY = "tui:reports:lastGeneratedAt";
+var EMPTY_REPORTS = [];
 function useReportGenerator(db) {
-  const [reports, setReports] = import_react30.useState([]);
-  const [isGenerating, setIsGenerating] = import_react30.useState(false);
-  const [lastGeneratedAt, setLastGeneratedAt] = import_react30.useState(null);
-  import_react30.useEffect(() => {
-    const loadReports = () => {
-      try {
-        const dbReports = db.query("SELECT * FROM reports WHERE type = 'auto_summary' ORDER BY created_at DESC LIMIT 50");
-        setReports(dbReports);
-      } catch (err) {
-        console.debug("[useReportGenerator] Load error:", err);
-      }
-    };
-    loadReports();
-    const interval = setInterval(loadReports, 5000);
-    return () => clearInterval(interval);
-  }, [db]);
-  const generateNow = import_react30.useCallback(async () => {
+  const [reports, setReports] = useTuiState(REPORTS_KEY, EMPTY_REPORTS);
+  const [isGenerating, setIsGenerating] = useTuiState(GENERATING_KEY, false);
+  const [lastGeneratedAt, setLastGeneratedAt] = useTuiState(LAST_GENERATED_KEY, null);
+  const generateNow = import_react28.useCallback(async () => {
     setIsGenerating(true);
     try {
       const report = await generateReport(db);
@@ -62061,13 +62136,26 @@ function useReportGenerator(db) {
     } finally {
       setIsGenerating(false);
     }
-  }, [db]);
-  import_react30.useEffect(() => {
-    const interval = setInterval(() => {
+  }, [db, setIsGenerating, setReports, setLastGeneratedAt]);
+  useEffectOnValueChange(db, () => {
+    const loadReports = () => {
+      try {
+        const dbReports = db.query("SELECT * FROM reports WHERE type = 'auto_summary' ORDER BY created_at DESC LIMIT 50");
+        setReports(dbReports);
+      } catch (err) {
+        console.debug("[useReportGenerator] Load error:", err);
+      }
+    };
+    loadReports();
+    const loadInterval = setInterval(loadReports, 5000);
+    const generateInterval = setInterval(() => {
       generateNow();
     }, REPORT_INTERVAL_MS);
-    return () => clearInterval(interval);
-  }, [generateNow]);
+    return () => {
+      clearInterval(loadInterval);
+      clearInterval(generateInterval);
+    };
+  }, [db, generateNow, setReports]);
   return {
     reports,
     isGenerating,
@@ -62077,13 +62165,20 @@ function useReportGenerator(db) {
 }
 
 // src/tui/components/views/ReportViewer.tsx
+init_hooks();
 var jsx_dev_runtime10 = __toESM(require_jsx_dev_runtime(), 1);
 function ReportViewer({ db }) {
   const { reports, isGenerating, generateNow } = useReportGenerator(db);
-  const [selectedIndex, setSelectedIndex] = import_react31.useState(0);
+  const [selectedIndex, setSelectedIndex] = useTuiState("tui:reports:selectedIndex", 0);
+  useEffectOnValueChange(reports.length, () => {
+    const maxIndex = Math.max(0, reports.length - 1);
+    if (selectedIndex > maxIndex) {
+      setSelectedIndex(maxIndex);
+    }
+  }, [reports.length, selectedIndex, setSelectedIndex]);
   useKeyboard((key) => {
     if (key.name === "j" || key.name === "down") {
-      setSelectedIndex((prev) => Math.min(prev + 1, reports.length - 1));
+      setSelectedIndex((prev) => Math.min(prev + 1, Math.max(0, reports.length - 1)));
     } else if (key.name === "k" || key.name === "up") {
       setSelectedIndex((prev) => Math.max(prev - 1, 0));
     } else if (key.name === "r") {
@@ -62230,60 +62325,67 @@ function getLineColor(line) {
 
 // src/tui/hooks/useSmithersConnection.ts
 init_db();
-var import_react33 = __toESM(require_react(), 1);
+init_hooks();
+var import_react30 = __toESM(require_react(), 1);
+var EMPTY_EXECUTIONS = [];
 function useSmithersConnection(dbPath) {
-  const [db, setDb] = import_react33.useState(null);
-  const [isConnected, setIsConnected] = import_react33.useState(false);
-  const [error2, setError] = import_react33.useState(null);
-  const [currentExecution, setCurrentExecution] = import_react33.useState(null);
-  const [executions, setExecutions] = import_react33.useState([]);
-  import_react33.useEffect(() => {
-    let smithersDb = null;
-    let pollInterval = null;
-    const connect = () => {
-      try {
-        const fullPath = dbPath.endsWith(".db") ? dbPath : `${dbPath}/smithers.db`;
-        smithersDb = createSmithersDB({ path: fullPath });
-        setDb(smithersDb);
-        setIsConnected(true);
-        setError(null);
-        const pollData = () => {
-          try {
-            const current = smithersDb?.execution.current();
-            if (current) {
-              setCurrentExecution({
-                ...current,
-                started_at: current.started_at?.toISOString() ?? null,
-                completed_at: current.completed_at?.toISOString() ?? null
-              });
-            } else {
-              setCurrentExecution(null);
-            }
-            const allExecs = smithersDb?.execution.list() ?? [];
-            setExecutions(allExecs.map((e) => ({
-              ...e,
-              started_at: e.started_at?.toISOString() ?? null,
-              completed_at: e.completed_at?.toISOString() ?? null
-            })));
-          } catch {}
-        };
-        pollData();
-        pollInterval = setInterval(pollData, 500);
-      } catch (e) {
-        setError(e instanceof Error ? e.message : "Connection failed");
-        setIsConnected(false);
+  const dbRef = import_react30.useRef(null);
+  const pollIntervalRef = import_react30.useRef(null);
+  const keyBase = `tui:connection:${dbPath}`;
+  const [isConnected, setIsConnected] = useTuiState(`${keyBase}:connected`, false);
+  const [error2, setError] = useTuiState(`${keyBase}:error`, null);
+  const [currentExecution, setCurrentExecution] = useTuiState(`${keyBase}:currentExecution`, null);
+  const [executions, setExecutions] = useTuiState(`${keyBase}:executions`, EMPTY_EXECUTIONS);
+  useEffectOnValueChange(dbPath, () => {
+    const cleanup = () => {
+      if (pollIntervalRef.current) {
+        clearInterval(pollIntervalRef.current);
+        pollIntervalRef.current = null;
+      }
+      if (dbRef.current) {
+        dbRef.current.close();
+        dbRef.current = null;
       }
     };
-    connect();
-    return () => {
-      if (pollInterval)
-        clearInterval(pollInterval);
-      if (smithersDb)
-        smithersDb.close();
-    };
-  }, [dbPath]);
+    cleanup();
+    try {
+      const fullPath = dbPath.endsWith(".db") ? dbPath : `${dbPath}/smithers.db`;
+      const smithersDb = createSmithersDB({ path: fullPath });
+      dbRef.current = smithersDb;
+      setIsConnected(true);
+      setError(null);
+      const pollData = () => {
+        try {
+          const current = smithersDb.execution.current();
+          if (current) {
+            setCurrentExecution({
+              ...current,
+              started_at: current.started_at?.toISOString() ?? null,
+              completed_at: current.completed_at?.toISOString() ?? null
+            });
+          } else {
+            setCurrentExecution(null);
+          }
+          const allExecs = smithersDb.execution.list();
+          setExecutions(allExecs.map((e) => ({
+            ...e,
+            started_at: e.started_at?.toISOString() ?? null,
+            completed_at: e.completed_at?.toISOString() ?? null
+          })));
+        } catch {}
+      };
+      pollData();
+      pollIntervalRef.current = setInterval(pollData, 500);
+    } catch (e) {
+      setError(e instanceof Error ? e.message : "Connection failed");
+      setIsConnected(false);
+      setCurrentExecution(null);
+      setExecutions(EMPTY_EXECUTIONS);
+    }
+    return cleanup;
+  }, [dbPath, setCurrentExecution, setError, setExecutions, setIsConnected]);
   return {
-    db,
+    db: dbRef.current,
     isConnected,
     error: error2,
     currentExecution,
@@ -62302,7 +62404,7 @@ var TABS = [
   { key: "reports", label: "Reports", shortcut: "F6" }
 ];
 function App({ dbPath }) {
-  const [activeTab, setActiveTab] = import_react34.useState("timeline");
+  const [activeTab, setActiveTab] = useTuiState("tui:app:activeTab", "timeline");
   const { height } = useTerminalDimensions();
   const { db, isConnected, error: error2, currentExecution } = useSmithersConnection(dbPath);
   useKeyboard((key) => {
@@ -62331,7 +62433,7 @@ function App({ dbPath }) {
     }
   });
   const contentHeight = Math.max(height - 6, 10);
-  const renderView = import_react34.useCallback(() => {
+  const renderView = import_react31.useCallback(() => {
     if (!db) {
       return /* @__PURE__ */ jsx_dev_runtime11.jsxDEV("text", {
         content: "Connecting to database...",