@cueloop/client 0.1.0-alpha.92 → 0.1.0-alpha.93

package/src/use-changes-workbench.ts

@@ -7,13 +7,14 @@ import type { ProjectPanelMode } from "./components/AppShell";
 import type { LaunchLayout } from "./launch-layout";
 import {
   activateTab,
-  addTab,
   changesTab,
   closeTab,
   containsGroup,
-  fileTab,
   firstGroupId,
+  keepFileTab,
   makeGroup,
+  openChangesTab,
+  openFileTab,
   splitGroup,
   welcomeTab,
   type EditorNode,
@@ -73,9 +74,10 @@ export interface ChangesWorkbench {
   toggleZoom: () => void;
   focusGroup: (groupId: string) => void;
   activate: (groupId: string, tabId: string) => void;
+  keepTab: (groupId: string, tabId: string) => void;
   close: (groupId: string, tabId: string) => void;
   split: (groupId: string, direction: SplitDirection) => void;
-  openFile: (path: string, fileView: "diff" | "contents") => void;
+  openFile: (path: string, fileView: "diff" | "contents", persistent?: boolean) => void;
   /** Re-open defaults when the session changes: a diff opens the region in changed-files mode. */
   syncSession: (sessionId: string | undefined, isDiff: boolean) => void;
 }
@@ -121,16 +123,16 @@ export function useChangesWorkbench(options?: ChangesWorkbenchOptions): ChangesW
     }
   };
   const toggleChanges = (): void => {
-    if (projectMode === "changes") {
-      setChangesOpen(false);
-      setProjectMode("tree");
-      // never leave zoom on with the Changes editor gone - the Thread pane would stay hidden
-      setZoomed(false);
-    } else {
-      setChangesOpen(true);
-      setProjectOpen(true);
-      setProjectMode("changes");
-    }
+    setChangesOpen(true);
+    setProjectOpen(true);
+    setProjectMode("changes");
+    setGrid((tree) => {
+      const result = openChangesTab(tree, focusedGroup ?? firstGroupId(tree));
+
+      setFocusedGroup(result.focusGroupId);
+
+      return result.tree;
+    });
   };
   const toggleProject = (): void => {
     setProjectOpen(true);
@@ -160,13 +162,22 @@ export function useChangesWorkbench(options?: ChangesWorkbenchOptions): ChangesW
       return result.tree;
     });
   };
-  const openFile = (path: string, fileView: "diff" | "contents"): void => {
+  const openFile = (path: string, fileView: "diff" | "contents", persistent = false): void => {
     setProjectOpen(true);
     setChangesOpen(true);
-    const label = path.split("/").pop() ?? path;
-    setGrid((tree) =>
-      addTab(tree, focusedGroup ?? firstGroupId(tree), fileTab(label, path, fileView)),
-    );
+    setGrid((tree) => {
+      const result = openFileTab(
+        tree,
+        focusedGroup ?? firstGroupId(tree),
+        path,
+        fileView,
+        persistent,
+      );
+
+      setFocusedGroup(result.focusGroupId);
+
+      return result.tree;
+    });
   };
 
   return {
@@ -182,6 +193,7 @@ export function useChangesWorkbench(options?: ChangesWorkbenchOptions): ChangesW
     toggleZoom: () => setZoomed((value) => !value),
     focusGroup: setFocusedGroup,
     activate: (groupId, tabId) => setGrid((tree) => activateTab(tree, groupId, tabId)),
+    keepTab: (groupId, tabId) => setGrid((tree) => keepFileTab(tree, groupId, tabId)),
     close,
     split,
     openFile,

package/src/use-frame-measure.ts

@@ -8,6 +8,45 @@
 import { useEffect, useState } from "react";
 import { useRenderer } from "@opentui/react";
 
+type Renderer = NonNullable<ReturnType<typeof useRenderer>>;
+type Measure = () => void;
+
+interface FrameSubscriptions {
+  measures: Set<Measure>;
+  notify: Measure;
+}
+
+const subscribers = new WeakMap<Renderer, FrameSubscriptions>();
+
+export function subscribeToFrames(renderer: Renderer, measure: Measure): () => void {
+  let subscription = subscribers.get(renderer);
+
+  if (!subscription) {
+    const measures = new Set<Measure>();
+    const notify = (): void => {
+      for (const subscriber of measures) subscriber();
+    };
+
+    subscription = { measures, notify };
+    subscribers.set(renderer, subscription);
+    renderer.on("frame", notify);
+    renderer.on("resize", notify);
+  }
+
+  const { measures, notify } = subscription;
+
+  measures.add(measure);
+
+  return () => {
+    measures.delete(measure);
+    if (measures.size > 0) return;
+
+    renderer.off("frame", notify);
+    renderer.off("resize", notify);
+    subscribers.delete(renderer);
+  };
+}
+
 export function useFrameMeasure<T>(
   read: () => T,
   isEqual: (left: T, right: T) => boolean,
@@ -27,13 +66,7 @@ export function useFrameMeasure<T>(
     };
 
     measure();
-    renderer?.on("frame", measure);
-    renderer?.on("resize", measure);
-
-    return () => {
-      renderer?.off("frame", measure);
-      renderer?.off("resize", measure);
-    };
+    if (renderer) return subscribeToFrames(renderer, measure);
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [renderer, active]);
 

package/src/use-settings-dialog.tsx

@@ -4,7 +4,6 @@ import {
   persistActions,
   persistAutoClose,
   persistDiffView,
-  persistReviewSkill,
   persistReviewWorkspace,
   persistTheme,
   type AutoClose,
@@ -94,8 +93,6 @@ export function useSettingsDialog(params: {
   onSyncGithubIdentity: () => void;
   onRenameDisplayName: () => void;
   reviewSkill: string;
-  reviewSkillOptions: string[];
-  setReviewSkill: Dispatch<SetStateAction<string>>;
   reviewWorkspace: ReviewWorkspaceMode;
   setReviewWorkspace: Dispatch<SetStateAction<ReviewWorkspaceMode>>;
 }): SettingsDialogModel {
@@ -118,8 +115,6 @@ export function useSettingsDialog(params: {
     onSyncGithubIdentity,
     onRenameDisplayName,
     reviewSkill,
-    reviewSkillOptions,
-    setReviewSkill,
     reviewWorkspace,
     setReviewWorkspace,
   } = params;
@@ -210,8 +205,7 @@ export function useSettingsDialog(params: {
         {
           key: "reviewSkill",
           label: "Skill",
-          kind: "cycle",
-          options: reviewSkillOptions,
+          kind: "text",
         },
         {
           key: "reviewWorkspace",
@@ -281,12 +275,6 @@ export function useSettingsDialog(params: {
       onSyncGithubIdentity();
     } else if (rowKey === "displayName") {
       onRenameDisplayName();
-    } else if (rowKey === "reviewSkill") {
-      const current = Math.max(0, reviewSkillOptions.indexOf(reviewSkill));
-      const next = reviewSkillOptions[(current + 1) % reviewSkillOptions.length]!;
-
-      setReviewSkill(next);
-      persistReviewSkill(next);
     } else if (rowKey === "reviewWorkspace") {
       const next: ReviewWorkspaceMode = reviewWorkspace === "worktree" ? "current" : "worktree";
 

package/src/use-shared-keyboard.ts

@@ -0,0 +1,55 @@
+/** One keypress subscription per renderer, even when several editor tiles are mounted. */
+
+import { useEffect, useEffectEvent } from "react";
+import { useRenderer } from "@opentui/react";
+import type { KeyEvent } from "@opentui/core";
+
+type KeyInput = NonNullable<ReturnType<typeof useRenderer>>["keyInput"];
+type KeyHandler = (key: KeyEvent) => void;
+
+interface KeySubscriptions {
+  handlers: Set<KeyHandler>;
+  notify: KeyHandler;
+}
+
+const subscribers = new WeakMap<KeyInput, KeySubscriptions>();
+
+function subscribeToKeypress(input: KeyInput, handler: KeyHandler): () => void {
+  let subscription = subscribers.get(input);
+
+  if (!subscription) {
+    const handlers = new Set<KeyHandler>();
+    const notify = (key: KeyEvent): void => {
+      for (const subscriber of handlers) subscriber(key);
+    };
+
+    subscription = { handlers, notify };
+    subscribers.set(input, subscription);
+    input.on("keypress", notify);
+  }
+
+  const { handlers, notify } = subscription;
+
+  handlers.add(handler);
+
+  return () => {
+    handlers.delete(handler);
+    if (handlers.size > 0) return;
+
+    input.off("keypress", notify);
+    subscribers.delete(input);
+  };
+}
+
+export function useSharedKeyboard(handler: KeyHandler): void {
+  const renderer = useRenderer();
+  const stableHandler = useEffectEvent(handler);
+
+  useEffect(() => {
+    const input = renderer?.keyInput;
+
+    if (!input) return;
+
+    return subscribeToKeypress(input, stableHandler);
+  }, [renderer]);
+}

package/src/use-terminal-virtualizer.ts

@@ -12,6 +12,7 @@ import { useEffect, useLayoutEffect, useRef, useState, type RefObject } from "re
 import type { BoxRenderable, ScrollBoxRenderable } from "@opentui/core";
 import { useRenderer } from "@opentui/react";
 import { Virtualizer, type VirtualItem } from "@tanstack/virtual-core";
+import { subscribeToFrames } from "./use-frame-measure";
 
 export interface TerminalVirtualizerOptions {
   scrollbox: RefObject<ScrollBoxRenderable | null>;
@@ -29,6 +30,10 @@ export interface TerminalVirtualizer {
   measureRef: (index: number) => (renderable: BoxRenderable | null) => void | (() => void);
   /** Scroll the item into view; "auto" only scrolls when it is off screen. */
   scrollToIndex: (index: number, align?: "auto" | "start" | "center" | "end") => void;
+  /** Measured or estimated visual-row offset of an item. */
+  startOfIndex: (index: number) => number | undefined;
+  /** Move the native viewport to an exact visual-row offset. */
+  scrollToOffset: (offset: number) => void;
 }
 
 /** Visible rows and one-row scrolling for a held mouse mark at a viewport edge. */
@@ -150,9 +155,8 @@ export function useTerminalVirtualizer(options: TerminalVirtualizerOptions): Ter
   // render, and the callbacks only fire the core when the value actually changed
   const onFrame = (read: () => void): (() => void) => {
     read();
-    renderer?.on("frame", read);
 
-    return () => renderer?.off("frame", read);
+    return renderer ? subscribeToFrames(renderer, read) : () => {};
   };
 
   const coreOptions = () => ({
@@ -255,5 +259,7 @@ export function useTerminalVirtualizer(options: TerminalVirtualizerOptions): Ter
       };
     },
     scrollToIndex: (index, align = "auto") => virtualizer.scrollToIndex(index, { align }),
+    startOfIndex: (index) => virtualizer.getOffsetForIndex(index, "start")?.[0],
+    scrollToOffset: (offset) => virtualizer.scrollToOffset(offset, { align: "start" }),
   };
 }