@jetcrab/pi-desk 1.1.20-dev → 1.1.22-dev

package/src/client/l2_biz/workbench/hooks/l2-workbench-chat-viewport.ts

@@ -7,7 +7,8 @@ import {
   clearL3ConversationTailSpacer,
   findL3ConversationMessage,
   logL3ConversationScroll,
-  positionL3ConversationMessage
+  positionL3ConversationMessage,
+  refreshL3ConversationTailSpacer
 } from '@client/l3_modules/conversation/l3-conversation-viewport'
 import type { L2WorkbenchChatViewportSnapshot } from '../l2-workbench-chat'
 
@@ -252,25 +253,18 @@ export function L2WorkbenchChatViewportManager({
       const enterRunningAtBottom =
         entryPosition?.follow ?? (initializing && running && snapshot === null)
       const entryTarget = target
-      const positionEntry = (): void => {
-        stopScroll()
-        if (entryTarget) {
-          positionL3ConversationMessage(scrollElement, entryTarget, targetOffset, containsTail)
-        } else {
-          clearL3ConversationTailSpacer(scrollElement)
-        }
-        if (enterRunningAtBottom || !entryTarget) {
-          // 首屏懒布局展开后也在绘制前置底，不交给后续缓动收敛。
-          scrollElement.scrollTop = Math.max(
-            0,
-            scrollElement.scrollHeight - scrollElement.clientHeight
-          )
-        }
-        markProgrammaticScroll(state, scrollElement)
-        // 同步确立跟随，立即切走也不能丢失这个状态。
-        if (followAfterPosition || !entryTarget) void scrollToBottom({ animation: 'instant' })
+      stopScroll()
+      if (entryTarget) {
+        positionL3ConversationMessage(scrollElement, entryTarget, targetOffset, containsTail)
+      } else {
+        clearL3ConversationTailSpacer(scrollElement)
+      }
+      if (enterRunningAtBottom || !entryTarget) {
+        scrollElement.scrollTop = Math.max(0, state.calculatedTargetScrollTop)
       }
-      positionEntry()
+      markProgrammaticScroll(state, scrollElement)
+      // 同步确立跟随，立即切走也不能丢失这个状态。
+      if (followAfterPosition || !entryTarget) void scrollToBottom({ animation: 'instant' })
 
       logL3ConversationScroll('viewport:initialize:positioned', scrollElement, {
         initializing,
@@ -288,7 +282,18 @@ export function L2WorkbenchChatViewportManager({
           anchor: anchor ? { messageId: anchor, offset: targetOffset } : null,
           follow: followAfterPosition || target === null
         }
-        const observer = new ResizeObserver(positionEntry)
+        const observer = new ResizeObserver(() => {
+          // 懒布局与拖宽只校正既定目标，不再重走提问定位、停止和启动跟随。
+          if (followAfterPosition || !entryTarget) {
+            refreshL3ConversationTailSpacer(scrollElement)
+            scrollElement.scrollTop = Math.max(0, state.calculatedTargetScrollTop)
+          } else {
+            // 内容收缩时库可能自动恢复跟随；首屏阅读锚点仍优先。
+            if (state.isAtBottom) stopScroll()
+            positionL3ConversationMessage(scrollElement, entryTarget, targetOffset, containsTail)
+          }
+          markProgrammaticScroll(state, scrollElement)
+        })
         observer.observe(scrollElement)
         if (scrollElement.firstElementChild) observer.observe(scrollElement.firstElementChild)
         const interactionElement = scrollElement.parentElement!
@@ -356,13 +361,15 @@ export function L2WorkbenchChatViewportManager({
           isAtBottom: state.isAtBottom,
           escapedFromLock: state.escapedFromLock
         })
+        // 新视图会在旧视图清理前读取快照，恢复跟随时就释放旧阅读位置。
+        onClearSnapshot()
         void scrollToBottom({ animation: 'instant' })
       }
     }
 
     scrollElement.addEventListener('scroll', resumeFollowAtBottom, { passive: true })
     return () => scrollElement.removeEventListener('scroll', resumeFollowAtBottom)
-  }, [latestUserAnchor, scrollRef, scrollToBottom, state, visible])
+  }, [latestUserAnchor, onClearSnapshot, scrollRef, scrollToBottom, state, visible])
 
   useLayoutEffect(() => {
     if (!running || !visible) return

package/src/client/l2_biz/workbench/l2-work-session-columns.module.css

@@ -1,3 +1,35 @@
+.chatContainer {
+  container-name: work-session-chat;
+  container-type: inline-size;
+}
+
+.headerActionIcon {
+  display: none;
+}
+
+@container work-session-chat (width < 28rem) {
+  .sessionHeader {
+    gap: 0.5rem;
+  }
+
+  .headerAction {
+    width: 1.75rem;
+    height: 1.75rem;
+    min-height: 1.75rem;
+    gap: 0;
+    border-radius: 0.375rem;
+    padding: 0;
+  }
+
+  .headerActionLabel {
+    display: none;
+  }
+
+  .headerActionIcon {
+    display: block;
+  }
+}
+
 .collapsedText {
   overflow: hidden;
   text-overflow: ellipsis;

package/src/client/l2_biz/workbench/l2-work-session-columns.tsx

@@ -54,8 +54,10 @@ import { useL2WorkSessionColumnCapacity } from './hooks/l2-work-session-column-c
 import type { L2FileWorkspaceRuntime } from './file-workspace/l2-file-workspace-runtime'
 import { L2WorkSessionFileLayout } from './file-workspace/l2-work-session-file-layout'
 import { Button, buttonVariants } from '@client/l4_foundation/ui/shadcn/button'
+import type { L2WorkbenchPluginSessionSlots } from './l2-workbench-plugin-slots'
 
-interface L2WorkSessionColumnsProps extends L2WorkbenchComposerSlots {
+interface L2WorkSessionColumnsProps
+  extends L2WorkbenchComposerSlots, L2WorkbenchPluginSessionSlots {
   onOpenSettings?: (target?: 'model-presets') => void
   workSessions: readonly L2WorkSessionListItem[]
   primaryWorkId: string | null
@@ -126,7 +128,7 @@ function SidebarToggle({
   )
 }
 
-interface WorkSessionColumnProps extends L2WorkbenchComposerSlots {
+interface WorkSessionColumnProps extends L2WorkbenchComposerSlots, L2WorkbenchPluginSessionSlots {
   onOpenSettings?: (target?: 'model-presets') => void
   workSession: L2WorkSessionListItem
   fixed: boolean
@@ -181,6 +183,8 @@ const WorkSessionColumn = memo(function WorkSessionColumn({
   renderTaskSummary,
   renderTaskMenu,
   renderPluginComposerPanel,
+  renderPluginWidgets,
+  renderPluginSessionHeader,
   gitRuntime,
   invokePluginMethod,
   listPiCommands,
@@ -214,6 +218,34 @@ const WorkSessionColumn = memo(function WorkSessionColumn({
   useSyncExternalStore(fileRuntime.subscribe, fileRuntime.getRevision, fileRuntime.getRevision)
   const fileWorkspace = fileRuntime.getWorkspace(workSession.workId)
   const fileCount = (fileWorkspace?.tabs.length ?? 0) + (fileWorkspace?.activeDiff ? 1 : 0)
+  const source = useMemo<L2ChatSource>(
+    () => ({
+      workId: workSession.workId,
+      sessionId: workSession.sessionId,
+      branchId: workSession.branchId
+    }),
+    [workSession.workId, workSession.sessionId, workSession.branchId]
+  )
+  const title = (
+    <div className="min-w-0">
+      <p
+        className={cn(
+          'truncate text-sm transition-colors duration-150 motion-reduce:transition-none',
+          focused ? 'font-semibold text-foreground' : 'font-medium text-muted-foreground'
+        )}
+        title={workSession.projectName}
+      >
+        {workSession.projectName}
+      </p>
+      <p
+        className="truncate text-xs text-muted-foreground"
+        data-testid="session-header-title"
+        title={workSession.sessionTitle ?? t('newSession')}
+      >
+        {workSession.sessionTitle ?? t('newSession')}
+      </p>
+    </div>
+  )
 
   useEffect(() => {
     const column = columnRef.current
@@ -259,23 +291,18 @@ const WorkSessionColumn = memo(function WorkSessionColumn({
         onOpenSidebar={() => onOpenFileSidebar(workSession.workId)}
       >
         {(chatVisible) => (
-          <div className="flex h-full min-h-0 min-w-0 flex-1 flex-col">
-            <header className="flex min-h-14 items-center gap-3 px-3">
+          <div className={cn(styles.chatContainer, 'flex h-full min-h-0 min-w-0 flex-1 flex-col')}>
+            <header
+              className={cn(styles.sessionHeader, 'flex min-h-14 shrink-0 items-center gap-3 px-3')}
+              data-testid="session-header"
+            >
               {fixed && !mobile ? null : (
                 <SidebarToggle sidebarOpen={sidebarOpen} onToggle={onToggleSidebar} />
               )}
               <div className="min-w-0 flex-1">
-                <p
-                  className={cn(
-                    'truncate text-sm transition-colors duration-150 motion-reduce:transition-none',
-                    focused ? 'font-semibold text-foreground' : 'font-medium text-muted-foreground'
-                  )}
-                >
-                  {workSession.projectName}
-                </p>
-                <p className="truncate text-xs text-muted-foreground">
-                  {workSession.sessionTitle ?? t('newSession')}
-                </p>
+                {chatVisible && contentActive
+                  ? renderPluginSessionHeader({ source, title })
+                  : title}
               </div>
               <div className="-mr-1 flex shrink-0 items-center">
                 {initializationIssue.error ? (
@@ -292,13 +319,17 @@ const WorkSessionColumn = memo(function WorkSessionColumn({
                 {fileCount > 0 ? (
                   <Button
                     variant="ghost"
+                    className={styles.headerAction}
                     data-testid="session-files-entry"
                     aria-label={t('openSessionFiles')}
+                    title={t('sessionFiles', { count: fileCount })}
                     aria-pressed={fileWorkspace?.windowOpen ?? false}
                     onClick={() => fileRuntime.showWindow(workSession.workId)}
                   >
                     <FilesIcon className="size-4" />
-                    {t('sessionFiles', { count: fileCount })}
+                    <span className={styles.headerActionLabel}>
+                      {t('sessionFiles', { count: fileCount })}
+                    </span>
                   </Button>
                 ) : null}
                 {onUnpinWorkSession ? (
@@ -338,6 +369,8 @@ const WorkSessionColumn = memo(function WorkSessionColumn({
                 renderTaskSummary={renderTaskSummary}
                 renderTaskMenu={renderTaskMenu}
                 renderPluginComposerPanel={renderPluginComposerPanel}
+                renderPluginWidgets={renderPluginWidgets}
+                widgetsVisible={chatVisible && contentActive}
                 gitRuntime={gitRuntime}
                 active={composerActive}
                 mobile={mobile}
@@ -473,6 +506,8 @@ export function L2WorkSessionColumns({
   renderTaskSummary,
   renderTaskMenu,
   renderPluginComposerPanel,
+  renderPluginWidgets,
+  renderPluginSessionHeader,
   gitRuntime,
   invokePluginMethod,
   listPiCommands,
@@ -660,6 +695,8 @@ export function L2WorkSessionColumns({
               renderTaskSummary={renderTaskSummary}
               renderTaskMenu={renderTaskMenu}
               renderPluginComposerPanel={renderPluginComposerPanel}
+              renderPluginWidgets={renderPluginWidgets}
+              renderPluginSessionHeader={renderPluginSessionHeader}
               gitRuntime={gitRuntime}
               invokePluginMethod={invokePluginMethod}
               listPiCommands={listPiCommands}
@@ -758,6 +795,8 @@ export function L2WorkSessionColumns({
                   renderTaskSummary={renderTaskSummary}
                   renderTaskMenu={renderTaskMenu}
                   renderPluginComposerPanel={renderPluginComposerPanel}
+                  renderPluginWidgets={renderPluginWidgets}
+                  renderPluginSessionHeader={renderPluginSessionHeader}
                   gitRuntime={gitRuntime}
                   invokePluginMethod={invokePluginMethod}
                   listPiCommands={listPiCommands}

package/src/client/l2_biz/workbench/l2-work-session-sidebar.tsx

@@ -21,6 +21,7 @@ import {
   EllipsisIcon,
   FolderTreeIcon,
   FolderSearchIcon,
+  ExternalLinkIcon,
   LoaderCircleIcon,
   MessageSquareTextIcon,
   PinIcon,
@@ -131,6 +132,7 @@ interface L2WorkSessionSidebarProps {
   onModeChange: (mode: L2WorkSessionSidebarMode) => void
   onRefreshFiles: () => void
   onPreviewProject: () => void
+  onPreviewProjectWindow: () => void
   onOpenTerminal: () => void
   onCreate: () => void
   onReplace: () => void
@@ -680,6 +682,7 @@ function L2WorkSessionSidebarComponent({
   onModeChange,
   onRefreshFiles,
   onPreviewProject,
+  onPreviewProjectWindow,
   onOpenTerminal,
   onCreate,
   onReplace,
@@ -769,14 +772,6 @@ function L2WorkSessionSidebarComponent({
         ]
       : mode === 'files'
         ? [
-            {
-              key: 'new-terminal',
-              label: t('newTerminal'),
-              disabled,
-              icon: <TerminalIcon />,
-              testId: 'project-files-terminal-open',
-              onSelect: onOpenTerminal
-            },
             {
               key: 'preview-project',
               label: t('projectPreview'),
@@ -785,6 +780,22 @@ function L2WorkSessionSidebarComponent({
               testId: 'project-preview-open',
               onSelect: onPreviewProject
             },
+            {
+              key: 'preview-project-window',
+              label: t('projectPreviewWindow'),
+              disabled: !canBrowseFiles,
+              icon: <ExternalLinkIcon />,
+              testId: 'project-preview-window-open',
+              onSelect: onPreviewProjectWindow
+            },
+            {
+              key: 'new-terminal',
+              label: t('newTerminal'),
+              disabled,
+              icon: <TerminalIcon />,
+              testId: 'project-files-terminal-open',
+              onSelect: onOpenTerminal
+            },
             {
               key: 'refresh-files',
               label: t('refreshFiles'),

package/src/client/l2_biz/workbench/l2-workbench-chat-composer.tsx

@@ -89,6 +89,7 @@ import type { L3CapabilityModeNames } from '@common/l3_modules/capability-modes/
 import { L2WorkbenchCapabilityModePicker } from './l2-workbench-capability-mode-picker'
 import { useL2NativeUi } from './native-ui/l2-native-ui'
 import { L2NativeUiExtras, L2NativeUiQuestions } from './native-ui/l2-native-ui-view'
+import type { L2WorkbenchPluginWidgetSlots } from './l2-workbench-plugin-slots'
 
 interface L2WorkbenchTaskSlotInput {
   source: L2ChatSource
@@ -107,13 +108,15 @@ export interface L2WorkbenchComposerSlots {
   }) => ReactNode
 }
 
-interface L2WorkbenchChatComposerProps extends L2WorkbenchComposerSlots {
+interface L2WorkbenchChatComposerProps
+  extends L2WorkbenchComposerSlots, L2WorkbenchPluginWidgetSlots {
   onOpenSettings?: (target?: 'model-presets') => void
   workSession: L2WorkSessionListItem
   chatRuntime: L2WorkbenchChatRuntime
   inputRuntime: L2WorkbenchChatInputRuntime
   gitRuntime: L2GitWorkspaceRuntime
   active: boolean
+  widgetsVisible: boolean
   mobile: boolean
   invokePluginMethod: L2WorkbenchBiz['invokePluginMethod']
   listPiCommands: L2WorkbenchBiz['listPiCommands']
@@ -161,8 +164,10 @@ function L2WorkbenchChatComposerComponent({
   renderTaskSummary,
   renderTaskMenu,
   renderPluginComposerPanel,
+  renderPluginWidgets,
   gitRuntime,
   active,
+  widgetsVisible,
   mobile,
   invokePluginMethod,
   listPiCommands,
@@ -633,6 +638,9 @@ function L2WorkbenchChatComposerComponent({
         <p className="mb-1 px-1 text-xs text-muted-foreground">{t('nativeUiComposer')}</p>
       ) : null}
 
+      {widgetsVisible && !basicChat
+        ? renderPluginWidgets({ source, placement: 'aboveEditor' })
+        : null}
       <form
         aria-label={
           workSessionRunning
@@ -1021,6 +1029,9 @@ function L2WorkbenchChatComposerComponent({
           </PromptInputFooter>
         </InputGroup>
       </form>
+      {widgetsVisible && !basicChat
+        ? renderPluginWidgets({ source, placement: 'belowEditor' })
+        : null}
       <L2NativeUiExtras snapshot={nativeUi.state.snapshot} placement="belowEditor" />
 
       {activePluginPanel &&

package/src/client/l2_biz/workbench/l2-workbench-initialization-notice.tsx

@@ -1,7 +1,9 @@
 'use client'
 
-import { CheckIcon, CopyIcon, LoaderCircleIcon, RefreshCwIcon } from 'lucide-react'
+import { CheckIcon, CircleAlertIcon, CopyIcon, LoaderCircleIcon, RefreshCwIcon } from 'lucide-react'
 import { useTranslation } from 'react-i18next'
+import { cn } from '@client/l4_foundation/lib/l4-utils'
+import styles from './l2-work-session-columns.module.css'
 import { Button } from '@client/l4_foundation/ui/shadcn/button'
 import {
   Popover,
@@ -36,11 +38,14 @@ export function L2WorkbenchInitializationNotice({
           <Button
             variant="ghost"
             size="sm"
-            className="text-xs text-destructive hover:text-destructive"
+            aria-label={t('initializationDegraded')}
+            title={t('initializationDegraded')}
+            className={cn(styles.headerAction, 'text-xs text-destructive hover:text-destructive')}
           />
         }
       >
-        {t('initializationDegraded')}
+        <CircleAlertIcon className={cn(styles.headerActionIcon, 'size-4')} aria-hidden="true" />
+        <span className={styles.headerActionLabel}>{t('initializationDegraded')}</span>
       </PopoverTrigger>
       <PopoverContent
         align="end"

package/src/client/l2_biz/workbench/l2-workbench-plugin-slots.ts

@@ -0,0 +1,13 @@
+import type { ReactNode } from 'react'
+import type { PluginSource } from '@jetcrab/pi-desk-sdk/browser'
+
+export interface L2WorkbenchPluginWidgetSlots {
+  renderPluginWidgets: (input: {
+    source: PluginSource
+    placement: 'aboveEditor' | 'belowEditor'
+  }) => ReactNode
+}
+
+export interface L2WorkbenchPluginSessionSlots extends L2WorkbenchPluginWidgetSlots {
+  renderPluginSessionHeader: (input: { source: PluginSource; title: ReactNode }) => ReactNode
+}

package/src/client/l2_biz/workbench/l2-workbench.tsx

@@ -66,6 +66,7 @@ import { L4_APP_VERSION } from '@client/l4_foundation/l4-app-info'
 import { L2WorkbenchSidebarLayout } from './l2-workbench-sidebar-layout'
 import type { L4PluginBrowserContributionDescriptor } from '@client/l4_foundation/plugin-host/l4-plugin-host-runtime'
 import type { L2WorkbenchComposerSlots } from './l2-workbench-chat-composer'
+import type { L2WorkbenchPluginSessionSlots } from './l2-workbench-plugin-slots'
 import { createL2WorkbenchBiz } from './l2-workbench-biz'
 import { createL2WorkbenchVersionRefresh } from './l2-workbench-version-refresh'
 import { L2FileWorkspaceRuntime } from './file-workspace/l2-file-workspace-runtime'
@@ -172,10 +173,11 @@ function WorkbenchDisplaySlot<Input>({
   return render(input)
 }
 
-interface L2WorkbenchProps extends L2WorkbenchComposerSlots {
+interface L2WorkbenchProps extends L2WorkbenchComposerSlots, L2WorkbenchPluginSessionSlots {
   onTerminalReady: () => Promise<void>
   onTerminalDisconnected: () => void
   onOpenTerminal: (cwd?: string) => Promise<void>
+  onOpenProjectPreviewWindow: (cwd: string) => void
   renderTerminalWorkspace: (input: { mobile: boolean; children: ReactNode }) => ReactNode
   listPluginManagement: () => Promise<L2PluginManagementSnapshot>
   subscribePluginManagementChanges: (listener: () => void) => () => void
@@ -221,6 +223,7 @@ export function L2Workbench({
   onTerminalReady,
   onTerminalDisconnected,
   onOpenTerminal,
+  onOpenProjectPreviewWindow,
   renderTerminalWorkspace,
   listPluginManagement,
   subscribePluginManagementChanges,
@@ -234,7 +237,9 @@ export function L2Workbench({
   renderSettings,
   renderTaskSummary,
   renderTaskMenu,
-  renderPluginComposerPanel
+  renderPluginComposerPanel,
+  renderPluginWidgets,
+  renderPluginSessionHeader
 }: L2WorkbenchProps): React.JSX.Element {
   const { t } = useTranslation('workbench')
   const { clientId, appSocket } = useL4AppSocket()
@@ -1917,6 +1922,12 @@ export function L2Workbench({
         fileRuntime.collapseExpandedWindow()
         pluginHost.previewProject(activeWorkId ? fileRuntime.getDirectory(activeWorkId) : activeCwd)
       }}
+      onPreviewProjectWindow={() => {
+        if (!activeCwd) return
+        onOpenProjectPreviewWindow(
+          activeWorkId ? fileRuntime.getDirectory(activeWorkId) : activeCwd
+        )
+      }}
       onOpenTerminal={() => {
         closeMobileDrawer()
         fileRuntime.collapseExpandedWindow()
@@ -1973,6 +1984,8 @@ export function L2Workbench({
           renderTaskSummary={renderTaskSummary}
           renderTaskMenu={renderTaskMenu}
           renderPluginComposerPanel={renderPluginComposerPanel}
+          renderPluginWidgets={renderPluginWidgets}
+          renderPluginSessionHeader={renderPluginSessionHeader}
           gitRuntime={gitRuntime}
           invokePluginMethod={workbenchBiz.invokePluginMethod}
           listPiCommands={workbenchBiz.listPiCommands}

package/src/client/l3_modules/conversation/l3-conversation-viewport.tsx

@@ -157,9 +157,11 @@ export function positionL3ConversationMessage(
     offset,
     addTailSpace
   })
-  clearL3ConversationTailSpacer(scrollElement)
-
   const turn = addTailSpace ? logicalTailTurn(scrollElement) : null
+  // 同一轮的定位空间可直接重算，先清空会让浏览器截短 scrollTop。
+  if (!turn || activeTailTurn(scrollElement) !== turn) {
+    clearL3ConversationTailSpacer(scrollElement)
+  }
   if (!turn) {
     scrollElement.scrollTop = Math.max(
       0,
@@ -177,11 +179,15 @@ export function positionL3ConversationMessage(
   }
 
   const { targetScrollTop, minHeight } = measureTailPosition(scrollElement, target, turn, offset)
-  turn.style.minHeight = `${Math.ceil(minHeight)}px`
-  turn.dataset.chatTailSpace = ''
+  const nextMinHeight = `${Math.ceil(minHeight)}px`
+  if (turn.style.minHeight !== nextMinHeight) turn.style.minHeight = nextMinHeight
+  if (!turn.hasAttribute('data-chat-tail-space')) turn.dataset.chatTailSpace = ''
   const anchor = target.dataset.chatScrollAnchor
-  if (anchor) turn.dataset.chatTailAnchor = anchor
-  turn.dataset.chatTailOffset = String(offset)
+  if (turn.dataset.chatTailAnchor !== anchor) {
+    if (anchor) turn.dataset.chatTailAnchor = anchor
+    else delete turn.dataset.chatTailAnchor
+  }
+  if (turn.dataset.chatTailOffset !== String(offset)) turn.dataset.chatTailOffset = String(offset)
   scrollElement.scrollTop = targetScrollTop
   logL3ConversationScroll('position:end', scrollElement, {
     target: target.dataset.chatScrollAnchor ?? null,

package/src/client/l3_modules/project-files/l3-markdown-preview.module.css

@@ -1,7 +1,7 @@
 .document {
   box-sizing: border-box;
   width: 100%;
-  max-width: 80ch;
+  max-width: 1200px;
   min-width: 0;
   margin-inline: auto;
   padding: 1.5rem;

package/src/client/l3_modules/project-files/l3-project-document-git.ts

@@ -10,7 +10,8 @@ export function useL3ProjectDocumentGit(
   git: L3ProjectGitBrowser,
   host: RefObject<HTMLDivElement | null>,
   savePosition: () => void,
-  active: boolean
+  active: boolean,
+  refreshOnFocus = true
 ): { refresh: () => void; unavailable: boolean } {
   useSyncExternalStore(git.subscribe, git.getRevision, git.getRevision)
   const snapshot = git.getWorkspace(runtime.cwd)?.snapshot
@@ -29,7 +30,7 @@ export function useL3ProjectDocumentGit(
   }, [diffActive, git, path, runtime])
 
   useEffect(() => {
-    if (!active || !path || diffActive) return
+    if (!refreshOnFocus || !active || !path || diffActive) return
     const visible = (): boolean =>
       window.document.visibilityState === 'visible' &&
       Boolean(host.current?.getClientRects().length) &&
@@ -54,7 +55,7 @@ export function useL3ProjectDocumentGit(
       window.removeEventListener('focus', onFocus)
       window.document.removeEventListener('visibilitychange', onFocus)
     }
-  }, [active, diffActive, git, host, path, refresh, runtime])
+  }, [active, diffActive, git, host, path, refresh, refreshOnFocus, runtime])
 
   useEffect(() => {
     if (!active || !path || diffActive || document?.status !== 'text') return

package/src/client/l3_modules/project-files/l3-project-document-view.tsx

@@ -53,6 +53,7 @@ export function L3ProjectDocumentView({
   gitRuntime,
   compact,
   visible = true,
+  refreshOnFocus = true,
   onEscape,
   onSwitchPane
 }: {
@@ -61,6 +62,7 @@ export function L3ProjectDocumentView({
   gitRuntime: L3ProjectGitBrowser
   compact: boolean
   visible?: boolean
+  refreshOnFocus?: boolean
   onEscape: () => void
   onSwitchPane?: () => void
 }): React.JSX.Element {
@@ -107,7 +109,8 @@ export function L3ProjectDocumentView({
     gitRuntime,
     hostRef,
     savePosition,
-    visible
+    visible,
+    refreshOnFocus
   )
   const comparison = document?.status === 'text' ? document.comparison : undefined
   const [computed, setComputed] = useState<{

package/src/client/l3_modules/project-files/l3-project-reader.ts

@@ -85,49 +85,37 @@ export interface L3ProjectReader extends L3ProjectFileReader {
 
 export function createL3ProjectReader(
   clientId: string,
-  context: contract.L3ProjectReadContext
+  context: contract.L3ProjectReadContext,
+  onUnauthorized?: () => void
 ): L3ProjectReader {
+  async function request<I, O>(
+    api: { path: string; request: z.ZodType<I>; response: z.ZodType<O> },
+    input: I,
+    signal?: AbortSignal
+  ): Promise<O> {
+    try {
+      return await requestL3Project(clientId, api, input, signal)
+    } catch (cause) {
+      if (!signal?.aborted && cause instanceof L3ProjectRequestError && cause.status === 401)
+        onUnauthorized?.()
+      throw cause
+    }
+  }
   return {
-    list: (path, signal) =>
-      requestL3Project(clientId, contract.L3ProjectFileList, { ...context, path }, signal),
+    list: (path, signal) => request(contract.L3ProjectFileList, { ...context, path }, signal),
     search: (input, signal) =>
-      requestL3Project(clientId, contract.L3ProjectFileSearch, { ...context, ...input }, signal),
+      request(contract.L3ProjectFileSearch, { ...context, ...input }, signal),
     get: (path, imagePreviewMode, signal) =>
-      requestL3Project(
-        clientId,
-        contract.L3ProjectFileGet,
-        { ...context, path, imagePreviewMode },
-        signal
-      ),
+      request(contract.L3ProjectFileGet, { ...context, path, imagePreviewMode }, signal),
     snapshot: (signal, refresh) =>
-      requestL3Project(clientId, contract.L3ProjectGitGet, { ...context, refresh }, signal),
+      request(contract.L3ProjectGitGet, { ...context, refresh }, signal),
     branches: (repositoryRoot, signal) =>
-      requestL3Project(
-        clientId,
-        contract.L3ProjectGitBranches,
-        { ...context, repositoryRoot },
-        signal
-      ),
+      request(contract.L3ProjectGitBranches, { ...context, repositoryRoot }, signal),
     log: (repositoryRoot, query, signal) =>
-      requestL3Project(
-        clientId,
-        contract.L3ProjectGitLog,
-        { ...context, repositoryRoot, ...query },
-        signal
-      ),
+      request(contract.L3ProjectGitLog, { ...context, repositoryRoot, ...query }, signal),
     changes: (repositoryRoot, query, signal) =>
-      requestL3Project(
-        clientId,
-        contract.L3ProjectGitChanges,
-        { ...context, repositoryRoot, ...query },
-        signal
-      ),
+      request(contract.L3ProjectGitChanges, { ...context, repositoryRoot, ...query }, signal),
     diff: (repositoryRoot, path, signal, comparison) =>
-      requestL3Project(
-        clientId,
-        contract.L3ProjectGitDiff,
-        { ...context, repositoryRoot, path, comparison },
-        signal
-      )
+      request(contract.L3ProjectGitDiff, { ...context, repositoryRoot, path, comparison }, signal)
   }
 }

package/src/client/l4_foundation/lib/l4-client-id.tsx

@@ -0,0 +1,11 @@
+'use client'
+
+import { createContext, useContext } from 'react'
+
+export const L4ClientIdContext = createContext<string | null>(null)
+
+export function useL4ClientId(): string {
+  const clientId = useContext(L4ClientIdContext)
+  if (clientId === null) throw new Error('缺少页面 clientId Provider')
+  return clientId
+}