@hienlh/ppm 0.23.13 → 0.23.15

package/src/web/components/floating-window/window-persistence.ts

@@ -8,7 +8,7 @@
 
 import { clampRect, type Bounds, type Rect } from "./window-geometry";
 import { WINDOW_KINDS } from "./window-store-types";
-import type { WindowKind, WindowRuntimeState, WindowVisualState } from "./window-store-types";
+import type { WindowKind, WindowRuntimeState, WindowShownState, WindowVisualState } from "./window-store-types";
 
 const STORAGE_KEY = "ppm-windows";
 
@@ -17,7 +17,10 @@ export interface PersistedWindow {
   id: string;
   kind: WindowKind;
   rect: Rect;
+  /** Open order; absent in a blob written before the dock existed. */
+  opened?: number;
   state: WindowVisualState;
+  restoreTo?: WindowShownState;
   payload?: Record<string, unknown>;
 }
 
@@ -29,7 +32,8 @@ export interface PersistedWindow {
  * renamed (`team-member`) simply matches nothing here and is dropped the same way.
  */
 const RESTORABLE_KINDS: readonly WindowKind[] = WINDOW_KINDS.filter((k) => k !== "agent-session");
-const STATES: WindowVisualState[] = ["normal", "maximized", "minimized"];
+const STATES: WindowVisualState[] = ["normal", "maximized", "snapped", "minimized"];
+const SHOWN_STATES: WindowShownState[] = ["normal", "maximized", "snapped"];
 
 function isRect(v: unknown): v is Rect {
   if (!v || typeof v !== "object") return false;
@@ -50,7 +54,11 @@ function isSerialisable(payload: unknown): payload is Record<string, unknown> |
 
 function toPersisted(win: WindowRuntimeState): PersistedWindow | null {
   if (!isSerialisable(win.payload)) return null;
-  return { id: win.id, kind: win.kind, rect: win.rect, state: win.state, payload: win.payload };
+  return {
+    id: win.id, kind: win.kind, rect: win.rect, opened: win.opened, state: win.state,
+    ...(win.restoreTo ? { restoreTo: win.restoreTo } : {}),
+    payload: win.payload,
+  };
 }
 
 export function saveWindowRects(windows: WindowRuntimeState[]): void {
@@ -92,11 +100,16 @@ export function loadWindowRects(bounds: Bounds): PersistedWindow[] {
     const state = STATES.includes(w.state as WindowVisualState)
       ? (w.state as WindowVisualState)
       : "normal";
+    const restoreTo = SHOWN_STATES.includes(w.restoreTo as WindowShownState)
+      ? (w.restoreTo as WindowShownState)
+      : undefined;
     out.push({
       id: w.id,
       kind: w.kind as WindowKind,
       rect: clampRect(w.rect, bounds),
+      ...(typeof w.opened === "number" && Number.isFinite(w.opened) ? { opened: w.opened } : {}),
       state,
+      ...(state === "minimized" && restoreTo ? { restoreTo } : {}),
       payload: w.payload as Record<string, unknown> | undefined,
     });
   }

package/src/web/components/floating-window/window-store-types.ts

@@ -11,16 +11,27 @@ export const WINDOW_KINDS = ["explorer", "agent-session", "system-monitor", "tab
 
 export type WindowKind = (typeof WINDOW_KINDS)[number];
 
-export type WindowVisualState = "normal" | "maximized" | "minimized";
+/**
+ * `snapped` fills the right part of the layer (see `snapRect`); `minimized` takes the window
+ * off screen entirely and leaves it as a chip in the status bar's window dock.
+ */
+export type WindowVisualState = "normal" | "maximized" | "snapped" | "minimized";
+
+/** Every state a window can be brought back to from the dock. */
+export type WindowShownState = Exclude<WindowVisualState, "minimized">;
 
 export interface WindowRuntimeState {
   id: string;
   kind: WindowKind;
-  /** Geometry in layer coordinates. While maximized this holds the restore rect. */
+  /** Geometry in layer coordinates. While maximized or snapped this holds the restore rect. */
   rect: Rect;
   /** Dense stacking order, 0 = backmost, renormalised on every focus. */
   rank: number;
+  /** When the window was opened, relative to the others: the dock lists chips in this order. */
+  opened: number;
   state: WindowVisualState;
+  /** What a minimized window comes back as; absent means `normal`. */
+  restoreTo?: WindowShownState;
   /** Kind-specific, must stay JSON-serialisable to survive a reload. */
   payload?: Record<string, unknown>;
 }

package/src/web/components/floating-window/window-store.ts

@@ -15,9 +15,10 @@ import {
   type Rect,
 } from "./window-geometry";
 import { loadWindowRects, saveWindowRects } from "./window-persistence";
-import type { WindowKind, WindowRuntimeState, WindowVisualState } from "./window-store-types";
+import { isPipOnlyWindow } from "./window-pip-registry";
+import type { WindowKind, WindowRuntimeState, WindowShownState, WindowVisualState } from "./window-store-types";
 
-export type { WindowKind, WindowRuntimeState, WindowVisualState };
+export type { WindowKind, WindowRuntimeState, WindowShownState, WindowVisualState };
 
 /** Fallback layer size used before the container has been measured. */
 const DEFAULT_BOUNDS: Bounds = { w: 1280, h: 800 };
@@ -31,10 +32,20 @@ interface WindowStore {
 
   open(kind: WindowKind, payload?: Record<string, unknown>, rect?: Rect): string;
   close(id: string): void;
+  /** Raise a window to the front, bringing it back from the dock if it was minimized. */
   focus(id: string): void;
   move(id: string, position: { x: number; y: number }): void;
   resize(id: string, rect: Rect): void;
+  /** Change how a window is shown. Minimizing remembers the state to come back to. */
   setState(id: string, state: WindowVisualState): void;
+  /** Bring a window back from the dock in the state it was minimized from, and raise it. */
+  restore(id: string): void;
+  /** A dock chip's click: the window in front minimizes, any other comes forward. */
+  activateFromDock(id: string): void;
+  minimizeAll(): void;
+  /** The window being dragged towards a snap, or null; drives the layer's snap preview. */
+  snapPreviewId: string | null;
+  setSnapPreview(id: string | null): void;
   /** Merge into a window's payload; persisted so a reload restores the latest state. */
   setPayload(id: string, payload: Record<string, unknown>): void;
   setBounds(bounds: Bounds): void;
@@ -58,6 +69,19 @@ function persist(windows: Record<string, WindowRuntimeState>): void {
   saveWindowRects(Object.values(windows));
 }
 
+/** The next open-order number: one past the newest window, so the dock appends it. */
+function nextOpened(windows: WindowRuntimeState[]): number {
+  return windows.reduce((max, w) => Math.max(max, w.opened + 1), 0);
+}
+
+/** `win` in `state`, remembering what a minimized window was showing as. */
+function withState(win: WindowRuntimeState, state: WindowVisualState): WindowRuntimeState {
+  if (win.state === state) return win;
+  if (state === "minimized") return { ...win, state, restoreTo: win.state as WindowShownState };
+  const { restoreTo: _dropped, ...rest } = win;
+  return { ...rest, state };
+}
+
 function newId(): string {
   return `win-${Date.now().toString(36)}-${Math.random().toString(36).slice(2, 8)}`;
 }
@@ -66,6 +90,7 @@ export const useWindowStore = create<WindowStore>((set, get) => ({
   windows: {},
   bounds: DEFAULT_BOUNDS,
   restored: false,
+  snapPreviewId: null,
 
   open: (kind, payload, rect) => {
     const { windows, bounds } = get();
@@ -75,7 +100,7 @@ export const useWindowStore = create<WindowStore>((set, get) => ({
     // of silently dropping the request.
     if (ordered.length >= MAX_WINDOWS) {
       const oldest = ordered[0]!;
-      get().focus(oldest.id);
+      get().restore(oldest.id);
       return oldest.id;
     }
 
@@ -83,7 +108,7 @@ export const useWindowStore = create<WindowStore>((set, get) => ({
     const spawn = rect ? clampRect(rect, bounds) : cascadeSpawnRect(ordered.map((w) => w.rect), bounds);
     const next = densify([
       ...ordered,
-      { id, kind, rect: spawn, rank: ordered.length, state: "normal" as const, payload },
+      { id, kind, rect: spawn, rank: ordered.length, opened: nextOpened(ordered), state: "normal" as const, payload },
     ]);
     set({ windows: next });
     persist(next);
@@ -100,10 +125,13 @@ export const useWindowStore = create<WindowStore>((set, get) => ({
 
   focus: (id) => {
     const { windows } = get();
-    const target = windows[id];
-    if (!target) return;
+    const found = windows[id];
+    if (!found) return;
+    // Every opener that finds its window already open focuses it; one waiting in the dock
+    // has to come back on screen for that to mean anything.
+    const target = found.state === "minimized" ? withState(found, found.restoreTo ?? "normal") : found;
     const ordered = sortedByRank(windows);
-    if (ordered[ordered.length - 1]?.id === id) return; // already frontmost
+    if (target === found && ordered[ordered.length - 1]?.id === id) return; // already frontmost
     const next = densify([...ordered.filter((w) => w.id !== id), target]);
     set({ windows: next });
     persist(next); // stacking order is part of the restored layout
@@ -132,11 +160,32 @@ export const useWindowStore = create<WindowStore>((set, get) => ({
     const { windows } = get();
     const win = windows[id];
     if (!win || win.state === state) return;
-    const next = { ...windows, [id]: { ...win, state } };
+    const next = { ...windows, [id]: withState(win, state) };
+    set({ windows: next });
+    persist(next);
+  },
+
+  restore: (id) => get().focus(id),
+
+  activateFromDock: (id) => {
+    const { windows } = get();
+    if (!windows[id]) return;
+    if (frontWindowId(windows) === id) get().setState(id, "minimized");
+    else get().restore(id);
+  },
+
+  minimizeAll: () => {
+    const { windows } = get();
+    const next: Record<string, WindowRuntimeState> = {};
+    for (const win of Object.values(windows)) next[win.id] = withState(win, "minimized");
     set({ windows: next });
     persist(next);
   },
 
+  setSnapPreview: (id) => {
+    if (get().snapPreviewId !== id) set({ snapPreviewId: id });
+  },
+
   setPayload: (id, payload) => {
     const { windows } = get();
     const win = windows[id];
@@ -178,7 +227,10 @@ export const useWindowStore = create<WindowStore>((set, get) => ({
         kind: w.kind,
         rect: w.rect,
         rank,
+        // A blob from before open order was kept has none; stacking order stands in for it.
+        opened: w.opened ?? rank,
         state: w.state,
+        restoreTo: w.restoreTo,
         payload: w.payload,
       })),
     );
@@ -190,3 +242,18 @@ export const useWindowStore = create<WindowStore>((set, get) => ({
 export function windowsInRankOrder(windows: Record<string, WindowRuntimeState>): WindowRuntimeState[] {
   return sortedByRank(windows);
 }
+
+/**
+ * The window in front: the highest-ranked one still on screen. A minimized window keeps its
+ * rank so it comes back where it was in the stack, but it is never the one in front.
+ */
+export function frontWindowId(windows: Record<string, WindowRuntimeState>): string | null {
+  // A window that only carries a tab into picture-in-picture is never on screen either.
+  const shown = sortedByRank(windows).filter((w) => w.state !== "minimized" && !isPipOnlyWindow(w.id));
+  return shown[shown.length - 1]?.id ?? null;
+}
+
+/** Windows in the order they were opened — the order the dock lists them in. */
+export function windowsInOpenOrder(windows: Record<string, WindowRuntimeState>): WindowRuntimeState[] {
+  return Object.values(windows).sort((a, b) => a.opened - b.opened);
+}

package/src/web/components/floating-window/window-title-identity.tsx

@@ -0,0 +1,86 @@
+/**
+ * The parts of a window's identity both skins and the status-bar dock draw the same way: the
+ * tinted glyph tile, and the title row (title, dimmer subtitle, "working" marker).
+ *
+ * Colours come in as a CSS colour expression (a theme token) and are mixed here, so a design
+ * window's own colour and a terminal's success green go through one rule.
+ */
+
+import type { CSSProperties, ElementType } from "react";
+import { cn } from "@/lib/utils";
+
+const TILE_SIZES = {
+  sm: "size-4 rounded-[4px] [&_svg]:size-[11px]",
+  md: "size-[22px] rounded-md [&_svg]:size-3.5",
+  lg: "size-6 rounded-md [&_svg]:size-3.5",
+} as const;
+
+export interface WindowTileProps {
+  icon: ElementType;
+  tone: string;
+  size?: keyof typeof TILE_SIZES;
+  /** A design's tile is filled with its colour; every other kind gets a tint. */
+  filled?: boolean;
+  /** Dimmed: the window is minimized. */
+  muted?: boolean;
+  className?: string;
+  children?: React.ReactNode;
+}
+
+export function WindowTile({ icon: Icon, tone, size = "md", filled, muted, className, children }: WindowTileProps) {
+  const style = {
+    "--tone": tone,
+    background: filled
+      ? "linear-gradient(140deg, var(--tone), color-mix(in srgb, var(--tone) 60%, #000))"
+      : "color-mix(in srgb, var(--tone) 20%, transparent)",
+    color: filled ? "#fff" : "var(--tone)",
+  } as CSSProperties;
+  return (
+    <span
+      aria-hidden="true"
+      style={style}
+      className={cn(
+        "relative grid shrink-0 place-items-center",
+        TILE_SIZES[size],
+        muted && "opacity-55 saturate-50",
+        className,
+      )}
+    >
+      <Icon />
+      {children}
+    </span>
+  );
+}
+
+/** The pulsing dot of a window with an AI turn running; sits on a tile's corner. */
+export function WindowBusyDot({ className }: { className?: string }) {
+  return (
+    <span className={cn("absolute -right-[3px] -top-[3px] size-[7px] rounded-full bg-success ring-2 ring-panel", className)}>
+      <span className="absolute inset-0 rounded-full bg-success animate-ping motion-reduce:hidden" />
+    </span>
+  );
+}
+
+export interface WindowTitleTextProps {
+  title: string;
+  subtitle?: string;
+  busy: boolean;
+  focused: boolean;
+  className?: string;
+}
+
+/** Title, subtitle and the "Working" marker, in a row that truncates the subtitle first. */
+export function WindowTitleText({ title, subtitle, busy, focused, className }: WindowTitleTextProps) {
+  return (
+    <span className={cn("flex min-w-0 items-center gap-2", className)}>
+      <span className={cn("truncate text-[13px] font-semibold", focused ? "text-text" : "text-text-2")}>{title}</span>
+      {subtitle && <span className="min-w-0 truncate text-[11px] text-text-3 @max-[560px]/window:hidden">{subtitle}</span>}
+      {busy && (
+        <span className="flex shrink-0 items-center gap-1.5 text-[11px] text-success">
+          <span className="size-1.5 rounded-full bg-current" />
+          Working
+        </span>
+      )}
+    </span>
+  );
+}

package/src/web/components/layout/status-bar.tsx

@@ -13,6 +13,7 @@ import { WakeLockStatusBarItem } from "@/components/layout/wake-lock-indicator";
 import { countDockTabs } from "@/components/layout/dock-tabs";
 import { BranchPicker } from "@/components/git/branch-picker";
 import { DbRowsStatus } from "@/components/database/db-rows-status";
+import { WindowDock } from "@/components/floating-window/window-dock";
 import { DOCK_PANEL_ID } from "@/stores/panel-utils";
 import { cn } from "@/lib/utils";
 
@@ -45,6 +46,8 @@ export const StatusBar = memo(function StatusBar() {
         {/* Native panel toggle — the sole dock toggle (sidebar/tab-bar toggles removed). */}
         <DockToggle />
       </div>
+      {/* The floating windows' taskbar; takes the free middle, renders nothing with no windows. */}
+      <WindowDock />
       {/* Never shrinks: squeezed, CPU/MEM was its only shrinkable item and wrapped onto two lines. */}
       <div className="flex items-center gap-3 shrink-0">
         {/* Screen-awake marker — only while a wake lock is actually held. */}

package/src/web/components/layout/tab-pop-out-menu-item.tsx

@@ -15,7 +15,7 @@ import { isDocumentPipSupported } from "@/components/floating-window/pip/pip-sup
 import { ContextMenuItem, ContextMenuSeparator } from "@/components/ui/context-menu";
 import { useIsMobile } from "@/hooks/use-is-mobile";
 import { usePanelStore } from "@/stores/panel-store";
-import { NON_POPPABLE_TAB_TYPES } from "@/stores/panel-utils";
+import { NON_PIP_TAB_TYPES, NON_POPPABLE_TAB_TYPES } from "@/stores/panel-utils";
 import type { Tab } from "@/stores/tab-store";
 
 interface TabPopOutMenuItemProps {
@@ -42,7 +42,7 @@ export function TabPopOutMenuItem({ tab, panelId }: TabPopOutMenuItemProps) {
         <ExternalLink className="size-3.5 mr-2" />
         Open in window
       </ContextMenuItem>
-      {isDocumentPipSupported() && (
+      {isDocumentPipSupported() && !NON_PIP_TAB_TYPES.has(tab.type) && (
         <ContextMenuItem
           onClick={() => {
             // Nothing awaited before this call: it spends the click's activation on the PiP

package/src/web/components/logs/open-logs.ts

@@ -54,7 +54,6 @@ export function openLogs(nav?: LogsNavigation): void {
     const existing = Object.values(store.windows).find((w) => w.kind === "logs");
     if (existing) {
       if (nav?.view) store.setPayload(existing.id, { view: nav.view });
-      if (existing.state === "minimized") store.setState(existing.id, "normal");
       store.focus(existing.id);
     } else {
       const rect = cascadeSpawnRect(Object.values(store.windows).map((w) => w.rect), store.bounds, LOGS_WINDOW_SIZE);

package/src/web/components/os-explorer/actions/explorer-actions-upload.ts

@@ -14,6 +14,7 @@
 
 import { fsApi, FsError } from "@/lib/fs-api";
 import { uploadFileXhr } from "@/lib/fs-upload-xhr";
+import { randomId } from "@/lib/utils";
 import { dirnameOf, joinPath } from "../format-file-meta";
 import { fsChanged } from "../explorer-store";
 import type { DroppedEntry } from "../upload/collect-dropped-entries";
@@ -94,7 +95,7 @@ export async function uploadEntries(
 ): Promise<void> {
   if (entries.length === 0) return;
 
-  const batchId = crypto.randomUUID();
+  const batchId = randomId();
   const store = useUploadStore.getState();
   store.addBatch(
     batchId,

package/src/web/components/os-explorer/skins/macos-window-chrome.tsx

@@ -13,10 +13,11 @@
  * element that itself carries the attribute.
  */
 
-import { Minus, Plus, X } from "@/lib/icons";
+import { Minus, PanelRight, Plus, X } from "@/lib/icons";
 import { cn } from "@/lib/utils";
 import { TITLEBAR_HEIGHT, type WindowChromeProps } from "@/components/floating-window/window-chrome-contract";
 import { PipCaptionButton } from "@/components/floating-window/pip/pip-caption-button";
+import { WindowTile, WindowTitleText } from "@/components/floating-window/window-title-identity";
 
 /** The traffic-light colours, plus the unfocused grey — the documented hardcoded hexes. */
 const LIGHTS = [
@@ -25,8 +26,12 @@ const LIGHTS = [
   { color: "#28C840", label: "Maximize window", Icon: Plus },
 ] as const;
 
+/** Same box as the PiP button's default, so the two right-hand buttons line up. */
+const SIDE_BUTTON =
+  "grid place-items-center size-6 rounded text-text-2 can-hover:hover:bg-surface-elevated can-hover:hover:text-text transition-colors";
+
 export function MacosWindowChrome({
-  id, title, focused, titlebarProps, onMinimize, onToggleMaximize, onClose,
+  id, kind, title, state, focused, titlebarProps, identity, onMinimize, onToggleMaximize, onToggleSnap, onClose,
 }: WindowChromeProps) {
   const { className, style, ...rest } = titlebarProps;
   const actions = [onClose, onMinimize, onToggleMaximize];
@@ -62,16 +67,17 @@ export function MacosWindowChrome({
       {/* A flex child, not an absolutely centred span: the title is boxed between the
           traffic lights and the caption button, so a long title truncates instead of
           painting over either of them. Centre is a few px off true middle — acceptable. */}
-      <span
-        className={cn(
-          "pointer-events-none flex-1 min-w-0 truncate text-center text-[13px] px-2",
-          focused ? "text-text" : "text-text-2",
-        )}
-      >
-        {title}
+      <span className="pointer-events-none flex flex-1 min-w-0 items-center justify-center gap-2 px-2">
+        {kind !== "explorer" && <WindowTile icon={identity.icon} tone={identity.tone} size="sm" />}
+        <WindowTitleText title={title} subtitle={identity.subtitle} busy={identity.busy} focused={focused} />
       </span>
-      <div className="flex items-center pr-2">
-        <PipCaptionButton id={id} />
+      <div className="flex items-center gap-0.5 pr-2">
+        {identity.allowPip && <PipCaptionButton id={id} />}
+        <button type="button" aria-label="Snap to the right"
+          title={state === "snapped" ? "Unsnap" : "Snap to the right"} aria-pressed={state === "snapped"}
+          className={cn(SIDE_BUTTON, state === "snapped" && "text-primary")} onClick={onToggleSnap}>
+          <PanelRight className="size-3.5" />
+        </button>
       </div>
     </div>
   );

package/src/web/components/os-explorer/skins/windows-window-chrome.tsx

@@ -15,10 +15,11 @@
  * `--x-radius`, `--x-font`) only resolve on an element that itself carries the attribute.
  */
 
-import { Minus, Square, Copy, X } from "@/lib/icons";
+import { Minus, Square, Copy, X, PanelRight } from "@/lib/icons";
 import { cn } from "@/lib/utils";
 import { TITLEBAR_HEIGHT, type WindowChromeProps } from "@/components/floating-window/window-chrome-contract";
 import { PipCaptionButton } from "@/components/floating-window/pip/pip-caption-button";
+import { WindowTile, WindowTitleText } from "@/components/floating-window/window-title-identity";
 import { WindowsFolderIcon } from "./folder-icon-windows";
 
 /** Windows metric: 46px wide caption buttons, full titlebar height. */
@@ -28,7 +29,7 @@ const CAPTION_BUTTON =
 const CLOSE_BUTTON = cn(CAPTION_BUTTON, "can-hover:hover:!bg-[#c42b1c] can-hover:hover:!text-white");
 
 export function WindowsWindowChrome({
-  id, kind, title, state, focused, titlebarProps, onMinimize, onToggleMaximize, onClose,
+  id, kind, title, state, focused, titlebarProps, identity, onMinimize, onToggleMaximize, onToggleSnap, onClose,
 }: WindowChromeProps) {
   const { className, style, ...rest } = titlebarProps;
   return (
@@ -44,10 +45,18 @@ export function WindowsWindowChrome({
       )}
     >
       <div className="flex flex-1 min-w-0 items-center gap-2 px-2.5 cursor-default">
-        {kind === "explorer" && <WindowsFolderIcon className="size-4 shrink-0" />}
-        <span className={cn("truncate text-[12px]", focused ? "text-text" : "text-text-2")}>{title}</span>
+        {kind === "explorer"
+          ? <WindowsFolderIcon className="size-4 shrink-0" />
+          : <WindowTile icon={identity.icon} tone={identity.tone} />}
+        <WindowTitleText title={title} subtitle={identity.subtitle} busy={identity.busy} focused={focused} />
       </div>
-      <PipCaptionButton id={id} className={CAPTION_BUTTON} />
+      {identity.allowPip && <PipCaptionButton id={id} className={CAPTION_BUTTON} />}
+      <button type="button" aria-label="Snap to the right"
+        title={state === "snapped" ? "Unsnap" : "Snap to the right"}
+        aria-pressed={state === "snapped"}
+        className={cn(CAPTION_BUTTON, state === "snapped" && "text-primary")} onClick={onToggleSnap}>
+        <PanelRight className="size-3.5" />
+      </button>
       <button type="button" aria-label="Minimize window" className={CAPTION_BUTTON} onClick={onMinimize}>
         <Minus className="size-3.5" />
       </button>

package/src/web/components/remote-desktop/use-remote-desktop-readiness.ts

@@ -5,7 +5,8 @@
  * Mirrors the server types in `src/services/remote-desktop/remote-desktop-requirements.ts` —
  * the UI renders whatever items arrive and never branches on the host OS. Polls while `poll`
  * is on so a permission granted in System Settings (or `brew install ffmpeg` finishing in the
- * dock terminal) flips the panel without a reload.
+ * dock terminal) flips the panel without a reload — and only until the host is ready, when
+ * there is nothing left to flip.
  */
 import { useCallback, useEffect, useState } from "react";
 import { api } from "@/lib/api-client";
@@ -142,11 +143,15 @@ export function useRemoteDesktopReadiness(poll: boolean): {
     return () => { cancelled = true; };
   }, [tick]);
 
+  // A ready host stops the poll. The gate is then showing the viewer for the rest of the
+  // session, and every poll re-ran the host's probes for it — on a Wayland host without a GPU
+  // encoder, four `gst-inspect-1.0` every two seconds beside a software encode.
+  const ready = !!caps?.videoReady && caps.inputReady;
   useEffect(() => {
-    if (!poll) return;
+    if (!poll || ready) return;
     const timer = setInterval(refresh, READINESS_POLL_MS);
     return () => clearInterval(timer);
-  }, [poll, refresh]);
+  }, [poll, ready, refresh]);
 
   const runHostAction = useCallback(async (id: string, action: "request" | "open-settings") => {
     try { await api.post(`/api/remote-desktop/requirements/${encodeURIComponent(id)}/${action}`); } catch { /* panel shows state on next poll */ }

package/src/web/components/settings/accounts/account-add-dialog.tsx

@@ -5,6 +5,7 @@ import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
 import { Loader2 } from "@/lib/icons";
 import { addAccount, getOAuthUrl, exchangeOAuthCode } from "../../../lib/api-settings";
+import { ApiError } from "../../../lib/api-client";
 
 // ── Add Account Dialog ─────────────────────────────────────────────
 
@@ -13,10 +14,11 @@ interface AddAccountDialogProps {
   onOpenChange: (open: boolean) => void;
   onSuccess: (msg?: string) => void;
   /**
-   * The label of an account being signed in again. Only the wording changes: the add flow
-   * already updates an account it matches by email or profile id, clearing its re-auth flag.
+   * The account being signed in again. The add flow already updates an account it matches by
+   * email or profile id, clearing its re-auth flag; the id tells the dialog whether the sign-in
+   * landed on this account or on another one.
    */
-  signInAgainFor?: string;
+  signInAgainFor?: { id: string; label: string };
 }
 
 export function AddAccountDialog({ open, onOpenChange, onSuccess, signInAgainFor }: AddAccountDialogProps) {
@@ -63,17 +65,27 @@ export function AddAccountDialog({ open, onOpenChange, onSuccess, signInAgainFor
     setOauthLoading(true);
     setAddError(null);
     try {
-      let code = oauthCode.trim();
-      if (code.includes("#")) code = code.split("#")[0] ?? code;
-      const acc = await exchangeOAuthCode(code, oauthState);
+      // Sent whole: the `#state` after the code names the link it came from, which may be an
+      // earlier one than `oauthState`.
+      const acc = await exchangeOAuthCode(oauthCode.trim(), oauthState);
       handleClose();
-      // Signing in again on an account this machine parked carries the token in but
-      // deliberately leaves it out of the rotation. A flat success over a toggle that is
-      // still off reads as a bug, and this is the only place the user finds out otherwise.
-      onSuccess(acc?.status === "disabled"
-        ? "Signed in. This account is still disabled — enable it to use it."
-        : "Account connected via OAuth!");
+      if (signInAgainFor && acc && acc.id !== signInAgainFor.id) {
+        // Claude signed in a different account than the one this dialog renews. That sign-in is
+        // kept — the code is spent by the time PPM learns whose it is — but it must not read as
+        // the renewal the user asked for.
+        const other = acc.email || acc.label || acc.id.slice(0, 8);
+        onSuccess(`Signed in to ${other}, not ${signInAgainFor.label}. ${signInAgainFor.label} is still signed out — click "Sign in again" on it to fix it.`);
+      } else {
+        // Signing in again on an account this machine parked carries the token in but
+        // deliberately leaves it out of the rotation. A flat success over a toggle that is
+        // still off reads as a bug, and this is the only place the user finds out otherwise.
+        onSuccess(acc?.status === "disabled"
+          ? "Signed in. This account is still disabled — enable it to use it."
+          : "Account connected via OAuth!");
+      }
     } catch (e) {
+      // The server no longer holds that link, so no code can finish it: back to Login with Claude.
+      if (e instanceof ApiError && e.status === 410) resetOAuth();
       setAddError((e as Error).message);
     }
     setOauthLoading(false);
@@ -105,7 +117,7 @@ export function AddAccountDialog({ open, onOpenChange, onSuccess, signInAgainFor
     <Dialog open={open} onOpenChange={(v) => { if (!v) handleClose(); }}>
       <DialogContent className="sm:max-w-md">
         <DialogHeader>
-          <DialogTitle className="text-sm">{signInAgainFor ? `Sign in again — ${signInAgainFor}` : "Add Claude Account"}</DialogTitle>
+          <DialogTitle className="text-sm">{signInAgainFor ? `Sign in again — ${signInAgainFor.label}` : "Add Claude Account"}</DialogTitle>
           <DialogDescription className="text-xs leading-relaxed">
             {signInAgainFor
               ? "Log in with the same Claude account. PPM matches it by email and renews the existing card instead of adding a new one."

package/src/web/components/settings/accounts/claude-accounts-section.tsx

@@ -40,8 +40,8 @@ export function ClaudeAccountsSection() {
   const [profileView, setProfileView] = useState<{ profile: OAuthProfileData; accountId: string } | null>(null);
   const [exportPreselect, setExportPreselect] = useState<string | null>(null);
   const [dialog, setDialog] = useState<"add" | "export" | "import" | "rotation" | "token-test" | null>(null);
-  /** Label of the account whose "Sign in again" chip opened the add dialog. */
-  const [signInAgainFor, setSignInAgainFor] = useState<string | undefined>(undefined);
+  /** The account whose "Sign in again" chip opened the add dialog. */
+  const [signInAgainFor, setSignInAgainFor] = useState<{ id: string; label: string } | undefined>(undefined);
 
   function handleSuccess(msg?: string) {
     void reload();
@@ -140,7 +140,7 @@ export function ClaudeAccountsSection() {
                 onDelete={(id, display) => setDeleteTarget({ id, display })}
                 onExport={(id) => { setExportPreselect(id); setDialog("export"); }}
                 onViewProfile={(profile, accountId) => setProfileView({ profile, accountId })}
-                onReauth={() => { setSignInAgainFor(entry.accountLabel ?? entry.accountId.slice(0, 8)); setDialog("add"); }}
+                onReauth={() => { setSignInAgainFor({ id: entry.accountId, label: entry.accountLabel ?? entry.accountId.slice(0, 8) }); setDialog("add"); }}
                 flash={flashIds.has(entry.accountId)}
               />
             ))}

package/src/web/components/settings/ai-settings-section.tsx

@@ -210,26 +210,6 @@ export function AISettingsSection({ compact }: { compact?: boolean } = {}) {
         />
       </div>
 
-      <div className="flex items-start justify-between gap-3 rounded-md border border-border p-3">
-        <div className={fieldGap}>
-          <Label htmlFor="ai-tab-tools" className={compact ? labelSize : undefined}>
-            Let the AI open tabs in PPM
-          </Label>
-          <p id="ai-tab-tools-description" className={`${compact ? "text-[9px]" : "text-[11px]"} text-muted-foreground`}>
-            The AI can open files in a PPM tab on your device, and show the pages, charts and reports
-            it makes, seeing their errors and a screenshot. Turns off Claude's claude.ai Artifact tool.
-            Applies to new chats.
-          </p>
-        </div>
-        <Switch
-          id="ai-tab-tools"
-          aria-describedby="ai-tab-tools-description"
-          checked={settings.tab_tools ?? false}
-          disabled={saving}
-          onCheckedChange={(checked) => handleSettingsSave({ tab_tools: checked })}
-        />
-      </div>
-
       {/* Provider tabs */}
       {providerTabs.length > 1 && (
         <div className="flex gap-0.5 border-b border-border/50 -mx-1 px-1">