diff --git a/clients/web/src/App.test.tsx b/clients/web/src/App.test.tsx
index 19d43ae48..c66cb03bf 100644
--- a/clients/web/src/App.test.tsx
+++ b/clients/web/src/App.test.tsx
@@ -7,6 +7,21 @@ import {
 } from "./test/renderWithMantine";
 import userEvent from "@testing-library/user-event";
 
+// Spy on the toast layer so the progress-notification tests can assert the
+// show/update calls without mounting Mantine's <Notifications/> portal.
+// `vi.hoisted` lets the mock factory (hoisted above imports) reach the spies.
+const { notificationsMock } = vi.hoisted(() => ({
+  notificationsMock: {
+    show: vi.fn(),
+    update: vi.fn(),
+    hide: vi.fn(),
+    clean: vi.fn(),
+  },
+}));
+vi.mock("@mantine/notifications", () => ({
+  notifications: notificationsMock,
+}));
+
 // App is a wiring component: it owns session-scoped UI state (the per-call
 // result panels and the optimistic log level) and resets it when the active
 // InspectorClient emits `disconnect`. These tests exercise that reset in
@@ -177,10 +192,37 @@ vi.mock("@inspector/core/react/useSettingsDraft.js", () => ({
 vi.mock("./components/views/InspectorView/InspectorView", () => ({
   InspectorView: (props: {
     toolCallState?: { status?: string };
+    toolsUi?: {
+      selectedToolName?: string;
+      formValues: Record<string, unknown>;
+      search: string;
+    };
+    promptsUi?: {
+      selectedPromptName?: string;
+      argumentValues: Record<string, string>;
+      submittedFor?: string;
+      search: string;
+    };
+    logsUi?: { filterText: string; visibleLevels: Record<string, boolean> };
     getPromptState?: { status?: string };
     readResourceState?: { status?: string };
     currentLogLevel?: string;
     onToggleConnection: (id: string) => void;
+    onToolsUiChange: (next: {
+      selectedToolName?: string;
+      formValues: Record<string, unknown>;
+      search: string;
+    }) => void;
+    onPromptsUiChange: (next: {
+      selectedPromptName?: string;
+      argumentValues: Record<string, string>;
+      submittedFor?: string;
+      search: string;
+    }) => void;
+    onLogsUiChange: (next: {
+      filterText: string;
+      visibleLevels: Record<string, boolean>;
+    }) => void;
     onCallTool: (name: string, args: Record<string, unknown>) => void;
     onGetPrompt: (name: string, args: Record<string, string>) => void;
     onReadResource: (uri: string) => void;
@@ -190,6 +232,14 @@ vi.mock("./components/views/InspectorView/InspectorView", () => ({
       <span data-testid="tool-status">
         {props.toolCallState?.status ?? "none"}
       </span>
+      <span data-testid="selected-tool">
+        {props.toolsUi?.selectedToolName ?? "none"}
+      </span>
+      <span data-testid="tool-search">{props.toolsUi?.search || "none"}</span>
+      <span data-testid="selected-prompt">
+        {props.promptsUi?.selectedPromptName ?? "none"}
+      </span>
+      <span data-testid="log-filter">{props.logsUi?.filterText || "none"}</span>
       <span data-testid="prompt-status">
         {props.getPromptState?.status ?? "none"}
       </span>
@@ -198,6 +248,64 @@ vi.mock("./components/views/InspectorView/InspectorView", () => ({
       </span>
       <span data-testid="log-level">{props.currentLogLevel}</span>
       <button onClick={() => props.onToggleConnection("A")}>connect</button>
+      <button
+        onClick={() =>
+          props.onToolsUiChange({
+            formValues: {},
+            search: "",
+            ...props.toolsUi,
+            selectedToolName: "get_acts",
+          })
+        }
+      >
+        select-tool
+      </button>
+      <button
+        onClick={() =>
+          props.onToolsUiChange({
+            formValues: {},
+            search: "",
+            ...props.toolsUi,
+            selectedToolName: "other_tool",
+          })
+        }
+      >
+        select-other-tool
+      </button>
+      <button
+        onClick={() =>
+          props.onToolsUiChange({
+            formValues: {},
+            ...props.toolsUi,
+            search: "act",
+          })
+        }
+      >
+        set-tool-search
+      </button>
+      <button
+        onClick={() =>
+          props.onPromptsUiChange({
+            argumentValues: {},
+            search: "",
+            ...props.promptsUi,
+            selectedPromptName: "greet",
+          })
+        }
+      >
+        select-prompt
+      </button>
+      <button
+        onClick={() =>
+          props.onLogsUiChange({
+            visibleLevels: {},
+            ...props.logsUi,
+            filterText: "err",
+          })
+        }
+      >
+        set-log-filter
+      </button>
       <button onClick={() => props.onCallTool("get_acts", {})}>call</button>
       <button onClick={() => props.onGetPrompt("greet", {})}>get-prompt</button>
       <button onClick={() => props.onReadResource("res://x")}>
@@ -238,13 +346,29 @@ describe("App session-scoped state reset on disconnect", () => {
       expect(screen.getByTestId("resource-status")).toHaveTextContent("ok");
     });
 
+    // Set App-owned per-screen UI state (selection + search + filter) — all of
+    // it persists across navigation, so all of it must reset on disconnect
+    // (#1417). A representative sample across screens exercises the shared
+    // `resetSessionScopedUiState` wiring.
+    await user.click(screen.getByText("select-tool"));
+    await user.click(screen.getByText("set-tool-search"));
+    await user.click(screen.getByText("select-prompt"));
+    await user.click(screen.getByText("set-log-filter"));
+    await waitFor(() => {
+      expect(screen.getByTestId("selected-tool")).toHaveTextContent("get_acts");
+      expect(screen.getByTestId("tool-search")).toHaveTextContent("act");
+      expect(screen.getByTestId("selected-prompt")).toHaveTextContent("greet");
+      expect(screen.getByTestId("log-filter")).toHaveTextContent("err");
+    });
+
     // Bump the optimistic log level off its "info" default.
     await user.click(screen.getByText("set-level"));
     await waitFor(() =>
       expect(screen.getByTestId("log-level")).toHaveTextContent("debug"),
     );
 
-    // Disconnect: every panel empties and the level returns to "info".
+    // Disconnect: every panel empties, all per-screen UI state clears, and the
+    // level returns to "info".
     act(() => {
       clientInstances[0].dispatchEvent(new Event("disconnect"));
     });
@@ -254,8 +378,159 @@ describe("App session-scoped state reset on disconnect", () => {
       expect(screen.getByTestId("prompt-status")).toHaveTextContent("none");
       expect(screen.getByTestId("resource-status")).toHaveTextContent("none");
     });
+    expect(screen.getByTestId("selected-tool")).toHaveTextContent("none");
+    expect(screen.getByTestId("tool-search")).toHaveTextContent("none");
+    expect(screen.getByTestId("selected-prompt")).toHaveTextContent("none");
+    expect(screen.getByTestId("log-filter")).toHaveTextContent("none");
     expect(screen.getByTestId("log-level")).toHaveTextContent("info");
   });
+
+  it("persists the selected tool across navigation within a live session", async () => {
+    const user = userEvent.setup();
+    renderWithMantine(<App />);
+
+    await user.click(screen.getByText("connect"));
+    await waitFor(() => expect(clientInstances).toHaveLength(1));
+
+    // The selection lives in App (not the unmounting ToolsScreen), so once set
+    // it stays put through re-renders / tab switches until the session ends.
+    await user.click(screen.getByText("select-tool"));
+    await waitFor(() =>
+      expect(screen.getByTestId("selected-tool")).toHaveTextContent("get_acts"),
+    );
+  });
+
+  it("drops the previous tool's result when a different tool is selected", async () => {
+    const user = userEvent.setup();
+    renderWithMantine(<App />);
+
+    await user.click(screen.getByText("connect"));
+    await waitFor(() => expect(clientInstances).toHaveLength(1));
+
+    // Select a tool and run it so the result panel is populated.
+    await user.click(screen.getByText("select-tool"));
+    await user.click(screen.getByText("call"));
+    await waitFor(() =>
+      expect(screen.getByTestId("tool-status")).toHaveTextContent("ok"),
+    );
+
+    // Selecting a *different* tool clears the stale result so it doesn't linger
+    // under the new selection.
+    await user.click(screen.getByText("select-other-tool"));
+    await waitFor(() => {
+      expect(screen.getByTestId("selected-tool")).toHaveTextContent(
+        "other_tool",
+      );
+      expect(screen.getByTestId("tool-status")).toHaveTextContent("none");
+    });
+  });
+
+  it("keeps the result when the same tool stays selected (search/form edits)", async () => {
+    const user = userEvent.setup();
+    renderWithMantine(<App />);
+
+    await user.click(screen.getByText("connect"));
+    await waitFor(() => expect(clientInstances).toHaveLength(1));
+
+    await user.click(screen.getByText("select-tool"));
+    await user.click(screen.getByText("call"));
+    await waitFor(() =>
+      expect(screen.getByTestId("tool-status")).toHaveTextContent("ok"),
+    );
+
+    // A search keystroke leaves `selectedToolName` unchanged, so the result
+    // stays put.
+    await user.click(screen.getByText("set-tool-search"));
+    await waitFor(() =>
+      expect(screen.getByTestId("tool-search")).toHaveTextContent("act"),
+    );
+    expect(screen.getByTestId("tool-status")).toHaveTextContent("ok");
+  });
+});
+
+describe("App tool progress toasts", () => {
+  beforeEach(() => {
+    clientInstances.length = 0;
+    notificationsMock.show.mockClear();
+    notificationsMock.update.mockClear();
+    notificationsMock.hide.mockClear();
+  });
+
+  it("shows a toast on the first progress tick and updates it on later ticks", async () => {
+    const user = userEvent.setup();
+    renderWithMantine(<App />);
+
+    await user.click(screen.getByText("connect"));
+    await waitFor(() => expect(clientInstances).toHaveLength(1));
+
+    // First tick of a progress stream → a fresh toast keyed by its stream id.
+    act(() => {
+      clientInstances[0].dispatchEvent(
+        new CustomEvent("progressNotification", {
+          detail: { progress: 1, total: 4, message: "Working" },
+        }),
+      );
+    });
+    expect(notificationsMock.show).toHaveBeenCalledTimes(1);
+    const shown = notificationsMock.show.mock.calls[0][0];
+    expect(shown.title).toBe("Tool progress");
+    expect(shown.message).toBe("Working — 1 / 4 (25%)");
+
+    // Second tick on the same stream → the existing toast is updated, not
+    // stacked, so a chatty server doesn't flood the corner.
+    act(() => {
+      clientInstances[0].dispatchEvent(
+        new CustomEvent("progressNotification", {
+          detail: { progress: 2, total: 4, message: "Working" },
+        }),
+      );
+    });
+    expect(notificationsMock.show).toHaveBeenCalledTimes(1);
+    expect(notificationsMock.update).toHaveBeenCalledTimes(1);
+    expect(notificationsMock.update.mock.calls[0][0].message).toBe(
+      "Working — 2 / 4 (50%)",
+    );
+  });
+
+  it("formats a totalless progress tick as the bare count", async () => {
+    const user = userEvent.setup();
+    renderWithMantine(<App />);
+
+    await user.click(screen.getByText("connect"));
+    await waitFor(() => expect(clientInstances).toHaveLength(1));
+
+    act(() => {
+      clientInstances[0].dispatchEvent(
+        new CustomEvent("progressNotification", {
+          detail: { progress: 7 },
+        }),
+      );
+    });
+    expect(notificationsMock.show.mock.calls[0][0].message).toBe("7");
+  });
+
+  it("dismisses still-visible progress toasts when the client is torn down", async () => {
+    const user = userEvent.setup();
+    const { unmount } = renderWithMantine(<App />);
+
+    await user.click(screen.getByText("connect"));
+    await waitFor(() => expect(clientInstances).toHaveLength(1));
+
+    act(() => {
+      clientInstances[0].dispatchEvent(
+        new CustomEvent("progressNotification", {
+          detail: { progress: 1, total: 4 },
+        }),
+      );
+    });
+    const id = notificationsMock.show.mock.calls[0][0].id;
+
+    // Tearing down the client (here via unmount; same path as a server swap)
+    // hides the live toast so it can't linger into — or race with — the next
+    // session, rather than waiting out its auto-close window.
+    unmount();
+    expect(notificationsMock.hide).toHaveBeenCalledWith(id);
+  });
 });
 
 describe("App pending server-initiated request modal", () => {
diff --git a/clients/web/src/App.tsx b/clients/web/src/App.tsx
index fac217582..dbbd8ad29 100644
--- a/clients/web/src/App.tsx
+++ b/clients/web/src/App.tsx
@@ -13,10 +13,16 @@ import type {
   InitializeResult,
   LoggingLevel,
   LoggingMessageNotification,
+  Progress,
+  ProgressToken,
   Tool,
 } from "@modelcontextprotocol/sdk/types.js";
 import { InspectorClient } from "@inspector/core/mcp/index.js";
-import type { JsonValue } from "@inspector/core/mcp/index.js";
+import type {
+  InspectorClientEventMap,
+  JsonValue,
+} from "@inspector/core/mcp/index.js";
+import type { TypedEventGeneric } from "@inspector/core/mcp/typedEventTarget.js";
 import type {
   InspectorServerSettings,
   MCPServerConfig,
@@ -59,9 +65,23 @@ import { useFetchRequestLog } from "@inspector/core/react/useFetchRequestLog.js"
 import { useSandboxUrl } from "@inspector/core/react/useSandboxUrl.js";
 import { usePendingClientRequests } from "@inspector/core/react/usePendingClientRequests.js";
 import { InspectorView } from "./components/views/InspectorView/InspectorView";
-import type { ToolCallState } from "./components/screens/ToolsScreen/ToolsScreen";
+import type {
+  ToolCallState,
+  ToolsUiState,
+} from "./components/screens/ToolsScreen/ToolsScreen";
 import type { GetPromptState } from "./components/screens/PromptsScreen/PromptsScreen";
 import type { ReadResourceState } from "./components/screens/ResourcesScreen/ResourcesScreen";
+import {
+  EMPTY_TOOLS_UI,
+  EMPTY_PROMPTS_UI,
+  EMPTY_RESOURCES_UI,
+  EMPTY_APPS_UI,
+  EMPTY_TASKS_UI,
+  EMPTY_LOGS_UI,
+  EMPTY_HISTORY_UI,
+  EMPTY_NETWORK_UI,
+} from "./components/screens/screenUiState";
+import { clearScrollMemory } from "./hooks/useScrollMemory";
 import type { AppRendererHandle } from "./components/elements/AppRenderer/AppRenderer";
 import { createAppBridgeFactory } from "./components/elements/AppRenderer/createAppBridgeFactory";
 import type { LogEntryData } from "./components/elements/LogEntry/LogEntry";
@@ -195,6 +215,34 @@ const OutputValidationToastMessage = ({
   </Stack>
 );
 
+// How long a progress toast lingers after its last tick. Each new tick on the
+// same progress stream resets this window (via `notifications.update`), so a
+// steady stream keeps one toast alive; the toast clears a few seconds after
+// progress stops (i.e. the call finished or went quiet).
+const PROGRESS_TOAST_AUTOCLOSE_MS = 5000;
+
+// Stable toast id for a progress stream. Notifications keyed by this id are
+// replaced (not stacked) so a chatty server updates one toast per stream
+// rather than flooding the corner. The injected `progressToken` correlates a
+// stream with the request that triggered it; when absent (the common case —
+// the inspector doesn't expose a caller token), all ticks share one toast.
+function progressToastId(token: ProgressToken | undefined): string {
+  return `progress-${String(token ?? "default")}`;
+}
+
+// One-line toast body: "<message> — <progress> / <total> (NN%)". The fraction
+// and percentage are omitted when the server sends no `total`.
+function formatProgressToastMessage(
+  detail: Progress & { progressToken?: ProgressToken },
+): string {
+  const { progress, total, message } = detail;
+  const ratio =
+    total !== undefined && total > 0
+      ? `${progress} / ${total} (${Math.round((progress / total) * 100)}%)`
+      : `${progress}`;
+  return message ? `${message} — ${ratio}` : ratio;
+}
+
 function App() {
   // Theme toggle plumbing (preserved from the pre-wire placeholder).
   const { setColorScheme } = useMantineColorScheme();
@@ -314,6 +362,23 @@ function App() {
     ReadResourceState | undefined
   >(undefined);
 
+  // Per-screen selection / search / filter state, one object per screen. Lifted
+  // here (out of the individual screens) so it persists across tab navigation
+  // within a live session — the screens unmount on tab switch, so screen-local
+  // state would be lost. Cleared only on disconnect (via
+  // `resetSessionScopedUiState`) or an explicit user action, never on plain
+  // navigation (#1414/#1417). The in-flight result panels (`toolCallState` /
+  // `getPromptState` / `readResourceState`) stay separate — they're written by
+  // the async action handlers below, not by the screens.
+  const [toolsUi, setToolsUi] = useState(EMPTY_TOOLS_UI);
+  const [promptsUi, setPromptsUi] = useState(EMPTY_PROMPTS_UI);
+  const [resourcesUi, setResourcesUi] = useState(EMPTY_RESOURCES_UI);
+  const [appsUi, setAppsUi] = useState(EMPTY_APPS_UI);
+  const [tasksUi, setTasksUi] = useState(EMPTY_TASKS_UI);
+  const [logsUi, setLogsUi] = useState(EMPTY_LOGS_UI);
+  const [historyUi, setHistoryUi] = useState(EMPTY_HISTORY_UI);
+  const [networkUi, setNetworkUi] = useState(EMPTY_NETWORK_UI);
+
   // Handshake telemetry. `connectStartRef` is set at the "connecting" edge
   // and consumed at the "connected" edge — a ref (not state) so the
   // intervening rerenders don't reset it.
@@ -325,6 +390,12 @@ function App() {
   // render; this ref ensures the token exchange fires exactly once per load.
   const oauthCallbackHandledRef = useRef(false);
 
+  // Tracks which progress streams currently have a live toast, so each new tick
+  // updates the existing toast instead of stacking a fresh one. Entries are
+  // removed when their toast closes (auto-dismiss or user). A ref (not state)
+  // because it's incidental bookkeeping that must not trigger re-renders.
+  const progressToastIdsRef = useRef<Set<string>>(new Set());
+
   // Hook layer. Each hook subscribes to its respective event source and
   // re-renders the App on change. When `inspectorClient` / state managers
   // are null, the hooks degrade to empty results.
@@ -410,7 +481,18 @@ function App() {
     setToolCallState(undefined);
     setGetPromptState(undefined);
     setReadResourceState(undefined);
+    setToolsUi(EMPTY_TOOLS_UI);
+    setPromptsUi(EMPTY_PROMPTS_UI);
+    setResourcesUi(EMPTY_RESOURCES_UI);
+    setAppsUi(EMPTY_APPS_UI);
+    setTasksUi(EMPTY_TASKS_UI);
+    setLogsUi(EMPTY_LOGS_UI);
+    setHistoryUi(EMPTY_HISTORY_UI);
+    setNetworkUi(EMPTY_NETWORK_UI);
     setCurrentLogLevel("info");
+    // Remembered scroll offsets are session-scoped too — drop them so the next
+    // session's screens start at the top (#1417).
+    clearScrollMemory();
   }, []);
 
   // Reset activeServerId whenever the live session ends. Without this the
@@ -438,6 +520,56 @@ function App() {
     };
   }, [inspectorClient, resetSessionScopedUiState]);
 
+  // Surface incoming `notifications/progress` as toasts so the user can watch a
+  // long-running tool's progress while staying on the tool view — the v2
+  // replacement for v1's always-visible "Server Notifications" shelf (#1414).
+  // The full notification history still lives in the History tab; these toasts
+  // are the at-a-glance, in-context signal. Toasts are keyed by progress stream
+  // (see `progressToastId`) and replaced per tick so a chatty server updates one
+  // toast rather than stacking one per tick.
+  useEffect(() => {
+    if (!inspectorClient) return;
+    const liveToastIds = progressToastIdsRef.current;
+    const onProgress = (
+      event: TypedEventGeneric<InspectorClientEventMap, "progressNotification">,
+    ) => {
+      const detail = event.detail;
+      const id = progressToastId(detail.progressToken);
+      const message = formatProgressToastMessage(detail);
+      if (liveToastIds.has(id)) {
+        notifications.update({
+          id,
+          title: "Tool progress",
+          message,
+          color: "blue",
+          autoClose: PROGRESS_TOAST_AUTOCLOSE_MS,
+        });
+        return;
+      }
+      liveToastIds.add(id);
+      notifications.show({
+        id,
+        title: "Tool progress",
+        message,
+        color: "blue",
+        autoClose: PROGRESS_TOAST_AUTOCLOSE_MS,
+        onClose: () => liveToastIds.delete(id),
+      });
+    };
+    inspectorClient.addEventListener("progressNotification", onProgress);
+    return () => {
+      inspectorClient.removeEventListener("progressNotification", onProgress);
+      // Dismiss any still-visible progress toasts when the client is swapped
+      // out, then drop the stream bookkeeping. Hiding them (rather than letting
+      // them auto-close up to PROGRESS_TOAST_AUTOCLOSE_MS later) keeps a stale
+      // "Tool progress" toast from lingering into the next session, and avoids
+      // a race where the lingering toast's `onClose` would later delete an id
+      // from the *new* session's set and trigger a duplicate-id re-show.
+      liveToastIds.forEach((id) => notifications.hide(id));
+      liveToastIds.clear();
+    };
+  }, [inspectorClient]);
+
   // Build the InitializeResult the connected ViewHeader expects from the
   // hook's split fields. `protocolVersion` is hard-coded for now — the
   // useInspectorClient hook doesn't expose it. TODO(#1324): consume the
@@ -929,6 +1061,23 @@ function App() {
     setToolCallState(undefined);
   }, []);
 
+  // Tools UI changes flow through here so selecting a *different* tool also
+  // drops the previous tool's result — the result panel renders `toolCallState`
+  // regardless of selection, so without this a stale result would linger under
+  // the newly-selected tool (which has no result of its own yet). Search and
+  // form edits keep `selectedToolName` unchanged, so they leave the result be.
+  // Depends on `selectedToolName` only (not the whole `toolsUi`), so a search
+  // keystroke doesn't churn the callback identity.
+  const onToolsUiChange = useCallback(
+    (next: ToolsUiState) => {
+      if (next.selectedToolName !== toolsUi.selectedToolName) {
+        setToolCallState(undefined);
+      }
+      setToolsUi(next);
+    },
+    [toolsUi.selectedToolName],
+  );
+
   // --- MCP Apps handlers. Unlike onCallTool (which feeds the Tools panel),
   // these route the tool input/result into the running app via the renderer's
   // imperative handle. ---
@@ -1424,6 +1573,14 @@ function App() {
         toolCallState={toolCallState}
         getPromptState={getPromptState}
         readResourceState={effectiveReadResourceState}
+        toolsUi={toolsUi}
+        promptsUi={promptsUi}
+        resourcesUi={resourcesUi}
+        appsUi={appsUi}
+        tasksUi={tasksUi}
+        logsUi={logsUi}
+        historyUi={historyUi}
+        networkUi={networkUi}
         currentLogLevel={currentLogLevel}
         sandboxPath={sandboxUrl}
         bridgeFactory={sandboxBridgeFactory}
@@ -1447,15 +1604,18 @@ function App() {
           const target = servers.find((s) => s.id === id);
           if (target) setRemoveTarget(target);
         }}
+        onToolsUiChange={onToolsUiChange}
         onCallTool={(name, args) => {
           void onCallTool(name, args);
         }}
         onClearToolResult={onClearToolResult}
         onRefreshTools={onRefreshTools}
+        onPromptsUiChange={setPromptsUi}
         onGetPrompt={(name, args) => {
           void onGetPrompt(name, args);
         }}
         onRefreshPrompts={onRefreshPrompts}
+        onResourcesUiChange={setResourcesUi}
         onReadResource={(uri) => {
           void onReadResource(uri);
         }}
@@ -1464,18 +1624,23 @@ function App() {
         onRefreshResources={onRefreshResources}
         onCompleteArgument={onCompleteArgument}
         completionsSupported={capabilities?.completions !== undefined}
+        onTasksUiChange={setTasksUi}
         onCancelTask={onCancelTask}
         onClearCompletedTasks={todoNoop}
         onRefreshTasks={onRefreshTasks}
         onSetLogLevel={onSetLogLevel}
+        onLogsUiChange={setLogsUi}
         onClearLogs={onClearLogs}
         onExportLogs={onExportLogs}
+        onHistoryUiChange={setHistoryUi}
         onClearHistory={onClearHistory}
         onExportHistory={onExportHistory}
         onReplayHistory={todoNoop}
         onTogglePinHistory={todoNoop}
+        onNetworkUiChange={setNetworkUi}
         onClearNetwork={onClearNetwork}
         onExportNetwork={onExportNetwork}
+        onAppsUiChange={setAppsUi}
         onSelectApp={onSelectApp}
         onOpenApp={(name, args) => {
           void onOpenApp(name, args);
diff --git a/clients/web/src/components/groups/AppControls/AppControls.stories.tsx b/clients/web/src/components/groups/AppControls/AppControls.stories.tsx
index 925323480..8a076e0ce 100644
--- a/clients/web/src/components/groups/AppControls/AppControls.stories.tsx
+++ b/clients/web/src/components/groups/AppControls/AppControls.stories.tsx
@@ -1,9 +1,25 @@
+import { useState } from "react";
+import type { ComponentProps } from "react";
 import type { Meta, StoryObj } from "@storybook/react-vite";
 import type { Tool } from "@modelcontextprotocol/sdk/types.js";
 import { fn, userEvent, within } from "storybook/test";
 import { AppControls } from "./AppControls";
 import { SUN_ICON_SVG } from "../../../test/fixtures/storyIcons";
 
+// AppControls' search text is controlled by the parent (App, via AppsScreen —
+// see #1417). This wrapper holds that state so the play-driven typing updates
+// the controlled input.
+function StatefulAppControls(args: ComponentProps<typeof AppControls>) {
+  const [searchText, setSearchText] = useState(args.searchText ?? "");
+  return (
+    <AppControls
+      {...args}
+      searchText={searchText}
+      onSearchChange={setSearchText}
+    />
+  );
+}
+
 const sampleApps: Tool[] = [
   {
     name: "get-cohort-data",
@@ -41,8 +57,10 @@ const meta: Meta<typeof AppControls> = {
   args: {
     onRefreshList: fn(),
     onSelectApp: fn(),
+    onSearchChange: fn(),
     listChanged: false,
   },
+  render: (args) => <StatefulAppControls {...args} />,
 };
 
 export default meta;
diff --git a/clients/web/src/components/groups/AppControls/AppControls.test.tsx b/clients/web/src/components/groups/AppControls/AppControls.test.tsx
index c66ce1224..54a4629ae 100644
--- a/clients/web/src/components/groups/AppControls/AppControls.test.tsx
+++ b/clients/web/src/components/groups/AppControls/AppControls.test.tsx
@@ -1,8 +1,9 @@
+import { useState } from "react";
 import { describe, it, expect, vi } from "vitest";
 import userEvent from "@testing-library/user-event";
 import type { Tool } from "@modelcontextprotocol/sdk/types.js";
 import { renderWithMantine, screen } from "../../../test/renderWithMantine";
-import { AppControls } from "./AppControls";
+import { AppControls, type AppControlsProps } from "./AppControls";
 
 const sampleApps: Tool[] = [
   {
@@ -29,8 +30,27 @@ const baseProps = {
   listChanged: false,
   onRefreshList: vi.fn(),
   onSelectApp: vi.fn(),
+  onSearchChange: vi.fn(),
 };
 
+// The search box is controlled: typing fires onSearchChange but does not
+// update the component's own state. This host holds the searchText state so
+// interaction tests that filter by typing behave like the real parent.
+function ControlledAppControls(props: Partial<AppControlsProps>) {
+  const [searchText, setSearchText] = useState(props.searchText ?? "");
+  return (
+    <AppControls
+      {...baseProps}
+      {...props}
+      searchText={searchText}
+      onSearchChange={(value) => {
+        setSearchText(value);
+        props.onSearchChange?.(value);
+      }}
+    />
+  );
+}
+
 describe("AppControls", () => {
   it("renders the title with the app count and a search input", () => {
     renderWithMantine(<AppControls {...baseProps} />);
@@ -47,7 +67,7 @@ describe("AppControls", () => {
 
   it("filters apps by name when typing in the search input", async () => {
     const user = userEvent.setup();
-    renderWithMantine(<AppControls {...baseProps} />);
+    renderWithMantine(<ControlledAppControls />);
     await user.type(screen.getByPlaceholderText("Search apps..."), "git");
     expect(screen.getByText("git_status")).toBeInTheDocument();
     expect(screen.queryByText("Weather Widget")).not.toBeInTheDocument();
@@ -55,7 +75,7 @@ describe("AppControls", () => {
 
   it("filters apps by title when typing in the search input", async () => {
     const user = userEvent.setup();
-    renderWithMantine(<AppControls {...baseProps} />);
+    renderWithMantine(<ControlledAppControls />);
     await user.type(
       screen.getByPlaceholderText("Search apps..."),
       "weather widget",
@@ -72,7 +92,7 @@ describe("AppControls", () => {
 
   it("shows 'No matching apps' when search yields no results", async () => {
     const user = userEvent.setup();
-    renderWithMantine(<AppControls {...baseProps} />);
+    renderWithMantine(<ControlledAppControls />);
     await user.type(screen.getByPlaceholderText("Search apps..."), "zzz");
     expect(screen.getByText("No matching apps")).toBeInTheDocument();
   });
diff --git a/clients/web/src/components/groups/AppControls/AppControls.tsx b/clients/web/src/components/groups/AppControls/AppControls.tsx
index 59a29329d..44d3c6543 100644
--- a/clients/web/src/components/groups/AppControls/AppControls.tsx
+++ b/clients/web/src/components/groups/AppControls/AppControls.tsx
@@ -1,4 +1,3 @@
-import { useState } from "react";
 import {
   Button,
   Group,
@@ -11,12 +10,17 @@ import {
 import type { Tool } from "@modelcontextprotocol/sdk/types.js";
 import { ListChangedIndicator } from "../../elements/ListChangedIndicator/ListChangedIndicator";
 import { AppListItem } from "../AppListItem/AppListItem";
+import { useScrollMemory } from "../../../hooks/useScrollMemory";
 
 export interface AppControlsProps {
   tools: Tool[];
   selectedName?: string;
+  // Search text is controlled by the parent (App, via AppsScreen) so it
+  // persists across tab navigation within a live session — see #1417.
+  searchText?: string;
   listChanged: boolean;
   onRefreshList: () => void;
+  onSearchChange: (value: string) => void;
   onSelectApp: (name: string) => void;
 }
 
@@ -37,11 +41,13 @@ const EmptyState = Text.withProps({
 export function AppControls({
   tools,
   selectedName,
+  searchText = "",
   listChanged,
   onRefreshList,
+  onSearchChange,
   onSelectApp,
 }: AppControlsProps) {
-  const [searchText, setSearchText] = useState("");
+  const viewportRef = useScrollMemory("apps-sidebar");
   const query = searchText.toLowerCase();
   const filteredTools = searchText
     ? tools.filter(
@@ -61,9 +67,9 @@ export function AppControls({
       <TextInput
         placeholder="Search apps..."
         value={searchText}
-        onChange={(e) => setSearchText(e.currentTarget.value)}
+        onChange={(e) => onSearchChange(e.currentTarget.value)}
       />
-      <ScrollArea.Autosize mah={LIST_MAX_HEIGHT}>
+      <ScrollArea.Autosize viewportRef={viewportRef} mah={LIST_MAX_HEIGHT}>
         <Stack gap="xs">
           {filteredTools.length === 0 ? (
             <EmptyState>
diff --git a/clients/web/src/components/groups/HistoryListPanel/HistoryListPanel.tsx b/clients/web/src/components/groups/HistoryListPanel/HistoryListPanel.tsx
index 88385a62b..b17567f58 100644
--- a/clients/web/src/components/groups/HistoryListPanel/HistoryListPanel.tsx
+++ b/clients/web/src/components/groups/HistoryListPanel/HistoryListPanel.tsx
@@ -16,6 +16,7 @@ import {
   type SortDirection,
 } from "../../elements/SortToggle/SortToggle";
 import { extractMethod } from "../historyUtils.js";
+import { useScrollMemory } from "../../../hooks/useScrollMemory";
 
 export interface HistoryListPanelProps {
   entries: MessageEntry[];
@@ -84,6 +85,7 @@ export function HistoryListPanel({
   compact,
   onToggleCompact,
 }: HistoryListPanelProps) {
+  const viewportRef = useScrollMemory("history-list");
   const filteredEntries = useMemo(() => {
     // `.filter()` returns a fresh array, so sorting in-place is safe.
     const sorted = entries
@@ -134,7 +136,10 @@ export function HistoryListPanel({
       {!hasResults ? (
         <EmptyState>No request history</EmptyState>
       ) : (
-        <ScrollArea.Autosize mah="calc(100vh - var(--app-shell-header-height, 0px) - 150px)">
+        <ScrollArea.Autosize
+          viewportRef={viewportRef}
+          mah="calc(100vh - var(--app-shell-header-height, 0px) - 150px)"
+        >
           <Stack gap="md">
             {pinnedEntries.length > 0 && (
               <>
diff --git a/clients/web/src/components/groups/LogStreamPanel/LogStreamPanel.tsx b/clients/web/src/components/groups/LogStreamPanel/LogStreamPanel.tsx
index 7295d1bb0..28672fc2e 100644
--- a/clients/web/src/components/groups/LogStreamPanel/LogStreamPanel.tsx
+++ b/clients/web/src/components/groups/LogStreamPanel/LogStreamPanel.tsx
@@ -15,6 +15,7 @@ import {
   SortToggle,
   type SortDirection,
 } from "../../elements/SortToggle/SortToggle";
+import { useScrollMemory } from "../../../hooks/useScrollMemory";
 
 export interface LogStreamPanelProps {
   entries: LogEntryData[];
@@ -69,6 +70,7 @@ export function LogStreamPanel({
   sortDirection,
   onSortChange,
 }: LogStreamPanelProps) {
+  const viewportRef = useScrollMemory("logs-stream");
   const filteredEntries = useMemo(() => {
     // `.filter()` returns a fresh array, so sorting in-place is safe.
     const sorted = entries
@@ -105,7 +107,10 @@ export function LogStreamPanel({
         </Group>
       </Group>
       {filteredEntries.length > 0 ? (
-        <ScrollArea.Autosize mah="calc(100vh - var(--app-shell-header-height, 0px) - 150px)">
+        <ScrollArea.Autosize
+          viewportRef={viewportRef}
+          mah="calc(100vh - var(--app-shell-header-height, 0px) - 150px)"
+        >
           <Stack gap="xs">
             {filteredEntries.map((entry, index) => (
               <LogEntry key={index} entry={entry} />
diff --git a/clients/web/src/components/groups/NetworkStreamPanel/NetworkStreamPanel.tsx b/clients/web/src/components/groups/NetworkStreamPanel/NetworkStreamPanel.tsx
index 9c0521b0b..2b29e1ea5 100644
--- a/clients/web/src/components/groups/NetworkStreamPanel/NetworkStreamPanel.tsx
+++ b/clients/web/src/components/groups/NetworkStreamPanel/NetworkStreamPanel.tsx
@@ -18,6 +18,7 @@ import {
   SortToggle,
   type SortDirection,
 } from "../../elements/SortToggle/SortToggle";
+import { useScrollMemory } from "../../../hooks/useScrollMemory";
 
 export interface NetworkStreamPanelProps {
   entries: FetchRequestEntry[];
@@ -95,6 +96,7 @@ export function NetworkStreamPanel({
   compact,
   onToggleCompact,
 }: NetworkStreamPanelProps) {
+  const viewportRef = useScrollMemory("network-stream");
   const filteredEntries = useMemo(() => {
     // `.filter()` returns a fresh array, so sorting in-place is safe.
     const sorted = entries
@@ -132,7 +134,10 @@ export function NetworkStreamPanel({
       {!hasResults ? (
         <EmptyState>No network requests</EmptyState>
       ) : (
-        <ScrollArea.Autosize mah="calc(100vh - var(--app-shell-header-height, 0px) - 150px)">
+        <ScrollArea.Autosize
+          viewportRef={viewportRef}
+          mah="calc(100vh - var(--app-shell-header-height, 0px) - 150px)"
+        >
           <Stack gap="md">
             {filteredEntries.map((entry) => (
               <NetworkEntry
diff --git a/clients/web/src/components/groups/PromptControls/PromptControls.stories.tsx b/clients/web/src/components/groups/PromptControls/PromptControls.stories.tsx
index 7eb462bd2..6fb10a947 100644
--- a/clients/web/src/components/groups/PromptControls/PromptControls.stories.tsx
+++ b/clients/web/src/components/groups/PromptControls/PromptControls.stories.tsx
@@ -9,6 +9,7 @@ const meta: Meta<typeof PromptControls> = {
   args: {
     onRefreshList: fn(),
     onSelectPrompt: fn(),
+    onSearchChange: fn(),
     listChanged: false,
   },
 };
diff --git a/clients/web/src/components/groups/PromptControls/PromptControls.test.tsx b/clients/web/src/components/groups/PromptControls/PromptControls.test.tsx
index 76881136c..b8714dcae 100644
--- a/clients/web/src/components/groups/PromptControls/PromptControls.test.tsx
+++ b/clients/web/src/components/groups/PromptControls/PromptControls.test.tsx
@@ -1,8 +1,9 @@
+import { useState } from "react";
 import { describe, it, expect, vi } from "vitest";
 import userEvent from "@testing-library/user-event";
 import type { Prompt } from "@modelcontextprotocol/sdk/types.js";
 import { renderWithMantine, screen } from "../../../test/renderWithMantine";
-import { PromptControls } from "./PromptControls";
+import { PromptControls, type PromptControlsProps } from "./PromptControls";
 
 const samplePrompts: Prompt[] = [
   {
@@ -23,8 +24,27 @@ const baseProps = {
   listChanged: false,
   onRefreshList: vi.fn(),
   onSelectPrompt: vi.fn(),
+  onSearchChange: vi.fn(),
 };
 
+// The search box is controlled: typing fires onSearchChange but does not
+// update the component's own state. This host holds the searchText state so
+// interaction tests that filter by typing behave like the real parent.
+function ControlledPromptControls(props: Partial<PromptControlsProps>) {
+  const [searchText, setSearchText] = useState(props.searchText ?? "");
+  return (
+    <PromptControls
+      {...baseProps}
+      {...props}
+      searchText={searchText}
+      onSearchChange={(value) => {
+        setSearchText(value);
+        props.onSearchChange?.(value);
+      }}
+    />
+  );
+}
+
 describe("PromptControls", () => {
   it("renders the title and search input", () => {
     renderWithMantine(<PromptControls {...baseProps} />);
@@ -45,7 +65,7 @@ describe("PromptControls", () => {
 
   it("filters prompts by name when typing in the search input", async () => {
     const user = userEvent.setup();
-    renderWithMantine(<PromptControls {...baseProps} />);
+    renderWithMantine(<ControlledPromptControls />);
     await user.type(screen.getByPlaceholderText("Search prompts..."), "trans");
     expect(screen.getByText("translate")).toBeInTheDocument();
     expect(screen.queryByText("summarize")).not.toBeInTheDocument();
@@ -54,7 +74,7 @@ describe("PromptControls", () => {
 
   it("filters prompts by description when typing in the search input", async () => {
     const user = userEvent.setup();
-    renderWithMantine(<PromptControls {...baseProps} />);
+    renderWithMantine(<ControlledPromptControls />);
     await user.type(
       screen.getByPlaceholderText("Search prompts..."),
       "sentiment",
@@ -69,9 +89,7 @@ describe("PromptControls", () => {
       { name: "p1", title: "Alpha Title" },
       { name: "p2", title: "Beta Title" },
     ];
-    renderWithMantine(
-      <PromptControls {...baseProps} prompts={promptsWithTitle} />,
-    );
+    renderWithMantine(<ControlledPromptControls prompts={promptsWithTitle} />);
     await user.type(screen.getByPlaceholderText("Search prompts..."), "alpha");
     expect(screen.getByText("Alpha Title")).toBeInTheDocument();
     expect(screen.queryByText("Beta Title")).not.toBeInTheDocument();
diff --git a/clients/web/src/components/groups/PromptControls/PromptControls.tsx b/clients/web/src/components/groups/PromptControls/PromptControls.tsx
index a945db468..572d6d6ae 100644
--- a/clients/web/src/components/groups/PromptControls/PromptControls.tsx
+++ b/clients/web/src/components/groups/PromptControls/PromptControls.tsx
@@ -1,14 +1,18 @@
-import { useState } from "react";
 import { Group, ScrollArea, Stack, TextInput, Title } from "@mantine/core";
 import type { Prompt } from "@modelcontextprotocol/sdk/types.js";
 import { ListChangedIndicator } from "../../elements/ListChangedIndicator/ListChangedIndicator";
 import { PromptListItem } from "../PromptListItem/PromptListItem";
+import { useScrollMemory } from "../../../hooks/useScrollMemory";
 
 export interface PromptControlsProps {
   prompts: Prompt[];
   selectedName?: string;
+  // Search text is controlled by the parent (App, via PromptsScreen) so it
+  // persists across tab navigation within a live session — see #1417.
+  searchText?: string;
   listChanged: boolean;
   onRefreshList: () => void;
+  onSearchChange: (value: string) => void;
   onSelectPrompt: (name: string) => void;
 }
 
@@ -18,11 +22,13 @@ const LIST_MAX_HEIGHT =
 export function PromptControls({
   prompts,
   selectedName,
+  searchText = "",
   listChanged,
   onRefreshList,
+  onSearchChange,
   onSelectPrompt,
 }: PromptControlsProps) {
-  const [searchText, setSearchText] = useState("");
+  const viewportRef = useScrollMemory("prompts-sidebar");
   const query = searchText.toLowerCase();
   const filteredPrompts = prompts.filter(
     (p) =>
@@ -40,9 +46,9 @@ export function PromptControls({
       <TextInput
         placeholder="Search prompts..."
         value={searchText}
-        onChange={(e) => setSearchText(e.currentTarget.value)}
+        onChange={(e) => onSearchChange(e.currentTarget.value)}
       />
-      <ScrollArea.Autosize mah={LIST_MAX_HEIGHT}>
+      <ScrollArea.Autosize viewportRef={viewportRef} mah={LIST_MAX_HEIGHT}>
         <Stack gap="xs">
           {filteredPrompts.map((prompt) => (
             <PromptListItem
diff --git a/clients/web/src/components/groups/ResourceControls/ResourceControls.stories.tsx b/clients/web/src/components/groups/ResourceControls/ResourceControls.stories.tsx
index 98c8144f0..73518d521 100644
--- a/clients/web/src/components/groups/ResourceControls/ResourceControls.stories.tsx
+++ b/clients/web/src/components/groups/ResourceControls/ResourceControls.stories.tsx
@@ -15,6 +15,8 @@ const meta: Meta<typeof ResourceControls> = {
     onSelectUri: fn(),
     onSelectTemplate: fn(),
     onUnsubscribeResource: fn(),
+    onSearchChange: fn(),
+    onOpenSectionsChange: fn(),
     listChanged: false,
     compact: false,
     onCompactChange: fn(),
diff --git a/clients/web/src/components/groups/ResourceControls/ResourceControls.test.tsx b/clients/web/src/components/groups/ResourceControls/ResourceControls.test.tsx
index 7f1be81a2..1ee1e07a3 100644
--- a/clients/web/src/components/groups/ResourceControls/ResourceControls.test.tsx
+++ b/clients/web/src/components/groups/ResourceControls/ResourceControls.test.tsx
@@ -1,3 +1,4 @@
+import { useState } from "react";
 import { describe, it, expect, vi } from "vitest";
 import userEvent from "@testing-library/user-event";
 import type {
@@ -6,7 +7,10 @@ import type {
 } from "@modelcontextprotocol/sdk/types.js";
 import type { InspectorResourceSubscription } from "@inspector/core/mcp/types.js";
 import { renderWithMantine, screen } from "../../../test/renderWithMantine";
-import { ResourceControls } from "./ResourceControls";
+import {
+  ResourceControls,
+  type ResourceControlsProps,
+} from "./ResourceControls";
 
 const sampleResources: Resource[] = [
   { name: "config.json", uri: "file:///config.json" },
@@ -30,6 +34,8 @@ const baseProps = {
   subscriptions: sampleSubscriptions,
   listChanged: false,
   onRefreshList: vi.fn(),
+  onSearchChange: vi.fn(),
+  onOpenSectionsChange: vi.fn(),
   onSelectUri: vi.fn(),
   onSelectTemplate: vi.fn(),
   onUnsubscribeResource: vi.fn(),
@@ -37,6 +43,35 @@ const baseProps = {
   onCompactChange: vi.fn(),
 };
 
+// ResourceControls is controlled: search text + accordion open-sections live in
+// the parent (App, via ResourcesScreen) so they persist across tab navigation
+// (#1417). This host holds that state so typing filters the lists and toggling
+// the ListToggle drives the accordion, mirroring how App owns it. Props passed
+// in override defaults; the stateful search/open-sections wiring is applied last
+// so callers can still observe changes via the spied callbacks.
+function ControlledResourceControls(props: Partial<ResourceControlsProps>) {
+  const [searchText, setSearchText] = useState<string>(props.searchText ?? "");
+  const [openSections, setOpenSections] = useState<string[]>(
+    props.openSections ?? ["resources", "templates", "subscriptions"],
+  );
+  return (
+    <ResourceControls
+      {...baseProps}
+      {...props}
+      searchText={searchText}
+      openSections={openSections}
+      onSearchChange={(value) => {
+        setSearchText(value);
+        props.onSearchChange?.(value);
+      }}
+      onOpenSectionsChange={(value) => {
+        setOpenSections(value);
+        props.onOpenSectionsChange?.(value);
+      }}
+    />
+  );
+}
+
 describe("ResourceControls", () => {
   it("renders title and section counts", () => {
     renderWithMantine(<ResourceControls {...baseProps} />);
@@ -68,7 +103,7 @@ describe("ResourceControls", () => {
 
   it("filters resources, templates, and subscriptions by search text", async () => {
     const user = userEvent.setup();
-    renderWithMantine(<ResourceControls {...baseProps} />);
+    renderWithMantine(<ControlledResourceControls />);
     await user.type(screen.getByPlaceholderText("Search..."), "README");
     expect(screen.getByText("URIs (1)")).toBeInTheDocument();
     expect(screen.getByText("Templates (0)")).toBeInTheDocument();
@@ -172,8 +207,7 @@ describe("ResourceControls", () => {
     const user = userEvent.setup();
     const onCompactChange = vi.fn();
     renderWithMantine(
-      <ResourceControls
-        {...baseProps}
+      <ControlledResourceControls
         compact={false}
         onCompactChange={onCompactChange}
       />,
@@ -195,7 +229,7 @@ describe("ResourceControls", () => {
       { name: "y", uri: "file:///y" },
     ];
     renderWithMantine(
-      <ResourceControls {...baseProps} resources={resourcesWithTitle} />,
+      <ControlledResourceControls resources={resourcesWithTitle} />,
     );
     await user.type(screen.getByPlaceholderText("Search..."), "special");
     expect(screen.getByText("URIs (1)")).toBeInTheDocument();
diff --git a/clients/web/src/components/groups/ResourceControls/ResourceControls.tsx b/clients/web/src/components/groups/ResourceControls/ResourceControls.tsx
index 01c58fc02..58eeab51f 100644
--- a/clients/web/src/components/groups/ResourceControls/ResourceControls.tsx
+++ b/clients/web/src/components/groups/ResourceControls/ResourceControls.tsx
@@ -1,4 +1,3 @@
-import { useState } from "react";
 import {
   Accordion,
   Group,
@@ -23,15 +22,24 @@ export interface ResourceControlsProps {
   subscriptions: InspectorResourceSubscription[];
   selectedUri?: string;
   selectedTemplateUri?: string;
+  // Search text + accordion open-sections are controlled by the parent (App,
+  // via ResourcesScreen) so they persist across tab navigation within a live
+  // session — see #1417. `openSections` is optional: when undefined the
+  // accordion falls back to the `compact`-derived default below.
+  searchText?: string;
+  openSections?: string[];
   listChanged: boolean;
   onRefreshList: () => void;
+  onSearchChange: (value: string) => void;
+  onOpenSectionsChange: (value: string[]) => void;
   onSelectUri: (uri: string) => void;
   onSelectTemplate: (uriTemplate: string) => void;
   onUnsubscribeResource: (uri: string) => void;
   /**
    * Persisted preference for the ListToggle. Seeds initial accordion state
-   * on mount; the user can still toggle individual sections during a session
-   * without affecting this value. Only an explicit ListToggle click updates it.
+   * (when `openSections` is undefined); the user can still toggle individual
+   * sections during a session without affecting this value. Only an explicit
+   * ListToggle click updates it.
    */
   compact: boolean;
   onCompactChange: (next: boolean) => void;
@@ -54,15 +62,18 @@ export function ResourceControls({
   subscriptions,
   selectedUri,
   selectedTemplateUri,
+  searchText = "",
+  openSections: controlledOpenSections,
   listChanged,
   onRefreshList,
+  onSearchChange,
+  onOpenSectionsChange,
   onSelectUri,
   onSelectTemplate,
   onUnsubscribeResource,
   compact: initialCompact,
   onCompactChange,
 }: ResourceControlsProps) {
-  const [searchText, setSearchText] = useState("");
   const query = searchText.toLowerCase();
   const filteredResources = resources.filter(
     (r) =>
@@ -84,13 +95,13 @@ export function ResourceControls({
   );
 
   const allSections = ["resources", "templates", "subscriptions"];
-  // Seed the accordion from the persisted preference: empty when the user
-  // last left the panel compact, all three open when they explicitly
-  // expanded. Per-section accordion clicks during a session update the
-  // local list but don't change the persisted preference.
-  const [openSections, setOpenSections] = useState<string[]>(
-    initialCompact ? [] : [...allSections],
-  );
+  // Open-sections is parent-controlled (persists across navigation). When the
+  // parent hasn't set it yet (undefined), fall back to the persisted `compact`
+  // preference: empty when last left compact, all three open when expanded.
+  // Per-section accordion clicks update the lifted value but don't change the
+  // persisted preference.
+  const openSections =
+    controlledOpenSections ?? (initialCompact ? [] : [...allSections]);
   const allExpanded = openSections.length === allSections.length;
   const maxHeight = panelMaxHeight(openSections.length);
 
@@ -100,7 +111,7 @@ export function ResourceControls({
     // right preference: clicking "expand all" should record `compact=false`
     // even if the visible state was already partially expanded.
     const nextCompact = allExpanded;
-    setOpenSections(nextCompact ? [] : [...allSections]);
+    onOpenSectionsChange(nextCompact ? [] : [...allSections]);
     onCompactChange(nextCompact);
   }
 
@@ -115,11 +126,11 @@ export function ResourceControls({
           flex={1}
           placeholder="Search..."
           value={searchText}
-          onChange={(e) => setSearchText(e.currentTarget.value)}
+          onChange={(e) => onSearchChange(e.currentTarget.value)}
         />
         <ListToggle compact={!allExpanded} onToggle={handleToggleList} />
       </Group>
-      <Accordion multiple value={openSections} onChange={setOpenSections}>
+      <Accordion multiple value={openSections} onChange={onOpenSectionsChange}>
         <Accordion.Item value="resources">
           <Accordion.Control disabled={filteredResources.length === 0}>
             {formatSectionCount("URIs", filteredResources.length)}
diff --git a/clients/web/src/components/groups/TaskListPanel/TaskListPanel.tsx b/clients/web/src/components/groups/TaskListPanel/TaskListPanel.tsx
index c512f7fa1..18abe84e9 100644
--- a/clients/web/src/components/groups/TaskListPanel/TaskListPanel.tsx
+++ b/clients/web/src/components/groups/TaskListPanel/TaskListPanel.tsx
@@ -12,6 +12,7 @@ import type { Task, TaskStatus } from "@modelcontextprotocol/sdk/types.js";
 import { TaskCard } from "../TaskCard/TaskCard";
 import type { TaskProgress } from "../TaskCard/TaskCard";
 import { ListToggle } from "../../elements/ListToggle/ListToggle";
+import { useScrollMemory } from "../../../hooks/useScrollMemory";
 
 export interface TaskListPanelProps {
   tasks: Task[];
@@ -75,6 +76,7 @@ export function TaskListPanel({
   onCancel,
   onClearCompleted,
 }: TaskListPanelProps) {
+  const viewportRef = useScrollMemory("tasks-list");
   const [compact, setCompact] = useState(false);
 
   const filteredTasks = useMemo(
@@ -109,7 +111,10 @@ export function TaskListPanel({
       {!hasResults ? (
         <EmptyState>No tasks</EmptyState>
       ) : (
-        <ScrollArea.Autosize mah="calc(100vh - var(--app-shell-header-height, 0px) - 150px)">
+        <ScrollArea.Autosize
+          viewportRef={viewportRef}
+          mah="calc(100vh - var(--app-shell-header-height, 0px) - 150px)"
+        >
           <Stack gap="md">
             {activeTasks.length > 0 && (
               <>
diff --git a/clients/web/src/components/groups/ToolControls/ToolControls.stories.tsx b/clients/web/src/components/groups/ToolControls/ToolControls.stories.tsx
index 4bc75f7dc..5ded38929 100644
--- a/clients/web/src/components/groups/ToolControls/ToolControls.stories.tsx
+++ b/clients/web/src/components/groups/ToolControls/ToolControls.stories.tsx
@@ -1,16 +1,34 @@
+import { useState } from "react";
+import type { ComponentProps } from "react";
 import type { Meta, StoryObj } from "@storybook/react-vite";
 import { fn, userEvent, within } from "storybook/test";
 import { ToolControls } from "./ToolControls";
 import { longToolList } from "../../screens/ToolsScreen/ToolsScreen.fixtures";
 
+// ToolControls' search text is controlled by the parent (App, via ToolsScreen —
+// see #1417). This wrapper holds that state so the play-driven typing updates
+// the controlled input.
+function StatefulToolControls(args: ComponentProps<typeof ToolControls>) {
+  const [searchText, setSearchText] = useState(args.searchText ?? "");
+  return (
+    <ToolControls
+      {...args}
+      searchText={searchText}
+      onSearchChange={setSearchText}
+    />
+  );
+}
+
 const meta: Meta<typeof ToolControls> = {
   title: "Groups/ToolControls",
   component: ToolControls,
   args: {
     onRefreshList: fn(),
     onSelectTool: fn(),
+    onSearchChange: fn(),
     listChanged: false,
   },
+  render: (args) => <StatefulToolControls {...args} />,
 };
 
 export default meta;
diff --git a/clients/web/src/components/groups/ToolControls/ToolControls.test.tsx b/clients/web/src/components/groups/ToolControls/ToolControls.test.tsx
index f051fb2aa..e0746c02a 100644
--- a/clients/web/src/components/groups/ToolControls/ToolControls.test.tsx
+++ b/clients/web/src/components/groups/ToolControls/ToolControls.test.tsx
@@ -1,8 +1,9 @@
+import { useState } from "react";
 import { describe, it, expect, vi } from "vitest";
 import userEvent from "@testing-library/user-event";
 import type { Tool } from "@modelcontextprotocol/sdk/types.js";
 import { renderWithMantine, screen } from "../../../test/renderWithMantine";
-import { ToolControls } from "./ToolControls";
+import { ToolControls, type ToolControlsProps } from "./ToolControls";
 
 const sampleTools: Tool[] = [
   { name: "list_files", title: "List Files", inputSchema: { type: "object" } },
@@ -20,8 +21,27 @@ const baseProps = {
   listChanged: false,
   onRefreshList: vi.fn(),
   onSelectTool: vi.fn(),
+  onSearchChange: vi.fn(),
 };
 
+// The search box is controlled: typing fires onSearchChange but does not
+// update the component's own state. This host holds the searchText state so
+// interaction tests that filter by typing behave like the real parent.
+function ControlledToolControls(props: Partial<ToolControlsProps>) {
+  const [searchText, setSearchText] = useState(props.searchText ?? "");
+  return (
+    <ToolControls
+      {...baseProps}
+      {...props}
+      searchText={searchText}
+      onSearchChange={(value) => {
+        setSearchText(value);
+        props.onSearchChange?.(value);
+      }}
+    />
+  );
+}
+
 describe("ToolControls", () => {
   it("renders the title and search input", () => {
     renderWithMantine(<ToolControls {...baseProps} />);
@@ -39,7 +59,7 @@ describe("ToolControls", () => {
 
   it("filters tools by name when typing in the search input", async () => {
     const user = userEvent.setup();
-    renderWithMantine(<ToolControls {...baseProps} />);
+    renderWithMantine(<ControlledToolControls />);
     await user.type(screen.getByPlaceholderText("Search tools..."), "git");
     expect(screen.getByText("git_status")).toBeInTheDocument();
     expect(screen.getByText("git_commit")).toBeInTheDocument();
@@ -48,7 +68,7 @@ describe("ToolControls", () => {
 
   it("filters tools by title when typing in the search input", async () => {
     const user = userEvent.setup();
-    renderWithMantine(<ToolControls {...baseProps} />);
+    renderWithMantine(<ControlledToolControls />);
     await user.type(screen.getByPlaceholderText("Search tools..."), "query db");
     expect(screen.getByText("Query DB")).toBeInTheDocument();
     expect(screen.queryByText("List Files")).not.toBeInTheDocument();
diff --git a/clients/web/src/components/groups/ToolControls/ToolControls.tsx b/clients/web/src/components/groups/ToolControls/ToolControls.tsx
index 8779e6174..08f80529c 100644
--- a/clients/web/src/components/groups/ToolControls/ToolControls.tsx
+++ b/clients/web/src/components/groups/ToolControls/ToolControls.tsx
@@ -1,14 +1,18 @@
-import { useState } from "react";
 import { Group, ScrollArea, Stack, TextInput, Title } from "@mantine/core";
 import type { Tool } from "@modelcontextprotocol/sdk/types.js";
 import { ListChangedIndicator } from "../../elements/ListChangedIndicator/ListChangedIndicator";
 import { ToolListItem } from "../ToolListItem/ToolListItem";
+import { useScrollMemory } from "../../../hooks/useScrollMemory";
 
 export interface ToolControlsProps {
   tools: Tool[];
   selectedName?: string;
+  // Search text is controlled by the parent (App, via ToolsScreen) so it
+  // persists across tab navigation within a live session — see #1417.
+  searchText?: string;
   listChanged: boolean;
   onRefreshList: () => void;
+  onSearchChange: (value: string) => void;
   onSelectTool: (name: string) => void;
 }
 
@@ -18,11 +22,13 @@ const LIST_MAX_HEIGHT =
 export function ToolControls({
   tools,
   selectedName,
+  searchText = "",
   listChanged,
   onRefreshList,
+  onSearchChange,
   onSelectTool,
 }: ToolControlsProps) {
-  const [searchText, setSearchText] = useState("");
+  const viewportRef = useScrollMemory("tools-sidebar");
   const query = searchText.toLowerCase();
   const filteredTools = searchText
     ? tools.filter(
@@ -41,9 +47,9 @@ export function ToolControls({
       <TextInput
         placeholder="Search tools..."
         value={searchText}
-        onChange={(e) => setSearchText(e.currentTarget.value)}
+        onChange={(e) => onSearchChange(e.currentTarget.value)}
       />
-      <ScrollArea.Autosize mah={LIST_MAX_HEIGHT}>
+      <ScrollArea.Autosize viewportRef={viewportRef} mah={LIST_MAX_HEIGHT}>
         <Stack gap="xs">
           {filteredTools.map((tool) => (
             <ToolListItem
diff --git a/clients/web/src/components/screens/AppsScreen/AppsScreen.stories.tsx b/clients/web/src/components/screens/AppsScreen/AppsScreen.stories.tsx
index 6102cc72c..a517e8feb 100644
--- a/clients/web/src/components/screens/AppsScreen/AppsScreen.stories.tsx
+++ b/clients/web/src/components/screens/AppsScreen/AppsScreen.stories.tsx
@@ -4,7 +4,12 @@ import type { Meta, StoryObj } from "@storybook/react-vite";
 import type { CallToolResult, Tool } from "@modelcontextprotocol/sdk/types.js";
 import type { AppBridge } from "@modelcontextprotocol/ext-apps/app-bridge";
 import { expect, fn, userEvent, waitFor, within } from "storybook/test";
-import { AppsScreen, type AppsScreenProps } from "./AppsScreen";
+import {
+  AppsScreen,
+  type AppsScreenProps,
+  type AppsUiState,
+} from "./AppsScreen";
+import { EMPTY_APPS_UI } from "../screenUiState";
 import type {
   AppRendererHandle,
   BridgeFactory,
@@ -80,6 +85,16 @@ const dashboardApp: Tool = {
 
 const sampleApps: Tool[] = [cohortApp, weatherApp, dashboardApp];
 
+// AppsScreen is controlled (app selection, form values, and search text live in
+// the parent as one `ui` object — running/maximized stay internal; see #1417).
+// This hook holds the lifted state so the play-driven select/type/open
+// interactions still drive the detail panel, mirroring how App owns the state in
+// the real app.
+function useLiftedAppState(args: AppsScreenProps) {
+  const [ui, setUi] = useState<AppsUiState>(args.ui ?? EMPTY_APPS_UI);
+  return { ui, onUiChange: setUi };
+}
+
 const meta: Meta<typeof AppsScreen> = {
   title: "Screens/AppsScreen",
   component: AppsScreen,
@@ -88,6 +103,8 @@ const meta: Meta<typeof AppsScreen> = {
     sandboxPath: PLACEHOLDER_SANDBOX,
     bridgeFactory: okBridgeFactory,
     listChanged: false,
+    ui: EMPTY_APPS_UI,
+    onUiChange: fn(),
     onRefreshList: fn(),
     onSelectApp: fn(),
     onOpenApp: fn(),
@@ -98,7 +115,8 @@ const meta: Meta<typeof AppsScreen> = {
   // arg edits, but the ref itself is owned by the wrapping component).
   render: function StoryRender(args: AppsScreenProps) {
     const ref = useRef<AppRendererHandle>(null);
-    return <AppsScreen {...args} rendererRef={ref} />;
+    const lifted = useLiftedAppState(args);
+    return <AppsScreen {...args} {...lifted} rendererRef={ref} />;
   },
 };
 
@@ -175,6 +193,7 @@ export const EchoRunning: Story = {
   render: function EchoRender(args: AppsScreenProps) {
     const ref = useRef<AppRendererHandle>(null);
     const [echo, setEcho] = useState<string | null>(null);
+    const lifted = useLiftedAppState(args);
 
     const bridgeFactory: BridgeFactory = useCallback(() => {
       let onInitialized: (() => void) | undefined;
@@ -227,6 +246,7 @@ export const EchoRunning: Story = {
         </Text>
         <AppsScreen
           {...args}
+          {...lifted}
           rendererRef={ref}
           bridgeFactory={bridgeFactory}
           onOpenApp={onOpenApp}
diff --git a/clients/web/src/components/screens/AppsScreen/AppsScreen.test.tsx b/clients/web/src/components/screens/AppsScreen/AppsScreen.test.tsx
index 60e09ae86..9ec51b3a4 100644
--- a/clients/web/src/components/screens/AppsScreen/AppsScreen.test.tsx
+++ b/clients/web/src/components/screens/AppsScreen/AppsScreen.test.tsx
@@ -1,4 +1,4 @@
-import { createRef } from "react";
+import { createRef, useState } from "react";
 import { describe, it, expect, vi } from "vitest";
 import userEvent from "@testing-library/user-event";
 import type { Tool } from "@modelcontextprotocol/sdk/types.js";
@@ -8,7 +8,12 @@ import {
   screen,
   within,
 } from "../../../test/renderWithMantine";
-import { AppsScreen } from "./AppsScreen";
+import {
+  AppsScreen,
+  type AppsScreenProps,
+  type AppsUiState,
+} from "./AppsScreen";
+import { EMPTY_APPS_UI } from "../screenUiState";
 import type {
   AppRendererHandle,
   BridgeFactory,
@@ -54,7 +59,7 @@ const okBridgeFactory: BridgeFactory = () =>
     close: async () => {},
   }) as unknown as AppBridge;
 
-function buildProps(overrides: Partial<Parameters<typeof AppsScreen>[0]> = {}) {
+function buildProps(overrides: Partial<AppsScreenProps> = {}): AppsScreenProps {
   return {
     tools: [fieldedApp, noFieldsApp, cohortApp] as Tool[],
     listChanged: false,
@@ -64,6 +69,8 @@ function buildProps(overrides: Partial<Parameters<typeof AppsScreen>[0]> = {}) {
     sandboxPath: "data:text/html,<title>sandbox</title>",
     bridgeFactory: okBridgeFactory,
     rendererRef: createRef<AppRendererHandle>(),
+    ui: EMPTY_APPS_UI,
+    onUiChange: vi.fn(),
     onRefreshList: vi.fn(),
     onSelectApp: vi.fn(),
     onOpenApp: vi.fn(),
@@ -72,6 +79,32 @@ function buildProps(overrides: Partial<Parameters<typeof AppsScreen>[0]> = {}) {
   };
 }
 
+// AppsScreen lifts selection, form values, and the sidebar search to the
+// parent (App) as one `ui` object so they persist across tab navigation
+// (#1417), while `running`/`maximized` stay local to the screen. This host
+// holds the lifted state so clicking an app, typing into its form/search, and
+// closing drive the panel exactly as App owns it. The internal running/maximized
+// state handles auto-launch, open, maximize, and back-to-input on its own. Props
+// passed in override defaults; the stateful `ui` wiring is applied last so
+// callers can still observe activity via the rendered state.
+function ControlledAppsScreen(overrides: Partial<AppsScreenProps> = {}) {
+  const props = buildProps(overrides);
+  const [ui, setUi] = useState<AppsUiState>({
+    ...EMPTY_APPS_UI,
+    ...props.ui,
+  });
+  return (
+    <AppsScreen
+      {...props}
+      ui={ui}
+      onUiChange={(next) => {
+        setUi(next);
+        props.onUiChange(next);
+      }}
+    />
+  );
+}
+
 describe("AppsScreen", () => {
   it("renders the empty selection state", () => {
     renderWithMantine(<AppsScreen {...buildProps()} />);
@@ -101,8 +134,9 @@ describe("AppsScreen", () => {
       throw new Error("no connected MCP client");
     };
     renderWithMantine(
-      <AppsScreen
-        {...buildProps({ bridgeFactory: throwingFactory, onError })}
+      <ControlledAppsScreen
+        bridgeFactory={throwingFactory}
+        onError={onError}
       />,
     );
     // The no-fields app auto-launches on selection, mounting the renderer,
@@ -117,7 +151,7 @@ describe("AppsScreen", () => {
 
   it("filters the list via the search input", async () => {
     const user = userEvent.setup();
-    renderWithMantine(<AppsScreen {...buildProps()} />);
+    renderWithMantine(<ControlledAppsScreen />);
     await user.type(screen.getByPlaceholderText("Search apps..."), "weather");
     expect(screen.getByText("Weather Widget")).toBeInTheDocument();
     expect(screen.queryByText("Ops Dashboard")).not.toBeInTheDocument();
@@ -125,7 +159,7 @@ describe("AppsScreen", () => {
 
   it("shows 'No matching apps' when search yields no results", async () => {
     const user = userEvent.setup();
-    renderWithMantine(<AppsScreen {...buildProps()} />);
+    renderWithMantine(<ControlledAppsScreen />);
     await user.type(screen.getByPlaceholderText("Search apps..."), "zzz");
     expect(screen.getByText("No matching apps")).toBeInTheDocument();
   });
@@ -135,7 +169,7 @@ describe("AppsScreen", () => {
     const onSelectApp = vi.fn();
     const onOpenApp = vi.fn();
     renderWithMantine(
-      <AppsScreen {...buildProps({ onSelectApp, onOpenApp })} />,
+      <ControlledAppsScreen onSelectApp={onSelectApp} onOpenApp={onOpenApp} />,
     );
     await user.click(screen.getByText("Weather Widget"));
     expect(onSelectApp).toHaveBeenCalledWith("weather");
@@ -148,7 +182,7 @@ describe("AppsScreen", () => {
   it("auto-launches a no-fields app on selection", async () => {
     const user = userEvent.setup();
     const onOpenApp = vi.fn();
-    renderWithMantine(<AppsScreen {...buildProps({ onOpenApp })} />);
+    renderWithMantine(<ControlledAppsScreen onOpenApp={onOpenApp} />);
     await user.click(screen.getByText("Ops Dashboard"));
     expect(onOpenApp).toHaveBeenCalledWith("ops", {});
     // Renderer iframe replaces the form; Open App button is gone.
@@ -161,7 +195,7 @@ describe("AppsScreen", () => {
   it("invokes onOpenApp with form values when Open App is clicked", async () => {
     const user = userEvent.setup();
     const onOpenApp = vi.fn();
-    renderWithMantine(<AppsScreen {...buildProps({ onOpenApp })} />);
+    renderWithMantine(<ControlledAppsScreen onOpenApp={onOpenApp} />);
     await user.click(screen.getByText("Weather Widget"));
     const cityField = screen.getByRole("textbox", { name: /city/i });
     await user.type(cityField, "Reykjavik");
@@ -173,7 +207,7 @@ describe("AppsScreen", () => {
   it("seeds schema defaults so untouched fields are sent on Open App", async () => {
     const user = userEvent.setup();
     const onOpenApp = vi.fn();
-    renderWithMantine(<AppsScreen {...buildProps({ onOpenApp })} />);
+    renderWithMantine(<ControlledAppsScreen onOpenApp={onOpenApp} />);
     await user.click(screen.getByText("Cohort Data"));
     // Open without editing the metric field: its default must still be sent.
     await user.click(screen.getByRole("button", { name: /Open App/ }));
@@ -182,7 +216,7 @@ describe("AppsScreen", () => {
 
   it("returns to the input form when 'Back to Input' is clicked", async () => {
     const user = userEvent.setup();
-    renderWithMantine(<AppsScreen {...buildProps()} />);
+    renderWithMantine(<ControlledAppsScreen />);
     await user.click(screen.getByText("Weather Widget"));
     await user.type(
       screen.getByRole("textbox", { name: /city/i }),
@@ -197,7 +231,7 @@ describe("AppsScreen", () => {
 
   it("does not show 'Back to Input' for a no-fields app", async () => {
     const user = userEvent.setup();
-    renderWithMantine(<AppsScreen {...buildProps()} />);
+    renderWithMantine(<ControlledAppsScreen />);
     await user.click(screen.getByText("Ops Dashboard"));
     expect(
       screen.queryByRole("button", { name: /Back to Input/ }),
@@ -206,7 +240,7 @@ describe("AppsScreen", () => {
 
   it("toggles maximize, hiding the sidebar", async () => {
     const user = userEvent.setup();
-    renderWithMantine(<AppsScreen {...buildProps()} />);
+    renderWithMantine(<ControlledAppsScreen />);
     await user.click(screen.getByText("Ops Dashboard"));
     expect(screen.getByText("MCP Apps (3)")).toBeInTheDocument();
     await user.click(screen.getByLabelText("Maximize"));
@@ -218,7 +252,7 @@ describe("AppsScreen", () => {
   it("calls onCloseApp and clears selection on Close", async () => {
     const user = userEvent.setup();
     const onCloseApp = vi.fn();
-    renderWithMantine(<AppsScreen {...buildProps({ onCloseApp })} />);
+    renderWithMantine(<ControlledAppsScreen onCloseApp={onCloseApp} />);
     await user.click(screen.getByText("Ops Dashboard"));
     await user.click(screen.getByLabelText("Close"));
     expect(onCloseApp).toHaveBeenCalledTimes(1);
@@ -228,7 +262,7 @@ describe("AppsScreen", () => {
   it("ignores re-clicking the same app (no duplicate onSelectApp)", async () => {
     const user = userEvent.setup();
     const onSelectApp = vi.fn();
-    renderWithMantine(<AppsScreen {...buildProps({ onSelectApp })} />);
+    renderWithMantine(<ControlledAppsScreen onSelectApp={onSelectApp} />);
     // After the first click "Weather Widget" appears both in the sidebar
     // list item and the right-pane header, so target the sidebar entry
     // explicitly via the list-item button role.
@@ -240,7 +274,7 @@ describe("AppsScreen", () => {
 
   it("resets form state when switching to a different app", async () => {
     const user = userEvent.setup();
-    renderWithMantine(<AppsScreen {...buildProps()} />);
+    renderWithMantine(<ControlledAppsScreen />);
     await user.click(screen.getByText("Weather Widget"));
     await user.type(
       screen.getByRole("textbox", { name: /city/i }),
@@ -287,7 +321,7 @@ describe("AppsScreen", () => {
       inputSchema: { type: "object" },
       _meta: { ui: { resourceUri: "ui://apps/weather-iconed" } },
     };
-    renderWithMantine(<AppsScreen {...buildProps({ tools: [iconedApp] })} />);
+    renderWithMantine(<ControlledAppsScreen tools={[iconedApp]} />);
     await user.click(screen.getByText("Weather (Iconed)"));
     const headerImg = screen
       .getAllByRole("presentation")
@@ -299,15 +333,16 @@ describe("AppsScreen", () => {
     const user = userEvent.setup();
     const onSelectApp = vi.fn();
     const { rerender } = renderWithMantine(
-      <AppsScreen {...buildProps({ onSelectApp })} />,
+      <ControlledAppsScreen onSelectApp={onSelectApp} />,
     );
     // Click an item, then re-render with a tools list that no longer
     // contains it: the selection state stays put, but a follow-up click
     // on the same name no-ops because the lookup fails.
     await user.click(screen.getByText("Weather Widget"));
     rerender(
-      <AppsScreen
-        {...buildProps({ onSelectApp, tools: [noFieldsApp, cohortApp] })}
+      <ControlledAppsScreen
+        onSelectApp={onSelectApp}
+        tools={[noFieldsApp, cohortApp]}
       />,
     );
     // Sidebar no longer shows Weather Widget; the right pane falls back
diff --git a/clients/web/src/components/screens/AppsScreen/AppsScreen.tsx b/clients/web/src/components/screens/AppsScreen/AppsScreen.tsx
index fdcab3dc6..f60d57b4b 100644
--- a/clients/web/src/components/screens/AppsScreen/AppsScreen.tsx
+++ b/clients/web/src/components/screens/AppsScreen/AppsScreen.tsx
@@ -39,6 +39,8 @@ export interface AppsScreenProps {
   sandboxPath?: string;
   bridgeFactory: BridgeFactory;
   rendererRef: Ref<AppRendererHandle>;
+  ui: AppsUiState;
+  onUiChange: (next: AppsUiState) => void;
   onRefreshList: () => void;
   onSelectApp: (name: string) => void;
   onOpenApp: (name: string, args: Record<string, unknown>) => void;
@@ -47,6 +49,18 @@ export interface AppsScreenProps {
   onError?: (err: Error) => void;
 }
 
+// Selected app, its form values, and the sidebar search — controlled by the
+// parent (App) as one object so they persist across tab navigation within a
+// live session (#1417). `running`/`maximized` stay local to the screen: they're
+// tied to the live iframe and bridge, which are torn down on unmount, so
+// persisting them would restore a flag without its runtime. On return the
+// selected app's input form (with its values) is shown, ready to re-open.
+export interface AppsUiState {
+  selectedAppName?: string;
+  formValues: Record<string, unknown>;
+  search: string;
+}
+
 const ScreenLayout = Flex.withProps({
   variant: "screen",
   h: "calc(100vh - var(--app-shell-header-height, 0px))",
@@ -131,16 +145,15 @@ export function AppsScreen({
   sandboxPath,
   bridgeFactory,
   rendererRef,
+  ui,
+  onUiChange,
   onRefreshList,
   onSelectApp,
   onOpenApp,
   onCloseApp,
   onError,
 }: AppsScreenProps) {
-  const [selectedAppName, setSelectedAppName] = useState<string | undefined>(
-    undefined,
-  );
-  const [formValues, setFormValues] = useState<Record<string, unknown>>({});
+  const { selectedAppName, formValues, search } = ui;
   const [running, setRunning] = useState(false);
   const [maximized, setMaximized] = useState(false);
 
@@ -153,10 +166,13 @@ export function AppsScreen({
     if (name === selectedAppName) return;
     const next = tools.find((t) => t.name === name);
     if (!next) return;
-    setSelectedAppName(name);
     // Seed schema defaults so default-only fields are sent on Open App (parity
     // with the form's resolveValue display, which onChange doesn't capture).
-    setFormValues(collectSchemaDefaults(next.inputSchema));
+    onUiChange({
+      ...ui,
+      selectedAppName: name,
+      formValues: collectSchemaDefaults(next.inputSchema),
+    });
     setMaximized(false);
     onSelectApp(name);
     // No-input apps auto-launch on selection so the user lands directly in
@@ -177,8 +193,7 @@ export function AppsScreen({
 
   function handleClose() {
     setRunning(false);
-    setSelectedAppName(undefined);
-    setFormValues({});
+    onUiChange({ ...ui, selectedAppName: undefined, formValues: {} });
     setMaximized(false);
     onCloseApp();
   }
@@ -211,8 +226,10 @@ export function AppsScreen({
             <AppControls
               tools={tools}
               selectedName={selectedAppName}
+              searchText={search}
               listChanged={listChanged}
               onRefreshList={onRefreshList}
+              onSearchChange={(value) => onUiChange({ ...ui, search: value })}
               onSelectApp={handleSelect}
             />
           </SidebarCard>
@@ -294,7 +311,9 @@ export function AppsScreen({
                 tool={selectedTool}
                 formValues={formValues}
                 isOpening={false}
-                onFormChange={setFormValues}
+                onFormChange={(values) =>
+                  onUiChange({ ...ui, formValues: values })
+                }
                 onOpenApp={handleOpen}
               />
             )}
diff --git a/clients/web/src/components/screens/HistoryScreen/HistoryScreen.stories.tsx b/clients/web/src/components/screens/HistoryScreen/HistoryScreen.stories.tsx
index f65bdba14..b7e23c03c 100644
--- a/clients/web/src/components/screens/HistoryScreen/HistoryScreen.stories.tsx
+++ b/clients/web/src/components/screens/HistoryScreen/HistoryScreen.stories.tsx
@@ -1,7 +1,19 @@
+import { useState } from "react";
+import type { ComponentProps } from "react";
 import type { Meta, StoryObj } from "@storybook/react-vite";
 import type { MessageEntry } from "../../../../../../core/mcp/types.js";
 import { expect, fn, screen, userEvent, within } from "storybook/test";
 import { HistoryScreen } from "./HistoryScreen";
+import { EMPTY_HISTORY_UI } from "../screenUiState";
+
+// HistoryScreen is controlled (search text + method filter live in the parent
+// as one `ui` object — see #1417). This wrapper holds that state so the
+// play-driven filter selection and clear-all reset are observable, mirroring
+// how App owns the state.
+function StatefulHistoryScreen(args: ComponentProps<typeof HistoryScreen>) {
+  const [ui, setUi] = useState({ ...EMPTY_HISTORY_UI, ...args.ui });
+  return <HistoryScreen {...args} ui={ui} onUiChange={setUi} />;
+}
 
 const meta: Meta<typeof HistoryScreen> = {
   title: "Screens/HistoryScreen",
@@ -13,11 +25,14 @@ const meta: Meta<typeof HistoryScreen> = {
     onExport: fn(),
     onReplay: fn(),
     onTogglePin: fn(),
+    ui: EMPTY_HISTORY_UI,
+    onUiChange: fn(),
     sortDirection: "newest-first",
     onSortChange: fn(),
     compact: true,
     onToggleCompact: fn(),
   },
+  render: (args) => <StatefulHistoryScreen {...args} />,
 };
 
 export default meta;
diff --git a/clients/web/src/components/screens/HistoryScreen/HistoryScreen.test.tsx b/clients/web/src/components/screens/HistoryScreen/HistoryScreen.test.tsx
index f9d76a1bb..bbff1767a 100644
--- a/clients/web/src/components/screens/HistoryScreen/HistoryScreen.test.tsx
+++ b/clients/web/src/components/screens/HistoryScreen/HistoryScreen.test.tsx
@@ -3,6 +3,7 @@ import userEvent from "@testing-library/user-event";
 import type { MessageEntry } from "@inspector/core/mcp/types.js";
 import { renderWithMantine, screen } from "../../../test/renderWithMantine";
 import { HistoryScreen } from "./HistoryScreen";
+import { EMPTY_HISTORY_UI } from "../screenUiState";
 
 const sampleEntries: MessageEntry[] = [
   {
@@ -22,6 +23,8 @@ const sampleEntries: MessageEntry[] = [
 const baseProps = {
   entries: sampleEntries,
   pinnedIds: new Set<string>(),
+  ui: EMPTY_HISTORY_UI,
+  onUiChange: vi.fn(),
   onClearAll: vi.fn(),
   onExport: vi.fn(),
   onReplay: vi.fn(),
@@ -52,4 +55,34 @@ describe("HistoryScreen", () => {
     await user.click(clearButton);
     expect(onClearAll).toHaveBeenCalled();
   });
+
+  it("emits the search text through onUiChange", async () => {
+    const user = userEvent.setup();
+    const onUiChange = vi.fn();
+    renderWithMantine(<HistoryScreen {...baseProps} onUiChange={onUiChange} />);
+    await user.type(screen.getByPlaceholderText("Search..."), "t");
+    expect(onUiChange).toHaveBeenCalledWith(
+      expect.objectContaining({ search: "t" }),
+    );
+  });
+
+  it("emits the cleared method filter through onUiChange", async () => {
+    const user = userEvent.setup();
+    const onUiChange = vi.fn();
+    const { container } = renderWithMantine(
+      <HistoryScreen
+        {...baseProps}
+        ui={{ ...EMPTY_HISTORY_UI, methodFilter: "tools/list" }}
+        onUiChange={onUiChange}
+      />,
+    );
+    const clearButton = container.querySelector(
+      "button.mantine-InputClearButton-root",
+    ) as HTMLButtonElement | null;
+    expect(clearButton).not.toBeNull();
+    await user.click(clearButton!);
+    expect(onUiChange).toHaveBeenCalledWith(
+      expect.objectContaining({ methodFilter: undefined }),
+    );
+  });
 });
diff --git a/clients/web/src/components/screens/HistoryScreen/HistoryScreen.tsx b/clients/web/src/components/screens/HistoryScreen/HistoryScreen.tsx
index ccb5fa7ff..5411afc26 100644
--- a/clients/web/src/components/screens/HistoryScreen/HistoryScreen.tsx
+++ b/clients/web/src/components/screens/HistoryScreen/HistoryScreen.tsx
@@ -1,4 +1,4 @@
-import { useCallback, useMemo, useState } from "react";
+import { useCallback, useMemo } from "react";
 import { Card, Flex, Stack } from "@mantine/core";
 import type { MessageEntry, MessageMethod } from "@inspector/core/mcp/types.js";
 import { HistoryControls } from "../../groups/HistoryControls/HistoryControls";
@@ -9,6 +9,8 @@ import type { SortDirection } from "../../elements/SortToggle/SortToggle";
 export interface HistoryScreenProps {
   entries: MessageEntry[];
   pinnedIds: Set<string>;
+  ui: HistoryUiState;
+  onUiChange: (next: HistoryUiState) => void;
   onClearAll: () => void;
   onExport: () => void;
   onReplay: (id: string) => void;
@@ -19,6 +21,13 @@ export interface HistoryScreenProps {
   onToggleCompact: () => void;
 }
 
+// Search text + method filter — controlled by the parent (App) as one object so
+// they persist across tab navigation within a live session (#1417).
+export interface HistoryUiState {
+  search: string;
+  methodFilter?: MessageMethod;
+}
+
 const ScreenLayout = Flex.withProps({
   variant: "screen",
   h: "calc(100vh - var(--app-shell-header-height, 0px))",
@@ -39,6 +48,8 @@ const SidebarCard = Card.withProps({
 export function HistoryScreen({
   entries,
   pinnedIds,
+  ui,
+  onUiChange,
   onClearAll,
   onExport,
   onReplay,
@@ -48,8 +59,7 @@ export function HistoryScreen({
   compact,
   onToggleCompact,
 }: HistoryScreenProps) {
-  const [searchText, setSearchText] = useState("");
-  const [methodFilter, setMethodFilter] = useState<MessageMethod | undefined>();
+  const { search, methodFilter } = ui;
 
   const availableMethods = useMemo(
     () => Array.from(new Set(entries.map(extractMethod))).sort(),
@@ -57,27 +67,29 @@ export function HistoryScreen({
   );
 
   const handleClearAll = useCallback(() => {
-    setMethodFilter(undefined);
+    onUiChange({ ...ui, methodFilter: undefined });
     onClearAll();
-  }, [onClearAll]);
+  }, [ui, onUiChange, onClearAll]);
 
   return (
     <ScreenLayout>
       <Sidebar>
         <SidebarCard>
           <HistoryControls
-            searchText={searchText}
+            searchText={search}
             methodFilter={methodFilter}
             availableMethods={availableMethods}
-            onSearchChange={setSearchText}
-            onMethodFilterChange={setMethodFilter}
+            onSearchChange={(value) => onUiChange({ ...ui, search: value })}
+            onMethodFilterChange={(value) =>
+              onUiChange({ ...ui, methodFilter: value })
+            }
           />
         </SidebarCard>
       </Sidebar>
       <HistoryListPanel
         entries={entries}
         pinnedIds={pinnedIds}
-        searchText={searchText}
+        searchText={search}
         methodFilter={methodFilter}
         onClearAll={handleClearAll}
         onExport={onExport}
diff --git a/clients/web/src/components/screens/LoggingScreen/LoggingScreen.stories.tsx b/clients/web/src/components/screens/LoggingScreen/LoggingScreen.stories.tsx
index 655ed94a8..8f2346692 100644
--- a/clients/web/src/components/screens/LoggingScreen/LoggingScreen.stories.tsx
+++ b/clients/web/src/components/screens/LoggingScreen/LoggingScreen.stories.tsx
@@ -1,6 +1,7 @@
 import type { Meta, StoryObj } from "@storybook/react-vite";
 import { fn } from "storybook/test";
 import { LoggingScreen } from "./LoggingScreen";
+import { EMPTY_LOGS_UI } from "../screenUiState";
 import { mixedEntries } from "./LoggingScreen.fixtures";
 import type { LogEntryData } from "../../elements/LogEntry/LogEntry";
 
@@ -13,6 +14,8 @@ const meta: Meta<typeof LoggingScreen> = {
     onSetLevel: fn(),
     onClear: fn(),
     onExport: fn(),
+    ui: EMPTY_LOGS_UI,
+    onUiChange: fn(),
     sortDirection: "newest-first",
     onSortChange: fn(),
   },
diff --git a/clients/web/src/components/screens/LoggingScreen/LoggingScreen.test.tsx b/clients/web/src/components/screens/LoggingScreen/LoggingScreen.test.tsx
index 70b97e80c..19f7c50bc 100644
--- a/clients/web/src/components/screens/LoggingScreen/LoggingScreen.test.tsx
+++ b/clients/web/src/components/screens/LoggingScreen/LoggingScreen.test.tsx
@@ -1,11 +1,19 @@
+import { useState } from "react";
 import { describe, it, expect, vi } from "vitest";
 import userEvent from "@testing-library/user-event";
 import { renderWithMantine, screen } from "../../../test/renderWithMantine";
-import { LoggingScreen } from "./LoggingScreen";
+import {
+  LoggingScreen,
+  type LoggingScreenProps,
+  type LogsUiState,
+} from "./LoggingScreen";
+import { EMPTY_LOGS_UI } from "../screenUiState";
 
 const baseProps = {
   entries: [],
   currentLevel: "info" as const,
+  ui: EMPTY_LOGS_UI,
+  onUiChange: vi.fn(),
   onSetLevel: vi.fn(),
   onClear: vi.fn(),
   onExport: vi.fn(),
@@ -13,6 +21,27 @@ const baseProps = {
   onSortChange: vi.fn(),
 };
 
+// LoggingScreen is controlled: filter text + visible-level set live in the
+// parent (App) as one `ui` object so they persist across tab navigation
+// (#1417). This host holds that state so typing/toggling drives the rendered
+// list, mirroring how App owns it. Props passed in override defaults; the
+// stateful `ui` wiring is applied last so callers can still observe changes
+// via the spied `onUiChange` callback.
+function ControlledLoggingScreen(props: Partial<LoggingScreenProps>) {
+  const [ui, setUi] = useState<LogsUiState>({ ...EMPTY_LOGS_UI, ...props.ui });
+  return (
+    <LoggingScreen
+      {...baseProps}
+      {...props}
+      ui={ui}
+      onUiChange={(value) => {
+        setUi(value);
+        props.onUiChange?.(value);
+      }}
+    />
+  );
+}
+
 describe("LoggingScreen", () => {
   it("renders the log stream panel", () => {
     renderWithMantine(<LoggingScreen {...baseProps} />);
@@ -58,7 +87,7 @@ describe("LoggingScreen", () => {
     const entries = [
       { receivedAt: new Date(), params: { level: "info" as const, data: "x" } },
     ];
-    renderWithMantine(<LoggingScreen {...baseProps} entries={entries} />);
+    renderWithMantine(<ControlledLoggingScreen entries={entries} />);
     expect(screen.getByText("x")).toBeInTheDocument();
     const debugButton = screen.getByRole("button", { name: "info" });
     await user.click(debugButton);
@@ -70,7 +99,7 @@ describe("LoggingScreen", () => {
     const entries = [
       { receivedAt: new Date(), params: { level: "info" as const, data: "x" } },
     ];
-    renderWithMantine(<LoggingScreen {...baseProps} entries={entries} />);
+    renderWithMantine(<ControlledLoggingScreen entries={entries} />);
     await user.click(screen.getByRole("button", { name: "Deselect All" }));
     expect(screen.queryByText("x")).not.toBeInTheDocument();
     await user.click(screen.getByRole("button", { name: "Select All" }));
@@ -89,7 +118,7 @@ describe("LoggingScreen", () => {
         params: { level: "info" as const, data: "beta" },
       },
     ];
-    renderWithMantine(<LoggingScreen {...baseProps} entries={entries} />);
+    renderWithMantine(<ControlledLoggingScreen entries={entries} />);
     await user.type(screen.getByPlaceholderText("Search..."), "alpha");
     expect(screen.getByText("alpha")).toBeInTheDocument();
     expect(screen.queryByText("beta")).not.toBeInTheDocument();
diff --git a/clients/web/src/components/screens/LoggingScreen/LoggingScreen.tsx b/clients/web/src/components/screens/LoggingScreen/LoggingScreen.tsx
index 8eaf4446c..284043d63 100644
--- a/clients/web/src/components/screens/LoggingScreen/LoggingScreen.tsx
+++ b/clients/web/src/components/screens/LoggingScreen/LoggingScreen.tsx
@@ -1,14 +1,16 @@
-import { useState } from "react";
 import { Card, Flex, Stack } from "@mantine/core";
 import type { LoggingLevel } from "@modelcontextprotocol/sdk/types.js";
 import { LogControls } from "../../groups/LogControls/LogControls";
 import { LogStreamPanel } from "../../groups/LogStreamPanel/LogStreamPanel";
 import type { LogEntryData } from "../../elements/LogEntry/LogEntry";
 import type { SortDirection } from "../../elements/SortToggle/SortToggle";
+import { ALL_LEVELS_VISIBLE, NO_LEVELS_VISIBLE } from "./logLevels";
 
 export interface LoggingScreenProps {
   entries: LogEntryData[];
   currentLevel: LoggingLevel;
+  ui: LogsUiState;
+  onUiChange: (next: LogsUiState) => void;
   onSetLevel: (level: LoggingLevel) => void;
   onClear: () => void;
   onExport: () => void;
@@ -16,27 +18,12 @@ export interface LoggingScreenProps {
   onSortChange: (next: SortDirection) => void;
 }
 
-const ALL_LEVELS_VISIBLE: Record<LoggingLevel, boolean> = {
-  debug: true,
-  info: true,
-  notice: true,
-  warning: true,
-  error: true,
-  critical: true,
-  alert: true,
-  emergency: true,
-};
-
-const NO_LEVELS_VISIBLE: Record<LoggingLevel, boolean> = {
-  debug: false,
-  info: false,
-  notice: false,
-  warning: false,
-  error: false,
-  critical: false,
-  alert: false,
-  emergency: false,
-};
+// Filter text + visible-level set — controlled by the parent (App) as one
+// object so they persist across tab navigation within a live session (#1417).
+export interface LogsUiState {
+  filterText: string;
+  visibleLevels: Record<LoggingLevel, boolean>;
+}
 
 const ScreenLayout = Flex.withProps({
   variant: "screen",
@@ -58,23 +45,29 @@ const SidebarCard = Card.withProps({
 export function LoggingScreen({
   entries,
   currentLevel,
+  ui,
+  onUiChange,
   onSetLevel,
   onClear,
   onExport,
   sortDirection,
   onSortChange,
 }: LoggingScreenProps) {
-  const [filterText, setFilterText] = useState("");
-  const [visibleLevels, setVisibleLevels] =
-    useState<Record<LoggingLevel, boolean>>(ALL_LEVELS_VISIBLE);
+  const { filterText, visibleLevels } = ui;
 
   function handleToggleLevel(level: LoggingLevel, visible: boolean) {
-    setVisibleLevels((prev) => ({ ...prev, [level]: visible }));
+    onUiChange({
+      ...ui,
+      visibleLevels: { ...visibleLevels, [level]: visible },
+    });
   }
 
   function handleToggleAllLevels() {
     const allSelected = Object.values(visibleLevels).every(Boolean);
-    setVisibleLevels(allSelected ? NO_LEVELS_VISIBLE : ALL_LEVELS_VISIBLE);
+    onUiChange({
+      ...ui,
+      visibleLevels: allSelected ? NO_LEVELS_VISIBLE : ALL_LEVELS_VISIBLE,
+    });
   }
 
   return (
@@ -86,7 +79,7 @@ export function LoggingScreen({
             filterText={filterText}
             visibleLevels={visibleLevels}
             onSetLevel={onSetLevel}
-            onFilterChange={setFilterText}
+            onFilterChange={(value) => onUiChange({ ...ui, filterText: value })}
             onToggleLevel={handleToggleLevel}
             onToggleAllLevels={handleToggleAllLevels}
           />
diff --git a/clients/web/src/components/screens/LoggingScreen/logLevels.ts b/clients/web/src/components/screens/LoggingScreen/logLevels.ts
new file mode 100644
index 000000000..115b97bff
--- /dev/null
+++ b/clients/web/src/components/screens/LoggingScreen/logLevels.ts
@@ -0,0 +1,27 @@
+import type { LoggingLevel } from "@modelcontextprotocol/sdk/types.js";
+
+// Default visible-level filter: every level on. Shared by LoggingScreen (its
+// fallback when the parent hasn't set `visibleLevels`) and App, which seeds and
+// resets the lifted filter state from it (#1417). Lives in its own module so
+// the screen file only exports a component (react-refresh constraint).
+export const ALL_LEVELS_VISIBLE: Record<LoggingLevel, boolean> = {
+  debug: true,
+  info: true,
+  notice: true,
+  warning: true,
+  error: true,
+  critical: true,
+  alert: true,
+  emergency: true,
+};
+
+export const NO_LEVELS_VISIBLE: Record<LoggingLevel, boolean> = {
+  debug: false,
+  info: false,
+  notice: false,
+  warning: false,
+  error: false,
+  critical: false,
+  alert: false,
+  emergency: false,
+};
diff --git a/clients/web/src/components/screens/NetworkScreen/NetworkScreen.stories.tsx b/clients/web/src/components/screens/NetworkScreen/NetworkScreen.stories.tsx
index 56ef45d4c..d80f01063 100644
--- a/clients/web/src/components/screens/NetworkScreen/NetworkScreen.stories.tsx
+++ b/clients/web/src/components/screens/NetworkScreen/NetworkScreen.stories.tsx
@@ -1,7 +1,19 @@
+import { useState } from "react";
+import type { ComponentProps } from "react";
 import type { Meta, StoryObj } from "@storybook/react-vite";
 import { expect, fn, userEvent, within } from "storybook/test";
 import type { FetchRequestEntry } from "../../../../../../core/mcp/types.js";
 import { NetworkScreen } from "./NetworkScreen";
+import { EMPTY_NETWORK_UI } from "../screenUiState";
+
+// NetworkScreen is controlled (filter text + visible categories live in the
+// parent as one `ui` object — see #1417). This wrapper holds that state so the
+// play-driven category toggle actually hides entries, mirroring how App owns
+// the state.
+function StatefulNetworkScreen(args: ComponentProps<typeof NetworkScreen>) {
+  const [ui, setUi] = useState({ ...EMPTY_NETWORK_UI, ...args.ui });
+  return <NetworkScreen {...args} ui={ui} onUiChange={setUi} />;
+}
 
 const meta: Meta<typeof NetworkScreen> = {
   title: "Screens/NetworkScreen",
@@ -10,11 +22,14 @@ const meta: Meta<typeof NetworkScreen> = {
   args: {
     onClear: fn(),
     onExport: fn(),
+    ui: EMPTY_NETWORK_UI,
+    onUiChange: fn(),
     sortDirection: "newest-first",
     onSortChange: fn(),
     compact: true,
     onToggleCompact: fn(),
   },
+  render: (args) => <StatefulNetworkScreen {...args} />,
 };
 
 export default meta;
diff --git a/clients/web/src/components/screens/NetworkScreen/NetworkScreen.test.tsx b/clients/web/src/components/screens/NetworkScreen/NetworkScreen.test.tsx
index f081a4e15..9d1822906 100644
--- a/clients/web/src/components/screens/NetworkScreen/NetworkScreen.test.tsx
+++ b/clients/web/src/components/screens/NetworkScreen/NetworkScreen.test.tsx
@@ -1,8 +1,14 @@
+import { useState } from "react";
 import { describe, it, expect, vi } from "vitest";
 import userEvent from "@testing-library/user-event";
 import type { FetchRequestEntry } from "@inspector/core/mcp/types.js";
 import { renderWithMantine, screen } from "../../../test/renderWithMantine";
-import { NetworkScreen } from "./NetworkScreen";
+import {
+  NetworkScreen,
+  type NetworkScreenProps,
+  type NetworkUiState,
+} from "./NetworkScreen";
+import { EMPTY_NETWORK_UI } from "../screenUiState";
 
 const transportEntry: FetchRequestEntry = {
   id: "t-1",
@@ -41,6 +47,8 @@ const errorEntry: FetchRequestEntry = {
 
 const baseProps = {
   entries: [transportEntry, authEntry, errorEntry],
+  ui: EMPTY_NETWORK_UI,
+  onUiChange: vi.fn(),
   onClear: vi.fn(),
   onExport: vi.fn(),
   sortDirection: "newest-first" as const,
@@ -49,6 +57,30 @@ const baseProps = {
   onToggleCompact: vi.fn(),
 };
 
+// NetworkScreen is controlled: filter text + visible-category set live in the
+// parent (App) as one `ui` object so they persist across tab navigation
+// (#1417). This host holds that state so typing/toggling drives the rendered
+// list, mirroring how App owns it. Props passed in override defaults; the
+// stateful `ui` wiring is applied last so callers can still observe changes via
+// the spied `onUiChange` callback.
+function ControlledNetworkScreen(props: Partial<NetworkScreenProps>) {
+  const [ui, setUi] = useState<NetworkUiState>({
+    ...EMPTY_NETWORK_UI,
+    ...props.ui,
+  });
+  return (
+    <NetworkScreen
+      {...baseProps}
+      {...props}
+      ui={ui}
+      onUiChange={(value) => {
+        setUi(value);
+        props.onUiChange?.(value);
+      }}
+    />
+  );
+}
+
 describe("NetworkScreen", () => {
   it("renders the network controls and panel", () => {
     renderWithMantine(<NetworkScreen {...baseProps} />);
@@ -77,7 +109,7 @@ describe("NetworkScreen", () => {
 
   it("filters by category when a category is toggled off", async () => {
     const user = userEvent.setup();
-    renderWithMantine(<NetworkScreen {...baseProps} />);
+    renderWithMantine(<ControlledNetworkScreen />);
     expect(
       screen.getByText("https://example.com/oauth/token"),
     ).toBeInTheDocument();
@@ -89,7 +121,7 @@ describe("NetworkScreen", () => {
 
   it("Deselect All hides every entry; Select All restores them", async () => {
     const user = userEvent.setup();
-    renderWithMantine(<NetworkScreen {...baseProps} />);
+    renderWithMantine(<ControlledNetworkScreen />);
     await user.click(screen.getByRole("button", { name: "Deselect All" }));
     expect(screen.getByText("No network requests")).toBeInTheDocument();
     await user.click(screen.getByRole("button", { name: "Select All" }));
@@ -100,7 +132,7 @@ describe("NetworkScreen", () => {
 
   it("filters by search text across URL, method, status, and headers", async () => {
     const user = userEvent.setup();
-    renderWithMantine(<NetworkScreen {...baseProps} />);
+    renderWithMantine(<ControlledNetworkScreen />);
     await user.type(screen.getByPlaceholderText("Search..."), "oauth");
     expect(
       screen.getByText("https://example.com/oauth/token"),
diff --git a/clients/web/src/components/screens/NetworkScreen/NetworkScreen.tsx b/clients/web/src/components/screens/NetworkScreen/NetworkScreen.tsx
index 93f7c52a0..ebc0996f0 100644
--- a/clients/web/src/components/screens/NetworkScreen/NetworkScreen.tsx
+++ b/clients/web/src/components/screens/NetworkScreen/NetworkScreen.tsx
@@ -1,4 +1,3 @@
-import { useState } from "react";
 import { Card, Flex, Stack } from "@mantine/core";
 import type {
   FetchRequestCategory,
@@ -7,9 +6,15 @@ import type {
 import { NetworkControls } from "../../groups/NetworkControls/NetworkControls";
 import { NetworkStreamPanel } from "../../groups/NetworkStreamPanel/NetworkStreamPanel";
 import type { SortDirection } from "../../elements/SortToggle/SortToggle";
+import {
+  ALL_CATEGORIES_VISIBLE,
+  NO_CATEGORIES_VISIBLE,
+} from "./fetchCategories";
 
 export interface NetworkScreenProps {
   entries: FetchRequestEntry[];
+  ui: NetworkUiState;
+  onUiChange: (next: NetworkUiState) => void;
   onClear: () => void;
   onExport: () => void;
   sortDirection: SortDirection;
@@ -18,15 +23,12 @@ export interface NetworkScreenProps {
   onToggleCompact: () => void;
 }
 
-const ALL_CATEGORIES_VISIBLE: Record<FetchRequestCategory, boolean> = {
-  auth: true,
-  transport: true,
-};
-
-const NO_CATEGORIES_VISIBLE: Record<FetchRequestCategory, boolean> = {
-  auth: false,
-  transport: false,
-};
+// Filter text + visible-category set — controlled by the parent (App) as one
+// object so they persist across tab navigation within a live session (#1417).
+export interface NetworkUiState {
+  filterText: string;
+  visibleCategories: Record<FetchRequestCategory, boolean>;
+}
 
 const ScreenLayout = Flex.withProps({
   variant: "screen",
@@ -47,6 +49,8 @@ const SidebarCard = Card.withProps({
 
 export function NetworkScreen({
   entries,
+  ui,
+  onUiChange,
   onClear,
   onExport,
   sortDirection,
@@ -54,23 +58,26 @@ export function NetworkScreen({
   compact,
   onToggleCompact,
 }: NetworkScreenProps) {
-  const [filterText, setFilterText] = useState("");
-  const [visibleCategories, setVisibleCategories] = useState<
-    Record<FetchRequestCategory, boolean>
-  >(ALL_CATEGORIES_VISIBLE);
+  const { filterText, visibleCategories } = ui;
 
   function handleToggleCategory(
     category: FetchRequestCategory,
     visible: boolean,
   ) {
-    setVisibleCategories((prev) => ({ ...prev, [category]: visible }));
+    onUiChange({
+      ...ui,
+      visibleCategories: { ...visibleCategories, [category]: visible },
+    });
   }
 
   function handleToggleAllCategories() {
     const allSelected = Object.values(visibleCategories).every(Boolean);
-    setVisibleCategories(
-      allSelected ? NO_CATEGORIES_VISIBLE : ALL_CATEGORIES_VISIBLE,
-    );
+    onUiChange({
+      ...ui,
+      visibleCategories: allSelected
+        ? NO_CATEGORIES_VISIBLE
+        : ALL_CATEGORIES_VISIBLE,
+    });
   }
 
   return (
@@ -80,7 +87,7 @@ export function NetworkScreen({
           <NetworkControls
             filterText={filterText}
             visibleCategories={visibleCategories}
-            onFilterChange={setFilterText}
+            onFilterChange={(value) => onUiChange({ ...ui, filterText: value })}
             onToggleCategory={handleToggleCategory}
             onToggleAllCategories={handleToggleAllCategories}
           />
diff --git a/clients/web/src/components/screens/NetworkScreen/fetchCategories.ts b/clients/web/src/components/screens/NetworkScreen/fetchCategories.ts
new file mode 100644
index 000000000..86a80c7f8
--- /dev/null
+++ b/clients/web/src/components/screens/NetworkScreen/fetchCategories.ts
@@ -0,0 +1,15 @@
+import type { FetchRequestCategory } from "@inspector/core/mcp/types.js";
+
+// Default visible-category filter: every category on. Shared by NetworkScreen
+// (its fallback when the parent hasn't set `visibleCategories`) and App, which
+// seeds and resets the lifted filter state from it (#1417). Lives in its own
+// module so the screen file only exports a component (react-refresh constraint).
+export const ALL_CATEGORIES_VISIBLE: Record<FetchRequestCategory, boolean> = {
+  auth: true,
+  transport: true,
+};
+
+export const NO_CATEGORIES_VISIBLE: Record<FetchRequestCategory, boolean> = {
+  auth: false,
+  transport: false,
+};
diff --git a/clients/web/src/components/screens/PromptsScreen/PromptsScreen.stories.tsx b/clients/web/src/components/screens/PromptsScreen/PromptsScreen.stories.tsx
index f947a071b..dae6659a3 100644
--- a/clients/web/src/components/screens/PromptsScreen/PromptsScreen.stories.tsx
+++ b/clients/web/src/components/screens/PromptsScreen/PromptsScreen.stories.tsx
@@ -1,19 +1,34 @@
+import { useState } from "react";
+import type { ComponentProps } from "react";
 import type { Meta, StoryObj } from "@storybook/react-vite";
 import type { Prompt } from "@modelcontextprotocol/sdk/types.js";
 import { fn, userEvent, within } from "storybook/test";
 import { PromptsScreen } from "./PromptsScreen";
-import type { GetPromptState } from "./PromptsScreen";
+import type { GetPromptState, PromptsUiState } from "./PromptsScreen";
+import { EMPTY_PROMPTS_UI } from "../screenUiState";
+
+// PromptsScreen is controlled (selection, argument values, submitted prompt, and
+// search text live in the parent as one `ui` object — see #1417). This wrapper
+// holds that state so the play-driven prompt clicks still drive the detail
+// panel, mirroring how App owns the state in the real app.
+function StatefulPromptsScreen(args: ComponentProps<typeof PromptsScreen>) {
+  const [ui, setUi] = useState<PromptsUiState>(args.ui ?? EMPTY_PROMPTS_UI);
+  return <PromptsScreen {...args} ui={ui} onUiChange={setUi} />;
+}
 
 const meta: Meta<typeof PromptsScreen> = {
   title: "Screens/PromptsScreen",
   component: PromptsScreen,
   parameters: { layout: "fullscreen" },
   args: {
+    ui: EMPTY_PROMPTS_UI,
+    onUiChange: fn(),
     onRefreshList: fn(),
     onGetPrompt: fn(),
     onCopyMessages: fn(),
     listChanged: false,
   },
+  render: (args) => <StatefulPromptsScreen {...args} />,
 };
 
 export default meta;
diff --git a/clients/web/src/components/screens/PromptsScreen/PromptsScreen.test.tsx b/clients/web/src/components/screens/PromptsScreen/PromptsScreen.test.tsx
index 025b16ef6..e9aa45cec 100644
--- a/clients/web/src/components/screens/PromptsScreen/PromptsScreen.test.tsx
+++ b/clients/web/src/components/screens/PromptsScreen/PromptsScreen.test.tsx
@@ -1,8 +1,14 @@
+import { useState } from "react";
 import { describe, it, expect, vi } from "vitest";
 import userEvent from "@testing-library/user-event";
 import type { Prompt } from "@modelcontextprotocol/sdk/types.js";
 import { renderWithMantine, screen } from "../../../test/renderWithMantine";
-import { PromptsScreen } from "./PromptsScreen";
+import {
+  PromptsScreen,
+  type PromptsScreenProps,
+  type PromptsUiState,
+} from "./PromptsScreen";
+import { EMPTY_PROMPTS_UI } from "../screenUiState";
 
 const promptsWithArgs: Prompt[] = [
   {
@@ -25,10 +31,37 @@ const noArgPrompts: Prompt[] = [
 const baseProps = {
   prompts: promptsWithArgs,
   listChanged: false,
+  ui: EMPTY_PROMPTS_UI,
+  onUiChange: vi.fn(),
   onRefreshList: vi.fn(),
   onGetPrompt: vi.fn(),
 };
 
+// PromptsScreen is controlled: selection, argument values, the submitted
+// marker, and the sidebar search live in the parent (App) as one `ui` object so
+// they persist across tab navigation (#1417). This host holds that state so
+// clicking a prompt, typing arguments, submitting, and closing drive the panel
+// exactly as App owns it. Props passed in override defaults; the stateful `ui`
+// wiring is applied last so callers can still observe activity via the rendered
+// state.
+function ControlledPromptsScreen(props: Partial<PromptsScreenProps>) {
+  const [ui, setUi] = useState<PromptsUiState>({
+    ...EMPTY_PROMPTS_UI,
+    ...props.ui,
+  });
+  return (
+    <PromptsScreen
+      {...baseProps}
+      {...props}
+      ui={ui}
+      onUiChange={(next) => {
+        setUi(next);
+        props.onUiChange?.(next);
+      }}
+    />
+  );
+}
+
 describe("PromptsScreen", () => {
   it("renders the empty state when no prompt is selected", () => {
     renderWithMantine(<PromptsScreen {...baseProps} />);
@@ -39,7 +72,7 @@ describe("PromptsScreen", () => {
 
   it("shows the argument form when a prompt with arguments is selected", async () => {
     const user = userEvent.setup();
-    renderWithMantine(<PromptsScreen {...baseProps} />);
+    renderWithMantine(<ControlledPromptsScreen />);
     await user.click(screen.getByText("summarize"));
     expect(
       screen.getByRole("button", { name: "Get Prompt" }),
@@ -50,8 +83,7 @@ describe("PromptsScreen", () => {
     const user = userEvent.setup();
     const onGetPrompt = vi.fn();
     renderWithMantine(
-      <PromptsScreen
-        {...baseProps}
+      <ControlledPromptsScreen
         prompts={noArgPrompts}
         onGetPrompt={onGetPrompt}
       />,
@@ -68,8 +100,7 @@ describe("PromptsScreen", () => {
     const user = userEvent.setup();
     const onGetPrompt = vi.fn();
     const { rerender } = renderWithMantine(
-      <PromptsScreen
-        {...baseProps}
+      <ControlledPromptsScreen
         prompts={noArgPrompts}
         onGetPrompt={onGetPrompt}
       />,
@@ -79,8 +110,7 @@ describe("PromptsScreen", () => {
     // Parent re-renders with a fresh pending state — the fetch must not
     // re-fire just because props changed.
     rerender(
-      <PromptsScreen
-        {...baseProps}
+      <ControlledPromptsScreen
         prompts={noArgPrompts}
         onGetPrompt={onGetPrompt}
         getPromptState={{ status: "pending", promptName: "ping" }}
@@ -93,8 +123,7 @@ describe("PromptsScreen", () => {
     const user = userEvent.setup();
     const onGetPrompt = vi.fn();
     renderWithMantine(
-      <PromptsScreen
-        {...baseProps}
+      <ControlledPromptsScreen
         onGetPrompt={onGetPrompt}
         getPromptState={{
           status: "ok",
@@ -119,8 +148,7 @@ describe("PromptsScreen", () => {
   it("shows pending state once the user has submitted", async () => {
     const user = userEvent.setup();
     renderWithMantine(
-      <PromptsScreen
-        {...baseProps}
+      <ControlledPromptsScreen
         getPromptState={{ status: "pending", promptName: "summarize" }}
       />,
     );
@@ -133,8 +161,7 @@ describe("PromptsScreen", () => {
   it("shows error state once the user has submitted", async () => {
     const user = userEvent.setup();
     renderWithMantine(
-      <PromptsScreen
-        {...baseProps}
+      <ControlledPromptsScreen
         getPromptState={{
           status: "error",
           promptName: "summarize",
@@ -152,8 +179,7 @@ describe("PromptsScreen", () => {
   it("falls back to a default error message when none is provided", async () => {
     const user = userEvent.setup();
     renderWithMantine(
-      <PromptsScreen
-        {...baseProps}
+      <ControlledPromptsScreen
         getPromptState={{ status: "error", promptName: "summarize" }}
       />,
     );
@@ -166,8 +192,7 @@ describe("PromptsScreen", () => {
   it("ignores a stale getPromptState whose name does not match the selection", async () => {
     const user = userEvent.setup();
     renderWithMantine(
-      <PromptsScreen
-        {...baseProps}
+      <ControlledPromptsScreen
         // Stale result for a prompt the user is no longer viewing.
         getPromptState={{
           status: "ok",
@@ -190,8 +215,7 @@ describe("PromptsScreen", () => {
     const user = userEvent.setup();
     const onGetPrompt = vi.fn();
     renderWithMantine(
-      <PromptsScreen
-        {...baseProps}
+      <ControlledPromptsScreen
         prompts={noArgPrompts}
         onGetPrompt={onGetPrompt}
       />,
@@ -210,9 +234,7 @@ describe("PromptsScreen", () => {
       { name: "alpha", arguments: [{ name: "x" }] },
       { name: "beta", arguments: [{ name: "y" }] },
     ];
-    renderWithMantine(
-      <PromptsScreen {...baseProps} prompts={arglessTwoStep} />,
-    );
+    renderWithMantine(<ControlledPromptsScreen prompts={arglessTwoStep} />);
     await user.click(screen.getByText("alpha"));
     await user.type(screen.getByPlaceholderText("Enter x..."), "value");
     await user.click(screen.getByText("beta"));
@@ -222,8 +244,7 @@ describe("PromptsScreen", () => {
   it("closing the preview from the error state brings the form back", async () => {
     const user = userEvent.setup();
     renderWithMantine(
-      <PromptsScreen
-        {...baseProps}
+      <ControlledPromptsScreen
         getPromptState={{
           status: "error",
           promptName: "summarize",
@@ -244,8 +265,7 @@ describe("PromptsScreen", () => {
   it("closing the preview for an arg-bearing prompt brings the form back", async () => {
     const user = userEvent.setup();
     renderWithMantine(
-      <PromptsScreen
-        {...baseProps}
+      <ControlledPromptsScreen
         getPromptState={{
           status: "ok",
           promptName: "summarize",
@@ -270,8 +290,7 @@ describe("PromptsScreen", () => {
   it("closing the preview for a no-arg prompt drops the selection", async () => {
     const user = userEvent.setup();
     renderWithMantine(
-      <PromptsScreen
-        {...baseProps}
+      <ControlledPromptsScreen
         prompts={noArgPrompts}
         getPromptState={{
           status: "ok",
@@ -305,8 +324,7 @@ describe("PromptsScreen", () => {
       >()
       .mockResolvedValue([]);
     renderWithMantine(
-      <PromptsScreen
-        {...baseProps}
+      <ControlledPromptsScreen
         completionsSupported
         onCompleteArgument={onCompleteArgument}
       />,
diff --git a/clients/web/src/components/screens/PromptsScreen/PromptsScreen.tsx b/clients/web/src/components/screens/PromptsScreen/PromptsScreen.tsx
index a3d7f1aba..d10f1686e 100644
--- a/clients/web/src/components/screens/PromptsScreen/PromptsScreen.tsx
+++ b/clients/web/src/components/screens/PromptsScreen/PromptsScreen.tsx
@@ -1,4 +1,3 @@
-import { useState } from "react";
 import {
   Alert,
   Card,
@@ -31,8 +30,10 @@ export interface GetPromptState {
 export interface PromptsScreenProps {
   prompts: Prompt[];
   getPromptState?: GetPromptState;
+  ui: PromptsUiState;
   listChanged: boolean;
   completionsSupported?: boolean;
+  onUiChange: (next: PromptsUiState) => void;
   onRefreshList: () => void;
   onGetPrompt: (name: string, args: Record<string, string>) => void;
   onCopyMessages?: () => void;
@@ -46,6 +47,16 @@ export interface PromptsScreenProps {
   ) => Promise<string[]>;
 }
 
+// Selection, argument values, the "submitted" marker, and the sidebar search —
+// controlled by the parent (App) as one object so they persist across tab
+// navigation within a live session (#1417).
+export interface PromptsUiState {
+  selectedPromptName?: string;
+  argumentValues: Record<string, string>;
+  submittedFor?: string;
+  search: string;
+}
+
 const ScreenLayout = Flex.withProps({
   variant: "screen",
   h: "calc(100vh - var(--app-shell-header-height, 0px))",
@@ -102,26 +113,16 @@ function hasArguments(prompt: Prompt): boolean {
 export function PromptsScreen({
   prompts,
   getPromptState,
+  ui,
   listChanged,
   completionsSupported,
+  onUiChange,
   onRefreshList,
   onGetPrompt,
   onCopyMessages,
   onCompleteArgument,
 }: PromptsScreenProps) {
-  const [selectedPromptName, setSelectedPromptName] = useState<
-    string | undefined
-  >(undefined);
-  const [argumentValues, setArgumentValues] = useState<Record<string, string>>(
-    {},
-  );
-  // Track which prompt the user has already submitted in this session so
-  // the form pane disappears once the user clicks Get Prompt. Cleared on
-  // sidebar switch so the form re-appears for a freshly-selected prompt.
-  const [submittedFor, setSubmittedFor] = useState<string | undefined>(
-    undefined,
-  );
-
+  const { selectedPromptName, argumentValues, submittedFor, search } = ui;
   const selectedPrompt = selectedPromptName
     ? prompts.find((p) => p.name === selectedPromptName)
     : undefined;
@@ -132,23 +133,23 @@ export function PromptsScreen({
     // for navigation, ✕ is for dismiss. Closing-then-reselecting is
     // its own thing (the close handler clears submittedFor).
     if (name === selectedPromptName) return;
-    setArgumentValues({});
-    setSelectedPromptName(name);
     // Auto-fetch no-argument prompts the moment they're selected — the
     // form pane would otherwise just render a bare Get Prompt button
     // with nothing to fill in. Prompts with arguments wait for submit.
     const target = prompts.find((p) => p.name === name);
-    if (target && !hasArguments(target)) {
-      setSubmittedFor(name);
-      onGetPrompt(name, {});
-    } else {
-      setSubmittedFor(undefined);
-    }
+    const autoFetch = !!target && !hasArguments(target);
+    onUiChange({
+      ...ui,
+      argumentValues: {},
+      selectedPromptName: name,
+      submittedFor: autoFetch ? name : undefined,
+    });
+    if (autoFetch) onGetPrompt(name, {});
   }
 
   function handleSubmit() {
     if (!selectedPrompt) return;
-    setSubmittedFor(selectedPrompt.name);
+    onUiChange({ ...ui, submittedFor: selectedPrompt.name });
     onGetPrompt(selectedPrompt.name, argumentValues);
   }
 
@@ -158,10 +159,13 @@ export function PromptsScreen({
     // prompts there's no form to return to, so drop the selection and
     // fall back to the empty state.
     if (selectedPrompt && hasArguments(selectedPrompt)) {
-      setSubmittedFor(undefined);
+      onUiChange({ ...ui, submittedFor: undefined });
     } else {
-      setSelectedPromptName(undefined);
-      setSubmittedFor(undefined);
+      onUiChange({
+        ...ui,
+        selectedPromptName: undefined,
+        submittedFor: undefined,
+      });
     }
   }
 
@@ -235,8 +239,10 @@ export function PromptsScreen({
           <PromptControls
             prompts={prompts}
             selectedName={selectedPromptName}
+            searchText={search}
             listChanged={listChanged}
             onRefreshList={onRefreshList}
+            onSearchChange={(value) => onUiChange({ ...ui, search: value })}
             onSelectPrompt={handleSelectPrompt}
           />
         </SidebarCard>
@@ -256,7 +262,10 @@ export function PromptsScreen({
               prompt={selectedPrompt}
               argumentValues={argumentValues}
               onArgumentChange={(argName, value) =>
-                setArgumentValues((prev) => ({ ...prev, [argName]: value }))
+                onUiChange({
+                  ...ui,
+                  argumentValues: { ...argumentValues, [argName]: value },
+                })
               }
               onGetPrompt={handleSubmit}
               completionsSupported={completionsSupported}
diff --git a/clients/web/src/components/screens/ResourcesScreen/ResourcesScreen.stories.tsx b/clients/web/src/components/screens/ResourcesScreen/ResourcesScreen.stories.tsx
index d63576e0b..ac35aeb00 100644
--- a/clients/web/src/components/screens/ResourcesScreen/ResourcesScreen.stories.tsx
+++ b/clients/web/src/components/screens/ResourcesScreen/ResourcesScreen.stories.tsx
@@ -1,3 +1,5 @@
+import { useState } from "react";
+import type { ComponentProps } from "react";
 import type { Meta, StoryObj } from "@storybook/react-vite";
 import type {
   Resource,
@@ -6,13 +8,26 @@ import type {
 import type { InspectorResourceSubscription } from "../../../../../../core/mcp/types.js";
 import { fn, userEvent, within } from "storybook/test";
 import { ResourcesScreen } from "./ResourcesScreen";
-import type { ReadResourceState } from "./ResourcesScreen";
+import type { ReadResourceState, ResourcesUiState } from "./ResourcesScreen";
+import { EMPTY_RESOURCES_UI } from "../screenUiState";
+
+// ResourcesScreen is controlled (resource/template selection, the originating
+// template, search text, and open accordion sections live in the parent as one
+// `ui` object — see #1417). This wrapper holds that state so the play-driven
+// clicks still drive the detail/preview panels, mirroring how App owns the state
+// in the real app.
+function StatefulResourcesScreen(args: ComponentProps<typeof ResourcesScreen>) {
+  const [ui, setUi] = useState<ResourcesUiState>(args.ui ?? EMPTY_RESOURCES_UI);
+  return <ResourcesScreen {...args} ui={ui} onUiChange={setUi} />;
+}
 
 const meta: Meta<typeof ResourcesScreen> = {
   title: "Screens/ResourcesScreen",
   component: ResourcesScreen,
   parameters: { layout: "fullscreen" },
   args: {
+    ui: EMPTY_RESOURCES_UI,
+    onUiChange: fn(),
     onRefreshList: fn(),
     onReadResource: fn(),
     onSubscribeResource: fn(),
@@ -23,6 +38,7 @@ const meta: Meta<typeof ResourcesScreen> = {
     compact: false,
     onCompactChange: fn(),
   },
+  render: (args) => <StatefulResourcesScreen {...args} />,
 };
 
 export default meta;
diff --git a/clients/web/src/components/screens/ResourcesScreen/ResourcesScreen.test.tsx b/clients/web/src/components/screens/ResourcesScreen/ResourcesScreen.test.tsx
index ccfca15fc..a94d96338 100644
--- a/clients/web/src/components/screens/ResourcesScreen/ResourcesScreen.test.tsx
+++ b/clients/web/src/components/screens/ResourcesScreen/ResourcesScreen.test.tsx
@@ -1,3 +1,4 @@
+import { useState } from "react";
 import { describe, it, expect, vi } from "vitest";
 import userEvent from "@testing-library/user-event";
 import type {
@@ -6,7 +7,12 @@ import type {
   ReadResourceResult,
 } from "@modelcontextprotocol/sdk/types.js";
 import { renderWithMantine, screen } from "../../../test/renderWithMantine";
-import { ResourcesScreen } from "./ResourcesScreen";
+import {
+  ResourcesScreen,
+  type ResourcesScreenProps,
+  type ResourcesUiState,
+} from "./ResourcesScreen";
+import { EMPTY_RESOURCES_UI } from "../screenUiState";
 
 const resources: Resource[] = [
   { uri: "file:///x", name: "x.txt" },
@@ -22,6 +28,8 @@ const baseProps = {
   templates,
   subscriptions: [],
   listChanged: false,
+  ui: EMPTY_RESOURCES_UI,
+  onUiChange: vi.fn(),
   onRefreshList: vi.fn(),
   onReadResource: vi.fn(),
   onSubscribeResource: vi.fn(),
@@ -34,6 +42,32 @@ const okResult: ReadResourceResult = {
   contents: [{ uri: "file:///x", text: "embedded contents" }],
 };
 
+// ResourcesScreen is controlled: the selected resource/template URIs, the
+// originating-template marker, the sidebar search, and the accordion's open
+// sections live in the parent (App) as one `ui` object so they persist across
+// tab navigation (#1417). This host holds that state so clicking a
+// resource/template, typing into the template form, reading, and closing drive
+// the panel exactly as App owns it. Props passed in override defaults; the
+// stateful `ui` wiring is applied last so callers can still observe activity via
+// the rendered state.
+function ControlledResourcesScreen(props: Partial<ResourcesScreenProps>) {
+  const [ui, setUi] = useState<ResourcesUiState>({
+    ...EMPTY_RESOURCES_UI,
+    ...props.ui,
+  });
+  return (
+    <ResourcesScreen
+      {...baseProps}
+      {...props}
+      ui={ui}
+      onUiChange={(next) => {
+        setUi(next);
+        props.onUiChange?.(next);
+      }}
+    />
+  );
+}
+
 describe("ResourcesScreen", () => {
   it("renders empty preview state when nothing is selected", () => {
     renderWithMantine(<ResourcesScreen {...baseProps} />);
@@ -45,8 +79,7 @@ describe("ResourcesScreen", () => {
   it("shows the read error alert when error and a resource is selected", async () => {
     const user = userEvent.setup();
     renderWithMantine(
-      <ResourcesScreen
-        {...baseProps}
+      <ControlledResourcesScreen
         readState={{ status: "error", error: "boom" }}
       />,
     );
@@ -58,7 +91,7 @@ describe("ResourcesScreen", () => {
   it("falls back to default error when error message is missing", async () => {
     const user = userEvent.setup();
     renderWithMantine(
-      <ResourcesScreen {...baseProps} readState={{ status: "error" }} />,
+      <ControlledResourcesScreen readState={{ status: "error" }} />,
     );
     await user.click(screen.getByText("x.txt"));
     expect(screen.getByText("Failed to read resource")).toBeInTheDocument();
@@ -67,7 +100,7 @@ describe("ResourcesScreen", () => {
   it("shows the loading state when reading", async () => {
     const user = userEvent.setup();
     renderWithMantine(
-      <ResourcesScreen {...baseProps} readState={{ status: "pending" }} />,
+      <ControlledResourcesScreen readState={{ status: "pending" }} />,
     );
     await user.click(screen.getByText("x.txt"));
     expect(screen.getByText("Reading resource...")).toBeInTheDocument();
@@ -76,8 +109,7 @@ describe("ResourcesScreen", () => {
   it("renders the preview panel when readState has a result", async () => {
     const user = userEvent.setup();
     renderWithMantine(
-      <ResourcesScreen
-        {...baseProps}
+      <ControlledResourcesScreen
         readState={{
           status: "ok",
           uri: "file:///x",
@@ -108,7 +140,7 @@ describe("ResourcesScreen", () => {
 
   it("renders the template panel when a template is selected", async () => {
     const user = userEvent.setup();
-    renderWithMantine(<ResourcesScreen {...baseProps} />);
+    renderWithMantine(<ControlledResourcesScreen />);
     await user.click(screen.getByText("Templates (1)"));
     await user.click(screen.getByText("files"));
     expect(
@@ -120,7 +152,7 @@ describe("ResourcesScreen", () => {
     const user = userEvent.setup();
     const onReadResource = vi.fn();
     renderWithMantine(
-      <ResourcesScreen {...baseProps} onReadResource={onReadResource} />,
+      <ControlledResourcesScreen onReadResource={onReadResource} />,
     );
     await user.click(screen.getByText("Templates (1)"));
     await user.click(screen.getByText("files"));
@@ -137,7 +169,7 @@ describe("ResourcesScreen", () => {
     const user = userEvent.setup();
     const onReadResource = vi.fn();
     renderWithMantine(
-      <ResourcesScreen {...baseProps} onReadResource={onReadResource} />,
+      <ControlledResourcesScreen onReadResource={onReadResource} />,
     );
     await user.click(screen.getByText("x.txt"));
     expect(onReadResource).toHaveBeenCalledWith("file:///x");
@@ -148,8 +180,7 @@ describe("ResourcesScreen", () => {
     const onReadResource = vi.fn();
     const onSubscribeResource = vi.fn();
     renderWithMantine(
-      <ResourcesScreen
-        {...baseProps}
+      <ControlledResourcesScreen
         onReadResource={onReadResource}
         onSubscribeResource={onSubscribeResource}
         readState={{
@@ -174,8 +205,7 @@ describe("ResourcesScreen", () => {
       { uriTemplate: "file:///{path}", name: "files" },
     ];
     const { rerender } = renderWithMantine(
-      <ResourcesScreen
-        {...baseProps}
+      <ControlledResourcesScreen
         templates={templates}
         onReadResource={onReadResource}
       />,
@@ -191,8 +221,7 @@ describe("ResourcesScreen", () => {
 
     // Parent re-renders with the read result; the preview appears.
     rerender(
-      <ResourcesScreen
-        {...baseProps}
+      <ControlledResourcesScreen
         templates={templates}
         onReadResource={onReadResource}
         readState={{
@@ -218,7 +247,7 @@ describe("ResourcesScreen", () => {
       { uriTemplate: "demo://resource/dynamic/text/{id}", name: "Dynamic" },
     ];
     const { rerender } = renderWithMantine(
-      <ResourcesScreen {...baseProps} templates={templates} />,
+      <ControlledResourcesScreen templates={templates} />,
     );
     await user.click(screen.getByText("Templates (1)"));
     await user.click(screen.getByText("Dynamic"));
@@ -227,8 +256,7 @@ describe("ResourcesScreen", () => {
 
     // Server rejects the URI.
     rerender(
-      <ResourcesScreen
-        {...baseProps}
+      <ControlledResourcesScreen
         templates={templates}
         readState={{
           status: "error",
@@ -248,8 +276,7 @@ describe("ResourcesScreen", () => {
   it("closing the preview for a plain resource returns to the empty state", async () => {
     const user = userEvent.setup();
     renderWithMantine(
-      <ResourcesScreen
-        {...baseProps}
+      <ControlledResourcesScreen
         readState={{
           status: "ok",
           uri: "file:///x",
@@ -268,8 +295,7 @@ describe("ResourcesScreen", () => {
     const user = userEvent.setup();
     const onUnsubscribeResource = vi.fn();
     renderWithMantine(
-      <ResourcesScreen
-        {...baseProps}
+      <ControlledResourcesScreen
         onUnsubscribeResource={onUnsubscribeResource}
         readState={{
           status: "ok",
diff --git a/clients/web/src/components/screens/ResourcesScreen/ResourcesScreen.tsx b/clients/web/src/components/screens/ResourcesScreen/ResourcesScreen.tsx
index 82372878b..ac3099b08 100644
--- a/clients/web/src/components/screens/ResourcesScreen/ResourcesScreen.tsx
+++ b/clients/web/src/components/screens/ResourcesScreen/ResourcesScreen.tsx
@@ -1,4 +1,3 @@
-import { useState } from "react";
 import {
   Alert,
   Card,
@@ -33,8 +32,10 @@ export interface ResourcesScreenProps {
   templates: ResourceTemplate[];
   subscriptions: InspectorResourceSubscription[];
   readState?: ReadResourceState;
+  ui: ResourcesUiState;
   listChanged: boolean;
   completionsSupported?: boolean;
+  onUiChange: (next: ResourcesUiState) => void;
   onRefreshList: () => void;
   onReadResource: (uri: string) => void;
   onSubscribeResource: (uri: string) => void;
@@ -51,6 +52,19 @@ export interface ResourcesScreenProps {
   onCompactChange: (next: boolean) => void;
 }
 
+// Selection (resource URI, template URI, the originating-template marker), the
+// sidebar search, and accordion open-sections — controlled by the parent (App)
+// as one object so they persist across tab navigation within a live session
+// (#1417). `openSections` undefined → ResourceControls falls back to the
+// compact-derived default.
+export interface ResourcesUiState {
+  selectedResourceUri?: string;
+  selectedTemplateUri?: string;
+  originatingTemplateUri?: string;
+  search: string;
+  openSections?: string[];
+}
+
 const ScreenLayout = Flex.withProps({
   variant: "screen",
   h: "calc(100vh - var(--app-shell-header-height, 0px))",
@@ -107,8 +121,10 @@ export function ResourcesScreen({
   templates,
   subscriptions,
   readState,
+  ui,
   listChanged,
   completionsSupported,
+  onUiChange,
   onRefreshList,
   onReadResource,
   onSubscribeResource,
@@ -117,20 +133,13 @@ export function ResourcesScreen({
   compact,
   onCompactChange,
 }: ResourcesScreenProps) {
-  const [selectedResourceUri, setSelectedResourceUri] = useState<
-    string | undefined
-  >(undefined);
-  const [selectedTemplateUri, setSelectedTemplateUri] = useState<
-    string | undefined
-  >(undefined);
-  // Tracks which template (if any) produced the current preview so that
-  // closing the preview can restore the template form. Cleared when the
-  // user navigates to a non-template resource or picks a different
-  // template directly from the sidebar.
-  const [originatingTemplateUri, setOriginatingTemplateUri] = useState<
-    string | undefined
-  >(undefined);
-
+  const {
+    selectedResourceUri,
+    selectedTemplateUri,
+    originatingTemplateUri,
+    search,
+    openSections,
+  } = ui;
   const selectedResource = selectedResourceUri
     ? resources.find((r) => r.uri === selectedResourceUri)
     : undefined;
@@ -147,16 +156,22 @@ export function ResourcesScreen({
       : undefined);
 
   function handleSelectResource(uri: string) {
-    setSelectedTemplateUri(undefined);
-    setSelectedResourceUri(uri);
-    setOriginatingTemplateUri(undefined);
+    onUiChange({
+      ...ui,
+      selectedTemplateUri: undefined,
+      selectedResourceUri: uri,
+      originatingTemplateUri: undefined,
+    });
     onReadResource(uri);
   }
 
   function handleSelectTemplate(uriTemplate: string) {
-    setSelectedResourceUri(undefined);
-    setSelectedTemplateUri(uriTemplate);
-    setOriginatingTemplateUri(undefined);
+    onUiChange({
+      ...ui,
+      selectedResourceUri: undefined,
+      selectedTemplateUri: uriTemplate,
+      originatingTemplateUri: undefined,
+    });
   }
 
   function handleReadResource(uri: string) {
@@ -165,19 +180,25 @@ export function ResourcesScreen({
     // clearing the template selection hides the template form so only
     // the rendered resource is shown. We remember the template URI so
     // closing the preview can restore the form.
-    if (selectedTemplateUri) {
-      setOriginatingTemplateUri(selectedTemplateUri);
-    }
-    setSelectedTemplateUri(undefined);
-    setSelectedResourceUri(uri);
+    onUiChange({
+      ...ui,
+      originatingTemplateUri: selectedTemplateUri ?? originatingTemplateUri,
+      selectedTemplateUri: undefined,
+      selectedResourceUri: uri,
+    });
     onReadResource(uri);
   }
 
   function handleClosePreview() {
-    setSelectedResourceUri(undefined);
     if (originatingTemplateUri) {
-      setSelectedTemplateUri(originatingTemplateUri);
-      setOriginatingTemplateUri(undefined);
+      onUiChange({
+        ...ui,
+        selectedResourceUri: undefined,
+        selectedTemplateUri: originatingTemplateUri,
+        originatingTemplateUri: undefined,
+      });
+    } else {
+      onUiChange({ ...ui, selectedResourceUri: undefined });
     }
   }
 
@@ -251,8 +272,14 @@ export function ResourcesScreen({
             subscriptions={subscriptions}
             selectedUri={selectedResourceUri}
             selectedTemplateUri={selectedTemplateUri}
+            searchText={search}
+            openSections={openSections}
             listChanged={listChanged}
             onRefreshList={onRefreshList}
+            onSearchChange={(value) => onUiChange({ ...ui, search: value })}
+            onOpenSectionsChange={(value) =>
+              onUiChange({ ...ui, openSections: value })
+            }
             onSelectUri={handleSelectResource}
             onSelectTemplate={handleSelectTemplate}
             onUnsubscribeResource={onUnsubscribeResource}
diff --git a/clients/web/src/components/screens/TasksScreen/TasksScreen.stories.tsx b/clients/web/src/components/screens/TasksScreen/TasksScreen.stories.tsx
index 409573d2c..558da51af 100644
--- a/clients/web/src/components/screens/TasksScreen/TasksScreen.stories.tsx
+++ b/clients/web/src/components/screens/TasksScreen/TasksScreen.stories.tsx
@@ -2,6 +2,7 @@ import type { Meta, StoryObj } from "@storybook/react-vite";
 import type { Task } from "@modelcontextprotocol/sdk/types.js";
 import { fn } from "storybook/test";
 import { TasksScreen } from "./TasksScreen";
+import { EMPTY_TASKS_UI } from "../screenUiState";
 
 const meta: Meta<typeof TasksScreen> = {
   title: "Screens/TasksScreen",
@@ -11,6 +12,8 @@ const meta: Meta<typeof TasksScreen> = {
     onRefresh: fn(),
     onClearCompleted: fn(),
     onCancel: fn(),
+    ui: EMPTY_TASKS_UI,
+    onUiChange: fn(),
   },
 };
 
diff --git a/clients/web/src/components/screens/TasksScreen/TasksScreen.test.tsx b/clients/web/src/components/screens/TasksScreen/TasksScreen.test.tsx
index dd1439b01..41b308bc8 100644
--- a/clients/web/src/components/screens/TasksScreen/TasksScreen.test.tsx
+++ b/clients/web/src/components/screens/TasksScreen/TasksScreen.test.tsx
@@ -3,6 +3,7 @@ import userEvent from "@testing-library/user-event";
 import type { Task } from "@modelcontextprotocol/sdk/types.js";
 import { renderWithMantine, screen } from "../../../test/renderWithMantine";
 import { TasksScreen } from "./TasksScreen";
+import { EMPTY_TASKS_UI } from "../screenUiState";
 
 const tasks: Task[] = [
   {
@@ -17,6 +18,8 @@ const tasks: Task[] = [
 
 const baseProps = {
   tasks,
+  ui: EMPTY_TASKS_UI,
+  onUiChange: vi.fn(),
   onRefresh: vi.fn(),
   onClearCompleted: vi.fn(),
   onCancel: vi.fn(),
@@ -40,4 +43,34 @@ describe("TasksScreen", () => {
     await user.click(screen.getByRole("button", { name: "Refresh" }));
     expect(onRefresh).toHaveBeenCalledTimes(1);
   });
+
+  it("emits the search text through onUiChange", async () => {
+    const user = userEvent.setup();
+    const onUiChange = vi.fn();
+    renderWithMantine(<TasksScreen {...baseProps} onUiChange={onUiChange} />);
+    await user.type(screen.getByPlaceholderText("Search..."), "x");
+    expect(onUiChange).toHaveBeenCalledWith(
+      expect.objectContaining({ search: "x" }),
+    );
+  });
+
+  it("emits the cleared status filter through onUiChange", async () => {
+    const user = userEvent.setup();
+    const onUiChange = vi.fn();
+    const { container } = renderWithMantine(
+      <TasksScreen
+        {...baseProps}
+        ui={{ ...EMPTY_TASKS_UI, statusFilter: "working" }}
+        onUiChange={onUiChange}
+      />,
+    );
+    const clearButton = container.querySelector(
+      "button.mantine-InputClearButton-root",
+    ) as HTMLButtonElement | null;
+    expect(clearButton).not.toBeNull();
+    await user.click(clearButton!);
+    expect(onUiChange).toHaveBeenCalledWith(
+      expect.objectContaining({ statusFilter: undefined }),
+    );
+  });
 });
diff --git a/clients/web/src/components/screens/TasksScreen/TasksScreen.tsx b/clients/web/src/components/screens/TasksScreen/TasksScreen.tsx
index b0fe9a1d1..a027f459e 100644
--- a/clients/web/src/components/screens/TasksScreen/TasksScreen.tsx
+++ b/clients/web/src/components/screens/TasksScreen/TasksScreen.tsx
@@ -1,4 +1,3 @@
-import { useState } from "react";
 import { Card, Flex, Stack } from "@mantine/core";
 import type { Task, TaskStatus } from "@modelcontextprotocol/sdk/types.js";
 import { TaskControls } from "../../groups/TaskControls/TaskControls";
@@ -8,11 +7,20 @@ import type { TaskProgress } from "../../groups/TaskCard/TaskCard";
 export interface TasksScreenProps {
   tasks: Task[];
   progressByTaskId?: Record<string, TaskProgress>;
+  ui: TasksUiState;
+  onUiChange: (next: TasksUiState) => void;
   onRefresh: () => void;
   onClearCompleted: () => void;
   onCancel: (taskId: string) => void;
 }
 
+// Search + status filter — controlled by the parent (App) as one object so they
+// persist across tab navigation within a live session (#1417).
+export interface TasksUiState {
+  search: string;
+  statusFilter?: TaskStatus;
+}
+
 const ScreenLayout = Flex.withProps({
   variant: "screen",
   h: "calc(100vh - var(--app-shell-header-height, 0px))",
@@ -33,22 +41,24 @@ const SidebarCard = Card.withProps({
 export function TasksScreen({
   tasks,
   progressByTaskId,
+  ui,
+  onUiChange,
   onRefresh,
   onClearCompleted,
   onCancel,
 }: TasksScreenProps) {
-  const [searchText, setSearchText] = useState("");
-  const [statusFilter, setStatusFilter] = useState<TaskStatus | undefined>();
-
+  const { search, statusFilter } = ui;
   return (
     <ScreenLayout>
       <Sidebar>
         <SidebarCard>
           <TaskControls
-            searchText={searchText}
+            searchText={search}
             statusFilter={statusFilter}
-            onSearchChange={setSearchText}
-            onStatusFilterChange={setStatusFilter}
+            onSearchChange={(value) => onUiChange({ ...ui, search: value })}
+            onStatusFilterChange={(value) =>
+              onUiChange({ ...ui, statusFilter: value })
+            }
             onRefresh={onRefresh}
           />
         </SidebarCard>
@@ -56,7 +66,7 @@ export function TasksScreen({
       <TaskListPanel
         tasks={tasks}
         progressByTaskId={progressByTaskId}
-        searchText={searchText}
+        searchText={search}
         statusFilter={statusFilter}
         onCancel={onCancel}
         onClearCompleted={onClearCompleted}
diff --git a/clients/web/src/components/screens/ToolsScreen/ToolsScreen.stories.tsx b/clients/web/src/components/screens/ToolsScreen/ToolsScreen.stories.tsx
index fd27224eb..89e1bf2f9 100644
--- a/clients/web/src/components/screens/ToolsScreen/ToolsScreen.stories.tsx
+++ b/clients/web/src/components/screens/ToolsScreen/ToolsScreen.stories.tsx
@@ -1,26 +1,42 @@
+import { useState } from "react";
+import type { ComponentProps } from "react";
 import type { Meta, StoryObj } from "@storybook/react-vite";
 import type { ElicitRequest, Tool } from "@modelcontextprotocol/sdk/types.js";
 import { Modal } from "@mantine/core";
 import { fn, userEvent, within } from "storybook/test";
 import { ToolsScreen } from "./ToolsScreen";
-import type { ToolCallState } from "./ToolsScreen";
+import type { ToolCallState, ToolsUiState } from "./ToolsScreen";
+import { EMPTY_TOOLS_UI } from "../screenUiState";
 import { SamplingRequestPanel } from "../../groups/SamplingRequestPanel/SamplingRequestPanel";
 import { ElicitationFormPanel } from "../../groups/ElicitationFormPanel/ElicitationFormPanel";
 import { PendingClientRequests } from "../../groups/PendingClientRequests/PendingClientRequests";
 import { InlineSamplingRequest } from "../../groups/InlineSamplingRequest/InlineSamplingRequest";
 import { InlineElicitationRequest } from "../../groups/InlineElicitationRequest/InlineElicitationRequest";
 
+// ToolsScreen is controlled (selection + form values live in the parent as one
+// `ui` object — see #1414). This wrapper holds that state so the play-driven
+// tool clicks still drive the detail panel, mirroring how App owns the state in
+// the real app.
+function StatefulToolsScreen(args: ComponentProps<typeof ToolsScreen>) {
+  const [ui, setUi] = useState<ToolsUiState>(args.ui ?? EMPTY_TOOLS_UI);
+  return <ToolsScreen {...args} ui={ui} onUiChange={setUi} />;
+}
+
 const meta: Meta<typeof ToolsScreen> = {
   title: "Screens/ToolsScreen",
   component: ToolsScreen,
   parameters: { layout: "fullscreen" },
   args: {
     listChanged: false,
+    ui: EMPTY_TOOLS_UI,
+    onUiChange: fn(),
     onRefreshList: fn(),
     onCallTool: fn(),
     onCancelCall: fn(),
     onClearResult: fn(),
   },
+  // Wrap in a stateful host so selection/form (now parent-owned) update on click.
+  render: (args) => <StatefulToolsScreen {...args} />,
 };
 
 export default meta;
@@ -197,7 +213,7 @@ export const WithSamplingModal: Story = {
   },
   render: (args) => (
     <>
-      <ToolsScreen {...args} />
+      <StatefulToolsScreen {...args} />
       <Modal opened={true} onClose={fn()} title="Sampling Request" size="lg">
         <SamplingRequestPanel
           request={{
@@ -240,7 +256,7 @@ export const WithElicitationModal: Story = {
   },
   render: (args) => (
     <>
-      <ToolsScreen {...args} />
+      <StatefulToolsScreen {...args} />
       <Modal opened={true} onClose={fn()} title="Elicitation Request" size="lg">
         <ElicitationFormPanel
           request={elicitFormRequest}
@@ -266,7 +282,7 @@ export const WithPendingRequests: Story = {
   },
   render: (args) => (
     <>
-      <ToolsScreen {...args} />
+      <StatefulToolsScreen {...args} />
       <Modal
         opened={true}
         onClose={fn()}
diff --git a/clients/web/src/components/screens/ToolsScreen/ToolsScreen.test.tsx b/clients/web/src/components/screens/ToolsScreen/ToolsScreen.test.tsx
index 2372c6daa..569de39cc 100644
--- a/clients/web/src/components/screens/ToolsScreen/ToolsScreen.test.tsx
+++ b/clients/web/src/components/screens/ToolsScreen/ToolsScreen.test.tsx
@@ -1,8 +1,14 @@
+import { useState } from "react";
 import { describe, it, expect, vi } from "vitest";
 import userEvent from "@testing-library/user-event";
 import type { Tool } from "@modelcontextprotocol/sdk/types.js";
 import { renderWithMantine, screen } from "../../../test/renderWithMantine";
-import { ToolsScreen } from "./ToolsScreen";
+import {
+  ToolsScreen,
+  type ToolsScreenProps,
+  type ToolsUiState,
+} from "./ToolsScreen";
+import { EMPTY_TOOLS_UI } from "../screenUiState";
 
 const tools: Tool[] = [
   { name: "alpha", inputSchema: { type: "object" } },
@@ -19,10 +25,35 @@ const tools: Tool[] = [
 const baseProps = {
   tools,
   listChanged: false,
+  ui: EMPTY_TOOLS_UI,
+  onUiChange: vi.fn(),
   onRefreshList: vi.fn(),
   onCallTool: vi.fn(),
 };
 
+// ToolsScreen is controlled: selection + form values live in the parent (App)
+// as one `ui` object so they persist across tab navigation (#1414). This host
+// holds that state so clicking a tool drives the detail panel, mirroring how
+// App owns it. Props passed in override defaults; the stateful `ui` wiring is
+// applied last so callers can still observe selections via the rendered state.
+function ControlledToolsScreen(props: Partial<ToolsScreenProps>) {
+  const [ui, setUi] = useState<ToolsUiState>({
+    ...EMPTY_TOOLS_UI,
+    ...props.ui,
+  });
+  return (
+    <ToolsScreen
+      {...baseProps}
+      {...props}
+      ui={ui}
+      onUiChange={(next) => {
+        setUi(next);
+        props.onUiChange?.(next);
+      }}
+    />
+  );
+}
+
 describe("ToolsScreen", () => {
   it("renders the empty selection state", () => {
     renderWithMantine(<ToolsScreen {...baseProps} />);
@@ -34,13 +65,55 @@ describe("ToolsScreen", () => {
 
   it("shows the detail panel when a tool is selected", async () => {
     const user = userEvent.setup();
-    renderWithMantine(<ToolsScreen {...baseProps} />);
+    renderWithMantine(<ControlledToolsScreen />);
     await user.click(screen.getByText("alpha"));
     expect(
       screen.queryByText("Select a tool to view details"),
     ).not.toBeInTheDocument();
   });
 
+  it("filters the sidebar list as the search text changes", async () => {
+    const user = userEvent.setup();
+    renderWithMantine(<ControlledToolsScreen />);
+    expect(screen.getByText("beta")).toBeInTheDocument();
+    await user.type(screen.getByPlaceholderText("Search tools..."), "alpha");
+    expect(screen.getByText("alpha")).toBeInTheDocument();
+    expect(screen.queryByText("beta")).not.toBeInTheDocument();
+  });
+
+  it("carries edited form values through to Execute", async () => {
+    const user = userEvent.setup();
+    const onCallTool = vi.fn();
+    renderWithMantine(<ControlledToolsScreen onCallTool={onCallTool} />);
+    await user.click(screen.getByText("gamma"));
+    // gamma seeds { mode: "fast" }; editing the field flows through onUiChange.
+    const field = screen.getByLabelText(/mode/i);
+    await user.clear(field);
+    await user.type(field, "slow");
+    await user.click(screen.getByRole("button", { name: /Execute/ }));
+    expect(onCallTool).toHaveBeenCalledWith("gamma", { mode: "slow" });
+  });
+
+  it("renders selection and result from props (persisted across navigation)", () => {
+    // App owns selection + result, so a remount after a tab switch re-renders
+    // with both still set — the detail and result panels show without any
+    // local re-selection.
+    renderWithMantine(
+      <ToolsScreen
+        {...baseProps}
+        ui={{ ...EMPTY_TOOLS_UI, selectedToolName: "alpha" }}
+        callState={{
+          status: "ok",
+          result: { content: [{ type: "text", text: "ok" }] },
+        }}
+      />,
+    );
+    expect(
+      screen.queryByText("Select a tool to view details"),
+    ).not.toBeInTheDocument();
+    expect(screen.getByText("Results")).toBeInTheDocument();
+  });
+
   it("renders the result panel when callState has a result", () => {
     renderWithMantine(
       <ToolsScreen
@@ -57,7 +130,7 @@ describe("ToolsScreen", () => {
   it("invokes onCallTool with form values on Execute", async () => {
     const user = userEvent.setup();
     const onCallTool = vi.fn();
-    renderWithMantine(<ToolsScreen {...baseProps} onCallTool={onCallTool} />);
+    renderWithMantine(<ControlledToolsScreen onCallTool={onCallTool} />);
     await user.click(screen.getByText("alpha"));
     await user.click(screen.getByRole("button", { name: /Execute/ }));
     expect(onCallTool).toHaveBeenCalledWith("alpha", {});
@@ -66,7 +139,7 @@ describe("ToolsScreen", () => {
   it("seeds schema defaults so untouched fields are sent on Execute", async () => {
     const user = userEvent.setup();
     const onCallTool = vi.fn();
-    renderWithMantine(<ToolsScreen {...baseProps} onCallTool={onCallTool} />);
+    renderWithMantine(<ControlledToolsScreen onCallTool={onCallTool} />);
     await user.click(screen.getByText("gamma"));
     // Execute without editing the form: the default must still be sent.
     await user.click(screen.getByRole("button", { name: /Execute/ }));
@@ -90,7 +163,9 @@ describe("ToolsScreen", () => {
     expect(onClearResult).toHaveBeenCalledTimes(1);
   });
 
-  it("clears the persisted result when the screen unmounts", () => {
+  it("does not clear the result when the screen unmounts", () => {
+    // The result is owned by App and must survive a tab switch (which unmounts
+    // the screen), so unmounting must NOT call onClearResult — see #1414.
     const onClearResult = vi.fn();
     const { unmount } = renderWithMantine(
       <ToolsScreen
@@ -102,17 +177,18 @@ describe("ToolsScreen", () => {
         }}
       />,
     );
-    expect(onClearResult).not.toHaveBeenCalled();
     unmount();
-    expect(onClearResult).toHaveBeenCalledTimes(1);
+    expect(onClearResult).not.toHaveBeenCalled();
   });
 
-  it("treats pending callState as executing", async () => {
-    const user = userEvent.setup();
+  it("treats pending callState as executing", () => {
     renderWithMantine(
-      <ToolsScreen {...baseProps} callState={{ status: "pending" }} />,
+      <ToolsScreen
+        {...baseProps}
+        ui={{ ...EMPTY_TOOLS_UI, selectedToolName: "alpha" }}
+        callState={{ status: "pending" }}
+      />,
     );
-    await user.click(screen.getByText("alpha"));
     expect(screen.getByRole("button", { name: /Cancel/ })).toBeInTheDocument();
   });
 
@@ -122,11 +198,11 @@ describe("ToolsScreen", () => {
     renderWithMantine(
       <ToolsScreen
         {...baseProps}
+        ui={{ ...EMPTY_TOOLS_UI, selectedToolName: "alpha" }}
         onCancelCall={onCancelCall}
         callState={{ status: "pending" }}
       />,
     );
-    await user.click(screen.getByText("alpha"));
     await user.click(screen.getByRole("button", { name: /Cancel/ }));
     expect(onCancelCall).toHaveBeenCalledTimes(1);
   });
diff --git a/clients/web/src/components/screens/ToolsScreen/ToolsScreen.tsx b/clients/web/src/components/screens/ToolsScreen/ToolsScreen.tsx
index e0dc82e6f..1e02262f6 100644
--- a/clients/web/src/components/screens/ToolsScreen/ToolsScreen.tsx
+++ b/clients/web/src/components/screens/ToolsScreen/ToolsScreen.tsx
@@ -1,4 +1,3 @@
-import { useEffect, useRef, useState } from "react";
 import { Card, Flex, Stack, Text } from "@mantine/core";
 import type { CallToolResult, Tool } from "@modelcontextprotocol/sdk/types.js";
 import { ToolControls } from "../../groups/ToolControls/ToolControls";
@@ -16,10 +15,21 @@ export interface ToolCallState {
   progress?: ToolProgress;
 }
 
+// Selection, form values, and sidebar search — controlled by the parent (App)
+// as one object so they persist across tab navigation within a live session;
+// the screen unmounts on tab switch, so local state would be lost (#1414/#1417).
+export interface ToolsUiState {
+  selectedToolName?: string;
+  formValues: Record<string, unknown>;
+  search: string;
+}
+
 export interface ToolsScreenProps {
   tools: Tool[];
   callState?: ToolCallState;
+  ui: ToolsUiState;
   listChanged: boolean;
+  onUiChange: (next: ToolsUiState) => void;
   onRefreshList: () => void;
   onCallTool: (name: string, args: Record<string, unknown>) => void;
   onCancelCall?: () => void;
@@ -80,37 +90,20 @@ const EmptyState = Text.withProps({
 export function ToolsScreen({
   tools,
   callState,
+  ui,
   listChanged,
+  onUiChange,
   onRefreshList,
   onCallTool,
   onCancelCall,
   onClearResult,
 }: ToolsScreenProps) {
-  const [selectedToolName, setSelectedToolName] = useState<string | undefined>(
-    undefined,
-  );
-  const [formValues, setFormValues] = useState<Record<string, unknown>>({});
+  const { selectedToolName, formValues, search } = ui;
   const selectedTool = selectedToolName
     ? tools.find((t) => t.name === selectedToolName)
     : undefined;
   const isExecuting = callState?.status === "pending";
 
-  // The result lives in App so it survives pending → ok/error without
-  // remounting the screen. But the screen's selection is local and resets when
-  // the screen unmounts on tab switch — leaving the Results panel showing a
-  // result with no selected tool. Clear the result on unmount so returning to
-  // the screen starts from a clean slate. A ref keeps the latest handler so the
-  // effect can stay mount/unmount-only without re-running mid-session.
-  const onClearResultRef = useRef(onClearResult);
-  useEffect(() => {
-    onClearResultRef.current = onClearResult;
-  }, [onClearResult]);
-  useEffect(() => {
-    return () => {
-      onClearResultRef.current?.();
-    };
-  }, []);
-
   return (
     <ScreenLayout>
       <Sidebar>
@@ -118,18 +111,21 @@ export function ToolsScreen({
           <ToolControls
             tools={tools}
             selectedName={selectedToolName}
+            searchText={search}
             listChanged={listChanged}
             onRefreshList={onRefreshList}
+            onSearchChange={(value) => onUiChange({ ...ui, search: value })}
             onSelectTool={(name) => {
               // Seed the form with the tool's schema defaults so default-only
               // fields the user never edits are still sent on execute (the
               // form shows defaults via resolveValue, but onChange only writes
               // edited fields).
               const tool = tools.find((t) => t.name === name);
-              setFormValues(
-                tool ? collectSchemaDefaults(tool.inputSchema) : {},
-              );
-              setSelectedToolName(name);
+              onUiChange({
+                ...ui,
+                selectedToolName: name,
+                formValues: tool ? collectSchemaDefaults(tool.inputSchema) : {},
+              });
             }}
           />
         </SidebarCard>
@@ -143,7 +139,9 @@ export function ToolsScreen({
               formValues={formValues}
               isExecuting={isExecuting}
               progress={callState?.progress}
-              onFormChange={setFormValues}
+              onFormChange={(values) =>
+                onUiChange({ ...ui, formValues: values })
+              }
               onExecute={() => onCallTool(selectedTool.name, formValues)}
               onCancel={() => onCancelCall?.()}
             />
diff --git a/clients/web/src/components/screens/screenUiState.ts b/clients/web/src/components/screens/screenUiState.ts
new file mode 100644
index 000000000..82ef2afe9
--- /dev/null
+++ b/clients/web/src/components/screens/screenUiState.ts
@@ -0,0 +1,62 @@
+// Empty-state defaults for each screen's lifted `ui` object — the value App
+// seeds its per-screen UI state with and resets to on disconnect (#1417). The
+// `*UiState` interfaces live alongside their screens; the defaults are gathered
+// here (a non-component module) so the screen files can keep a single component
+// export under the react-refresh rule, mirroring logLevels.ts / fetchCategories.ts.
+import type { ToolsUiState } from "./ToolsScreen/ToolsScreen";
+import type { PromptsUiState } from "./PromptsScreen/PromptsScreen";
+import type { ResourcesUiState } from "./ResourcesScreen/ResourcesScreen";
+import type { AppsUiState } from "./AppsScreen/AppsScreen";
+import type { TasksUiState } from "./TasksScreen/TasksScreen";
+import type { LogsUiState } from "./LoggingScreen/LoggingScreen";
+import type { HistoryUiState } from "./HistoryScreen/HistoryScreen";
+import type { NetworkUiState } from "./NetworkScreen/NetworkScreen";
+import { ALL_LEVELS_VISIBLE } from "./LoggingScreen/logLevels";
+import { ALL_CATEGORIES_VISIBLE } from "./NetworkScreen/fetchCategories";
+
+export const EMPTY_TOOLS_UI: ToolsUiState = {
+  selectedToolName: undefined,
+  formValues: {},
+  search: "",
+};
+
+export const EMPTY_PROMPTS_UI: PromptsUiState = {
+  selectedPromptName: undefined,
+  argumentValues: {},
+  submittedFor: undefined,
+  search: "",
+};
+
+export const EMPTY_RESOURCES_UI: ResourcesUiState = {
+  selectedResourceUri: undefined,
+  selectedTemplateUri: undefined,
+  originatingTemplateUri: undefined,
+  search: "",
+  openSections: undefined,
+};
+
+export const EMPTY_APPS_UI: AppsUiState = {
+  selectedAppName: undefined,
+  formValues: {},
+  search: "",
+};
+
+export const EMPTY_TASKS_UI: TasksUiState = {
+  search: "",
+  statusFilter: undefined,
+};
+
+export const EMPTY_LOGS_UI: LogsUiState = {
+  filterText: "",
+  visibleLevels: ALL_LEVELS_VISIBLE,
+};
+
+export const EMPTY_HISTORY_UI: HistoryUiState = {
+  search: "",
+  methodFilter: undefined,
+};
+
+export const EMPTY_NETWORK_UI: NetworkUiState = {
+  filterText: "",
+  visibleCategories: ALL_CATEGORIES_VISIBLE,
+};
diff --git a/clients/web/src/components/views/InspectorView/InspectorView.stories.tsx b/clients/web/src/components/views/InspectorView/InspectorView.stories.tsx
index d8898caaa..aadd0e933 100644
--- a/clients/web/src/components/views/InspectorView/InspectorView.stories.tsx
+++ b/clients/web/src/components/views/InspectorView/InspectorView.stories.tsx
@@ -16,6 +16,16 @@ import type {
 import type { Meta, StoryObj } from "@storybook/react-vite";
 import { fn } from "storybook/test";
 import { InspectorView } from "./InspectorView";
+import {
+  EMPTY_TOOLS_UI,
+  EMPTY_APPS_UI,
+  EMPTY_PROMPTS_UI,
+  EMPTY_RESOURCES_UI,
+  EMPTY_TASKS_UI,
+  EMPTY_LOGS_UI,
+  EMPTY_HISTORY_UI,
+  EMPTY_NETWORK_UI,
+} from "../../screens/screenUiState";
 import { mixedEntries as demoLogs } from "../../screens/LoggingScreen/LoggingScreen.fixtures";
 import { longToolList as demoRegularTools } from "../../screens/ToolsScreen/ToolsScreen.fixtures";
 import { SUN_ICON_SVG } from "../../../test/fixtures/storyIcons";
@@ -321,6 +331,16 @@ const meta: Meta<typeof InspectorView> = {
     bridgeFactory: noopBridgeFactory,
     appRendererRef: { current: null },
 
+    // Per-screen UI state (search / filter / selection), one object per screen.
+    toolsUi: EMPTY_TOOLS_UI,
+    promptsUi: EMPTY_PROMPTS_UI,
+    resourcesUi: EMPTY_RESOURCES_UI,
+    appsUi: EMPTY_APPS_UI,
+    tasksUi: EMPTY_TASKS_UI,
+    logsUi: EMPTY_LOGS_UI,
+    historyUi: EMPTY_HISTORY_UI,
+    networkUi: EMPTY_NETWORK_UI,
+
     // Callbacks — all wired to storybook spies so play functions can assert
     // on dispatch. Real wiring routes these to InspectorClient methods (the
     // app shell at clients/web/src/App.tsx).
@@ -336,26 +356,34 @@ const meta: Meta<typeof InspectorView> = {
     onServerEdit: fn(),
     onServerClone: fn(),
     onServerRemove: fn(),
+    onToolsUiChange: fn(),
     onCallTool: fn(),
     onRefreshTools: fn(),
+    onPromptsUiChange: fn(),
     onGetPrompt: fn(),
     onRefreshPrompts: fn(),
+    onResourcesUiChange: fn(),
     onReadResource: fn(),
     onSubscribeResource: fn(),
     onUnsubscribeResource: fn(),
     onRefreshResources: fn(),
+    onTasksUiChange: fn(),
     onCancelTask: fn(),
     onClearCompletedTasks: fn(),
     onRefreshTasks: fn(),
     onSetLogLevel: fn(),
+    onLogsUiChange: fn(),
     onClearLogs: fn(),
     onExportLogs: fn(),
+    onHistoryUiChange: fn(),
     onClearHistory: fn(),
     onExportHistory: fn(),
     onReplayHistory: fn(),
     onTogglePinHistory: fn(),
+    onNetworkUiChange: fn(),
     onClearNetwork: fn(),
     onExportNetwork: fn(),
+    onAppsUiChange: fn(),
     onSelectApp: fn(),
     onOpenApp: fn(),
     onCloseApp: fn(),
diff --git a/clients/web/src/components/views/InspectorView/InspectorView.test.tsx b/clients/web/src/components/views/InspectorView/InspectorView.test.tsx
index 3a4e06228..db526455f 100644
--- a/clients/web/src/components/views/InspectorView/InspectorView.test.tsx
+++ b/clients/web/src/components/views/InspectorView/InspectorView.test.tsx
@@ -1,3 +1,4 @@
+import { useState } from "react";
 import { describe, it, expect, vi } from "vitest";
 import userEvent from "@testing-library/user-event";
 import type {
@@ -13,6 +14,17 @@ import {
 } from "../../../test/renderWithMantine";
 import { InspectorView, type InspectorViewProps } from "./InspectorView";
 import type { BridgeFactory } from "../../elements/AppRenderer/AppRenderer";
+import type { AppsUiState } from "../../screens/AppsScreen/AppsScreen";
+import {
+  EMPTY_TOOLS_UI,
+  EMPTY_APPS_UI,
+  EMPTY_PROMPTS_UI,
+  EMPTY_RESOURCES_UI,
+  EMPTY_TASKS_UI,
+  EMPTY_LOGS_UI,
+  EMPTY_HISTORY_UI,
+  EMPTY_NETWORK_UI,
+} from "../../screens/screenUiState";
 
 // Stub bridge factory — AppsScreen mounts the inner iframe and invokes
 // `bridgeFactory(...)` on selection. The stub keeps that path quiet by
@@ -53,6 +65,14 @@ function makeProps(
     sandboxPath: "about:blank",
     bridgeFactory: noopBridgeFactory,
     appRendererRef: { current: null },
+    toolsUi: EMPTY_TOOLS_UI,
+    promptsUi: EMPTY_PROMPTS_UI,
+    resourcesUi: EMPTY_RESOURCES_UI,
+    appsUi: EMPTY_APPS_UI,
+    tasksUi: EMPTY_TASKS_UI,
+    logsUi: EMPTY_LOGS_UI,
+    historyUi: EMPTY_HISTORY_UI,
+    networkUi: EMPTY_NETWORK_UI,
     onToggleTheme: vi.fn(),
     onToggleConnection: vi.fn(),
     onDisconnect: vi.fn(),
@@ -65,26 +85,34 @@ function makeProps(
     onServerEdit: vi.fn(),
     onServerClone: vi.fn(),
     onServerRemove: vi.fn(),
+    onToolsUiChange: vi.fn(),
     onCallTool: vi.fn(),
     onRefreshTools: vi.fn(),
+    onPromptsUiChange: vi.fn(),
     onGetPrompt: vi.fn(),
     onRefreshPrompts: vi.fn(),
+    onResourcesUiChange: vi.fn(),
     onReadResource: vi.fn(),
     onSubscribeResource: vi.fn(),
     onUnsubscribeResource: vi.fn(),
     onRefreshResources: vi.fn(),
+    onTasksUiChange: vi.fn(),
     onCancelTask: vi.fn(),
     onClearCompletedTasks: vi.fn(),
     onRefreshTasks: vi.fn(),
     onSetLogLevel: vi.fn(),
+    onLogsUiChange: vi.fn(),
     onClearLogs: vi.fn(),
     onExportLogs: vi.fn(),
+    onHistoryUiChange: vi.fn(),
     onClearHistory: vi.fn(),
     onExportHistory: vi.fn(),
     onReplayHistory: vi.fn(),
     onTogglePinHistory: vi.fn(),
+    onNetworkUiChange: vi.fn(),
     onClearNetwork: vi.fn(),
     onExportNetwork: vi.fn(),
+    onAppsUiChange: vi.fn(),
     onSelectApp: vi.fn(),
     onOpenApp: vi.fn(),
     onCloseApp: vi.fn(),
@@ -94,6 +122,20 @@ function makeProps(
   };
 }
 
+// Most tests render the view fully prop-driven (every callback is a spy). A few
+// interactions — selecting an App and watching it auto-launch — depend on the
+// parent-owned selection state actually updating, since the view is controlled
+// (#1417). This host holds the App-tab selection/form state and threads it back
+// in as controlled props, mirroring how App.tsx owns it in the real wiring.
+function StatefulInspectorView({ props }: { props: InspectorViewProps }) {
+  const [appsUi, setAppsUi] = useState<AppsUiState>(
+    props.appsUi ?? EMPTY_APPS_UI,
+  );
+  return (
+    <InspectorView {...props} appsUi={appsUi} onAppsUiChange={setAppsUi} />
+  );
+}
+
 const sampleServer: ServerEntry = {
   id: "alpha",
   name: "Alpha",
@@ -270,8 +312,8 @@ describe("InspectorView", () => {
       _meta: { ui: { resourceUri: "not-a-ui-uri" } },
     };
     renderWithMantine(
-      <InspectorView
-        {...makeProps({
+      <StatefulInspectorView
+        props={makeProps({
           servers: [sampleServer],
           activeServer: "alpha",
           connectionStatus: "connected",
diff --git a/clients/web/src/components/views/InspectorView/InspectorView.tsx b/clients/web/src/components/views/InspectorView/InspectorView.tsx
index 5461dbb61..ecbe7a99d 100644
--- a/clients/web/src/components/views/InspectorView/InspectorView.tsx
+++ b/clients/web/src/components/views/InspectorView/InspectorView.tsx
@@ -23,8 +23,12 @@ import { ServerListScreen } from "../../screens/ServerListScreen/ServerListScree
 import {
   ToolsScreen,
   type ToolCallState,
+  type ToolsUiState,
 } from "../../screens/ToolsScreen/ToolsScreen";
-import { AppsScreen } from "../../screens/AppsScreen/AppsScreen";
+import {
+  AppsScreen,
+  type AppsUiState,
+} from "../../screens/AppsScreen/AppsScreen";
 import type {
   AppRendererHandle,
   BridgeFactory,
@@ -32,17 +36,31 @@ import type {
 import {
   PromptsScreen,
   type GetPromptState,
+  type PromptsUiState,
 } from "../../screens/PromptsScreen/PromptsScreen";
 import {
   ResourcesScreen,
   type ReadResourceState,
+  type ResourcesUiState,
 } from "../../screens/ResourcesScreen/ResourcesScreen";
-import { LoggingScreen } from "../../screens/LoggingScreen/LoggingScreen";
+import {
+  LoggingScreen,
+  type LogsUiState,
+} from "../../screens/LoggingScreen/LoggingScreen";
 import type { LogEntryData } from "../../elements/LogEntry/LogEntry";
-import { TasksScreen } from "../../screens/TasksScreen/TasksScreen";
+import {
+  TasksScreen,
+  type TasksUiState,
+} from "../../screens/TasksScreen/TasksScreen";
 import type { TaskProgress } from "../../groups/TaskCard/TaskCard";
-import { HistoryScreen } from "../../screens/HistoryScreen/HistoryScreen";
-import { NetworkScreen } from "../../screens/NetworkScreen/NetworkScreen";
+import {
+  HistoryScreen,
+  type HistoryUiState,
+} from "../../screens/HistoryScreen/HistoryScreen";
+import {
+  NetworkScreen,
+  type NetworkUiState,
+} from "../../screens/NetworkScreen/NetworkScreen";
 import type { SortDirection } from "../../elements/SortToggle/SortToggle";
 import { getServerType } from "@inspector/core/mcp/config.js";
 
@@ -195,6 +213,19 @@ export interface InspectorViewProps {
   getPromptState?: GetPromptState;
   readResourceState?: ReadResourceState;
 
+  // Per-screen selection / search / filter state, one object per screen. Owned
+  // by the parent (App) so it persists across tab navigation within a live
+  // session — the screens unmount on tab switch, so screen-local state would be
+  // lost (#1417). Each is paired with an `on{Screen}UiChange` setter below.
+  toolsUi: ToolsUiState;
+  promptsUi: PromptsUiState;
+  resourcesUi: ResourcesUiState;
+  appsUi: AppsUiState;
+  tasksUi: TasksUiState;
+  logsUi: LogsUiState;
+  historyUi: HistoryUiState;
+  networkUi: NetworkUiState;
+
   // Logging level. The MCP `logging/setLevel` request has no echo
   // notification, so the parent keeps the optimistic current value.
   currentLogLevel: LoggingLevel;
@@ -232,15 +263,19 @@ export interface InspectorViewProps {
   onServerRemove: (id: string) => void;
 
   // Per-primitive actions (route to `inspectorClient` methods / hook refresh).
+  // Each `on{Screen}UiChange` persists that screen's lifted UI state (#1417).
+  onToolsUiChange: (next: ToolsUiState) => void;
   onCallTool: (name: string, args: Record<string, unknown>) => void;
   onCancelToolCall?: () => void;
   onClearToolResult?: () => void;
   onRefreshTools: () => void;
 
+  onPromptsUiChange: (next: PromptsUiState) => void;
   onGetPrompt: (name: string, args: Record<string, string>) => void;
   onCopyPromptMessages?: () => void;
   onRefreshPrompts: () => void;
 
+  onResourcesUiChange: (next: ResourcesUiState) => void;
   onReadResource: (uri: string) => void;
   onSubscribeResource: (uri: string) => void;
   onUnsubscribeResource: (uri: string) => void;
@@ -255,22 +290,27 @@ export interface InspectorViewProps {
   ) => Promise<string[]>;
   completionsSupported?: boolean;
 
+  onTasksUiChange: (next: TasksUiState) => void;
   onCancelTask: (taskId: string) => void;
   onClearCompletedTasks: () => void;
   onRefreshTasks: () => void;
 
   onSetLogLevel: (level: LoggingLevel) => void;
+  onLogsUiChange: (next: LogsUiState) => void;
   onClearLogs: () => void;
   onExportLogs: () => void;
 
+  onHistoryUiChange: (next: HistoryUiState) => void;
   onClearHistory: () => void;
   onExportHistory: () => void;
   onReplayHistory: (id: string) => void;
   onTogglePinHistory: (id: string) => void;
 
+  onNetworkUiChange: (next: NetworkUiState) => void;
   onClearNetwork: () => void;
   onExportNetwork: () => void;
 
+  onAppsUiChange: (next: AppsUiState) => void;
   onSelectApp: (name: string) => void;
   onOpenApp: (name: string, args: Record<string, unknown>) => void;
   onCloseApp: () => void;
@@ -297,6 +337,14 @@ export function InspectorView({
   toolCallState,
   getPromptState,
   readResourceState,
+  toolsUi,
+  promptsUi,
+  resourcesUi,
+  appsUi,
+  tasksUi,
+  logsUi,
+  historyUi,
+  networkUi,
   currentLogLevel,
   sandboxPath,
   bridgeFactory,
@@ -314,31 +362,39 @@ export function InspectorView({
   onServerEdit,
   onServerClone,
   onServerRemove,
+  onToolsUiChange,
   onCallTool,
   onCancelToolCall,
   onClearToolResult,
   onRefreshTools,
+  onPromptsUiChange,
   onGetPrompt,
   onCopyPromptMessages,
   onRefreshPrompts,
+  onResourcesUiChange,
   onReadResource,
   onSubscribeResource,
   onUnsubscribeResource,
   onRefreshResources,
   onCompleteArgument,
   completionsSupported,
+  onTasksUiChange,
   onCancelTask,
   onClearCompletedTasks,
   onRefreshTasks,
   onSetLogLevel,
+  onLogsUiChange,
   onClearLogs,
   onExportLogs,
+  onHistoryUiChange,
   onClearHistory,
   onExportHistory,
   onReplayHistory,
   onTogglePinHistory,
+  onNetworkUiChange,
   onClearNetwork,
   onExportNetwork,
+  onAppsUiChange,
   onSelectApp,
   onOpenApp,
   onCloseApp,
@@ -466,7 +522,9 @@ export function InspectorView({
             <ToolsScreen
               tools={tools}
               callState={toolCallState}
+              ui={toolsUi}
               listChanged={false}
+              onUiChange={onToolsUiChange}
               onRefreshList={onRefreshTools}
               onCallTool={onCallTool}
               onCancelCall={onCancelToolCall}
@@ -480,6 +538,8 @@ export function InspectorView({
               sandboxPath={sandboxPath}
               bridgeFactory={bridgeFactory}
               rendererRef={appRendererRef}
+              ui={appsUi}
+              onUiChange={onAppsUiChange}
               onRefreshList={onRefreshApps}
               onSelectApp={onSelectApp}
               onOpenApp={onOpenApp}
@@ -491,8 +551,10 @@ export function InspectorView({
             <PromptsScreen
               prompts={prompts}
               getPromptState={getPromptState}
+              ui={promptsUi}
               listChanged={false}
               completionsSupported={completionsSupported}
+              onUiChange={onPromptsUiChange}
               onRefreshList={onRefreshPrompts}
               onGetPrompt={onGetPrompt}
               onCopyMessages={onCopyPromptMessages}
@@ -505,8 +567,10 @@ export function InspectorView({
               templates={resourceTemplates}
               subscriptions={subscriptions}
               readState={readResourceState}
+              ui={resourcesUi}
               listChanged={false}
               completionsSupported={completionsSupported}
+              onUiChange={onResourcesUiChange}
               onRefreshList={onRefreshResources}
               onReadResource={onReadResource}
               onSubscribeResource={onSubscribeResource}
@@ -520,6 +584,8 @@ export function InspectorView({
             <TasksScreen
               tasks={tasks}
               progressByTaskId={progressByTaskId}
+              ui={tasksUi}
+              onUiChange={onTasksUiChange}
               onRefresh={onRefreshTasks}
               onClearCompleted={onClearCompletedTasks}
               onCancel={onCancelTask}
@@ -529,6 +595,8 @@ export function InspectorView({
             <LoggingScreen
               entries={logs}
               currentLevel={currentLogLevel}
+              ui={logsUi}
+              onUiChange={onLogsUiChange}
               onSetLevel={onSetLogLevel}
               onClear={onClearLogs}
               onExport={onExportLogs}
@@ -540,6 +608,8 @@ export function InspectorView({
             <HistoryScreen
               entries={history}
               pinnedIds={pinnedHistoryIds ?? new Set()}
+              ui={historyUi}
+              onUiChange={onHistoryUiChange}
               onClearAll={onClearHistory}
               onExport={onExportHistory}
               onReplay={onReplayHistory}
@@ -553,6 +623,8 @@ export function InspectorView({
           <ScreenStage active={activeTab === "Network"}>
             <NetworkScreen
               entries={network}
+              ui={networkUi}
+              onUiChange={onNetworkUiChange}
               onClear={onClearNetwork}
               onExport={onExportNetwork}
               sortDirection={networkSort}
diff --git a/clients/web/src/hooks/useScrollMemory.test.tsx b/clients/web/src/hooks/useScrollMemory.test.tsx
new file mode 100644
index 000000000..4fb64087a
--- /dev/null
+++ b/clients/web/src/hooks/useScrollMemory.test.tsx
@@ -0,0 +1,56 @@
+import { describe, it, expect, beforeEach } from "vitest";
+import { renderWithMantine, act } from "../test/renderWithMantine";
+import { useScrollMemory, clearScrollMemory } from "./useScrollMemory";
+
+// happy-dom doesn't lay out scrollable content, so we drive scrollTop/scrollLeft
+// directly on the viewport node and assert the hook saves on unmount and
+// restores on the next mount. A fixed-height div with the ref is enough.
+function ScrollProbe({ scrollKey }: { scrollKey: string }) {
+  const ref = useScrollMemory(scrollKey);
+  return <div data-testid="viewport" ref={ref} />;
+}
+
+describe("useScrollMemory", () => {
+  beforeEach(() => {
+    clearScrollMemory();
+  });
+
+  it("restores the saved scroll offset on remount under the same key", () => {
+    const { getByTestId, unmount } = renderWithMantine(
+      <ScrollProbe scrollKey="logs" />,
+    );
+    const viewport = getByTestId("viewport") as HTMLDivElement;
+    // Simulate the user scrolling.
+    viewport.scrollTop = 240;
+    viewport.scrollLeft = 15;
+    // Unmount (tab switch) captures the offset; remount restores it.
+    unmount();
+
+    const second = renderWithMantine(<ScrollProbe scrollKey="logs" />);
+    const restored = second.getByTestId("viewport") as HTMLDivElement;
+    expect(restored.scrollTop).toBe(240);
+    expect(restored.scrollLeft).toBe(15);
+  });
+
+  it("does not cross-restore between different keys", () => {
+    const first = renderWithMantine(<ScrollProbe scrollKey="logs" />);
+    (first.getByTestId("viewport") as HTMLDivElement).scrollTop = 100;
+    first.unmount();
+
+    const other = renderWithMantine(<ScrollProbe scrollKey="history" />);
+    expect((other.getByTestId("viewport") as HTMLDivElement).scrollTop).toBe(0);
+  });
+
+  it("forgets saved positions after clearScrollMemory()", () => {
+    const first = renderWithMantine(<ScrollProbe scrollKey="logs" />);
+    (first.getByTestId("viewport") as HTMLDivElement).scrollTop = 180;
+    first.unmount();
+
+    act(() => clearScrollMemory());
+
+    const second = renderWithMantine(<ScrollProbe scrollKey="logs" />);
+    expect((second.getByTestId("viewport") as HTMLDivElement).scrollTop).toBe(
+      0,
+    );
+  });
+});
diff --git a/clients/web/src/hooks/useScrollMemory.ts b/clients/web/src/hooks/useScrollMemory.ts
new file mode 100644
index 000000000..fea5f3480
--- /dev/null
+++ b/clients/web/src/hooks/useScrollMemory.ts
@@ -0,0 +1,43 @@
+import { useLayoutEffect, useRef } from "react";
+
+// Scroll positions survive a screen unmount by living in this module-scope map
+// rather than React state: the screens unmount on tab switch (#1417), so a
+// component-local ref would be lost, and threading every scroll position up to
+// App would balloon the prop surface for what is purely ephemeral DOM state.
+// Keyed by a caller-supplied stable region id (e.g. "logs-stream").
+const scrollPositions = new Map<string, { x: number; y: number }>();
+
+/**
+ * Forget all remembered scroll positions. App calls this on disconnect so a new
+ * session's screens start at the top, matching the clear-on-disconnect rule the
+ * lifted selection/filter state follows (#1417).
+ */
+export function clearScrollMemory(): void {
+  scrollPositions.clear();
+}
+
+/**
+ * Remember and restore a scroll container's position across unmount/remount.
+ * Returns a ref to attach to a Mantine `ScrollArea`/`ScrollArea.Autosize` via
+ * its `viewportRef` prop. On mount the saved offset (if any) is restored before
+ * paint; on unmount the current offset is captured. The captured viewport node
+ * is closed over so the offset is still readable during the cleanup phase.
+ */
+export function useScrollMemory(key: string) {
+  const viewportRef = useRef<HTMLDivElement>(null);
+  useLayoutEffect(() => {
+    const viewport = viewportRef.current;
+    if (!viewport) return;
+    const saved = scrollPositions.get(key);
+    if (saved) {
+      viewport.scrollTo({ left: saved.x, top: saved.y });
+    }
+    return () => {
+      scrollPositions.set(key, {
+        x: viewport.scrollLeft,
+        y: viewport.scrollTop,
+      });
+    };
+  }, [key]);
+  return viewportRef;
+}