706 lines · 28.5 KB · TypeScript
RawDownload
/** * Thread-scoped right-panel surface state. * * This is intentionally a shallow workspace model: it owns an ordered set of * surface descriptors and the active surface, while each feature continues to * own its durable resource state. Browser surfaces point at preview tab ids, * terminal surfaces point at terminal session ids, file surfaces point at * workspace paths, and diff/files remain singleton surfaces. */import { scopedThreadKey } from "@t3tools/client-runtime/environment";import type { ScopedThreadRef } from "@t3tools/contracts";import { create } from "zustand";import { createJSONStorage, persist } from "zustand/middleware"; import { resolveStorage } from "./lib/storage"; export const RIGHT_PANEL_KINDS = [  "diff",  "files",  "file",  "preview",  "terminal",  "pull-request",  "agents",] as const;export type RightPanelKind = (typeof RIGHT_PANEL_KINDS)[number]; export type RightPanelSurface =  | { id: `browser:${string}`; kind: "preview"; resourceId: string }  | { id: "browser:new"; kind: "preview"; resourceId: null }  | {      id: `terminal:${string}`;      kind: "terminal";      resourceId: string;      terminalIds: string[];      activeTerminalId: string;      splitDirection?: "horizontal" | "vertical";    }  | { id: "diff"; kind: "diff" }  | { id: "files"; kind: "files" }  | {      id: `file:${string}`;      kind: "file";      relativePath: string;      revealLine: number | null;      revealRequestId: number;    }  | {      /**       * A change request opened beside a thread or in the pull-request list's shared panel.       * The reference lives in the id so several pull requests can remain open as peer tabs.       */      id: `pull-request:${string}`;      kind: "pull-request";      /**       * Which server the change request was read from. The list spans every connected one, so       * two of them can hold the same project id; a panel beside a thread leaves this out and       * takes the environment from its own ref.       */      environmentId?: string;      projectId: string;      repository: string;      number: number;    }  | { id: "agents"; kind: "agents" }; const RIGHT_PANEL_STORAGE_KEY = "t3code:right-panel-state:v2";// v9 removed the "plan" surface kind (plans render inline in the transcript).// v10 keys pull-request surfaces by reference instead of a singleton tab.// v11 stops persisting the pull-request list's shared panel, so a restart opens the page fresh.const RIGHT_PANEL_STORAGE_VERSION = 11; /** * The pull-request list's shared panel (see PULL_REQUESTS_PANEL_ID in the route) is session * state: reopening the app should show the list, not last session's tabs and detail fetches. */const isPullRequestsPanelKey = (threadKey: string) => threadKey.endsWith(":pull-requests-panel"); export interface ThreadRightPanelState {  isOpen: boolean;  activeSurfaceId: string | null;  surfaces: RightPanelSurface[];} interface RightPanelStoreState {  byThreadKey: Record<string, ThreadRightPanelState>;  open: (    ref: ScopedThreadRef,    kind: Exclude<RightPanelKind, "file" | "terminal" | "pull-request">,  ) => void;  openBrowser: (ref: ScopedThreadRef, tabId: string | null) => void;  openFile: (ref: ScopedThreadRef, relativePath: string, line?: number) => void;  openPullRequest: (    ref: ScopedThreadRef,    target: { environmentId?: string; projectId: string; repository: string; number: number },  ) => void;  openTerminal: (ref: ScopedThreadRef, terminalId: string) => void;  splitTerminal: (    ref: ScopedThreadRef,    surfaceId: string,    terminalId: string,    direction?: "horizontal" | "vertical",  ) => void;  activateTerminal: (ref: ScopedThreadRef, surfaceId: string, terminalId: string) => void;  closeTerminal: (ref: ScopedThreadRef, surfaceId: string, terminalId: string) => void;  activateSurface: (ref: ScopedThreadRef, surfaceId: string) => void;  closeSurface: (ref: ScopedThreadRef, surfaceId: string) => void;  closeOtherSurfaces: (ref: ScopedThreadRef, surfaceId: string) => void;  closeSurfacesToRight: (ref: ScopedThreadRef, surfaceId: string) => void;  closeAllSurfaces: (ref: ScopedThreadRef) => void;  reconcileBrowserSurfaces: (ref: ScopedThreadRef, tabIds: readonly string[]) => void;  reconcileFileSurfaces: (ref: ScopedThreadRef, workspaceAvailable: boolean) => void;  show: (ref: ScopedThreadRef) => void;  close: (ref: ScopedThreadRef) => void;  toggleVisibility: (ref: ScopedThreadRef) => void;  toggle: (    ref: ScopedThreadRef,    kind: Exclude<RightPanelKind, "file" | "terminal" | "pull-request">,  ) => void;  removeThread: (ref: ScopedThreadRef) => void;} const EMPTY_THREAD_STATE: ThreadRightPanelState = {  isOpen: false,  activeSurfaceId: null,  surfaces: [],}; const singletonSurface = (  kind: Exclude<RightPanelKind, "file" | "preview" | "terminal" | "pull-request">,): RightPanelSurface => {  switch (kind) {    case "diff":      return { id: "diff", kind };    case "files":      return { id: "files", kind };    case "agents":      return { id: "agents", kind };  }}; const browserSurface = (tabId: string | null): RightPanelSurface =>  tabId    ? { id: `browser:${tabId}`, kind: "preview", resourceId: tabId }    : { id: "browser:new", kind: "preview", resourceId: null }; const fileSurface = (  relativePath: string,  revealLine: number | null,  revealRequestId: number,): RightPanelSurface => ({  id: `file:${relativePath}`,  kind: "file",  relativePath,  revealLine,  revealRequestId,}); const terminalSurface = (terminalId: string): RightPanelSurface => ({  id: `terminal:${terminalId}`,  kind: "terminal",  resourceId: terminalId,  terminalIds: [terminalId],  activeTerminalId: terminalId,}); export type PullRequestSurface = Extract<RightPanelSurface, { kind: "pull-request" }>; export function pullRequestSurfaceId(target: {  environmentId?: string;  projectId: string;  repository: string;  number: number;}): PullRequestSurface["id"] {  // The environment leads the id where there is one, so the same change request read from two  // servers is two tabs rather than one tab that changes its mind about which server it is on.  const scope =    target.environmentId === undefined ? "" : `${encodeURIComponent(target.environmentId)}:`;  return `pull-request:${scope}${encodeURIComponent(target.projectId)}:${encodeURIComponent(target.repository)}:${target.number}`;} export function pullRequestSurface(target: {  environmentId?: string;  projectId: string;  repository: string;  number: number;}): PullRequestSurface {  return {    id: pullRequestSurfaceId(target),    kind: "pull-request",    ...(target.environmentId === undefined ? {} : { environmentId: target.environmentId }),    projectId: target.projectId,    repository: target.repository,    number: target.number,  };} /** * A pull-request tab's status map with one entry set. Keyed by the surface the panel is showing * rather than by a key rebuilt from the status, so the tab is found again whether or not that * surface was opened with an environment on it. Returns the same map when the tab's own fields * have not changed, so a caller can skip a re-render. */export function updatePullRequestTabStatus<Status extends { state: unknown; isDraft: boolean }>(  statuses: Readonly<Record<string, Status>>,  surfaceId: string,  status: Status,): Readonly<Record<string, Status>> {  return statuses[surfaceId]?.state === status.state &&    statuses[surfaceId]?.isDraft === status.isDraft    ? statuses    : { ...statuses, [surfaceId]: status };} const upsertSurface = (  current: ThreadRightPanelState,  surface: RightPanelSurface,  activate = true,): ThreadRightPanelState => ({  isOpen: true,  surfaces: current.surfaces.some((entry) => entry.id === surface.id)    ? current.surfaces    : [...current.surfaces, surface],  activeSurfaceId: activate ? surface.id : current.activeSurfaceId,}); const updateThread = (  byThreadKey: Record<string, ThreadRightPanelState>,  threadKey: string,  updater: (current: ThreadRightPanelState) => ThreadRightPanelState,): Record<string, ThreadRightPanelState> => {  const current = byThreadKey[threadKey] ?? EMPTY_THREAD_STATE;  const next = updater(current);  if (!next.isOpen && next.activeSurfaceId === null && next.surfaces.length === 0) {    if (!(threadKey in byThreadKey)) return byThreadKey;    const { [threadKey]: _removed, ...rest } = byThreadKey;    return rest;  }  if (next === current) return byThreadKey;  return { ...byThreadKey, [threadKey]: next };}; function normalizeRevealLine(line: number | undefined): number | null {  if (line === undefined || !Number.isFinite(line)) return null;  return Math.max(1, Math.trunc(line));} export function migratePersistedRightPanelState(persistedState: unknown): {  byThreadKey: Record<string, ThreadRightPanelState>;} {  if (!persistedState || typeof persistedState !== "object") {    return { byThreadKey: {} };  }  const byThreadKey =    "byThreadKey" in persistedState &&    persistedState.byThreadKey &&    typeof persistedState.byThreadKey === "object"      ? Object.fromEntries(          Object.entries(persistedState.byThreadKey as Record<string, ThreadRightPanelState>)            .filter(([threadKey]) => !isPullRequestsPanelKey(threadKey))            .map(([threadKey, threadState]) => {              const validThreadState =                threadState && typeof threadState === "object" ? threadState : null;              const surfaces = Array.isArray(validThreadState?.surfaces)                ? validThreadState.surfaces.flatMap<RightPanelSurface>((surface) => {                    // Dropped surface kind: plans now render inline in the                    // transcript (v9).                    if ((surface as { kind?: string }).kind === "plan") return [];                    if (surface.kind === "file") {                      const revealLine =                        typeof surface.revealLine === "number" &&                        Number.isFinite(surface.revealLine)                          ? Math.max(1, Math.trunc(surface.revealLine))                          : null;                      const revealRequestId =                        typeof surface.revealRequestId === "number" &&                        Number.isSafeInteger(surface.revealRequestId) &&                        surface.revealRequestId >= 0                          ? surface.revealRequestId                          : 0;                      return [{ ...surface, revealLine, revealRequestId }];                    }                    if (surface.kind === "pull-request") {                      if (                        typeof surface.projectId !== "string" ||                        typeof surface.repository !== "string" ||                        typeof surface.number !== "number" ||                        !Number.isSafeInteger(surface.number) ||                        surface.number < 1                      ) {                        return [];                      }                      const { environmentId, ...rest } = surface;                      // Anything else stored under that name is not an environment.                      return [                        pullRequestSurface({                          ...rest,                          ...(typeof environmentId === "string" ? { environmentId } : {}),                        }),                      ];                    }                    if (surface.kind !== "terminal") return [surface];                    if (                      !("resourceId" in surface) ||                      typeof surface.resourceId !== "string" ||                      surface.id !== `terminal:${surface.resourceId}`                    ) {                      return [];                    }                    const terminalIds =                      "terminalIds" in surface && Array.isArray(surface.terminalIds)                        ? [                            ...new Set(                              surface.terminalIds.filter(                                (terminalId): terminalId is string =>                                  typeof terminalId === "string",                              ),                            ),                          ]                        : [surface.resourceId];                    const activeTerminalId =                      "activeTerminalId" in surface &&                      typeof surface.activeTerminalId === "string" &&                      terminalIds.includes(surface.activeTerminalId)                        ? surface.activeTerminalId                        : (terminalIds[0] ?? surface.resourceId);                    return [                      {                        ...surface,                        terminalIds: terminalIds.length > 0 ? terminalIds : [surface.resourceId],                        activeTerminalId,                      },                    ];                  })                : [];              const rawActiveSurfaceId = validThreadState?.activeSurfaceId;              const persistedActiveSurfaceId = surfaces.some(                (surface) => surface.id === rawActiveSurfaceId,              )                ? (rawActiveSurfaceId ?? null)                : rawActiveSurfaceId === "pull-request"                  ? (surfaces.find((surface) => surface.kind === "pull-request")?.id ?? null)                  : null;              // A migration that dropped every surface (e.g. plan-only panels              // in v9) must not reopen an empty panel.              const isOpen =                surfaces.length > 0 &&                (typeof validThreadState?.isOpen === "boolean"                  ? validThreadState.isOpen                  : persistedActiveSurfaceId !== null);              // An open panel needs an active surface: if migration dropped              // the persisted one (e.g. plan was active), fall back to the              // first survivor instead of rendering an open empty panel.              const activeSurfaceId =                persistedActiveSurfaceId ?? (isOpen ? (surfaces[0]?.id ?? null) : null);              return [threadKey, { isOpen, surfaces, activeSurfaceId }];            }),        )      : {};  return { byThreadKey };} export const useRightPanelStore = create<RightPanelStoreState>()(  persist(    (set) => ({      byThreadKey: {},      open: (ref, kind) =>        set((state) => ({          byThreadKey: updateThread(state.byThreadKey, scopedThreadKey(ref), (current) => {            if (kind === "preview") {              const existing = current.surfaces.find((surface) => surface.kind === "preview");              return upsertSurface(current, existing ?? browserSurface(null));            }            return upsertSurface(current, singletonSurface(kind));          }),        })),      openBrowser: (ref, tabId) =>        set((state) => ({          byThreadKey: updateThread(state.byThreadKey, scopedThreadKey(ref), (current) => {            const surface = browserSurface(tabId);            const withoutPlaceholder = tabId              ? current.surfaces.filter((entry) => entry.id !== "browser:new")              : current.surfaces;            return upsertSurface({ ...current, surfaces: withoutPlaceholder }, surface);          }),        })),      openPullRequest: (ref, target) =>        set((state) => ({          byThreadKey: updateThread(state.byThreadKey, scopedThreadKey(ref), (current) => {            return upsertSurface(current, pullRequestSurface(target));          }),        })),      openFile: (ref, relativePath, line) =>        set((state) => ({          byThreadKey: updateThread(state.byThreadKey, scopedThreadKey(ref), (current) => {            const withoutStandaloneExplorer = current.surfaces.filter(              (surface) => surface.kind !== "files",            );            const surfaceId = `file:${relativePath}` as const;            const existing = withoutStandaloneExplorer.find(              (surface): surface is Extract<RightPanelSurface, { kind: "file" }> =>                surface.id === surfaceId && surface.kind === "file",            );            const surface = fileSurface(              relativePath,              normalizeRevealLine(line),              (existing?.revealRequestId ?? 0) + 1,            );            return {              isOpen: true,              activeSurfaceId: surface.id,              surfaces: existing                ? withoutStandaloneExplorer.map((entry) =>                    entry.id === surface.id ? surface : entry,                  )                : [...withoutStandaloneExplorer, surface],            };          }),        })),      openTerminal: (ref, terminalId) =>        set((state) => ({          byThreadKey: updateThread(state.byThreadKey, scopedThreadKey(ref), (current) =>            upsertSurface(current, terminalSurface(terminalId)),          ),        })),      splitTerminal: (ref, surfaceId, terminalId, direction = "horizontal") =>        set((state) => ({          byThreadKey: updateThread(state.byThreadKey, scopedThreadKey(ref), (current) => ({            ...current,            isOpen: true,            activeSurfaceId: surfaceId,            surfaces: current.surfaces.map((surface) => {              if (surface.id !== surfaceId || surface.kind !== "terminal") return surface;              const { splitDirection: _splitDirection, ...baseSurface } = surface;              return {                ...baseSurface,                terminalIds: surface.terminalIds.includes(terminalId)                  ? surface.terminalIds                  : [...surface.terminalIds, terminalId],                activeTerminalId: terminalId,                ...(direction === "vertical" ? { splitDirection: "vertical" as const } : {}),              };            }),          })),        })),      activateTerminal: (ref, surfaceId, terminalId) =>        set((state) => ({          byThreadKey: updateThread(state.byThreadKey, scopedThreadKey(ref), (current) => ({            ...current,            activeSurfaceId: surfaceId,            surfaces: current.surfaces.map((surface) =>              surface.id === surfaceId &&              surface.kind === "terminal" &&              surface.terminalIds.includes(terminalId)                ? { ...surface, activeTerminalId: terminalId }                : surface,            ),          })),        })),      closeTerminal: (ref, surfaceId, terminalId) =>        set((state) => ({          byThreadKey: updateThread(state.byThreadKey, scopedThreadKey(ref), (current) => {            const surface = current.surfaces.find(              (entry) => entry.id === surfaceId && entry.kind === "terminal",            );            if (!surface || surface.kind !== "terminal") return current;            const terminalIds = surface.terminalIds.filter((id) => id !== terminalId);            if (terminalIds.length === 0) {              const index = current.surfaces.findIndex((entry) => entry.id === surfaceId);              const surfaces = current.surfaces.filter((entry) => entry.id !== surfaceId);              const fallback = surfaces[Math.min(index, surfaces.length - 1)] ?? null;              return {                ...current,                isOpen: surfaces.length > 0 && current.isOpen,                surfaces,                activeSurfaceId:                  current.activeSurfaceId === surfaceId                    ? (fallback?.id ?? null)                    : current.activeSurfaceId,              };            }            return {              ...current,              surfaces: current.surfaces.map((entry) =>                entry.id === surfaceId && entry.kind === "terminal"                  ? {                      ...entry,                      terminalIds,                      activeTerminalId:                        entry.activeTerminalId === terminalId                          ? (terminalIds.at(-1) ?? terminalIds[0]!)                          : entry.activeTerminalId,                    }                  : entry,              ),            };          }),        })),      activateSurface: (ref, surfaceId) =>        set((state) => ({

Lines 1–500 of 706.