@dsdenes/devboard 0.1.559 → 0.1.562

package/client/lib/issues.svelte.ts

@@ -0,0 +1,439 @@
+import { connection } from "./connection.svelte";
+import { notifications } from "./notifications.svelte";
+import type {
+  GoalDraftDetail,
+  GoalDraftRun,
+  GoalDraftSummary,
+  IssuesActivityEntry,
+  IssuesAgent,
+  IssuesRunDetail,
+  IssuesRunSummary,
+  IssuesSnapshot,
+  QueuedIssue,
+} from "./types";
+
+export const GOAL_LABEL = "goal";
+export const DRAFT_PATH_KEY = "devboard.issues.draft.v1";
+export const DRAFT_PAGE_KEY = "devboard.issues.draftsPage.v1";
+
+export function markDraftsPage(open: boolean): void {
+  try {
+    if (open) localStorage.setItem(DRAFT_PAGE_KEY, "1");
+    else localStorage.removeItem(DRAFT_PAGE_KEY);
+  } catch {
+    // Storage may be unavailable; the current session still works.
+  }
+}
+
+export function draftsPageWasOpen(): boolean {
+  try {
+    return localStorage.getItem(DRAFT_PAGE_KEY) === "1";
+  } catch {
+    return false;
+  }
+}
+
+export function isGoalIssue(issue: { labels?: string[] }): boolean {
+  return issue.labels?.includes(GOAL_LABEL) === true;
+}
+
+function isObject(value: unknown): value is Record<string, unknown> {
+  return typeof value === "object" && value !== null;
+}
+
+function readDraftPath(): string | null {
+  try {
+    const value = localStorage.getItem(DRAFT_PATH_KEY);
+    return value === null || value.length === 0 ? null : value;
+  } catch {
+    return null;
+  }
+}
+
+function writeDraftPath(path: string | null): void {
+  try {
+    if (path === null) localStorage.removeItem(DRAFT_PATH_KEY);
+    else localStorage.setItem(DRAFT_PATH_KEY, path);
+  } catch {
+    // Storage may be unavailable; the selection then lasts the session only.
+  }
+}
+
+function isSnapshot(value: Record<string, unknown>): boolean {
+  return (
+    value.type === "issuesState" &&
+    typeof value.root === "string" &&
+    typeof value.lifecycle === "string" &&
+    typeof value.enabled === "boolean" &&
+    Array.isArray(value.queue) &&
+    Array.isArray(value.runs)
+  );
+}
+
+function isEntry(value: unknown): value is IssuesActivityEntry {
+  return isObject(value) && typeof value.text === "string" && typeof value.append === "boolean";
+}
+
+function applyActivity(lines: string[], entries: IssuesActivityEntry[], replay: boolean): string[] {
+  const next = replay ? [] : [...lines];
+  for (const entry of entries) {
+    if (entry.append && next.length > 0) next[next.length - 1] += entry.text;
+    else next.push(entry.text);
+  }
+  return next;
+}
+
+/**
+ * The Issues mode's client state. It never polls: the dashboard replays the
+ * worker's snapshot and activity on connect, then streams both as the worker
+ * persists them. Controls only send commands.
+ */
+export class IssuesStore {
+  snapshot = $state<IssuesSnapshot | null>(null);
+  agentActivity = $state<Record<string, string[]>>({});
+  run = $state<IssuesRunDetail | null>(null);
+  runError = $state<string | null>(null);
+  selectedRun = $state<string | null>(null);
+  private requestedRun: string | null = null;
+  /** Issue numbers whose close request is still unanswered. */
+  closing = $state<number[]>([]);
+
+  drafts = $state<GoalDraftSummary[]>([]);
+  draftRun = $state<GoalDraftRun | null>(null);
+  draft = $state<GoalDraftDetail | null>(null);
+  draftPath = $state<string | null>(readDraftPath());
+  draftError = $state<string | null>(null);
+
+  /**
+   * True once the connect-time replay has named the live agents. A run request
+   * made before the replay cannot tell a finished run from a running one.
+   */
+  get ready(): boolean {
+    return this.snapshot !== null;
+  }
+
+  get lifecycle(): string {
+    return this.snapshot?.lifecycle ?? "stopped";
+  }
+
+  get repo(): string | null {
+    return this.snapshot?.repo ?? null;
+  }
+
+  /**
+   * The header's origin label. A missing snapshot is not evidence that the
+   * checkout has no origin, so only a received snapshot may say so.
+   */
+  get repoLabel(): string {
+    if (this.repo !== null) return this.repo;
+    return this.snapshot === null ? "…" : "No GitHub origin";
+  }
+
+  get enabled(): boolean {
+    return this.snapshot?.enabled === true;
+  }
+
+  get paused(): boolean {
+    return this.snapshot?.paused === true;
+  }
+
+  get running(): boolean {
+    return this.lifecycle === "running" || this.lifecycle === "pausing";
+  }
+
+  get queue(): QueuedIssue[] {
+    return [...(this.snapshot?.queue ?? [])].sort((left, right) => left.number - right.number);
+  }
+
+  get runs(): IssuesRunSummary[] {
+    return this.snapshot?.runs ?? [];
+  }
+
+  get agents(): IssuesAgent[] {
+    return [...(this.snapshot?.agents ?? [])].sort(
+      (left, right) => left.issueNumber - right.issueNumber,
+    );
+  }
+
+  activityFor(runId: string): string[] {
+    return this.agentActivity[runId] ?? [];
+  }
+
+  agentFor(runId: string): IssuesAgent | null {
+    return this.snapshot?.agents.find((agent) => agent.runId === runId) ?? null;
+  }
+
+  /** The run status a card shows: the live run's status, else its history. */
+  statusFor(runId: string): string {
+    return this.snapshot?.runs.find((run) => run.runId === runId)?.status ?? "running";
+  }
+
+  get notice(): string | null {
+    return this.snapshot?.notice ?? null;
+  }
+
+  get pending(): number {
+    return this.queue.filter((issue) => !issue.handled).length;
+  }
+
+  get cooldowns(): Record<string, string> {
+    return this.snapshot?.cooldowns ?? {};
+  }
+
+  get cooldownCount(): number {
+    return Object.keys(this.cooldowns).length;
+  }
+
+  get earliestCooldown(): string | null {
+    const times = Object.values(this.cooldowns)
+      .map((value) => Date.parse(value))
+      .filter((value) => Number.isFinite(value));
+    if (times.length === 0) return null;
+    return new Date(Math.min(...times)).toISOString();
+  }
+
+  get draftRunning(): boolean {
+    return this.draftRun?.status === "running";
+  }
+
+  get draftBusyPath(): string | null {
+    return this.draftRunning ? (this.draftRun?.path ?? null) : null;
+  }
+
+  get draftStatus(): string {
+    return this.draftRun?.status ?? "idle";
+  }
+
+  /** The stated reason another draft's start control is disabled, or null. */
+  draftStartBlocker(path: string): string | null {
+    const busy = this.draftBusyPath;
+    if (busy === null) return null;
+    return busy === path
+      ? "This draft is being elaborated."
+      : `An elaboration is running for ${busy}.`;
+  }
+
+  refreshDrafts(): void {
+    if (!connection.open) return;
+    connection.send({ type: "getGoalDrafts" });
+  }
+
+  openDraft(path: string): void {
+    this.draftPath = path;
+    this.draft = null;
+    this.draftError = null;
+    writeDraftPath(path);
+    if (connection.open) connection.send({ type: "getGoalDraft", path });
+  }
+
+  clearDraft(): void {
+    this.draftPath = null;
+    this.draft = null;
+    this.draftError = null;
+    writeDraftPath(null);
+  }
+
+  startDraft(): void {
+    const path = this.draftPath;
+    if (path === null || this.draftRunning) return;
+    this.draftError = null;
+    connection.send({ type: "startGoalDraft", path });
+  }
+
+  stopDraft(): void {
+    if (!this.draftRunning) return;
+    connection.send({ type: "stopGoalDraft" });
+  }
+
+  submitDraftAnswer(value: string): void {
+    const question = this.draftRun?.question ?? null;
+    if (question === null || value.trim().length === 0) return;
+    connection.send({ type: "answerGoalDraft", id: question.id, value: value.trim() });
+  }
+
+  get canStart(): boolean {
+    return connection.open && !this.enabled;
+  }
+
+  get canPause(): boolean {
+    return this.enabled && !this.paused && this.lifecycle !== "pausing";
+  }
+
+  get canResume(): boolean {
+    return this.enabled && this.paused && this.lifecycle !== "stopped";
+  }
+
+  get canStop(): boolean {
+    return this.enabled;
+  }
+
+  get canCheck(): boolean {
+    return this.enabled && !this.paused;
+  }
+
+  start(): void {
+    connection.send({ type: "startIssues" });
+  }
+
+  pause(): void {
+    connection.send({ type: "pauseIssues" });
+  }
+
+  resume(): void {
+    connection.send({ type: "resumeIssues" });
+  }
+
+  stop(): void {
+    connection.send({ type: "stopIssues" });
+  }
+
+  check(): void {
+    connection.send({ type: "checkIssues" });
+  }
+
+  canClose(number: number): boolean {
+    return connection.open && !this.closing.includes(number);
+  }
+
+  /** Closes one issue on the tracker as not planned. */
+  closeIssue(number: number): void {
+    if (!Number.isInteger(number) || number <= 0) return;
+    if (!this.canClose(number)) return;
+    this.closing = [...this.closing, number];
+    if (!connection.send({ type: "closeIssue", number })) {
+      this.closing = this.closing.filter((entry) => entry !== number);
+    }
+  }
+
+  submitAgentAnswer(runId: string, questionId: number | string, value: string): void {
+    if (value.trim().length === 0) return;
+    connection.send({
+      type: "answerIssues",
+      id: questionId,
+      value: value.trim(),
+      runId,
+    });
+  }
+
+  /**
+   * Requests one run's history. The selection and the requested marker move
+   * only after the frame reaches the socket, so a rejected send leaves loadRun
+   * free to retry instead of claiming a request that never happened.
+   */
+  openRun(runId: string): void {
+    if (!connection.send({ type: "getIssuesRun", runId })) return;
+    this.selectedRun = runId;
+    this.requestedRun = runId;
+    this.run = null;
+    this.runError = null;
+  }
+
+  /** Fetches one run's history once unless it is already selected. */
+  loadRun(runId: string): void {
+    if (this.requestedRun === runId && (this.run?.runId === runId || this.selectedRun === runId)) {
+      return;
+    }
+    this.openRun(runId);
+  }
+
+  closeRun(): void {
+    this.selectedRun = null;
+    this.requestedRun = null;
+    this.run = null;
+  }
+
+  handleEvent(message: Record<string, unknown>): void {
+    if (isSnapshot(message)) {
+      const next = message as unknown as IssuesSnapshot;
+      this.snapshot = next;
+      const live = new Set((next.agents ?? []).map((agent) => agent.runId));
+      const kept: Record<string, string[]> = {};
+      for (const [runId, lines] of Object.entries(this.agentActivity)) {
+        if (live.has(runId)) kept[runId] = lines;
+      }
+      this.agentActivity = kept;
+      const open = new Set((next.queue ?? []).map((issue) => issue.number));
+      this.closing = this.closing.filter((number) => open.has(number));
+      return;
+    }
+    if (message.type === "issuesActivity" && typeof message.runId === "string") {
+      const runId = message.runId;
+      const entries = Array.isArray(message.entries) ? message.entries.filter(isEntry) : [];
+      if (!(this.snapshot?.agents ?? []).some((agent) => agent.runId === runId)) return;
+      this.agentActivity = {
+        ...this.agentActivity,
+        [runId]: applyActivity(this.agentActivity[runId] ?? [], entries, message.replay === true),
+      };
+      return;
+    }
+    if (message.type === "issuesRun" && isObject(message.run)) {
+      const run = message.run as unknown as IssuesRunDetail;
+      if (typeof run.runId === "string" && Array.isArray(run.activityLines)) {
+        this.run = run;
+        this.runError = null;
+        this.selectedRun = run.runId;
+      }
+      return;
+    }
+    if (message.type === "issuesClosed" && typeof message.number === "number") {
+      const number = message.number;
+      // A successful closure stays pending until the queue no longer lists the
+      // issue, so a paused or stopped worker cannot invite a duplicate call.
+      if (message.ok === true) {
+        notifications.push("success", `Closed issue #${number}.`);
+      } else {
+        this.closing = this.closing.filter((entry) => entry !== number);
+        if (typeof message.message === "string") notifications.push("error", message.message);
+      }
+      return;
+    }
+    if (message.type === "error" && message.message === "No such issues run.") {
+      this.runError = "No such issues run.";
+      return;
+    }
+    if (message.type === "issuesDrafts" && Array.isArray(message.drafts)) {
+      const drafts = (message.drafts as GoalDraftSummary[]).filter(
+        (draft) => typeof draft?.path === "string" && typeof draft?.name === "string",
+      );
+      this.drafts = drafts.sort((left, right) =>
+        left.name < right.name ? -1 : left.name > right.name ? 1 : 0,
+      );
+      const known = new Set(drafts.map((draft) => draft.path));
+      if (this.draftPath !== null && !known.has(this.draftPath)) {
+        this.clearDraft();
+      }
+      return;
+    }
+    if (message.type === "issuesDraftState" && isObject(message.draft)) {
+      const run = message.draft as unknown as GoalDraftRun;
+      if (typeof run.status !== "string") return;
+      this.draftRun = {
+        ...run,
+        activity: Array.isArray(run.activity) ? run.activity : [],
+        question: (run.question ?? null) as GoalDraftRun["question"],
+      };
+      if (run.status === "running") this.draftError = null;
+      return;
+    }
+    if (message.type === "issuesDraftDetail" && isObject(message.draft)) {
+      const draft = message.draft as unknown as GoalDraftDetail;
+      if (typeof draft.path === "string" && typeof draft.text === "string") {
+        this.draft = draft;
+        this.draftPath = draft.path;
+        writeDraftPath(draft.path);
+        this.draftError = null;
+      }
+      return;
+    }
+    if (message.type === "issuesDraftError" && typeof message.message === "string") {
+      // A stored path whose draft is gone opens the list instead of an error.
+      if (this.draft === null && this.draftPath !== null && message.message.startsWith("No draft at")) {
+        this.clearDraft();
+        return;
+      }
+      this.draftError = message.message;
+    }
+  }
+}
+
+export const issues = new IssuesStore();

package/client/lib/layout.svelte.ts

@@ -0,0 +1,234 @@
+import type { Mode, Theme } from "./types";
+
+export interface WorkspaceTab {
+  id: string;
+  kind: string;
+  resourceId: string;
+  title: string;
+}
+
+interface LayoutSnapshot {
+  version: 1;
+  mode: Mode;
+  theme: Theme;
+  tabs: Record<Mode, WorkspaceTab[]>;
+  activeTab: Record<Mode, string | null>;
+}
+
+export const LAYOUT_KEY = "devboard.layout.v1";
+export const THEME_KEY = "devboard.theme";
+export const PANE_KEY_PREFIX = "paneforge:";
+
+const MODES: Mode[] = ["goal", "issues", "flow", "discover"];
+
+function defaultTab(mode: Mode): WorkspaceTab {
+  return {
+    id: "overview",
+    kind: "overview",
+    resourceId: "overview",
+    title: mode === "goal" ? "Implementation" : "Overview",
+  };
+}
+
+export function defaultTabs(): Record<Mode, WorkspaceTab[]> {
+  return {
+    goal: [defaultTab("goal")],
+    issues: [defaultTab("issues")],
+    flow: [defaultTab("flow")],
+    discover: [defaultTab("discover")],
+  };
+}
+
+function defaultActive(): Record<Mode, string | null> {
+  return { goal: "overview", issues: "overview", flow: "overview", discover: "overview" };
+}
+
+function isMode(value: unknown): value is Mode {
+  return value === "goal" || value === "issues" || value === "flow" || value === "discover";
+}
+
+function validTab(value: unknown): value is WorkspaceTab {
+  if (typeof value !== "object" || value === null) return false;
+  const tab = value as Record<string, unknown>;
+  return (
+    typeof tab.id === "string" &&
+    typeof tab.kind === "string" &&
+    typeof tab.resourceId === "string" &&
+    typeof tab.title === "string"
+  );
+}
+
+/** A tab a previous revision could persist but this one no longer renders. */
+function normalizeTab(mode: Mode, tab: WorkspaceTab): WorkspaceTab {
+  if (mode === "flow" && tab.id === "flow-goal") return defaultTab("flow");
+  if (mode === "issues" && tab.kind === "issues") {
+    return { ...tab, kind: "queue", id: "issues" };
+  }
+  if (mode === "discover" && tab.kind === "term") {
+    return { id: "glossary", kind: "glossary", resourceId: "glossary", title: "Glossary" };
+  }
+  if (mode === "goal" && tab.id === "overview") return { ...tab, title: "Implementation" };
+  return tab;
+}
+
+function readSnapshot(): LayoutSnapshot | null {
+  try {
+    const raw = localStorage.getItem(LAYOUT_KEY);
+    if (raw === null) return null;
+    const parsed: unknown = JSON.parse(raw);
+    if (typeof parsed !== "object" || parsed === null) return null;
+    const snapshot = parsed as Record<string, unknown>;
+    if (!isMode(snapshot.mode)) return null;
+    const tabs = snapshot.tabs as Record<string, unknown> | undefined;
+    const active = snapshot.activeTab as Record<string, unknown> | undefined;
+    if (tabs === undefined || active === undefined) return null;
+    const nextTabs = defaultTabs();
+    const nextActive = defaultActive();
+    for (const mode of MODES) {
+      const list = tabs[mode];
+      if (Array.isArray(list)) {
+        const clean = list.filter(validTab);
+        const id = active[mode];
+        const chosen = clean.find((tab) => tab.id === id) ?? clean[0];
+        if (chosen !== undefined) {
+          const restored = normalizeTab(mode, chosen);
+          nextTabs[mode] = [restored];
+          nextActive[mode] = restored.id;
+        }
+      }
+    }
+    const theme: Theme = snapshot.theme === "light" ? "light" : "dark";
+    return {
+      version: 1,
+      mode: snapshot.mode,
+      theme,
+      tabs: nextTabs,
+      activeTab: nextActive,
+    };
+  } catch {
+    return null;
+  }
+}
+
+export class LayoutStore {
+  mode = $state<Mode>("goal");
+  theme = $state<Theme>("dark");
+  tabs = $state<Record<Mode, WorkspaceTab[]>>(defaultTabs());
+  activeTab = $state<Record<Mode, string | null>>(defaultActive());
+  /** Bumping the epoch remounts PaneForge groups so stored split sizes are gone. */
+  epoch = $state(0);
+
+  constructor() {
+    const snapshot = readSnapshot();
+    if (snapshot !== null) {
+      this.mode = snapshot.mode;
+      this.theme = snapshot.theme;
+      this.tabs = snapshot.tabs;
+      this.activeTab = snapshot.activeTab;
+    } else {
+      try {
+        const stored = localStorage.getItem(THEME_KEY);
+        if (stored === "light" || stored === "dark") this.theme = stored;
+      } catch {
+        // A blocked localStorage leaves the dark default.
+      }
+    }
+  }
+
+  get activeTabId(): string | null {
+    return this.activeTab[this.mode];
+  }
+
+  get activeWorkspaceTab(): WorkspaceTab | null {
+    const id = this.activeTab[this.mode];
+    return this.tabs[this.mode].find((tab) => tab.id === id) ?? null;
+  }
+
+  tab(mode: Mode, id: string): WorkspaceTab | null {
+    return this.tabs[mode].find((tab) => tab.id === id) ?? null;
+  }
+
+  setMode(mode: Mode): void {
+    this.mode = mode;
+  }
+
+  setTheme(theme: Theme): void {
+    this.theme = theme;
+    applyTheme(theme);
+    try {
+      localStorage.setItem(THEME_KEY, theme);
+    } catch {
+      // The theme still applies for this session.
+    }
+  }
+
+  toggleTheme(): void {
+    this.setTheme(this.theme === "dark" ? "light" : "dark");
+  }
+
+  /** One surface per mode: opening a tab replaces the visible page. */
+  openTab(mode: Mode, tab: WorkspaceTab, activate = true): void {
+    this.tabs[mode] = [tab];
+    if (activate) this.activeTab[mode] = tab.id;
+  }
+
+  activateTab(mode: Mode, id: string): void {
+    if (!this.tabs[mode].some((tab) => tab.id === id)) return;
+    this.activeTab[mode] = id;
+  }
+
+  /** Removes a tab and returns the new active id so callers can move focus. */
+  closeTab(mode: Mode, id: string): string | null {
+    const list = this.tabs[mode];
+    const index = list.findIndex((tab) => tab.id === id);
+    if (index < 0) return this.activeTab[mode];
+    const remaining = list.filter((tab) => tab.id !== id);
+    this.tabs[mode] = remaining;
+    if (this.activeTab[mode] === id) {
+      const next = remaining[Math.min(index, remaining.length - 1)] ?? null;
+      this.activeTab[mode] = next?.id ?? null;
+    }
+    return this.activeTab[mode];
+  }
+
+  reset(): void {
+    try {
+      for (const key of Object.keys(localStorage)) {
+        if (key.startsWith(PANE_KEY_PREFIX)) localStorage.removeItem(key);
+      }
+      localStorage.removeItem(LAYOUT_KEY);
+    } catch {
+      // Reset still resets the in-memory layout.
+    }
+    this.mode = "goal";
+    this.tabs = defaultTabs();
+    this.activeTab = defaultActive();
+    this.setTheme("dark");
+    this.epoch += 1;
+  }
+
+  serialize(): LayoutSnapshot {
+    return {
+      version: 1,
+      mode: this.mode,
+      theme: this.theme,
+      tabs: this.tabs,
+      activeTab: this.activeTab,
+    };
+  }
+
+  persist(): void {
+    try {
+      localStorage.setItem(LAYOUT_KEY, JSON.stringify(this.serialize()));
+    } catch {
+      // Layout persistence is best effort; the session keeps working.
+    }
+  }
+}
+
+export function applyTheme(theme: Theme): void {
+  document.documentElement.dataset.theme = theme;
+  document.documentElement.style.colorScheme = theme;
+}
+
+export const layout = new LayoutStore();