@nextclaw/ui 0.25.4 → 0.26.1

package/src/shared/components/doc-browser/doc-browser.tsx

@@ -18,18 +18,11 @@ import {
   DocBrowserFrameContent,
 } from './doc-browser-panel-parts';
 import { DocBrowserTabStrip } from './doc-browser-tab-strip';
-import {
-  createInitialFloatingPanelRect,
-  moveFloatingPanelRect,
-  resizeFloatingPanelRect,
-  type FloatingPanelRect,
-  type FloatingPanelResizeEdge,
-} from './utils/doc-browser-floating-panel.utils';
-import { ResizableRightPanel } from '@/shared/components/resizable-right-panel/resizable-right-panel';
-import { cn } from '@/shared/lib/utils';
+import { WorkbenchSurface } from '@/shared/components/workbench/workbench-surface';
+import { GLOBAL_WORKBENCH_SURFACE } from '@/shared/components/workbench/types/workbench-surface.types';
+import { getAppPresenter } from '@/app/presenters/app.presenter';
 import { t } from '@/shared/lib/i18n';
 import type { ContextMenuGroup } from '@/shared/components/ui/context-menu/context-menu';
-import { GripVertical } from 'lucide-react';
 import {
   DOC_BROWSER_DOCKED_MAX_WIDTH,
   DOC_BROWSER_DOCKED_MIN_WIDTH,
@@ -44,16 +37,8 @@ type DocBrowserProps = {
 
 export type DocBrowserTabMenuGroupsResolver = NonNullable<DocBrowserProps['getTabMenuGroups']>;
 
-type FloatingPanelInteraction = {
-  startX: number;
-  startY: number;
-  startRect: FloatingPanelRect;
-} & (
-  | { kind: 'drag' }
-  | { kind: 'resize'; edge: FloatingPanelResizeEdge }
-);
 
-const DEFAULT_DOCS_IFRAME_SANDBOX = 'allow-same-origin allow-scripts allow-popups allow-forms';
+
 
 function resolveContentUrlInput(input: string, currentUrl: string): string {
   if (input.startsWith('/')) {
@@ -72,20 +57,6 @@ function resolveContentUrlInput(input: string, currentUrl: string): string {
   return `https://${input}`;
 }
 
-function resolveIframeSandbox(
-  customRenderer: DocBrowserCustomTabRenderers[string] | undefined,
-  currentTab: DocBrowserTab | undefined,
-): string | undefined {
-  if (!currentTab) {
-    return DEFAULT_DOCS_IFRAME_SANDBOX;
-  }
-  const customSandbox = customRenderer?.getIframeSandbox?.(currentTab);
-  if (customSandbox !== undefined) {
-    return customSandbox;
-  }
-  return currentTab.kind === 'content' ? undefined : DEFAULT_DOCS_IFRAME_SANDBOX;
-}
-
 function useDocBrowserDockAction(
   dockControls: DocBrowserDockControls | undefined,
   currentTab: DocBrowserTab | undefined,
@@ -172,7 +143,6 @@ export function DocBrowser({
 }: DocBrowserProps) {
   const {
     isOpen,
-    mode,
     dockedWidth,
     tabs,
     activeTabId,
@@ -183,7 +153,6 @@ export function DocBrowser({
     openTarget,
     openNewTab,
     close,
-    toggleMode,
     setDockedWidth,
     goBack,
     goForward,
@@ -194,8 +163,6 @@ export function DocBrowser({
   } = useDocBrowser();
 
   const [iframeReloadVersion, setIframeReloadVersion] = useState(0);
-  const [floatRect, setFloatRect] = useState<FloatingPanelRect>(createInitialFloatingPanelRect);
-  const [floatInteraction, setFloatInteraction] = useState<FloatingPanelInteraction | null>(null);
   const iframeRef = useRef<HTMLIFrameElement>(null);
   const currentUrl = currentTab?.currentUrl ?? getDefaultDocsUrl();
   const navVersion = currentTab?.navVersion ?? 0;
@@ -251,7 +218,7 @@ export function DocBrowser({
 
   useEffect(() => {
     const handler = (e: MessageEvent) => {
-      if (!isDocsTab) {
+      if (!isDocsTab || e.source !== iframeRef.current?.contentWindow) {
         return;
       }
       if (e.data?.type === 'docs-route-change' && typeof e.data.url === 'string') {
@@ -283,65 +250,13 @@ export function DocBrowser({
     return () => window.removeEventListener('message', handler);
   }, [currentTab, customRenderer, iframeInstanceId]);
 
-  const startFloatDrag = useCallback((event: React.PointerEvent<HTMLElement>) => {
-    event.preventDefault();
-    setFloatInteraction({
-      kind: 'drag',
-      startX: event.clientX,
-      startY: event.clientY,
-      startRect: floatRect,
-    });
-  }, [floatRect]);
-
-  const startFloatResize = useCallback((edge: FloatingPanelResizeEdge) => (event: React.PointerEvent<HTMLElement>) => {
-    event.preventDefault();
-    event.stopPropagation();
-    setFloatInteraction({
-      kind: 'resize',
-      edge,
-      startX: event.clientX,
-      startY: event.clientY,
-      startRect: floatRect,
-    });
-  }, [floatRect]);
-
-  useEffect(() => {
-    if (!floatInteraction) return;
-
-    const onMove = (event: PointerEvent) => {
-      const { startRect, startX, startY } = floatInteraction;
-      const dx = event.clientX - startX;
-      const dy = event.clientY - startY;
-
-      if (floatInteraction.kind === 'drag') {
-        setFloatRect(moveFloatingPanelRect(startRect, dx, dy));
-        return;
-      }
-
-      setFloatRect(resizeFloatingPanelRect(floatInteraction.edge, startRect, dx, dy));
-    };
-
-    const onEnd = () => setFloatInteraction(null);
-
-    window.addEventListener('pointermove', onMove);
-    window.addEventListener('pointerup', onEnd);
-    window.addEventListener('pointercancel', onEnd);
-    return () => {
-      window.removeEventListener('pointermove', onMove);
-      window.removeEventListener('pointerup', onEnd);
-      window.removeEventListener('pointercancel', onEnd);
-    };
-  }, [floatInteraction]);
-
   const refreshIframe = useCallback(() => {
     setIframeReloadVersion((version) => version + 1);
   }, []);
 
   const handleToggleDock = useDocBrowserDockAction(dockControls, currentTab, dockState);
 
-  if (!isOpen) return null;
 
-  const isDocked = mode === 'docked';
   const isFullscreen = displayMode === 'fullscreen';
   const customRenderParams = currentTab ? {
     currentUrl,
@@ -354,29 +269,11 @@ export function DocBrowser({
   const customContent = customRenderParams
     ? customRenderer?.renderContent?.(customRenderParams) ?? (isHomeTab ? <DocBrowserHomePage /> : null)
     : null;
-  const iframeSandbox = resolveIframeSandbox(customRenderer, currentTab);
+  const iframeSandbox = currentTab ? customRenderer?.getIframeSandbox?.(currentTab) : undefined;
 
   const panelContent = (
     <>
-      <DocBrowserTabStrip
-        tabs={tabs}
-        activeTabId={activeTabId}
-        canGoBack={canGoBack}
-        canGoForward={canGoForward}
-        dockState={dockState}
-        isDocked={isDocked}
-        isFullscreen={isFullscreen}
-        onGoBack={goBack}
-        onGoForward={goForward}
-        onOpenNewTab={openNewTab}
-        onToggleDock={handleToggleDock}
-        onSetActiveTab={setActiveTab}
-        onCloseTab={closeTab}
-        onClose={close}
-        onDragStart={startFloatDrag}
-        onToggleMode={toggleMode}
-        getTabMenuGroups={getTabMenuGroups}
-      />
+
 
       <DocBrowserAddressToolbar
         isVisible={isAddressToolbarTab}
@@ -396,8 +293,8 @@ export function DocBrowser({
         iframeRef={iframeRef}
         iframeInstanceId={iframeInstanceId}
         iframeSandbox={iframeSandbox}
-        isDragging={floatInteraction?.kind === 'drag'}
-        isResizing={floatInteraction?.kind === 'resize'}
+        isDragging={false}
+        isResizing={false}
         onIframeLoad={restoreScroll}
         onIframePointerOver={customRenderer?.onIframePointerOver}
       />
@@ -406,89 +303,28 @@ export function DocBrowser({
     </>
   );
 
-  if (isDocked && !isFullscreen) {
-    return (
-      <ResizableRightPanel
-        data-testid="doc-browser-panel"
-        data-theme-surface="doc-browser"
-        defaultWidth={dockedWidth}
-        width={dockedWidth}
-        minWidth={DOC_BROWSER_DOCKED_MIN_WIDTH}
-        maxWidth={DOC_BROWSER_DOCKED_MAX_WIDTH}
-        onWidthCommit={setDockedWidth}
-      >
-        {panelContent}
-      </ResizableRightPanel>
-    );
-  }
-
   return (
-    <div
-      data-testid="doc-browser-panel"
-      data-theme-surface="doc-browser"
-      className={cn(
-        'relative flex flex-col overflow-hidden bg-card text-card-foreground',
-        isFullscreen
-          ? 'fixed inset-0 z-[var(--z-floating-panel)] h-[100dvh] w-screen rounded-none border-0 shadow-2xl'
-          : 'rounded-2xl border border-border shadow-2xl',
-      )}
-      style={
-        isFullscreen
-          ? undefined
-          : {
-              position: 'fixed',
-              left: floatRect.x,
-              top: floatRect.y,
-              width: floatRect.w,
-              height: floatRect.h,
-              zIndex: 'var(--z-floating-panel)',
-            }
-      }
-    >
+    <WorkbenchSurface id={GLOBAL_WORKBENCH_SURFACE} manager={getAppPresenter().workbenchSurfaceManager}
+      title={currentTab?.title || t('workbenchGlobalGroup')} testId="doc-browser-panel"
+      width={dockedWidth} minWidth={DOC_BROWSER_DOCKED_MIN_WIDTH} maxWidth={DOC_BROWSER_DOCKED_MAX_WIDTH}
+      onWidthCommit={setDockedWidth} onClose={close} closeLabel={t('workbenchHideGroup')}
+      hidden={!isOpen} fullscreen={isFullscreen} navigation={
+      <DocBrowserTabStrip
+        tabs={tabs}
+        activeTabId={activeTabId}
+        canGoBack={canGoBack}
+        canGoForward={canGoForward}
+        dockState={dockState}
+        onGoBack={goBack}
+        onGoForward={goForward}
+        onOpenNewTab={openNewTab}
+        onToggleDock={handleToggleDock}
+        onSetActiveTab={setActiveTab}
+        onCloseTab={closeTab}
+        getTabMenuGroups={getTabMenuGroups}
+      />
+      }>
       {panelContent}
-
-      {!isDocked && !isFullscreen && (
-        <>
-          <div className="absolute top-0 left-0 h-3 w-full cursor-ns-resize z-20 hover:bg-primary/10 transition-colors" data-testid="doc-browser-resize-top" onPointerDown={startFloatResize('top')} />
-          <div
-            className="absolute top-0 left-0 w-3 h-full cursor-ew-resize z-20 hover:bg-primary/10 transition-colors"
-            data-testid="doc-browser-resize-left"
-            onPointerDown={startFloatResize('left')}
-          />
-          <div
-            className="absolute top-0 right-0 w-3 h-full cursor-ew-resize z-20 hover:bg-primary/10 transition-colors"
-            data-testid="doc-browser-resize-right"
-            onPointerDown={startFloatResize('right')}
-          />
-          <div
-            className="absolute bottom-0 left-0 h-3 w-full cursor-ns-resize z-20 hover:bg-primary/10 transition-colors"
-            data-testid="doc-browser-resize-bottom"
-            onPointerDown={startFloatResize('bottom')}
-          />
-          <div
-            className="absolute top-0 left-0 z-30 h-4 w-4 cursor-nw-resize hover:bg-primary/10 transition-colors"
-            data-testid="doc-browser-resize-top-left"
-            onPointerDown={startFloatResize('top-left')}
-          />
-          <div
-            className="absolute top-0 right-0 z-30 h-4 w-4 cursor-ne-resize hover:bg-primary/10 transition-colors"
-            data-testid="doc-browser-resize-top-right"
-            onPointerDown={startFloatResize('top-right')}
-          />
-          <div
-            className="absolute bottom-0 left-0 z-30 h-4 w-4 cursor-sw-resize hover:bg-primary/10 transition-colors"
-            data-testid="doc-browser-resize-bottom-left"
-            onPointerDown={startFloatResize('bottom-left')}
-          />
-          <div
-            className="absolute bottom-0 right-0 z-30 flex h-4 w-4 cursor-se-resize items-center justify-center text-muted-foreground/45 transition-colors hover:text-muted-foreground"
-            data-testid="doc-browser-resize-bottom-right"
-            onPointerDown={startFloatResize('bottom-right')}
-          >
-            <GripVertical className="w-3 h-3 rotate-[-45deg]" />
-          </div>
-        </>
-      )}
-    </div>
+    </WorkbenchSurface>
   );
 }

package/src/shared/components/doc-browser/hooks/use-doc-browser-scroll-restoration.ts

@@ -17,6 +17,6 @@ export function useDocBrowserScrollRestoration({
     currentUrl: currentTab?.currentUrl ?? null,
     iframeRef,
     isEnabled,
-    restorationKey: currentTab ? `panel-app:doc-browser:${currentTab.id}` : null,
+    restorationKey: currentTab ? `panel-app:resource:${currentTab.dedupeKey ?? currentTab.resourceUri ?? currentTab.currentUrl}` : null,
   });
 }

package/src/shared/components/doc-browser/managers/doc-browser.manager.ts

@@ -1,3 +1,5 @@
+import type { WorkbenchSurfaceManager } from '@/shared/components/workbench/managers/workbench-surface.manager';
+import { GLOBAL_WORKBENCH_SURFACE } from '@/shared/components/workbench/types/workbench-surface.types';
 import type {
   DocBrowserActiveHistoryEntry,
   DocBrowserOpenOptions,
@@ -187,6 +189,7 @@ function openResolvedDocBrowserState(
       target.resourceUri ?? target.url,
       options?.dockIcon ?? target.dockIcon,
       target.contentParams,
+      options?.viewState ?? target.viewState,
     );
     if (isClosedDefaultHomeState(prev, activeTab)) {
       const nextState = {
@@ -244,6 +247,7 @@ function openDocBrowserState(
 
 export class DocBrowserManager {
   constructor(
+    private readonly surfaces: WorkbenchSurfaceManager,
     private readonly routeResolver: DocBrowserRouteResolver = defaultDocBrowserRouteResolver,
     private readonly onRightPanelOpened?: RightPanelOpenedHandler,
   ) {}
@@ -254,6 +258,8 @@ export class DocBrowserManager {
 
   readonly open = (url?: string, options?: DocBrowserOpenOptions): void => {
     this.setSnapshot((prev) => openDocBrowserState(this.routeResolver, prev, url, options));
+    if (options?.placement) this.surfaces.place(GLOBAL_WORKBENCH_SURFACE, options.placement);
+    this.surfaces.restore(GLOBAL_WORKBENCH_SURFACE);
     this.onRightPanelOpened?.();
   };
 
@@ -264,6 +270,8 @@ export class DocBrowserManager {
       kind: options?.kind ?? target.kind,
       title: options?.title ?? target.title,
     }));
+    if (options?.placement) this.surfaces.place(GLOBAL_WORKBENCH_SURFACE, options.placement);
+    this.surfaces.restore(GLOBAL_WORKBENCH_SURFACE);
     this.onRightPanelOpened?.();
   };
 
@@ -289,7 +297,9 @@ export class DocBrowserManager {
   };
 
   readonly toggleMode = (): void => {
-    this.setSnapshot((prev) => ({ ...prev, mode: prev.mode === 'floating' ? 'docked' : 'floating' }));
+    const { surfaces } = this;
+    surfaces.place(GLOBAL_WORKBENCH_SURFACE, surfaces.get(GLOBAL_WORKBENCH_SURFACE).placement === 'floating' ? 'docked' : 'floating');
+    this.surfaces.restore(GLOBAL_WORKBENCH_SURFACE);
     this.onRightPanelOpened?.();
   };
 

package/src/shared/components/doc-browser/stores/doc-browser.store.ts

@@ -1,9 +1,9 @@
+import { ViewMemoryStorage } from '@/shared/lib/navigation-history';
 import { create } from 'zustand';
 import { createJSONStorage, persist } from 'zustand/middleware';
 import type {
   DocBrowserActiveHistoryEntry,
   DocBrowserDockIcon,
-  DocBrowserMode,
   DocBrowserState,
   DocBrowserStateUpdate,
   DocBrowserTab,
@@ -28,9 +28,6 @@ function isRecord(value: unknown): value is Record<string, unknown> {
   return !!value && typeof value === 'object';
 }
 
-function isDocBrowserMode(value: unknown): value is DocBrowserMode {
-  return value === 'floating' || value === 'docked';
-}
 
 function normalizePersistedStringList(value: unknown, fallback: string): string[] {
   if (!Array.isArray(value)) {
@@ -91,6 +88,7 @@ function normalizePersistedDocBrowserTab(value: unknown): DocBrowserTab | null {
     currentUrl: history[historyIndex] ?? value.currentUrl,
     resourceUri,
     dockIcon,
+    viewState: value.viewState,
     dedupeKey,
     history,
     historyIndex,
@@ -170,7 +168,6 @@ function normalizePersistedDocBrowserState(value: unknown): DocBrowserState | nu
 
   return {
     isOpen: value.isOpen === true,
-    mode: isDocBrowserMode(value.mode) ? value.mode : 'docked',
     dockedWidth: normalizeDocBrowserDockedWidth(value.dockedWidth),
     tabs,
     activeTabId: resolvedActiveTabId,
@@ -197,11 +194,10 @@ export const useDocBrowserStore = create<DocBrowserStore>()(
     {
       name: DOC_BROWSER_STORAGE_KEY,
       version: DOC_BROWSER_STORAGE_VERSION,
-      storage: createJSONStorage(() => window.localStorage),
+      storage: createJSONStorage(() => new ViewMemoryStorage()),
       partialize: (state): { snapshot: PersistedDocBrowserState } => ({
         snapshot: {
           isOpen: state.snapshot.isOpen,
-          mode: state.snapshot.mode,
           dockedWidth: state.snapshot.dockedWidth,
           tabs: state.snapshot.tabs.slice(-DOC_BROWSER_MAX_PERSISTED_TABS),
           activeTabId: state.snapshot.activeTabId,

package/src/shared/components/doc-browser/types/doc-browser.types.ts

@@ -10,6 +10,8 @@ export type DocBrowserTab = {
   currentUrl: string;
   resourceUri?: string;
   contentParams?: UiContentParams;
+  /** Serializable renderer-owned view context; validated by the renderer. */
+  viewState?: unknown;
   dockIcon?: DocBrowserDockIcon;
   dedupeKey?: string;
   history: string[];
@@ -25,6 +27,8 @@ export type DocBrowserRouteTarget = {
   kind: DocBrowserTabKind;
   resourceUri?: string;
   contentParams?: UiContentParams;
+  /** Serializable renderer-owned view context; validated by the renderer. */
+  viewState?: unknown;
   title: string;
   url: string;
 };
@@ -69,6 +73,7 @@ export type DocBrowserActiveHistoryEntry = {
 };
 
 export type DocBrowserOpenOptions = {
+  placement?: DocBrowserMode;
   activate?: boolean;
   dedupeKey?: string;
   dockIcon?: DocBrowserDockIcon;
@@ -76,11 +81,12 @@ export type DocBrowserOpenOptions = {
   title?: string;
   kind?: DocBrowserTabKind;
   contentParams?: UiContentParams;
+  /** Serializable renderer-owned view context; validated by the renderer. */
+  viewState?: unknown;
 };
 
 export type DocBrowserState = {
   isOpen: boolean;
-  mode: DocBrowserMode;
   dockedWidth: number;
   tabs: DocBrowserTab[];
   activeTabId: string;
@@ -106,5 +112,6 @@ export type DocBrowserActions = {
 };
 
 export type DocBrowserContextValue = DocBrowserState & DocBrowserActions & {
+  mode: DocBrowserMode;
   currentTab?: DocBrowserTab;
 };

package/src/shared/components/doc-browser/use-doc-link-interceptor.ts

@@ -1,36 +1,34 @@
 import { useEffect } from 'react';
-import { isDocsUrl, useDocBrowser } from './doc-browser-context';
+import { useNavigate } from 'react-router-dom';
+import { useAppPresenter } from '@/app/components/app-presenter-provider';
+import { isDocsUrl } from './doc-browser-context';
+import { toast } from 'sonner';
+import { t } from '@/shared/lib/i18n';
 
-/**
- * Global click interceptor for docs links.
- * Captures clicks on <a> tags pointing to the docs domain
- * and opens them in the in-app micro-browser instead.
- */
+/** Resource links use the same opening policy as navigation and page menus. */
 export function useDocLinkInterceptor() {
-    const docBrowser = useDocBrowser();
-
-    useEffect(() => {
-        const handler = (e: MouseEvent) => {
-            // Walk up from the click target to find an anchor
-            const anchor = (e.target as HTMLElement).closest<HTMLAnchorElement>('a[href]');
-            if (!anchor) return;
-
-            const href = anchor.getAttribute('href') || '';
-            if (!isDocsUrl(href)) return;
-
-            // Don't intercept links explicitly marked for external opening
-            if (anchor.hasAttribute('data-doc-external')) return;
-
-            // Don't intercept if modifier keys are held (user wants new tab behavior)
-            if (e.ctrlKey || e.metaKey || e.shiftKey) return;
-
-            e.preventDefault();
-            e.stopPropagation();
-            docBrowser.open(href);
-        };
-
-        // Use capture phase to intercept before React's synthetic events
-        document.addEventListener('click', handler, true);
-        return () => document.removeEventListener('click', handler, true);
-    }, [docBrowser]);
+  const app = useAppPresenter();
+  const navigate = useNavigate();
+  useEffect(() => {
+    const handler = (event: MouseEvent) => {
+      if (event.defaultPrevented || event.button !== 0 || event.ctrlKey || event.metaKey || event.shiftKey || event.altKey) return;
+      const anchor = event.target instanceof Element ? event.target.closest<HTMLAnchorElement>('a[href]') : null;
+      if (!anchor || anchor.hasAttribute('data-doc-external') || anchor.hasAttribute('download')) return;
+      const href = anchor.getAttribute('href') ?? '';
+      if (!href.startsWith('nextclaw://') && !isDocsUrl(href)) return;
+      event.preventDefault();
+      event.stopPropagation();
+      const origin = anchor.closest<HTMLElement>('[data-resource-session]');
+      const page = app.pageResourceManager.resolve(href, { workingDir: origin?.dataset.resourceWorkingDir, sessionKey: origin?.dataset.resourceSession });
+      if (page) {
+        const label = anchor.cloneNode(true) as HTMLAnchorElement;
+        label.querySelectorAll('[aria-hidden="true"]').forEach((element) => element.remove());
+        const title = label.textContent?.trim();
+        app.pageResourceManager.open(title ? { ...page, title, target: { ...page.target, title } } : page, 'default', navigate);
+      }
+      else toast.error(t('pageUnavailable'));
+    };
+    document.addEventListener('click', handler, true);
+    return () => document.removeEventListener('click', handler, true);
+  }, [app, navigate]);
 }

package/src/shared/components/doc-browser/utils/doc-browser-state.utils.ts

@@ -13,6 +13,7 @@ import {
   DOC_BROWSER_HOME_URL,
   inferTabTitle,
 } from './doc-browser-url.utils';
+import { pushNavigationHistoryEntry } from '@/shared/lib/navigation-history';
 import { t } from '@/shared/lib/i18n';
 import {
   createUiContentParamsWindowName,
@@ -44,6 +45,7 @@ export function createDocBrowserTab(
   resourceUri?: string,
   dockIcon?: DocBrowserDockIcon,
   contentParams?: UiContentParams,
+  viewState?: unknown,
 ): DocBrowserTab {
   const tabTitle = title?.trim() || inferTabTitle(url, kind, kind === 'docs' ? t('docBrowserHelp') : 'Detail');
   const normalizedResourceUri = resourceUri?.trim();
@@ -55,6 +57,7 @@ export function createDocBrowserTab(
     currentUrl: url,
     resourceUri: normalizedResourceUri ? normalizedResourceUri : undefined,
     contentParams,
+    viewState,
     dockIcon,
     dedupeKey,
     history: [url],
@@ -67,11 +70,8 @@ export function appendManualNavigation(
   tab: DocBrowserTab,
   url: string,
 ): Pick<DocBrowserTab, 'history' | 'historyIndex'> {
-  const history = [...tab.history.slice(0, tab.historyIndex + 1), url];
-  return {
-    history,
-    historyIndex: history.length - 1,
-  };
+  const next = pushNavigationHistoryEntry({ entries: tab.history, index: tab.historyIndex }, url);
+  return { history: [...next.entries], historyIndex: next.index };
 }
 
 export function updateTabForOpen(
@@ -89,6 +89,7 @@ export function updateTabForOpen(
     dockIcon: options?.dockIcon ?? target.dockIcon,
     dedupeKey,
     contentParams: target.contentParams,
+    viewState: options?.viewState ?? target.viewState ?? tab.viewState,
   };
   const hasSameUrl = routeResolver.areUrlsEquivalent(
     tab.currentUrl,
@@ -130,7 +131,6 @@ export function createDefaultDocBrowserState(): DocBrowserState {
   const initialTab = createDocBrowserTab(DOC_BROWSER_HOME_URL, DOC_BROWSER_HOME_TAB_KIND, t('docBrowserHomeTitle'));
   return {
     isOpen: false,
-    mode: 'docked',
     dockedWidth: DOC_BROWSER_DOCKED_DEFAULT_WIDTH,
     tabs: [initialTab],
     activeTabId: initialTab.id,