@arbidocs/react 0.5.31 → 0.5.33

package/dist/{chunk-CIWI5UFT.js → chunk-VTNFF7P6.js}

@@ -3,10 +3,280 @@ import { OWN_SESSION_SLOT } from './chunk-DPYBZDJB.js';
 import { parseVersionRef } from './chunk-NNWMHMEC.js';
 import { useArbiHost, useArbi } from './chunk-MB34NKBZ.js';
 import { getUserEncryptionKeypair, sealedBoxDecrypt, sealedBoxEncrypt } from '@arbidocs/client';
-import { useSyncExternalStore, useMemo, useRef, useEffect } from 'react';
+import { useSyncExternalStore, useCallback, useMemo, useRef, useEffect } from 'react';
 import { useQuery, useMutation, useQueryClient, useInfiniteQuery, useQueries } from '@tanstack/react-query';
 import { ArbiApiError } from '@arbidocs/sdk/browser';
 
+// src/session/layout.ts
+var PANEL_MODES = ["main", "docked", "overlay", "popout"];
+var defaultPinned = () => typeof window === "undefined" || window.innerWidth >= 640;
+function defaultLayoutState() {
+  return {
+    shell: {
+      page: "home",
+      sidebar: { pinned: defaultPinned(), hovering: false, drawerOpen: false },
+      panels: { main: null, docked: null, overlay: null, popout: null, modes: {}, sizes: {} },
+      focusedArea: "main"
+    },
+    tabs: { dm: [], activeDm: null, dmMessageId: null, projects: [], activeProject: null },
+    views: { tabs: {}, filters: {}, values: {}, transient: {} },
+    grid: { states: {}, rowHeights: {}, labelWidths: {}, savedViews: {} }
+  };
+}
+var isRecord = (value) => typeof value === "object" && value !== null && !Array.isArray(value);
+var recordOf = (value, keep) => isRecord(value) ? Object.fromEntries(Object.entries(value).filter(([, v]) => keep(v))) : {};
+var isString = (v) => typeof v === "string";
+var isNumber = (v) => typeof v === "number" && Number.isFinite(v);
+var isAny = (v) => v !== void 0;
+var isMode = (v) => PANEL_MODES.includes(v);
+var isSize = (v) => isRecord(v) && isNumber(v.width) && isNumber(v.height);
+var isList = (v) => Array.isArray(v);
+var stringOrNull = (v) => isString(v) ? v : null;
+function parseSavedLayout(saved) {
+  if (!isRecord(saved) || saved.version !== 1) return null;
+  const shell = isRecord(saved.shell) ? saved.shell : {};
+  const panels = isRecord(shell.panels) ? shell.panels : {};
+  const views = isRecord(saved.views) ? saved.views : {};
+  const grid = isRecord(saved.grid) ? saved.grid : {};
+  const defaults = defaultLayoutState();
+  return {
+    version: 1,
+    migrated: isList(saved.migrated) ? saved.migrated.filter(isString) : [],
+    shell: {
+      page: isString(shell.page) ? shell.page : defaults.shell.page,
+      sidebarPinned: typeof shell.sidebarPinned === "boolean" ? shell.sidebarPinned : defaults.shell.sidebar.pinned,
+      panels: {
+        main: stringOrNull(panels.main),
+        docked: stringOrNull(panels.docked),
+        modes: recordOf(panels.modes, isMode),
+        sizes: recordOf(panels.sizes, isSize)
+      }
+    },
+    views: {
+      tabs: recordOf(views.tabs, isString),
+      filters: recordOf(views.filters, isAny),
+      values: recordOf(views.values, isAny)
+    },
+    grid: {
+      states: recordOf(grid.states, isRecord),
+      rowHeights: recordOf(grid.rowHeights, isNumber),
+      labelWidths: recordOf(grid.labelWidths, isNumber),
+      savedViews: recordOf(grid.savedViews, isList)
+    }
+  };
+}
+function savedLayoutOf(layout, migrated) {
+  const { shell, views, grid } = layout;
+  return {
+    version: 1,
+    migrated,
+    shell: {
+      page: shell.page,
+      sidebarPinned: shell.sidebar.pinned,
+      // A panel over the page or in its own window does not come back after a reload.
+      panels: {
+        main: shell.panels.main,
+        docked: shell.panels.docked,
+        modes: shell.panels.modes,
+        sizes: shell.panels.sizes
+      }
+    },
+    views: { tabs: views.tabs, filters: views.filters, values: views.values },
+    grid
+  };
+}
+function restoreLayout(current, saved) {
+  return {
+    ...current,
+    shell: {
+      ...current.shell,
+      page: saved.shell.page,
+      sidebar: { ...current.shell.sidebar, pinned: saved.shell.sidebarPinned },
+      panels: { ...current.shell.panels, ...saved.shell.panels }
+    },
+    views: { ...saved.views, transient: current.views.transient },
+    grid: saved.grid
+  };
+}
+function openPanelIn(panels, panelId, mode) {
+  const leave = (slot) => slot === panelId ? null : slot;
+  const next = {
+    ...panels,
+    main: leave(panels.main),
+    docked: leave(panels.docked),
+    overlay: leave(panels.overlay),
+    popout: leave(panels.popout),
+    modes: { ...panels.modes, [panelId]: mode }
+  };
+  if (mode === "docked") return { ...next, docked: panelId, overlay: null };
+  if (mode === "overlay") return { ...next, overlay: panelId, docked: null };
+  return { ...next, [mode]: panelId };
+}
+function closePanelIn(panels, panelId) {
+  const leave = (slot) => slot === panelId ? null : slot;
+  return {
+    ...panels,
+    main: leave(panels.main),
+    docked: leave(panels.docked),
+    overlay: leave(panels.overlay),
+    popout: leave(panels.popout)
+  };
+}
+function panelPlace(panels, panelId) {
+  return PANEL_MODES.find((mode) => panels[mode] === panelId) ?? null;
+}
+var isPanelOpen = (state, panelId) => panelPlace(state.shell.panels, panelId) !== null;
+var dmTabId = (tab) => tab.recipientId ?? "new";
+function createArbiLayoutStore({ persist } = {}) {
+  let layout = defaultLayoutState();
+  let migrated = [];
+  let isHydrated = !persist;
+  const listeners = /* @__PURE__ */ new Set();
+  const save = () => {
+    if (persist && isHydrated) persist.save(savedLayoutOf(layout, migrated));
+  };
+  const update = (next) => {
+    if (next === layout) return;
+    const persisted = next.views.tabs !== layout.views.tabs || next.views.filters !== layout.views.filters || next.views.values !== layout.views.values || next.grid !== layout.grid || next.shell.page !== layout.shell.page || next.shell.sidebar.pinned !== layout.shell.sidebar.pinned || next.shell.panels !== layout.shell.panels;
+    layout = next;
+    listeners.forEach((listener) => listener());
+    if (persisted) save();
+  };
+  const shell = (change) => update({ ...layout, shell: { ...layout.shell, ...change } });
+  const tabs = (change) => update({ ...layout, tabs: { ...layout.tabs, ...change } });
+  const views = (change) => update({ ...layout, views: { ...layout.views, ...change } });
+  const grid = (change) => update({ ...layout, grid: { ...layout.grid, ...change } });
+  const hydration = persist ? persist.load().then(
+    (saved) => {
+      const parsed = parseSavedLayout(saved);
+      if (parsed) {
+        migrated = parsed.migrated;
+        layout = restoreLayout(layout, parsed);
+      }
+      isHydrated = true;
+      listeners.forEach((listener) => listener());
+    },
+    () => {
+      isHydrated = true;
+      listeners.forEach((listener) => listener());
+    }
+  ) : Promise.resolve();
+  return {
+    getLayout: () => layout,
+    reset: () => update(defaultLayoutState()),
+    subscribe: (listener) => {
+      listeners.add(listener);
+      return () => listeners.delete(listener);
+    },
+    hydrated: () => hydration,
+    isHydrated: () => isHydrated,
+    setPage: (page) => {
+      if (layout.shell.page !== page || layout.shell.focusedArea !== "main")
+        shell({ page, focusedArea: "main" });
+    },
+    setSidebar: (change) => {
+      const sidebar = { ...layout.shell.sidebar, ...change };
+      const current = layout.shell.sidebar;
+      if (sidebar.pinned !== current.pinned || sidebar.hovering !== current.hovering || sidebar.drawerOpen !== current.drawerOpen)
+        shell({ sidebar });
+    },
+    openPanel: (panelId, mode) => shell({ panels: openPanelIn(layout.shell.panels, panelId, mode), focusedArea: panelId }),
+    closePanel: (panelId) => shell({ panels: closePanelIn(layout.shell.panels, panelId), focusedArea: "main" }),
+    setPanelMode: (panelId, mode) => {
+      const panels = layout.shell.panels;
+      if (panelPlace(panels, panelId) !== null)
+        shell({ panels: openPanelIn(panels, panelId, mode), focusedArea: panelId });
+      else if (panels.modes[panelId] !== mode)
+        shell({ panels: { ...panels, modes: { ...panels.modes, [panelId]: mode } } });
+    },
+    setPanelSize: (panelId, size) => {
+      const panels = layout.shell.panels;
+      shell({ panels: { ...panels, sizes: { ...panels.sizes, [panelId]: size } } });
+    },
+    setFocusedArea: (focusedArea) => {
+      if (layout.shell.focusedArea !== focusedArea) shell({ focusedArea });
+    },
+    openDmTab: (recipientId, messageId) => {
+      const id = recipientId ?? "new";
+      const dm = layout.tabs.dm.some((tab) => dmTabId(tab) === id) ? layout.tabs.dm : [...layout.tabs.dm, { recipientId }];
+      tabs({ dm, activeDm: id, ...messageId ? { dmMessageId: messageId } : {} });
+    },
+    closeDmTab: (tabId) => {
+      const dm = layout.tabs.dm.filter((tab) => dmTabId(tab) !== tabId);
+      if (dm.length === layout.tabs.dm.length) return;
+      if (dm.length === 0) return tabs({ dm, activeDm: null });
+      if (layout.tabs.activeDm !== tabId) return tabs({ dm });
+      const index = layout.tabs.dm.findIndex((tab) => dmTabId(tab) === tabId);
+      tabs({ dm, activeDm: dmTabId(dm[Math.min(index, dm.length - 1)]) });
+    },
+    selectDmTab: (activeDm) => {
+      if (layout.tabs.activeDm !== activeDm) tabs({ activeDm });
+    },
+    clearDmTabs: () => tabs({ dm: [], activeDm: null }),
+    setDmMessageId: (dmMessageId) => {
+      if (layout.tabs.dmMessageId !== dmMessageId) tabs({ dmMessageId });
+    },
+    openProjectTab: (projectId) => tabs({
+      projects: layout.tabs.projects.includes(projectId) ? layout.tabs.projects : [...layout.tabs.projects, projectId],
+      activeProject: projectId
+    }),
+    closeProjectTab: (projectId) => {
+      const projects = layout.tabs.projects.filter((id) => id !== projectId);
+      if (projects.length === layout.tabs.projects.length) return;
+      if (layout.tabs.activeProject !== projectId) return tabs({ projects });
+      const index = layout.tabs.projects.indexOf(projectId);
+      tabs({
+        projects,
+        activeProject: projects.length ? projects[Math.min(index, projects.length - 1)] : null
+      });
+    },
+    selectProjectTab: (activeProject) => {
+      if (layout.tabs.activeProject !== activeProject) tabs({ activeProject });
+    },
+    setPageTab: (page, tab) => {
+      if (layout.views.tabs[page] !== tab) views({ tabs: { ...layout.views.tabs, [page]: tab } });
+    },
+    setViewFilter: (key, value) => views({ filters: { ...layout.views.filters, [key]: value } }),
+    setViewValue: (key, value) => {
+      if (layout.views.values[key] !== value)
+        views({ values: { ...layout.views.values, [key]: value } });
+    },
+    setTransientView: (key, value) => {
+      if (layout.views.transient[key] === value) return;
+      const transient = { ...layout.views.transient };
+      if (value === void 0) delete transient[key];
+      else transient[key] = value;
+      views({ transient });
+    },
+    setGridState: (gridId, state) => grid({ states: { ...layout.grid.states, [gridId]: state } }),
+    clearGridState: (gridId) => {
+      if (!(gridId in layout.grid.states)) return;
+      const states = { ...layout.grid.states };
+      delete states[gridId];
+      grid({ states });
+    },
+    setGridRowHeight: (gridId, height) => grid({ rowHeights: { ...layout.grid.rowHeights, [gridId]: height } }),
+    setGridLabelWidth: (gridId, width) => grid({ labelWidths: { ...layout.grid.labelWidths, [gridId]: width } }),
+    setGridSavedViews: (gridId, saved) => grid({ savedViews: { ...layout.grid.savedViews, [gridId]: saved } }),
+    resetLayout: (variant) => {
+      const fresh = defaultLayoutState();
+      update({
+        shell: {
+          ...fresh.shell,
+          panels: {
+            ...fresh.shell.panels,
+            modes: layout.shell.panels.modes,
+            sizes: layout.shell.panels.sizes
+          }
+        },
+        tabs: fresh.tabs,
+        views: { ...layout.views, tabs: {}, transient: {} },
+        grid: variant === "logout" ? { ...layout.grid, states: {} } : layout.grid
+      });
+    }
+  };
+}
+
 // src/chat/run-state.ts
 var MIN_QUEUED_MESSAGE_VISIBILITY_MS = 800;
 var mapQueues = (queues, update) => Object.fromEntries(Object.entries(queues).map(([id, messages]) => [id, update(messages)]));
@@ -137,7 +407,8 @@ var EMPTY_SESSION_STATE = {
   agentChatOwners: {},
   newAgentChat: null,
   newChatDocumentId: null,
-  messageTimers: {}
+  messageTimers: {},
+  ...defaultLayoutState()
 };
 var selectViewingDocumentId = (state) => state.viewingDocument ? parseVersionRef(state.viewingDocument.id).docId : null;
 var conversationKey = (state) => state.conversationId ?? "new";
@@ -152,17 +423,28 @@ function nextViewingDocument(current, input) {
     passageId: input.passageId !== void 0 ? input.passageId : current?.passageId ?? null
   };
 }
+function layoutActionsOf(layout) {
+  const actions = { ...layout };
+  delete actions.getLayout;
+  delete actions.subscribe;
+  delete actions.hydrated;
+  delete actions.isHydrated;
+  delete actions.reset;
+  return actions;
+}
 function withoutNew(record) {
   const { new: _new, ...saved } = record;
   return saved;
 }
-function createArbiSessionStore(initial = {}, { draftStorage } = {}) {
-  let state = { ...EMPTY_SESSION_STATE, ...initial };
+function createArbiSessionStore(initial = {}, { draftStorage, persist } = {}) {
+  const layout = createArbiLayoutStore({ persist });
+  let state = { ...EMPTY_SESSION_STATE, ...layout.getLayout(), ...initial };
   const listeners = /* @__PURE__ */ new Set();
   const update = (patch) => {
     state = { ...state, ...patch };
     listeners.forEach((listener) => listener());
   };
+  layout.subscribe(() => update(layout.getLayout()));
   let preEdit = { draft: "", cursor: null };
   let draftsRestored = !draftStorage;
   let draftsOwner = draftStorage?.owner() ?? null;
@@ -206,6 +488,9 @@ function createArbiSessionStore(initial = {}, { draftStorage } = {}) {
     setDrafts(drafts);
   };
   return {
+    ...layoutActionsOf(layout),
+    layoutHydrated: () => layout.hydrated(),
+    isLayoutHydrated: () => layout.isHydrated(),
     getState: () => state,
     subscribe: (listener) => {
       listeners.add(listener);
@@ -597,6 +882,18 @@ function useArbiSessionState(selector) {
   const select = () => selector(store.getState());
   return useSyncExternalStore(store.subscribe, select, select);
 }
+function useSessionView(key, fallback) {
+  const store = useArbiSessionStore();
+  const value = useArbiSessionState((state) => state.views.values[key]);
+  const set = useCallback((next) => store.setViewValue(key, next), [store, key]);
+  return [value === void 0 ? fallback : value, set];
+}
+function useTransientView(key, fallback) {
+  const store = useArbiSessionStore();
+  const value = useArbiSessionState((state) => state.views.transient[key]);
+  const set = useCallback((next) => store.setTransientView(key, next), [store, key]);
+  return [value === void 0 ? fallback : value, set];
+}
 var SIGNED_OUT = {
   status: "signed-out",
   user: null,
@@ -627,6 +924,108 @@ function useSignedInSession(session) {
   );
 }
 
+// src/session/persist.ts
+function createDebouncedWriter({
+  write,
+  delayMs,
+  maxWaitMs,
+  onError
+}) {
+  const queue = /* @__PURE__ */ new Map();
+  const run = (key, value) => {
+    try {
+      void Promise.resolve(write(key, value)).catch((error) => onError?.(key, error));
+    } catch (error) {
+      onError?.(key, error);
+    }
+  };
+  const flush = (key) => {
+    const entry = queue.get(key);
+    if (!entry) return;
+    clearTimeout(entry.timer);
+    queue.delete(key);
+    run(key, entry.value);
+  };
+  return {
+    schedule(key, value) {
+      const now = Date.now();
+      const existing = queue.get(key);
+      if (existing) clearTimeout(existing.timer);
+      const firstQueuedAt = existing?.firstQueuedAt ?? now;
+      const wait = Math.max(0, Math.min(delayMs, firstQueuedAt + maxWaitMs - now));
+      queue.set(key, { value, firstQueuedAt, timer: setTimeout(() => flush(key), wait) });
+    },
+    pending: (key) => queue.get(key)?.value,
+    cancel(key) {
+      const entry = queue.get(key);
+      if (!entry) return;
+      clearTimeout(entry.timer);
+      queue.delete(key);
+    },
+    flushAll() {
+      for (const key of Array.from(queue.keys())) flush(key);
+    }
+  };
+}
+function flushOnPageExit(writer) {
+  if (typeof window === "undefined" || typeof document === "undefined") return () => {
+  };
+  const flush = () => writer.flushAll();
+  const onVisibility = () => {
+    if (document.visibilityState === "hidden") writer.flushAll();
+  };
+  window.addEventListener("beforeunload", flush);
+  window.addEventListener("pagehide", flush);
+  document.addEventListener("visibilitychange", onVisibility);
+  return () => {
+    window.removeEventListener("beforeunload", flush);
+    window.removeEventListener("pagehide", flush);
+    document.removeEventListener("visibilitychange", onVisibility);
+  };
+}
+function createStoragePersist({
+  storage,
+  key,
+  parse = (saved) => saved,
+  migrate,
+  delayMs = 250,
+  maxWaitMs = 1e3
+}) {
+  const writer = createDebouncedWriter({
+    write: (k, value) => storage.set(k, value),
+    delayMs,
+    maxWaitMs,
+    onError: (k, error) => console.error(`[session] Failed to save ${k}:`, error)
+  });
+  flushOnPageExit(writer);
+  const read = async () => {
+    const pending = writer.pending(key);
+    const raw = pending ?? await storage.get(key);
+    if (raw === null || raw === void 0) return null;
+    return parse(JSON.parse(raw));
+  };
+  return {
+    async load() {
+      try {
+        const saved = await read();
+        if (!migrate) return saved;
+        const migrated = await migrate(saved);
+        if (migrated !== null && migrated !== saved)
+          await storage.set(key, JSON.stringify(migrated));
+        return migrated;
+      } catch (error) {
+        console.warn("[session] The saved layout could not be read; starting from defaults", error);
+        return null;
+      }
+    },
+    save: (value) => writer.schedule(key, JSON.stringify(value)),
+    async clear() {
+      writer.cancel(key);
+      await storage.remove(key);
+    }
+  };
+}
+
 // src/usage-metered.ts
 function isUsageMetered(usage, subscription) {
   const empty = usage.total_spend === 0 && usage.total_tokens === 0 && usage.total_requests === 0;
@@ -1000,6 +1399,6 @@ function useUserUsageToday(options) {
   });
 }
 
-export { DEFAULT_DOCUMENT_VIEWER_STATE, EMPTY_SESSION_STATE, MAX_THREAD_TABS, MIN_QUEUED_MESSAGE_VISIBILITY_MS, PROJECT_CREATION_DENIED_REASON, agentControl, clearSealedDrafts, conversationKey, createArbiSessionStore, createSealedDraftStorage, isUsageMetered, nextViewingDocument, queuedMessages, selectDraft, selectIsGenerating, selectViewingDocumentId, threadTabId, useActivity, useAgents, useArbiSession, useArbiSessionState, useArbiSessionStore, useAssistantQuery, useAvailableModels, useBoxRole, useBuiltinCommands, useCanCreateProjects, useConfig, useConfigs, useConversationThreads, useConversations, useCurrentUser, useDeleteAgents, useDocumentVersionList, useFirmPool, useHealth, useMessageDetails, useParsedDocument, useProjectInvoices, useProjectUsage, useProjects, useProjectsUsage, useSignedInSession, useTags, useThumbnails, useTopUpFirmPool, useUserUsageToday, useWorkspaceActivity, useWorkspaces };
-//# sourceMappingURL=chunk-CIWI5UFT.js.map
-//# sourceMappingURL=chunk-CIWI5UFT.js.map
+export { DEFAULT_DOCUMENT_VIEWER_STATE, EMPTY_SESSION_STATE, MAX_THREAD_TABS, MIN_QUEUED_MESSAGE_VISIBILITY_MS, PROJECT_CREATION_DENIED_REASON, agentControl, clearSealedDrafts, closePanelIn, conversationKey, createArbiLayoutStore, createArbiSessionStore, createDebouncedWriter, createSealedDraftStorage, createStoragePersist, defaultLayoutState, dmTabId, flushOnPageExit, isPanelOpen, isUsageMetered, layoutActionsOf, nextViewingDocument, openPanelIn, panelPlace, parseSavedLayout, queuedMessages, restoreLayout, savedLayoutOf, selectDraft, selectIsGenerating, selectViewingDocumentId, threadTabId, useActivity, useAgents, useArbiSession, useArbiSessionState, useArbiSessionStore, useAssistantQuery, useAvailableModels, useBoxRole, useBuiltinCommands, useCanCreateProjects, useConfig, useConfigs, useConversationThreads, useConversations, useCurrentUser, useDeleteAgents, useDocumentVersionList, useFirmPool, useHealth, useMessageDetails, useParsedDocument, useProjectInvoices, useProjectUsage, useProjects, useProjectsUsage, useSessionView, useSignedInSession, useTags, useThumbnails, useTopUpFirmPool, useTransientView, useUserUsageToday, useWorkspaceActivity, useWorkspaces };
+//# sourceMappingURL=chunk-VTNFF7P6.js.map
+//# sourceMappingURL=chunk-VTNFF7P6.js.map