feat(web): terminal copy-on-select toggle and web-links polish

Wire copy-on-select in XtermSession (shared by the workspace terminal
and the /machine terminal): a header checkbox toggles the behavior and
persists to localStorage under spoon.terminal.copyOnSelect. On mount the
stored value takes precedence over the copyOnSelect prop default. When
enabled, onSelectionChange copies the current selection via
navigator.clipboard.writeText — guarded (empty selections skipped;
clipboard-unavailable/denied errors swallowed). The handler reads the
toggle through a ref so live flips apply without reconnecting.

WebLinksAddon remains loaded so printed URLs are clickable.

Manual verification: in /machine and a workspace terminal, enabling
copy-on-select and selecting text places it on the clipboard; a printed
URL is clickable and opens in a new tab.

apps/next/src/components/agent-workspace/xterm-session.tsx

@@ -13,6 +13,21 @@ import '@xterm/xterm/css/xterm.css';
 const TERMINAL_FONT =
   "var(--font-victor-mono), 'Symbols Nerd Font Mono', 'Geist Mono', ui-monospace, monospace";
 
+// Persisted user preference for copy-on-select. A stored value takes precedence
+// over the `copyOnSelect` prop default so the toggle sticks across sessions.
+const COPY_ON_SELECT_KEY = 'spoon.terminal.copyOnSelect';
+
+const readStoredCopyOnSelect = (): boolean | undefined => {
+  try {
+    const stored = window.localStorage.getItem(COPY_ON_SELECT_KEY);
+    if (stored === 'true') return true;
+    if (stored === 'false') return false;
+  } catch {
+    // localStorage may be unavailable (private mode, SSR); fall back to prop.
+  }
+  return undefined;
+};
+
 export type XtermStatus =
   | 'idle'
   | 'connecting'
@@ -95,6 +110,29 @@ export const XtermSession = ({
   const [status, setStatus] = useState<XtermStatus>('idle');
   const [errorText, setErrorText] = useState<string>();
   const [reconnectKey, setReconnectKey] = useState(0);
+  // localStorage overrides the prop default; the prop is only the initial value
+  // when nothing has been persisted yet.
+  const [copyEnabled, setCopyEnabled] = useState<boolean>(
+    () => readStoredCopyOnSelect() ?? copyOnSelect ?? false,
+  );
+  // The connect effect registers onSelectionChange once; it reads the current
+  // toggle through this ref so live flips take effect without a reconnect.
+  const copyEnabledRef = useRef(copyEnabled);
+  useEffect(() => {
+    copyEnabledRef.current = copyEnabled;
+  }, [copyEnabled]);
+
+  const toggleCopyOnSelect = () => {
+    setCopyEnabled((prev) => {
+      const next = !prev;
+      try {
+        window.localStorage.setItem(COPY_ON_SELECT_KEY, String(next));
+      } catch {
+        // Persistence is best-effort; ignore storage failures.
+      }
+      return next;
+    });
+  };
 
   // Update the live terminal's theme without tearing down the session.
   useEffect(() => {
@@ -164,13 +202,22 @@ export const XtermSession = ({
       termRef.current = term;
       fitRef.current = fit;
 
-      // Task 11 will wire clipboard copy-on-select behavior here. Accept the
-      // prop now so callers (and the effect deps) are stable across that change.
-      if (copyOnSelect) {
-        term.onSelectionChange(() => {
-          // no-op placeholder until Task 11
-        });
-      }
+      // Copy-on-select: when enabled, mirror the selection to the clipboard.
+      // Registered once; the ref lets live toggle flips apply without a
+      // reconnect. Clipboard access is guarded — it may be unavailable or
+      // denied, and empty selections are skipped.
+      term.onSelectionChange(() => {
+        if (!copyEnabledRef.current) return;
+        const selection = term.getSelection();
+        if (!selection) return;
+        try {
+          void navigator.clipboard.writeText(selection).catch(() => {
+            // clipboard write denied/unavailable; ignore
+          });
+        } catch {
+          // navigator.clipboard missing entirely; ignore
+        }
+      });
 
       const sendResize = () => {
         if (ws?.readyState !== WebSocket.OPEN) return;
@@ -285,16 +332,27 @@ export const XtermSession = ({
                     ? 'Terminal not configured'
                     : 'Connection error'}
         </p>
-        {status === 'closed' || status === 'error' ? (
-          <Button
-            type='button'
-            variant='outline'
-            size='sm'
-            onClick={() => setReconnectKey((key) => key + 1)}
-          >
-            Reconnect
-          </Button>
-        ) : null}
+        <div className='flex items-center gap-3'>
+          <label className='text-muted-foreground flex cursor-pointer items-center gap-1.5 text-xs select-none'>
+            <input
+              type='checkbox'
+              className='accent-primary size-3.5'
+              checked={copyEnabled}
+              onChange={toggleCopyOnSelect}
+            />
+            Copy on select
+          </label>
+          {status === 'closed' || status === 'error' ? (
+            <Button
+              type='button'
+              variant='outline'
+              size='sm'
+              onClick={() => setReconnectKey((key) => key + 1)}
+            >
+              Reconnect
+            </Button>
+          ) : null}
+        </div>
       </div>
       {status === 'unconfigured' ? (
         <div className='text-muted-foreground flex flex-1 items-center justify-center p-6 text-center text-sm'>