@scrylog/cli 0.3.0 → 0.3.1

package/src/tui/App.tsx

@@ -1,240 +0,0 @@
-import { useKeyboard, useTerminalDimensions } from "@opentui/react";
-import { useEffect, useReducer, useRef, useState } from "react";
-import type { ScrylogConfig } from "../shared/config";
-import type { SessionModel, StoreEvent } from "../shared/types";
-import type { SessionListItem } from "../shared/session-view";
-import { applySessionFilters, buildRows, moveSelection, sessionAttachCommand, visibleRowWindow } from "./model";
-import { dashboardReducer, INITIAL_DASHBOARD_STATE } from "./state";
-import type { DaemonClient } from "./client";
-import { SessionsView } from "./components/SessionsView";
-import { UsageView } from "./components/UsageView";
-import { TabBar } from "./components/TabBar";
-import { KeyBar } from "./components/KeyBar";
-import { BindingsModal } from "./components/BindingsModal";
-import { DashboardHeader, dashboardHeaderHeight } from "./components/DashboardHeader";
-import { isInsideTmux } from "../shared/utils";
-import type { DaemonVersionMismatch } from "../shared/version";
-
-export interface AppOptions {
-  refreshMs: number;
-  includeUnknown?: boolean;
-}
-
-export interface AppProps {
-  client: DaemonClient;
-  options: AppOptions;
-  config: ScrylogConfig;
-  versionMismatch?: DaemonVersionMismatch;
-  onExit(): void;
-  onAttach(command: string[], sessionId: string): void;
-}
-
-export function App({ client, options, config, versionMismatch, onExit, onAttach }: AppProps) {
-  const { width, height } = useTerminalDimensions();
-  const paneHeight = Math.max(1, height - dashboardHeaderHeight(width) - 2);
-  const [state, dispatch] = useReducer(dashboardReducer, INITIAL_DASHBOARD_STATE);
-  const [spinnerFrame, setSpinnerFrame] = useState(0);
-  const stateRef = useRef(state);
-  const rowsRef = useRef<ReturnType<typeof buildRows>>([]);
-  const debounceRef = useRef<ReturnType<typeof setTimeout> | null>(null);
-  const knownStatesRef = useRef(new Map<string, SessionModel["state"]>());
-  stateRef.current = state;
-
-  useEffect(() => {
-    let active = true;
-    const refreshSessions = async () => {
-      const [status, sessionData] = await Promise.all([
-        client.getStatusSummary(options.includeUnknown),
-        client.getSessions(options.includeUnknown),
-      ]);
-      if (!active) return;
-      if (!status || !sessionData) {
-        dispatch({ type: "connection", connected: false });
-        return;
-      }
-      knownStatesRef.current = new Map(sessionData.sessions.map((session) => [session.id, session.state]));
-      dispatch({ type: "sessions-loaded", sessions: sessionData.sessions, counts: status.counts });
-    };
-    const refreshAll = async () => {
-      const usage = await client.getUsage();
-      if (active && usage) dispatch({ type: "usage-loaded", usage });
-      await refreshSessions();
-    };
-    const scheduleRefresh = (immediate: boolean) => {
-      if (debounceRef.current) clearTimeout(debounceRef.current);
-      if (immediate || config.tui.pushDebounceMs <= 0) {
-        debounceRef.current = null;
-        void refreshSessions();
-        return;
-      }
-      debounceRef.current = setTimeout(() => {
-        debounceRef.current = null;
-        void refreshSessions();
-      }, config.tui.pushDebounceMs);
-    };
-    const onStoreEvent = (event: StoreEvent | { type: "connected" } | { type: "disconnected" }) => {
-      if (event.type === "connected") {
-        dispatch({ type: "connection", connected: true });
-        void refreshAll();
-      } else if (event.type === "disconnected") {
-        dispatch({ type: "connection", connected: false });
-      } else if (event.type === "usage:updated") {
-        dispatch({ type: "usage-loaded", usage: event.usage });
-      } else if (event.type === "session:added" || event.type === "session:removed") {
-        scheduleRefresh(true);
-      } else if (event.type === "session:updated") {
-        const known = knownStatesRef.current.get(event.session.id);
-        scheduleRefresh(known === undefined || known !== event.session.state);
-      }
-    };
-
-    void refreshAll();
-    const polling = setInterval(() => void refreshAll(), options.refreshMs);
-    const unsubscribe = config.tui.usePushUpdates ? client.subscribeEvents(onStoreEvent) : undefined;
-    return () => {
-      active = false;
-      clearInterval(polling);
-      unsubscribe?.();
-      if (debounceRef.current) clearTimeout(debounceRef.current);
-      debounceRef.current = null;
-    };
-  }, [client, config.tui.pushDebounceMs, config.tui.usePushUpdates, options.includeUnknown, options.refreshMs]);
-
-  useEffect(() => {
-    if (state.view !== "sessions") return;
-    const animation = setInterval(() => setSpinnerFrame((frame) => (frame + 1) % 10), 180);
-    return () => clearInterval(animation);
-  }, [state.view]);
-
-  const filtered = applySessionFilters(state.sessions, state.filters, config.tui.standaloneMaxAgeHours);
-  const rows = buildRows(filtered, width < 110);
-  rowsRef.current = rows;
-  const usagePaneRows = state.view === "sessions" && state.usage ? 3 : 0;
-  const visibleRows = visibleRowWindow(rows, state.selectedSessionId, Math.max(4, height - dashboardHeaderHeight(width) - usagePaneRows - (state.mode === "search" ? 8 : 5)));
-
-  const openDetail = async (session: SessionListItem | undefined) => {
-    if (!session) return;
-    const detail = await client.getSessionDetail(session.id) ?? ({ ...session } as SessionModel);
-    dispatch({ type: "detail", session: detail });
-  };
-
-  const attach = (session: SessionListItem | undefined) => {
-    if (!session) return;
-    const command = sessionAttachCommand(session, isInsideTmux());
-    if (!command) {
-      dispatch({
-        type: "message",
-        message: session.source === "herdr"
-          ? "Herdr attach is unavailable because this pane has no terminal ID."
-          : "Attach is only available for sessions running inside tmux or herdr.",
-      });
-      return;
-    }
-    onAttach(command, session.id);
-  };
-
-  useKeyboard((key) => {
-    const currentState = stateRef.current;
-    const currentSelected = currentState.sessions.find((session) => session.id === currentState.selectedSessionId);
-    if ((key.ctrl && key.name === "c") || (key.name === "q" && currentState.mode === "list")) return onExit();
-    if (currentState.mode === "search") {
-      if (key.name === "escape" || key.name === "return" || key.name === "enter") dispatch({ type: "close-overlay" });
-      return;
-    }
-    if (currentState.mode === "detail" || currentState.mode === "message" || currentState.mode === "bindings") {
-      if (key.name === "escape" || key.name === "q") dispatch({ type: "close-overlay" });
-      if (key.name === "t" && currentState.detail) attach(currentState.detail as SessionListItem);
-      return;
-    }
-    if (key.name === "tab") {
-      dispatch({ type: "view", view: key.shift ? "sessions" : currentState.view === "sessions" ? "usage" : "sessions" });
-      return;
-    }
-    if (key.name === "u") return dispatch({ type: "view", view: "usage" });
-    if (key.name === "s") return dispatch({ type: "view", view: "sessions" });
-    if (key.name === "r") {
-      void Promise.all([client.getStatusSummary(options.includeUnknown), client.getSessions(options.includeUnknown), client.getUsage()])
-        .then(([status, sessions, usage]) => {
-          if (status && sessions) dispatch({ type: "sessions-loaded", sessions: sessions.sessions, counts: status.counts });
-          if (usage) dispatch({ type: "usage-loaded", usage });
-        });
-      return;
-    }
-    if (key.name === "?") return dispatch({ type: "bindings" });
-    if (currentState.view !== "sessions") return;
-    if (key.name === "up" || key.name === "k") return dispatch({ type: "select", id: moveSelection(rowsRef.current, currentState.selectedSessionId, -1) });
-    if (key.name === "down" || key.name === "j") return dispatch({ type: "select", id: moveSelection(rowsRef.current, currentState.selectedSessionId, 1) });
-    if (key.name === "escape") return dispatch({ type: "select", id: undefined });
-    if (key.name === "return" || key.name === "enter") return void openDetail(currentSelected);
-    if (key.name === "t") return attach(currentSelected);
-    if (key.name === "/") return dispatch({ type: "search" });
-    if (key.name === "a") return dispatch({ type: "toggle-actionable" });
-    if (key.name === "f") return dispatch({ type: "cycle-filters" });
-  });
-
-  const filterSummary = [
-    state.filters.query ? `q=${state.filters.query}` : null,
-    state.filters.actionableOnly ? "actionable" : null,
-    state.filters.tool !== "all" ? `tool=${state.filters.tool}` : null,
-    state.filters.state !== "all" ? `state=${state.filters.state}` : null,
-  ].filter(Boolean).join(" ");
-  const selectedSession = state.sessions.find((session) => session.id === state.selectedSessionId);
-
-  return (
-    <box width="100%" height="100%" flexDirection="column">
-      <DashboardHeader
-        sessions={state.sessions}
-        connected={state.daemonConnected}
-        spinnerFrame={spinnerFrame}
-        width={width}
-        versionMismatch={versionMismatch}
-      />
-      <TabBar
-        view={state.view}
-        onSelect={(next) => dispatch({ type: "view", view: next })}
-      />
-      <box
-        position={state.view === "sessions" ? "relative" : "absolute"}
-        top={state.view === "sessions" ? 0 : height + 2}
-        width="100%"
-        height={paneHeight}
-      >
-        <SessionsView
-          rows={visibleRows}
-          sessions={state.sessions}
-          selectedSessionId={state.selectedSessionId}
-          filters={state.filters}
-          mode={state.mode}
-          detail={state.detail}
-          message={state.message}
-          usage={state.usage}
-          iconMode={config.tui.providerIcons}
-          spinnerFrame={spinnerFrame}
-          width={width}
-          interactive={state.mode === "list" && state.view === "sessions"}
-          onQueryChange={(query) => dispatch({ type: "query", query })}
-          onSearchSubmit={() => dispatch({ type: "close-overlay" })}
-          onSelectSession={(id) => dispatch({ type: "select", id })}
-          onOpenSessionDetail={(session) => void openDetail(session)}
-          onScrollSelection={(direction) => dispatch({ type: "select", id: moveSelection(rowsRef.current, stateRef.current.selectedSessionId, direction) })}
-        />
-      </box>
-      <box
-        position={state.view === "usage" ? "relative" : "absolute"}
-        top={state.view === "usage" ? 0 : height + 2}
-        width="100%"
-        height={paneHeight}
-      >
-        <UsageView usage={state.usage} width={width} iconMode={config.tui.providerIcons} hidden={state.view !== "usage"} />
-      </box>
-      <KeyBar
-        view={state.view}
-        width={width}
-        context={state.view === "sessions"
-          ? `${selectedSession ? `${selectedSession.tool} ${selectedSession.state} ${selectedSession.project?.compactLabel ?? selectedSession.id}` : "no selection"}${filterSummary ? `   ${filterSummary}` : ""}`
-          : undefined}
-      />
-      {state.mode === "bindings" && <BindingsModal width={width} iconMode={config.tui.providerIcons} />}
-    </box>
-  );
-}

package/src/tui/client.ts

@@ -1,163 +0,0 @@
-import { createDaemonFetch, getSocketPath } from "../shared/ipc";
-import { IS_WINDOWS } from "../shared/platform";
-import type { ScrylogConfig } from "../shared/config";
-import type { DaemonHealth, HealthResponse, SessionModel, StoreEvent } from "../shared/types";
-import type { SessionListItem, SessionTreeItem, SessionViewCounts } from "../shared/session-view";
-import { flattenSessionTree } from "../shared/session-view";
-import type { UsageState } from "../usage/types";
-
-type FetchFn = (input: string | URL | Request, init?: RequestInit) => Promise<Response>;
-
-export class DaemonClient {
-  private readonly fetch: FetchFn;
-
-  constructor(config: ScrylogConfig, socketPath?: string) {
-    this.fetch = createDaemonFetch({
-      host: config.api.host,
-      port: config.api.port,
-      socketPath: socketPath ?? (IS_WINDOWS ? undefined : getSocketPath(config.daemon.socketPath)),
-      bearerToken: config.api.bearerToken,
-    });
-  }
-
-  async getStatusSummary(includeUnknown = false): Promise<{ counts: SessionViewCounts; collectorStatus: Record<string, unknown>; generatedAt: number } | null> {
-    try {
-      const response = await this.fetch(includeUnknown ? "/api/status?includeUnknown=true" : "/api/status");
-      if (!response.ok) return null;
-      return await response.json() as { counts: SessionViewCounts; collectorStatus: Record<string, unknown>; generatedAt: number };
-    } catch {
-      return null;
-    }
-  }
-
-  async getHealth(): Promise<DaemonHealth | null> {
-    try {
-      const response = await this.fetch("/api/health");
-      if (!response.ok) return null;
-      const body = await response.json() as Partial<HealthResponse>;
-      if (body.ok !== true) return null;
-      return body as DaemonHealth;
-    } catch {
-      return null;
-    }
-  }
-
-  async getSessions(includeUnknown = false): Promise<{ sessions: SessionListItem[]; counts: SessionViewCounts; generatedAt: number } | null> {
-    try {
-      const response = await this.fetch(includeUnknown ? "/api/sessions?includeUnknown=true" : "/api/sessions");
-      if (!response.ok) return null;
-      const data = await response.json() as { sessions: SessionTreeItem[]; counts: SessionViewCounts; generatedAt: number };
-      return {
-        sessions: flattenSessionTree(data.sessions),
-        counts: data.counts,
-        generatedAt: data.generatedAt,
-      };
-    } catch {
-      return null;
-    }
-  }
-
-  async getSessionDetail(id: string): Promise<SessionModel | null> {
-    try {
-      const response = await this.fetch(`/api/sessions/${encodeURIComponent(id)}`);
-      if (!response.ok) return null;
-      const data = await response.json() as { session: SessionModel };
-      return data.session;
-    } catch {
-      return null;
-    }
-  }
-
-  async getUsage(): Promise<UsageState | null> {
-    try {
-      const response = await this.fetch("/api/usage");
-      if (!response.ok) return null;
-      return await response.json() as UsageState;
-    } catch {
-      return null;
-    }
-  }
-
-  /**
-   * Subscribe to daemon SSE events with automatic reconnect.
-   * Returns an unsubscribe function.
-   */
-  subscribeEvents(onEvent: (event: StoreEvent | { type: "connected" } | { type: "disconnected" }) => void): () => void {
-    let aborted = false;
-    const controller = new AbortController();
-    let reconnectTimer: ReturnType<typeof setTimeout> | null = null;
-    let reconnectDelay = 1_000;
-
-    const connect = async () => {
-      if (aborted) return;
-      try {
-        const response = await this.fetch("/api/events", {
-          signal: controller.signal,
-          headers: { Accept: "text/event-stream" },
-        });
-
-        if (!response.ok || !response.body) {
-          if (!aborted) {
-            onEvent({ type: "disconnected" });
-          }
-          return;
-        }
-
-        onEvent({ type: "connected" });
-        reconnectDelay = 1_000; // reset backoff on successful connect
-
-        const reader = response.body.getReader();
-        const decoder = new TextDecoder();
-        let buffer = "";
-
-        while (!aborted) {
-          const { value, done } = await reader.read();
-          if (done) break;
-
-          buffer += decoder.decode(value, { stream: true });
-          const lines = buffer.split("\n");
-          buffer = lines.pop() ?? "";
-
-          for (const line of lines) {
-            if (line.startsWith("data: ")) {
-              try {
-                const payload = JSON.parse(line.slice(6)) as StoreEvent;
-                onEvent(payload);
-              } catch {
-                // Ignore malformed events
-              }
-            }
-          }
-        }
-      } catch (error) {
-        if (!aborted) {
-          onEvent({ type: "disconnected" });
-        }
-      }
-    };
-
-    const scheduleReconnect = () => {
-      if (aborted || reconnectTimer) return;
-      reconnectTimer = setTimeout(() => {
-        reconnectTimer = null;
-        void connect().then(() => {
-          if (!aborted) scheduleReconnect();
-        });
-      }, reconnectDelay);
-      reconnectDelay = Math.min(reconnectDelay * 1.5, 5_000);
-    };
-
-    void connect().then(() => {
-      if (!aborted) scheduleReconnect();
-    });
-
-    return () => {
-      aborted = true;
-      controller.abort();
-      if (reconnectTimer) {
-        clearTimeout(reconnectTimer);
-        reconnectTimer = null;
-      }
-    };
-  }
-}

package/src/tui/components/BindingsModal.tsx

@@ -1,82 +0,0 @@
-import { TextAttributes } from "@opentui/core";
-import { bindingsForModal } from "../keybindings";
-import type { TuiConfig } from "../../shared/config";
-import { ProviderIcon } from "./UsageView";
-import { MINI_ICON_SIZE, isImageIconMode, toolProviderKey } from "./tool-icons";
-import { BRAND } from "../theme";
-
-const TOOL_LEGEND: { tool: string; label: string }[] = [
-  { tool: "claude", label: "Claude" },
-  { tool: "codex", label: "Codex" },
-  { tool: "opencode", label: "OpenCode" },
-  { tool: "copilotcli", label: "Copilot CLI" },
-  { tool: "shell", label: "Shell" },
-  { tool: "unknown", label: "Unknown" },
-];
-
-export function BindingsModal({ width, iconMode }: { width: number; iconMode: TuiConfig["providerIcons"] }) {
-  const groups = bindingsForModal();
-  const showIcons = isImageIconMode(iconMode);
-  return (
-    <box
-      position="absolute"
-      top="8%"
-      left="10%"
-      width="80%"
-      height="70%"
-      title="Keybindings"
-      border
-      borderColor={BRAND.primary}
-      backgroundColor={BRAND.surface}
-      flexDirection="column"
-      padding={1}
-      zIndex={20}
-    >
-      <box flexGrow={1} overflow="hidden" flexDirection="column">
-        <scrollbox flexGrow={1} height="100%" scrollY focused>
-        {groups.map((group) => (
-          <box key={group.scope} flexDirection="column">
-            <text
-              fg={BRAND.grey}
-              attributes={TextAttributes.BOLD}
-              content={`── ${group.scope === "global" ? "Global" : group.scope === "sessions" ? "Sessions tab" : "Usage tab"} ──`}
-            />
-            {group.bindings.map((binding) => (
-              <box key={`${group.scope}:${binding.key}`} flexDirection="row" height={1}>
-                <text width={Math.min(14, Math.max(10, Math.floor(width * 0.2)))} fg={BRAND.primary} attributes={TextAttributes.BOLD} content={binding.key} />
-                <text fg={BRAND.grey} content={binding.description} />
-              </box>
-            ))}
-            <text height={1} content="" />
-          </box>
-        ))}
-        {showIcons && (
-          <box flexDirection="column">
-            <text
-              fg={BRAND.grey}
-              attributes={TextAttributes.BOLD}
-              content="── Tool icons ──"
-            />
-            {TOOL_LEGEND.map((entry) => {
-              const key = toolProviderKey(entry.tool);
-              const labelWidth = Math.min(14, Math.max(10, Math.floor(width * 0.2)));
-              return (
-                <box key={entry.tool} flexDirection="row" height={1}>
-                  {key ? (
-                    <ProviderIcon provider={key} mode={iconMode} size={MINI_ICON_SIZE} />
-                  ) : (
-                    <box width={MINI_ICON_SIZE.width} />
-                  )}
-                  <text fg={BRAND.grey} content={` ${entry.label}`} />
-                </box>
-              );
-            })}
-            <text height={1} content="" />
-          </box>
-        )}
-      </scrollbox>
-      </box>
-      <text height={1} flexShrink={0} fg={BRAND.grey} content="Press q or Esc to close." />
-    </box>
-  );
-}