From b443ac0c848113a003fefd31f1d9fa32ee1633cc Mon Sep 17 00:00:00 2001
From: npeter83 <npeter83+claude@gmail.com>
Date: Fri, 23 Oct 2026 13:45:40 +0200
Subject: [PATCH] fix(frontend): the layer gates cover what the move left
 outside them, and each page keeps its own logic

Gates the folder move had narrowed or left open: the MenuCheck contract scans the whole app again (it
saw only components/); local/layers refuses an import of an entry (main.tsx, the /watch page) from
any layer, and reads a backtick import() as the path it is; the /watch contract forbids the shell,
the modules and the features by folder (its one path to App had gone stale); chunkGuard's own test
gets the vitest focus/skip rules. The root tests' exemption from local/layers is in the gate
register, with its three imports.

Placement: Plex's chip builder moves into lib beside the feed's, the folder names into
features/folders, and three files only one page uses into that page. ui/FilterRail takes its reset
from useRail instead of a page id. The channel page reads the feed's view and builds "Show in feed"
itself, and the feed's scroll key is the feed's hook, so the shell holds no feed logic.

The floating header re-measures when one page's pills replace another's in the same commit (the
claim count stayed equal, so only the observer caught it). A Plex view applied and edited now stays
across a visit to another page, as the feed's does: pinned by a test. docs/development.md says what a
page with a rail adds in lib.
---
 CLAUDE.md                                     |   2 +-
 docs/development.md                           |   5 +
 docs/gates.md                                 |   3 +-
 frontend/eslint.config.js                     |  34 +++-
 frontend/src/components/ui/FilterRail.tsx     |  13 +-
 .../ui/PageShell.header.dom.test.tsx          |  40 +++++
 frontend/src/components/ui/PageShell.tsx      |  17 +-
 .../components/ui/menuCheck.contract.test.ts  |   3 +-
 .../ui/pressableSelectable.contract.test.ts   |   2 +-
 .../src/features/downloads/DownloadTray.tsx   |   3 +-
 .../features/filters/PersonalViewsModal.tsx   |   2 +-
 .../folders}/fileFolders.tsx                  |   0
 .../navigation/moduleStores.contract.test.tsx |   3 +-
 frontend/src/lib/gates.contract.test.ts       |   7 +-
 frontend/src/lib/gates.snapshot.json          |  61 +++++++
 frontend/src/lib/layers.contract.test.ts      |  29 ++++
 frontend/src/lib/plexActiveFilters.ts         | 154 +++++++++++++++++
 frontend/src/lib/useRail.ts                   |  12 +-
 frontend/src/modules/channels/Channels.tsx    |   4 +-
 .../channels}/TagFilterChips.dom.test.tsx     |   0
 .../channels}/TagFilterChips.tsx              |   0
 .../src/modules/channels/channelColumns.tsx   |   2 +-
 .../channels}/useTagSuggestions.dom.test.tsx  |   0
 .../channels}/useTagSuggestions.ts            |   2 +-
 .../feed/ChannelPage.backfill.dom.test.tsx    |   4 +-
 .../feed/ChannelPage.banner.dom.test.tsx      |   4 +-
 .../feed/ChannelPage.busyFocus.dom.test.tsx   |   7 +-
 .../feed/ChannelPage.fold.dom.test.tsx        |   4 +-
 frontend/src/modules/feed/ChannelPage.tsx     |  22 ++-
 .../feed/ChannelPage.watchState.dom.test.tsx  |   4 +-
 frontend/src/modules/feed/Sidebar.tsx         |   8 +-
 frontend/src/modules/feed/index.ts            |   5 +-
 .../feed/useFeedPageHooks.dom.test.tsx        |  63 +++++++
 frontend/src/modules/feed/useFeedPageHooks.ts |  30 ++++
 .../src/modules/files/Files.menu.dom.test.tsx |   2 +-
 frontend/src/modules/files/Files.tsx          |   4 +-
 frontend/src/modules/files/FilesRail.tsx      |   6 +-
 .../files}/VideoEditor.partial.dom.test.tsx   |   0
 .../player => modules/files}/VideoEditor.tsx  |   0
 frontend/src/modules/files/fileBadges.tsx     |   2 +-
 frontend/src/modules/files/index.ts           |   3 +-
 frontend/src/modules/files/useFileActions.tsx |   2 +-
 .../src/modules/files/useFolderActions.tsx    |   2 +-
 .../src/modules/playlists/PlaylistsRail.tsx   |   4 +-
 .../plex/PlexSavedViewsProvider.dom.test.tsx  |  45 ++++-
 frontend/src/modules/plex/PlexSidebar.tsx     |   8 +-
 frontend/src/modules/plex/index.ts            |   3 +-
 .../src/modules/plex/usePlexActiveFilters.ts  | 155 +-----------------
 frontend/src/modules/settings/ApiTokens.tsx   |   2 +-
 frontend/src/shell/App.tsx                    |  52 +-----
 frontend/src/watchEntry.contract.test.ts      |  12 +-
 51 files changed, 561 insertions(+), 290 deletions(-)
 rename frontend/src/{modules/files => features/folders}/fileFolders.tsx (100%)
 create mode 100644 frontend/src/lib/plexActiveFilters.ts
 rename frontend/src/{features/filters => modules/channels}/TagFilterChips.dom.test.tsx (100%)
 rename frontend/src/{features/filters => modules/channels}/TagFilterChips.tsx (100%)
 rename frontend/src/{features/channel => modules/channels}/useTagSuggestions.dom.test.tsx (100%)
 rename frontend/src/{features/channel => modules/channels}/useTagSuggestions.ts (98%)
 create mode 100644 frontend/src/modules/feed/useFeedPageHooks.dom.test.tsx
 create mode 100644 frontend/src/modules/feed/useFeedPageHooks.ts
 rename frontend/src/{features/player => modules/files}/VideoEditor.partial.dom.test.tsx (100%)
 rename frontend/src/{features/player => modules/files}/VideoEditor.tsx (100%)

diff --git a/CLAUDE.md b/CLAUDE.md
index 867ac765..223ce247 100644
--- a/CLAUDE.md
+++ b/CLAUDE.md
@@ -78,7 +78,7 @@ boot; a shared `/watch` link boots from its own entry, `watch.html` → `watchMa
 app-free by a contract test) → **`modules/<page>/`** (one folder per page: the page, its rail, its store, its tests,
 and its `module.ts` definition — label, icon, gate, the lazy page and rail, its store — collected in nav order by
 `features/navigation/moduleRegistry`, which also mounts every store at the root; a new page is its folder, its id in
-`lib/urlState` and its entry there) →
+`lib/urlState` and its entry there, plus its panel in `lib/panelLayout` if it has a rail) →
 **`features/<name>/`** (what several pages share: video cards, filters, downloads, the player, navigation) → the
 **platform layer `components/ui/`** (domain-free primitives: the popover engine and its menus, `Modal`/`Overlay`,
 `Button`/`form`, `DataTable`/`VirtualGrid`, `QueryState`,
diff --git a/docs/development.md b/docs/development.md
index 8af4586e..0bb8d445 100644
--- a/docs/development.md
+++ b/docs/development.md
@@ -51,6 +51,11 @@ A frontend page is one folder, `frontend/src/modules/<id>/` (the layering is in
 4. The id in `lib/urlState`'s `PAGES`, and the definition in `features/navigation/moduleRegistry.ts`, in
    nav-rail order. The rail, the palette, the `g` chords, the tab title and the root's stores all read from there.
 5. Its strings in both locales (`src/i18n/locales`).
+6. A page with a side rail also names its panel below the module, in `lib/` (rails share one layout
+   and collapse machinery, which lib may not learn from a module): the `PanelId` and its default group
+   order, storage and pref keys in `lib/panelLayout.ts`, its collapse flag in `lib/useRail.ts`
+   (`COLLAPSE`), and those keys in `lib/storage.ts`. The rail calls `useRail("<id>")` and hands what it
+   returns to `ui/FilterRail`; tsc names each table still missing the new id.
 
 What holds it: `moduleRegistry.contract.test.ts` (every id defined once, from its own folder, lazily),
 `moduleStores.contract.test.tsx` (no store reads another module), the `local/layers` lint rule (imports only go
diff --git a/docs/gates.md b/docs/gates.md
index da680464..b0e23f5f 100644
--- a/docs/gates.md
+++ b/docs/gates.md
@@ -61,7 +61,8 @@ them itself (`no-undef`, `no-redeclare`, `no-dupe-keys`, …), nor the formattin
 | src tests · ui tests · lib tests | `local/literal-a11y-text`, `local/input-primitive`, `local/surface-role`, `local/glyph-link` — off | A test renders throwaway markup (a raw input as a focus target, an untranslated label) that is not product UI. `local/button-primitive` stays on: in a test file (and in a control primitive) it only refuses a raw `<button disabled>`, which drops focus there as anywhere. | — |
 | design-lab | `local/literal-a11y-text` — off | The dev-only design lab (never in the bundle — devOnlyGuard fails the build if it is) holds the owner's working copy, not product copy. | — |
 | e2e | `react-hooks/*`, `react-refresh/*`, `local/*`, `no-console`, `no-restricted-globals`, `no-restricted-properties`, `no-restricted-syntax` — not applied | Playwright specs drive a browser from Node: no React, no product UI, and they print to the console on purpose. They get the base + typed rules + the playwright rules. | — |
-| ts configs | `react-hooks/*`, `react-refresh/*`, `local/*`, `no-console`, `no-restricted-globals`, `no-restricted-properties`, `no-restricted-syntax` — not applied | The build configs (vite, vitest, playwright, reactPlugin, devOnlyGuard) run in Node at build time. | — |
+| ts configs · tool tests | `react-hooks/*`, `react-refresh/*`, `local/*`, `no-console`, `no-restricted-globals`, `no-restricted-properties`, `no-restricted-syntax` — not applied | The build configs (vite, vitest, playwright, reactPlugin, devOnlyGuard, chunkGuard) run in Node at build time. Their unit tests beside them (`tool tests`: `chunkGuard.test.ts`) are linted the same way, plus `vitest/no-focused-tests` and `vitest/no-disabled-tests`, since vitest runs them. | — |
+| src root tests · design-lab | `local/layers` — not applied (inside the rule: its `free` check, which the effective config cannot show) | The app-wide tests at `src/` root exercise a behaviour across modules (a write failure reported the same way in Plex and Files, the playlist editors' failures), so they render module-private components directly; the dev-only design lab shows every component. Neither ships. Every other layer, test or not, is held. | 3 imports of module-private files (`PlaylistEditFailures.dom.test.tsx` → `modules/plex/PlexPlaylistView`; `WriteFailureReporting.dom.test.tsx` → `modules/plex/PlexCollectionEditor`, `modules/files/UploadDialog`); design-lab 0 |
 | js configs | `@typescript-eslint/*`, `react-hooks/*`, `react-refresh/*`, `local/*`, `no-console`, `no-restricted-globals`, `no-restricted-properties`, `no-restricted-syntax`, `no-var`, `prefer-const`, `prefer-rest-params`, `prefer-spread`, `no-array-constructor`, `no-unused-expressions` — not applied | `eslint.config.js` and `postcss.config.js`: plain-JS build config, linted with `js.configs.recommended` only. | — |
 | repo scripts | `scripts/*.mjs` — not in the eslint or prettier lane; `js.configs.recommended` + Prettier via `src/lib/repoScripts.contract.test.ts` | They sit at the repo root, and an ESLint config cannot reach past its own directory. The contract test lints and format-checks them from the repo root, to the same bar as the `js configs` row; no typed rules, as they are in no tsc project. | 0 lint hits; 2 files reformatted (E32 review) |
 | everywhere | ignored paths: `dist`, `node_modules`, `playwright-report`, `test-results`, `e2e/.auth` | Build output, installed packages, test artefacts, a live Playwright session. Generated, not written. | — |
diff --git a/frontend/eslint.config.js b/frontend/eslint.config.js
index 8ac6b818..c54c2b96 100644
--- a/frontend/eslint.config.js
+++ b/frontend/eslint.config.js
@@ -443,8 +443,11 @@ function placeOf(abs) {
     return { layer: top, unit, face };
   }
   if (top === "shell") return { layer: "shell" };
-  // main.tsx, watch/, i18n/, content/, design-lab/, the app-wide tests at the root
-  return { layer: "other", top: parts.length === 1 ? "root" : top };
+  // main.tsx, watch/, i18n/, content/, design-lab/, the app-wide tests at the root. The two entries —
+  // the app's main.tsx and the shared /watch page (watch/ + watchMain.tsx) — sit above every layer.
+  const root = parts.length === 1;
+  const entry = top === "watch" || (root && (top === "main" || top === "watchMain"));
+  return { layer: "other", top: root ? "root" : top, entry };
 }
 const layers = {
   meta: {
@@ -452,6 +455,8 @@ const layers = {
     messages: {
       up: "{{from}} sits below {{to}}: it may not import from it (`{{spec}}`). Move the shared piece down, or take it as a prop.",
       face: "`{{spec}}` is one of {{unit}}'s own files: reach another unit through its index.ts (its public face), or lazily with import().",
+      entry:
+        "`{{spec}}` is an entry (the app's main.tsx or the shared /watch page): no layer imports one, or the app and the /watch page stop being separable.",
     },
   },
   create(context) {
@@ -465,7 +470,12 @@ const layers = {
     const check = (node, spec, lazy) => {
       if (free || typeof spec !== "string" || !spec.startsWith(".")) return;
       const to = placeOf(path.resolve(path.dirname(file), spec));
-      if (!to || to.layer === "other") return;
+      if (!to) return;
+      if (to.layer === "other") {
+        if (to.entry && from.layer !== "other")
+          context.report({ node, messageId: "entry", data: { spec } });
+        return;
+      }
       const fromRank = from.layer === "other" ? 5 : RANK[from.layer];
       if (
         to.layer === "shell" &&
@@ -492,7 +502,13 @@ const layers = {
       ImportDeclaration: (n) => check(n.source, n.source.value, false),
       ExportNamedDeclaration: (n) => n.source && check(n.source, n.source.value, false),
       ExportAllDeclaration: (n) => check(n.source, n.source.value, false),
-      ImportExpression: (n) => n.source.type === "Literal" && check(n.source, n.source.value, true),
+      ImportExpression: (n) => {
+        // A template literal with nothing substituted is a plain path to TypeScript and Rollup too.
+        const s = n.source;
+        if (s.type === "Literal") check(s, s.value, true);
+        else if (s.type === "TemplateLiteral" && s.expressions.length === 0)
+          check(s, s.quasis[0].value.cooked, true);
+      },
       TSImportType: (n) => {
         const lit = n.argument?.literal ?? n.argument;
         if (lit?.type === "Literal") check(lit, lit.value, false);
@@ -867,6 +883,16 @@ export default tseslint.config(
       "no-undef": "off",
     },
   },
+  {
+    // The unit tests of the build tools beside them (chunkGuard's): vitest runs them, so a stray
+    // `.only` / `.skip` there is the same silent skip as in src.
+    files: ["*.test.ts"],
+    plugins: { vitest },
+    rules: {
+      "vitest/no-focused-tests": "error",
+      "vitest/no-disabled-tests": "error",
+    },
+  },
   {
     files: ["e2e/**/*.ts"],
     plugins: { playwright },
diff --git a/frontend/src/components/ui/FilterRail.tsx b/frontend/src/components/ui/FilterRail.tsx
index fc1968c3..f5c1cc77 100644
--- a/frontend/src/components/ui/FilterRail.tsx
+++ b/frontend/src/components/ui/FilterRail.tsx
@@ -1,6 +1,6 @@
 import { useState, type ReactNode } from "react";
 import { useTranslation } from "react-i18next";
-import { defaultLayout, type PanelId, type PanelLayout } from "../../lib/panelLayout";
+import { type PanelLayout } from "../../lib/panelLayout";
 import SidePanel from "./SidePanel";
 import PanelGroups, { type PanelItem } from "./PanelGroups";
 
@@ -9,10 +9,10 @@ import PanelGroups, { type PanelItem } from "./PanelGroups";
 // the customize (reorder/hide) `editing` state and the fixed title-bar wiring (edit toggle, reset to
 // the layout default, edit hint); each rail supplies only what actually differs — its identity
 // (title/icon), the active-filter count + Clear-all action, its `items`, and any content below the
-// groups (`children`, e.g. the feed's tag manager). `kind` is the PanelId (also the layout key), so
-// `children` defaults to nothing for the rails that need none.
+// groups (`children`, e.g. the feed's tag manager; nothing for the rails that need none). What Reset
+// goes back to is the rail's (`onResetLayout`, from lib/useRail), so this shell names no page.
 export default function FilterRail({
-  kind,
+  onResetLayout,
   title,
   icon,
   count,
@@ -28,7 +28,8 @@ export default function FilterRail({
   titleActionLabel,
   children,
 }: {
-  kind: PanelId;
+  /** Puts the groups back in the rail's default order (lib/useRail's `onResetLayout`). */
+  onResetLayout: () => void;
   title: string;
   icon: ReactNode;
   count?: number;
@@ -56,7 +57,7 @@ export default function FilterRail({
       onToggleCollapse={onToggleCollapse}
       editing={editing}
       onToggleEditing={() => setEditing((e) => !e)}
-      onReset={() => setLayout(defaultLayout(kind))}
+      onReset={onResetLayout}
       editHint={t("sidebar.editHint")}
       actions={actions}
       iconExpanded={iconExpanded}
diff --git a/frontend/src/components/ui/PageShell.header.dom.test.tsx b/frontend/src/components/ui/PageShell.header.dom.test.tsx
index d0852357..3e484d6e 100644
--- a/frontend/src/components/ui/PageShell.header.dom.test.tsx
+++ b/frontend/src/components/ui/PageShell.header.dom.test.tsx
@@ -121,6 +121,46 @@ describe("the header slot", () => {
     expect(pad()).toBe("84px"); // the page's two pills, the default gone
   });
 
+  it("re-measures when one page's pills replace another's in the same commit", () => {
+    // Feed → Playlists: the leaving page's claim and the arriving page's land in one commit, so the
+    // number of claims never changes — the pad must follow the new pills all the same.
+    const height = (el: HTMLElement) => 40 * el.childElementCount;
+    const Feed = () => (
+      <PageHeader>
+        <span>search</span>
+        <span>scope</span>
+      </PageHeader>
+    );
+    const Playlists = () => (
+      <PageHeader>
+        <span>search</span>
+      </PageHeader>
+    );
+    const page = (which: "feed" | "playlists") => (
+      <PageShell header={hdr}>
+        {which === "feed" ? <Feed /> : <Playlists />}
+        {fallback}
+      </PageShell>
+    );
+    const { rerender, container } = render(<PageShell header={hdr}>{null}</PageShell>);
+    Object.defineProperty(screen.getByTestId("hdr"), "offsetHeight", {
+      get() {
+        return height(this as HTMLElement);
+      },
+      configurable: true,
+    });
+    const pad = () =>
+      (container.querySelector('[class*="pt-(--hdr-h)"]') as HTMLElement).style.getPropertyValue(
+        "--hdr-h",
+      );
+    rerender(page("feed"));
+    expect(pad()).toBe("84px");
+    rerender(page("playlists"));
+    expect(pad()).toBe("44px");
+    rerender(page("feed"));
+    expect(pad()).toBe("84px");
+  });
+
   it("renders a page's pills nowhere in a shell without a header", () => {
     render(
       <PageShell>
diff --git a/frontend/src/components/ui/PageShell.tsx b/frontend/src/components/ui/PageShell.tsx
index 9c8e391b..ab9c358d 100644
--- a/frontend/src/components/ui/PageShell.tsx
+++ b/frontend/src/components/ui/PageShell.tsx
@@ -153,17 +153,26 @@ export default function PageShell({
   // How many PageHeaders fill the header right now: a count, not a flag, so of two on one page the one
   // that leaves releases only its own claim.
   const [headerClaims, setHeaderClaims] = useState(0);
+  // Bumped by every claim and every release. The count alone cannot say the pills changed: when one
+  // page's PageHeader replaces another's in one commit (feed → playlists), the release and the claim
+  // net to the same count, and the measurement below would not re-run.
+  const [headerGeneration, setHeaderGeneration] = useState(0);
   const claimHeader = useCallback(() => {
     setHeaderClaims((n) => n + 1);
-    return () => setHeaderClaims((n) => n - 1);
+    setHeaderGeneration((g) => g + 1);
+    return () => {
+      setHeaderClaims((n) => n - 1);
+      setHeaderGeneration((g) => g + 1);
+    };
   }, []);
   // Whether the shell's default is in the header (PageHeaderDefault reports it).
   const [defaultShown, setDefaultShown] = useState(false);
   // The pills arrive by portal AFTER this shell mounted (with the page's chunk), so the first measurement
   // saw an empty header; the ResizeObserver catches up only a frame or more later, and until then the
   // content sat under the pills (the feed toolbar jumped 55px on a tablet). So the measurement also re-runs
-  // here, before paint, whenever what fills the header changes; the observer still covers a change within
-  // a page's own pills (Plex's view switch appearing).
+  // here, before paint, whenever what fills the header changes (a claim made or released, the default
+  // shown or gone); the observer still covers a change within a page's own pills (Plex's view switch
+  // appearing).
   useLayoutEffect(() => {
     if (!headerEl || !contentEl) {
       // No header (channel page) → drop any stale pad so a leftover value can't linger.
@@ -177,7 +186,7 @@ export default function PageShell({
     const ro = new ResizeObserver(apply);
     ro.observe(headerEl);
     return () => ro.disconnect();
-  }, [headerEl, contentEl, headerClaims, defaultShown]);
+  }, [headerEl, contentEl, headerGeneration, defaultShown]);
   const headerSlot = {
     target: headerEl,
     claimed: headerClaims > 0,
diff --git a/frontend/src/components/ui/menuCheck.contract.test.ts b/frontend/src/components/ui/menuCheck.contract.test.ts
index 86095712..0a782f11 100644
--- a/frontend/src/components/ui/menuCheck.contract.test.ts
+++ b/frontend/src/components/ui/menuCheck.contract.test.ts
@@ -1,7 +1,8 @@
 import { readdirSync, readFileSync } from "node:fs";
 import { describe, expect, it } from "vitest";
 
-const root = new URL("../", import.meta.url);
+// The whole app source (shell, modules, features, ui): the checkable menus live in all of them.
+const root = new URL("../../", import.meta.url);
 const sources = () =>
   readdirSync(root, { recursive: true, encoding: "utf8" })
     .filter((f) => f.endsWith(".tsx") && !f.includes(".test."))
diff --git a/frontend/src/components/ui/pressableSelectable.contract.test.ts b/frontend/src/components/ui/pressableSelectable.contract.test.ts
index a16a7936..270093b9 100644
--- a/frontend/src/components/ui/pressableSelectable.contract.test.ts
+++ b/frontend/src/components/ui/pressableSelectable.contract.test.ts
@@ -53,7 +53,7 @@ const PLAIN: Record<string, [number, string]> = {
   "modules/channels/SyncStatus.tsx": [1, "the status pill trigger"],
   "features/channel/TagManager.tsx": [1, "a suggestion in a picker"],
   "modules/files/UploadDialog.tsx": [1, "the drop zone"],
-  "features/player/VideoEditor.tsx": [2, "timeline glyphs"],
+  "modules/files/VideoEditor.tsx": [2, "timeline glyphs"],
   "shell/Welcome.tsx": [1, "a screenshot (zoom)"],
   "modules/playlists/playlistColumns.tsx": [1, "the thumbnail"],
   "modules/plex/plexDetailUi.tsx": [2, "a switch row and the poster"],
diff --git a/frontend/src/features/downloads/DownloadTray.tsx b/frontend/src/features/downloads/DownloadTray.tsx
index d4422f58..c7c80331 100644
--- a/frontend/src/features/downloads/DownloadTray.tsx
+++ b/frontend/src/features/downloads/DownloadTray.tsx
@@ -37,7 +37,8 @@ import { useLiveQuery } from "../../lib/useLiveQuery";
 import { usePref } from "../../lib/usePref";
 import { ErrorModal } from "./downloadModals";
 import { jobTitle } from "./downloadTitle";
-import { sourceLabel, useFilesActions } from "../../modules/files";
+import { useFilesActions } from "../../modules/files";
+import { sourceLabel } from "../folders/fileFolders";
 import { useDownloadActions } from "./useDownloadActions";
 import { type ActionMenuItem } from "../../components/ui/ActionMenu";
 import { setCornerLift } from "../../components/ui/backToTopState";
diff --git a/frontend/src/features/filters/PersonalViewsModal.tsx b/frontend/src/features/filters/PersonalViewsModal.tsx
index 5b062547..25a4aa52 100644
--- a/frontend/src/features/filters/PersonalViewsModal.tsx
+++ b/frontend/src/features/filters/PersonalViewsModal.tsx
@@ -28,7 +28,7 @@ import { Button } from "../../components/ui/Button";
 import { IconButton } from "../../components/ui/IconButton";
 import { useSavedViews, asFilters } from "./savedViewsContext";
 import { useActiveFilters } from "../../lib/useActiveFilters";
-import { buildPlexActiveFilters } from "../../modules/plex";
+import { buildPlexActiveFilters } from "../../lib/plexActiveFilters";
 import { useUndoable } from "../../lib/useUndoable";
 import UndoToolbar from "../../components/ui/UndoToolbar";
 import { useSortableA11y, useSortableItem } from "../../components/ui/sortableA11y";
diff --git a/frontend/src/modules/files/fileFolders.tsx b/frontend/src/features/folders/fileFolders.tsx
similarity index 100%
rename from frontend/src/modules/files/fileFolders.tsx
rename to frontend/src/features/folders/fileFolders.tsx
diff --git a/frontend/src/features/navigation/moduleStores.contract.test.tsx b/frontend/src/features/navigation/moduleStores.contract.test.tsx
index ff908bbd..85e59062 100644
--- a/frontend/src/features/navigation/moduleStores.contract.test.tsx
+++ b/frontend/src/features/navigation/moduleStores.contract.test.tsx
@@ -13,7 +13,7 @@ import { render } from "@testing-library/react";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import { ModuleStores } from "./ModuleStores";
 import { REGISTERED_PAGES, moduleDef } from "./moduleRegistry";
-import { useFeedFilters, useFeedSavedViews, useFeedView } from "../../modules/feed";
+import { useFeedFilters, useFeedSavedViews } from "../../modules/feed";
 import { usePlex, usePlexSavedViews } from "../../modules/plex";
 import { useChannelsActions } from "../../modules/channels";
 import { useFilesActions } from "../../modules/files";
@@ -29,7 +29,6 @@ const SRC = resolve(dirname(fileURLToPath(import.meta.url)), "../..");
 // Each store's read side, as the app's readers reach it (the module faces).
 function Readers() {
   useFeedFilters();
-  useFeedView();
   useFeedSavedViews();
   usePlex();
   usePlexSavedViews();
diff --git a/frontend/src/lib/gates.contract.test.ts b/frontend/src/lib/gates.contract.test.ts
index f0f2eab0..7bb1994b 100644
--- a/frontend/src/lib/gates.contract.test.ts
+++ b/frontend/src/lib/gates.contract.test.ts
@@ -133,7 +133,12 @@ type Snapshot = {
 
 /** The register scope a code file belongs to, by its path (relative to frontend/). */
 function scopeOf(file: string): string {
-  if (!file.includes("/")) return /[.][mc]?js$/.test(file) ? "js configs" : "ts configs";
+  if (!file.includes("/"))
+    return /[.][mc]?js$/.test(file)
+      ? "js configs"
+      : /[.]test[.]ts$/.test(file)
+        ? "tool tests"
+        : "ts configs";
   if (file.startsWith("e2e/")) return "e2e";
   if (file.startsWith("src/design-lab/")) return "design-lab";
   // the network owners (NETWORK_OWNERS in eslint.config.js)
diff --git a/frontend/src/lib/gates.snapshot.json b/frontend/src/lib/gates.snapshot.json
index bb3cf52f..7d42f338 100644
--- a/frontend/src/lib/gates.snapshot.json
+++ b/frontend/src/lib/gates.snapshot.json
@@ -1044,6 +1044,67 @@
       },
       "settings": null
     },
+    "tool tests": {
+      "languageOptions": {
+        "ecmaVersion": 2022,
+        "globals": "82 names, sha1 29467d490e30",
+        "parser": "typescript-eslint/parser",
+        "parserOptions": { "projectService": true, "tsconfigRootDir": "." },
+        "sourceType": "module"
+      },
+      "linterOptions": { "reportUnusedDisableDirectives": 2 },
+      "notApplied": [
+        "local/button-primitive",
+        "local/glyph-link",
+        "local/input-primitive",
+        "local/jsx-comment-text",
+        "local/layers",
+        "local/literal-a11y-text",
+        "local/locale-format",
+        "local/sortable-a11y",
+        "local/surface-role",
+        "no-console",
+        "no-restricted-globals",
+        "no-restricted-properties",
+        "no-restricted-syntax",
+        "react-hooks/capitalized-calls",
+        "react-hooks/component-hook-factories",
+        "react-hooks/config",
+        "react-hooks/error-boundaries",
+        "react-hooks/exhaustive-deps",
+        "react-hooks/gating",
+        "react-hooks/globals",
+        "react-hooks/hooks",
+        "react-hooks/immutability",
+        "react-hooks/incompatible-library",
+        "react-hooks/invariant",
+        "react-hooks/memo-dependencies",
+        "react-hooks/no-deriving-state-in-effects",
+        "react-hooks/preserve-manual-memoization",
+        "react-hooks/purity",
+        "react-hooks/refs",
+        "react-hooks/rules-of-hooks",
+        "react-hooks/set-state-in-effect",
+        "react-hooks/set-state-in-render",
+        "react-hooks/static-components",
+        "react-hooks/syntax",
+        "react-hooks/todo",
+        "react-hooks/unsupported-syntax",
+        "react-hooks/use-memo",
+        "react-hooks/void-use-memo",
+        "react-refresh/only-export-components"
+      ],
+      "plugins": ["@", "@eslint-community/eslint-comments", "@typescript-eslint", "vitest"],
+      "rules": {
+        "@typescript-eslint/no-unused-expressions": [
+          2,
+          { "allowShortCircuit": false, "allowTaggedTemplates": false, "allowTernary": false }
+        ],
+        "vitest/no-disabled-tests": [2],
+        "vitest/no-focused-tests": [2, { "fixable": true }]
+      },
+      "settings": null
+    },
     "ts configs": {
       "languageOptions": {
         "ecmaVersion": 2022,
diff --git a/frontend/src/lib/layers.contract.test.ts b/frontend/src/lib/layers.contract.test.ts
index 6f6135be..1c50e1d6 100644
--- a/frontend/src/lib/layers.contract.test.ts
+++ b/frontend/src/lib/layers.contract.test.ts
@@ -76,6 +76,35 @@ describe("the platform and lib layers", () => {
   });
 });
 
+describe("the entries", () => {
+  // main.tsx and the /watch page (watch/, its own entry) sit above every layer: no layer imports
+  // them, or the app and the shared page would stop being separable.
+  it("are imported by no layer", async () => {
+    const lib =
+      imp("../watch/WatchPage") + 'import type { T } from "../main";\nexport type U = T;\n';
+    expect(await refused(lib, "src/lib/__layers_probe.ts")).toHaveLength(2);
+    expect(
+      await refused(imp("../../watch/WatchPage"), "src/components/ui/__layers_probe.tsx"),
+    ).toHaveLength(1);
+    expect(await refused(imp("../../watch/watchStrings"), IN_FEATURE)).toHaveLength(1);
+    expect(await refused(imp("../../watch/WatchPage"), IN_FEED)).toHaveLength(1);
+    expect(await refused(imp("../watch/WatchPage"), "src/shell/__layers_probe.tsx")).toHaveLength(
+      1,
+    );
+  });
+
+  it("while the /watch entry itself imports its page", async () => {
+    expect(await refused(imp("./watch/WatchPage"), "src/__layers_probe.tsx")).toEqual([]);
+  });
+});
+
+describe("an import()", () => {
+  it("is the same path in backticks", async () => {
+    const src = "export const L = () => import(`../modules/feed/Feed`);\n";
+    expect(await refused(src, "src/lib/__layers_probe.ts")).toHaveLength(1);
+  });
+});
+
 describe("the shell and the entry", () => {
   it("reach a module through its face, or lazily", async () => {
     const src =
diff --git a/frontend/src/lib/plexActiveFilters.ts b/frontend/src/lib/plexActiveFilters.ts
new file mode 100644
index 00000000..4bf461fb
--- /dev/null
+++ b/frontend/src/lib/plexActiveFilters.ts
@@ -0,0 +1,154 @@
+import { vocabI18nKey } from "./vocab";
+import { type ActiveFilter } from "./useActiveFilters";
+import { type PlexFilters } from "./api";
+
+type TFn = (key: string, options?: Record<string, unknown>) => string;
+
+// The pure builder behind Plex's chip row (modules/plex usePlexActiveFilters): turns a Plex filter
+// set + watch-state into the source-agnostic ActiveFilter[]. Apart from the hook so the saved-views
+// manager (features/filters) can DESCRIBE an arbitrary view's captured filters (with no-op removes)
+// without reaching into the Plex module — the labels stay in one place, no duplication with the live
+// chip row. Store-free, like its feed twin useActiveFilters.
+export function buildPlexActiveFilters(
+  filters: PlexFilters,
+  show: string,
+  patch: (p: Partial<PlexFilters>) => void,
+  setShow: (s: string) => void,
+  t: TFn,
+  /** Collection titles for the chip labels, resolved beyond what the filter state carries. Omitted by
+   *  the saved-views manager, which describes a stored view and has only the captured titles. */
+  collectionTitles?: Record<string, string>,
+  /** The missing titles are still loading: their chips show a placeholder, not the generic word. */
+  collectionsPending = false,
+): ActiveFilter[] {
+  const out: ActiveFilter[] = [];
+
+  const has = (x: number | null | undefined) => x != null;
+
+  for (const g of filters.genres) {
+    out.push({
+      key: `genre:${g}`,
+      label: g,
+      remove: () => patch({ genres: filters.genres.filter((x) => x !== g) }),
+    });
+  }
+  for (const r of filters.contentRatings) {
+    out.push({
+      key: `contentRating:${r}`,
+      label: vocabI18nKey("certificate", r)
+        ? t(vocabI18nKey("certificate", r), { defaultValue: r })
+        : r,
+      remove: () => patch({ contentRatings: filters.contentRatings.filter((x) => x !== r) }),
+    });
+  }
+  if (has(filters.yearMin) || has(filters.yearMax)) {
+    const range =
+      has(filters.yearMin) && has(filters.yearMax)
+        ? `${filters.yearMin}–${filters.yearMax}`
+        : has(filters.yearMin)
+          ? `≥${filters.yearMin}`
+          : `≤${filters.yearMax}`;
+    out.push({
+      key: "year",
+      label: `${t("plex.filter.year")}: ${range}`,
+      remove: () => patch({ yearMin: null, yearMax: null }),
+    });
+  }
+  if (has(filters.ratingMin)) {
+    out.push({
+      key: "ratingMin",
+      label: `${t("plex.filter.rating")}: ≥${filters.ratingMin}`,
+      remove: () => patch({ ratingMin: null }),
+    });
+  }
+  if (has(filters.durationMin) || has(filters.durationMax)) {
+    const lo = has(filters.durationMin) ? Math.round(filters.durationMin! / 60) : null;
+    const hi = has(filters.durationMax) ? Math.round(filters.durationMax! / 60) : null;
+    const u = t("plex.filter.durationUnit");
+    const range =
+      lo != null && hi != null ? `${lo}–${hi} ${u}` : lo != null ? `≥${lo} ${u}` : `≤${hi} ${u}`;
+    out.push({
+      key: "duration",
+      label: `${t("plex.filter.duration")}: ${range}`,
+      remove: () => patch({ durationMin: null, durationMax: null }),
+    });
+  }
+  if (filters.addedWithin) {
+    out.push({
+      key: "added",
+      label: `${t("plex.filter.added")}: ${t("plex.filter.addedOpt." + filters.addedWithin)}`,
+      remove: () => patch({ addedWithin: "" }),
+    });
+  }
+  for (const d of filters.directors) {
+    out.push({
+      key: `director:${d}`,
+      label: d,
+      remove: () => patch({ directors: filters.directors.filter((x) => x !== d) }),
+    });
+  }
+  for (const a of filters.actors) {
+    out.push({
+      key: `actor:${a}`,
+      label: a,
+      remove: () => patch({ actors: filters.actors.filter((x) => x !== a) }),
+    });
+  }
+  for (const s of filters.studios) {
+    out.push({
+      key: `studio:${s}`,
+      label: s,
+      remove: () => patch({ studios: filters.studios.filter((x) => x !== s) }),
+    });
+  }
+  for (const p of filters.playable) {
+    out.push({
+      key: `playable:${p}`,
+      label: t(`plex.filter.playableOpt.${p}`),
+      remove: () => patch({ playable: filters.playable.filter((x) => x !== p) }),
+    });
+  }
+  for (const k of filters.keywords) {
+    out.push({
+      key: `keyword:${k}`,
+      label: k,
+      remove: () => patch({ keywords: filters.keywords.filter((x) => x !== k) }),
+    });
+  }
+  out.push(...collectionChips(filters, patch, t, collectionTitles, collectionsPending));
+  if (show !== "all") {
+    out.push({
+      key: "show",
+      label: t("plex.filter.showOpt." + show),
+      remove: () => setShow("all"),
+    });
+  }
+  return out;
+}
+
+// One chip per selected collection, named by the resolved titles (a placeholder while a link's titles
+// load), else by the ones the state carries, else the generic word.
+function collectionChips(
+  filters: PlexFilters,
+  patch: (p: Partial<PlexFilters>) => void,
+  t: TFn,
+  collectionTitles: Record<string, string> | undefined,
+  pending: boolean,
+): ActiveFilter[] {
+  return filters.collections.map((c) => ({
+    key: `collection:${c}`,
+    label: collectionTitles?.[c] ?? filters.collectionTitles?.[c] ?? t("plex.filter.collection"),
+    pending: pending && collectionTitles?.[c] === undefined,
+    // Prune the title too — collectionTitles is hashed into the plex query keys, so a stale entry
+    // splits the cache from the logically-identical no-collection state (mirrors CollectionPicker).
+    // Collapse an empty map back to undefined so the last-removed state key-matches the pristine
+    // one (an empty `{}` still hashes differently from an absent key).
+    remove: () => {
+      const { [c]: _drop, ...restTitles } = filters.collectionTitles ?? {};
+      patch({
+        collections: filters.collections.filter((x) => x !== c),
+        collectionTitles: Object.keys(restTitles).length ? restTitles : undefined,
+      });
+    },
+  }));
+}
diff --git a/frontend/src/lib/useRail.ts b/frontend/src/lib/useRail.ts
index ab3ff7bf..58299e7a 100644
--- a/frontend/src/lib/useRail.ts
+++ b/frontend/src/lib/useRail.ts
@@ -8,6 +8,7 @@ import { LS } from "./storage";
 import { usePref } from "./usePref";
 import { updateMeCache } from "./useMe";
 import {
+  defaultLayout,
   PREF_KEY,
   saveLayoutLocal,
   seedLayout,
@@ -68,10 +69,17 @@ const COLLAPSE = {
   },
 } as const;
 
-/** What a rail hands its FilterRail: the layout and the collapse flag, each with its setter. */
+/** What a rail hands its FilterRail: the layout and the collapse flag, each with its setter, and the
+ *  reset to the rail's default layout. */
 export function useRail(panel: PanelId) {
   const [layout, setLayout] = usePanelLayout(panel);
   const c = COLLAPSE[panel];
   const [collapsed, setCollapsed] = usePref<boolean>(c.key, c.initial, c.opts);
-  return { layout, setLayout, collapsed, onToggleCollapse: () => setCollapsed(!collapsed) };
+  return {
+    layout,
+    setLayout,
+    onResetLayout: () => setLayout(defaultLayout(panel)),
+    collapsed,
+    onToggleCollapse: () => setCollapsed(!collapsed),
+  };
 }
diff --git a/frontend/src/modules/channels/Channels.tsx b/frontend/src/modules/channels/Channels.tsx
index bf8fa9d6..a1ee78a0 100644
--- a/frontend/src/modules/channels/Channels.tsx
+++ b/frontend/src/modules/channels/Channels.tsx
@@ -33,14 +33,14 @@ import { useChannelActions } from "./useChannelActions";
 import { useContextMenu } from "../../components/ui/useContextMenu";
 import { LoadingState, StateMessage } from "../../components/ui/QueryState";
 import { useChannelTagActions } from "../../lib/useChannelTagActions";
-import { useTagSuggestions } from "../../features/channel/useTagSuggestions";
+import { useTagSuggestions } from "./useTagSuggestions";
 import { useChannelPriority } from "../../lib/useChannelPriority";
 import { placeByPriority } from "../../lib/channelOrder";
 import { focusNavItem } from "../../lib/listNav";
 import ViewSwitcher, { type ViewOption } from "../../components/ui/ViewSwitcher";
 import ColumnSortControl from "../../components/ui/ColumnSortControl";
 import FilterChipGroup from "../../components/ui/FilterChipGroup";
-import TagFilterChips from "../../features/filters/TagFilterChips";
+import TagFilterChips from "./TagFilterChips";
 import ActionMenu, { type ActionMenuItem } from "../../components/ui/ActionMenu";
 import ChannelStatsPopover from "./ChannelStatsPopover";
 import Pager from "../../components/ui/Pager";
diff --git a/frontend/src/features/filters/TagFilterChips.dom.test.tsx b/frontend/src/modules/channels/TagFilterChips.dom.test.tsx
similarity index 100%
rename from frontend/src/features/filters/TagFilterChips.dom.test.tsx
rename to frontend/src/modules/channels/TagFilterChips.dom.test.tsx
diff --git a/frontend/src/features/filters/TagFilterChips.tsx b/frontend/src/modules/channels/TagFilterChips.tsx
similarity index 100%
rename from frontend/src/features/filters/TagFilterChips.tsx
rename to frontend/src/modules/channels/TagFilterChips.tsx
diff --git a/frontend/src/modules/channels/channelColumns.tsx b/frontend/src/modules/channels/channelColumns.tsx
index afdedb46..499f3ee3 100644
--- a/frontend/src/modules/channels/channelColumns.tsx
+++ b/frontend/src/modules/channels/channelColumns.tsx
@@ -11,7 +11,7 @@ import { ChannelTagsControl, type SuggestedTag } from "../../features/channel/Ch
 import { StoredCell } from "./channelCells";
 import { isFullySynced } from "./channelSync";
 import { RelativeTime } from "../../components/ui/RelativeTime";
-import type { FilterChip } from "../../features/filters/TagFilterChips";
+import type { FilterChip } from "./TagFilterChips";
 
 /** The shared "subscribers" DataTable column (right-aligned, sortable, em-dash for null) — identical
  * in the Channels manager and the ChannelDiscovery table, which show subscriber counts on different
diff --git a/frontend/src/features/channel/useTagSuggestions.dom.test.tsx b/frontend/src/modules/channels/useTagSuggestions.dom.test.tsx
similarity index 100%
rename from frontend/src/features/channel/useTagSuggestions.dom.test.tsx
rename to frontend/src/modules/channels/useTagSuggestions.dom.test.tsx
diff --git a/frontend/src/features/channel/useTagSuggestions.ts b/frontend/src/modules/channels/useTagSuggestions.ts
similarity index 98%
rename from frontend/src/features/channel/useTagSuggestions.ts
rename to frontend/src/modules/channels/useTagSuggestions.ts
index 9842e604..bec733d4 100644
--- a/frontend/src/features/channel/useTagSuggestions.ts
+++ b/frontend/src/modules/channels/useTagSuggestions.ts
@@ -4,7 +4,7 @@ import { useTranslation } from "react-i18next";
 import { api, type Tag, type TagSuggestions } from "../../lib/api";
 import { qk } from "../../lib/queryKeys";
 import { useConfirm } from "../../components/ui/confirmContext";
-import type { SuggestedTag } from "./ChannelTags";
+import type { SuggestedTag } from "../../features/channel/ChannelTags";
 
 // A tag suggestion at/above this score is "high confidence" — the only ones the header's bulk
 // "accept all" acts on. Mirrors AUTOAPPLY_THRESHOLD in backend app/sync/tagsuggest.py (kept in
diff --git a/frontend/src/modules/feed/ChannelPage.backfill.dom.test.tsx b/frontend/src/modules/feed/ChannelPage.backfill.dom.test.tsx
index 16ee1552..8271d516 100644
--- a/frontend/src/modules/feed/ChannelPage.backfill.dom.test.tsx
+++ b/frontend/src/modules/feed/ChannelPage.backfill.dom.test.tsx
@@ -22,6 +22,7 @@ vi.mock("../../features/navigation/navigationContext", () => ({
 vi.mock("../../components/ui/confirmContext", () => ({ useConfirm: () => async () => true }));
 vi.mock("./feedFiltersContext", () => ({
   useFeedFilters: () => ({ includeNormal: true, includeShorts: false, includeLive: false }),
+  useFeedFiltersActions: () => ({ setFilters: () => {} }),
 }));
 vi.mock("./Feed", () => ({ default: () => null }));
 vi.mock("../../features/channel/ChannelAbout", () => ({ default: () => null }));
@@ -71,9 +72,6 @@ describe("ChannelPage — the grid follows a running backfill", () => {
           channelId={CH}
           initialName="LEMMiNO"
           me={{ id: 1, can_write: true } as unknown as Me}
-          view="cards"
-          setView={() => {}}
-          onShowInFeed={() => {}}
         />
       </QueryClientProvider>,
     );
diff --git a/frontend/src/modules/feed/ChannelPage.banner.dom.test.tsx b/frontend/src/modules/feed/ChannelPage.banner.dom.test.tsx
index 285986a1..b719bf5b 100644
--- a/frontend/src/modules/feed/ChannelPage.banner.dom.test.tsx
+++ b/frontend/src/modules/feed/ChannelPage.banner.dom.test.tsx
@@ -20,6 +20,7 @@ vi.mock("../../features/navigation/navigationContext", () => ({
 vi.mock("../../components/ui/confirmContext", () => ({ useConfirm: () => async () => true }));
 vi.mock("./feedFiltersContext", () => ({
   useFeedFilters: () => ({ includeNormal: true, includeShorts: false, includeLive: false }),
+  useFeedFiltersActions: () => ({ setFilters: () => {} }),
 }));
 vi.mock("./Feed", () => ({ default: () => null }));
 vi.mock("../../features/channel/ChannelAbout", () => ({ default: () => null }));
@@ -73,9 +74,6 @@ describe("ChannelPage — the banner", () => {
           channelId={CH}
           initialName="StarTalk"
           me={{ id: 1, can_write: true } as unknown as Me}
-          view="cards"
-          setView={() => {}}
-          onShowInFeed={() => {}}
         />
       </QueryClientProvider>,
     );
diff --git a/frontend/src/modules/feed/ChannelPage.busyFocus.dom.test.tsx b/frontend/src/modules/feed/ChannelPage.busyFocus.dom.test.tsx
index 2669f886..8bfa6d59 100644
--- a/frontend/src/modules/feed/ChannelPage.busyFocus.dom.test.tsx
+++ b/frontend/src/modules/feed/ChannelPage.busyFocus.dom.test.tsx
@@ -20,6 +20,7 @@ vi.mock("../../features/navigation/navigationContext", () => ({
 vi.mock("../../components/ui/confirmContext", () => ({ useConfirm: () => async () => true }));
 vi.mock("./feedFiltersContext", () => ({
   useFeedFilters: () => ({ includeNormal: true, includeShorts: false, includeLive: false }),
+  useFeedFiltersActions: () => ({ setFilters: () => {} }),
 }));
 vi.mock("./Feed", () => ({ default: () => null }));
 vi.mock("../../features/channel/ChannelAbout", () => ({ default: () => null }));
@@ -80,9 +81,6 @@ describe("ChannelPage — a busy toggle keeps the keyboard", () => {
             channelId={CH}
             initialName="LEMMiNO"
             me={{ id: 1, can_write: true } as unknown as Me}
-            view="cards"
-            setView={() => {}}
-            onShowInFeed={() => {}}
           />
         </QueryClientProvider>,
       );
@@ -127,9 +125,6 @@ describe("ChannelPage — the banner", () => {
           channelId={CH}
           initialName="LEMMiNO"
           me={{ id: 1, can_write: true } as unknown as Me}
-          view="cards"
-          setView={() => {}}
-          onShowInFeed={() => {}}
         />
       </QueryClientProvider>,
     );
diff --git a/frontend/src/modules/feed/ChannelPage.fold.dom.test.tsx b/frontend/src/modules/feed/ChannelPage.fold.dom.test.tsx
index dedc0434..1d423216 100644
--- a/frontend/src/modules/feed/ChannelPage.fold.dom.test.tsx
+++ b/frontend/src/modules/feed/ChannelPage.fold.dom.test.tsx
@@ -19,6 +19,7 @@ vi.mock("../../features/navigation/navigationContext", () => ({
 vi.mock("../../components/ui/confirmContext", () => ({ useConfirm: () => async () => true }));
 vi.mock("./feedFiltersContext", () => ({
   useFeedFilters: () => ({ includeNormal: true, includeShorts: false, includeLive: false }),
+  useFeedFiltersActions: () => ({ setFilters: () => {} }),
 }));
 vi.mock("./Feed", () => ({ default: () => null }));
 vi.mock("../../features/channel/ChannelAbout", () => ({ default: () => null }));
@@ -91,9 +92,6 @@ async function renderPage() {
         channelId={CH}
         initialName="StarTalk"
         me={{ id: 1, can_write: true } as unknown as Me}
-        view="cards"
-        setView={() => {}}
-        onShowInFeed={() => {}}
       />
     </QueryClientProvider>,
   );
diff --git a/frontend/src/modules/feed/ChannelPage.tsx b/frontend/src/modules/feed/ChannelPage.tsx
index df517b35..0551865d 100644
--- a/frontend/src/modules/feed/ChannelPage.tsx
+++ b/frontend/src/modules/feed/ChannelPage.tsx
@@ -30,6 +30,8 @@ import ChannelAboutContent from "../../features/channel/ChannelAbout";
 import { PageToolbar } from "../../components/ui/PageShell";
 import { PageToolbarSlot } from "../../components/ui/pageToolbarSlot";
 import { useFeedFilters } from "./feedFiltersContext";
+import { useFeedView, useFeedViewActions } from "./feedViewContext";
+import { useShowChannelInFeed } from "./useFeedPageHooks";
 import { SHOW_IDS } from "./feedFiltersInit";
 import { usePref } from "../../lib/usePref";
 import { LS } from "../../lib/storage";
@@ -44,7 +46,6 @@ import {
   type Me,
   type ChannelDetail,
 } from "../../lib/api";
-import type { FeedView } from "../../lib/feedView";
 import { channelYouTubeUrl, formatDate, formatCompact } from "../../lib/format";
 import { ChannelTagsControl } from "../../features/channel/ChannelTags";
 import { useChannelTagActions } from "../../lib/useChannelTagActions";
@@ -64,21 +65,10 @@ export default function ChannelPage({
   channelId,
   initialName,
   me,
-  view,
-  setView,
-  onShowInFeed,
 }: {
   channelId: string;
   initialName?: string;
   me: Me;
-  // The feed's view pref, passed straight through to the Feed this page renders — so its
-  // toolbar carries the same switcher and a change here is the same account-wide choice.
-  view: FeedView;
-  setView: (v: FeedView) => void;
-  // Narrow the real feed to this channel and go there. Offered only for a channel you're
-  // subscribed to: the feed defaults to scope "my", so filtering it to a channel you don't
-  // follow would just land you on an empty page.
-  onShowInFeed: () => void;
 }) {
   const { t, i18n } = useTranslation();
   const lang = i18n.language;
@@ -90,6 +80,14 @@ export default function ChannelPage({
   // shorts / live-upcoming) is a genuine preference, not part of "this channel's catalog" — so we
   // inherit it instead of forcing Live/Upcoming on. The channel toolbar can still toggle these.
   const globalFilters = useFeedFilters();
+  // The feed's view pref, handed straight to the Feed this page renders — so its toolbar carries the
+  // same switcher and a change here is the same account-wide choice.
+  const view = useFeedView();
+  const { setView } = useFeedViewActions();
+  // Narrow the real feed to this channel and go there. Offered only for a channel you're subscribed
+  // to: the feed defaults to scope "my", so filtering it to a channel you don't follow would just
+  // land you on an empty page.
+  const onShowInFeed = useShowChannelInFeed(channelId);
   const [tab, setTab] = useState<"videos" | "about">("videos");
   const panel = useTabPanel();
   // The whole channel chrome (banner, identity, tabs, toolbar) is fixed: it portals into the shell's
diff --git a/frontend/src/modules/feed/ChannelPage.watchState.dom.test.tsx b/frontend/src/modules/feed/ChannelPage.watchState.dom.test.tsx
index 39536ee2..1d866030 100644
--- a/frontend/src/modules/feed/ChannelPage.watchState.dom.test.tsx
+++ b/frontend/src/modules/feed/ChannelPage.watchState.dom.test.tsx
@@ -18,6 +18,7 @@ vi.mock("../../features/navigation/navigationContext", () => ({
 vi.mock("../../components/ui/confirmContext", () => ({ useConfirm: () => async () => true }));
 vi.mock("./feedFiltersContext", () => ({
   useFeedFilters: () => ({ includeNormal: true, includeShorts: false, includeLive: false }),
+  useFeedFiltersActions: () => ({ setFilters: () => {} }),
 }));
 const feed = vi.hoisted(() => ({
   last: null as null | { filters: FeedFilters; setFilters: (f: FeedFilters) => void },
@@ -75,9 +76,6 @@ function mount(preferences: Record<string, unknown> = {}) {
         channelId={CH}
         initialName="StarTalk"
         me={{ id: 1, can_write: true, can_read: true } as unknown as Me}
-        view="cards"
-        setView={() => {}}
-        onShowInFeed={() => {}}
       />
     </QueryClientProvider>,
   );
diff --git a/frontend/src/modules/feed/Sidebar.tsx b/frontend/src/modules/feed/Sidebar.tsx
index 529725c8..0adaf30a 100644
--- a/frontend/src/modules/feed/Sidebar.tsx
+++ b/frontend/src/modules/feed/Sidebar.tsx
@@ -41,7 +41,7 @@ const DATE_PRESETS: { days: number; key: string }[] = [
 
 export default function Sidebar() {
   // Its layout and collapse flag are its own (lib/useRail), so the shell only places it.
-  const { layout, setLayout, collapsed, onToggleCollapse } = useRail("feed");
+  const { layout, setLayout, onResetLayout, collapsed, onToggleCollapse } = useRail("feed");
   const { t, i18n } = useTranslation();
   const lang = i18n.language;
   // The feed's saved views, handed to the shared views UI in this rail through the scope below.
@@ -83,8 +83,8 @@ export default function Sidebar() {
   const topics = tags.filter((t) => t.category === "topic");
   const userTags = tags.filter((t) => !t.system);
   const [tagManagerOpen, setTagManagerOpen] = useState(false);
-  // This rail's media source (the feed). Names the abstraction the feed and Plex rails share; drives
-  // the panel layout key. `FilterRail` owns the customize `editing` state now.
+  // This rail's media source (the feed). Names the abstraction the feed and Plex rails share; picks
+  // the default group order below. `FilterRail` owns the customize `editing` state.
   const source: MediaSourceKind = "feed";
 
   // The language/topic/tags sections all write into the one `filters.tags` list, so each combobox owns
@@ -227,7 +227,7 @@ export default function Sidebar() {
   return (
     <SavedViewsScope value={savedViews}>
       <FilterRail
-        kind={source}
+        onResetLayout={onResetLayout}
         title={t("sidebar.filters")}
         icon={<SlidersHorizontal className="w-4 h-4" />}
         count={activeCount}
diff --git a/frontend/src/modules/feed/index.ts b/frontend/src/modules/feed/index.ts
index f0432d85..567155c9 100644
--- a/frontend/src/modules/feed/index.ts
+++ b/frontend/src/modules/feed/index.ts
@@ -1,5 +1,6 @@
-// The feed's public face: its stores (filters, view, saved views), mounted at the root and read app-wide.
+// The feed's public face: its stores (filters, saved views), mounted at the root and read app-wide,
+// and the feed page's scroll key, which the shell's scroller restores by.
 export { useFeedSavedViews } from "./feedSavedViews";
 export { useFeedFilters, useFeedFiltersActions } from "./feedFiltersContext";
-export { useFeedView, useFeedViewActions } from "./feedViewContext";
+export { useFeedScrollKey } from "./useFeedPageHooks";
 export { ChannelPage, feedModule } from "./module";
diff --git a/frontend/src/modules/feed/useFeedPageHooks.dom.test.tsx b/frontend/src/modules/feed/useFeedPageHooks.dom.test.tsx
new file mode 100644
index 00000000..294cba4e
--- /dev/null
+++ b/frontend/src/modules/feed/useFeedPageHooks.dom.test.tsx
@@ -0,0 +1,63 @@
+// @vitest-environment jsdom
+//
+// The feed's two page hooks the shell used to hand-build: the channel page's "Show in feed" (adds the
+// channel to the picked set and opens the feed) and the feed page's scroll key.
+import { describe, expect, it, vi, beforeEach } from "vitest";
+import { renderHook } from "@testing-library/react";
+
+const h = vi.hoisted(() => ({
+  filters: { channelIds: [] as string[], q: "", show: "unwatched" } as Record<string, unknown>,
+  ytSearch: null as string | null,
+  setFilters: vi.fn(),
+  setPage: vi.fn(),
+}));
+
+vi.mock("../../features/navigation/navigationContext", () => ({
+  useNavigation: () => ({ ytSearch: h.ytSearch }),
+  useNavigationActions: () => ({ setPage: h.setPage }),
+}));
+vi.mock("./feedFiltersContext", () => ({
+  useFeedFilters: () => h.filters,
+  useFeedFiltersActions: () => ({ setFilters: h.setFilters }),
+}));
+
+import { useFeedScrollKey, useShowChannelInFeed } from "./useFeedPageHooks";
+
+beforeEach(() => {
+  h.filters = { channelIds: ["a"], q: "", show: "unwatched" };
+  h.ytSearch = null;
+  h.setFilters.mockClear();
+  h.setPage.mockClear();
+});
+
+describe("Show in feed", () => {
+  it("adds the channel to the picked ones, keeps the other filters, and opens the feed", () => {
+    renderHook(() => useShowChannelInFeed("b")).result.current();
+    expect(h.setFilters).toHaveBeenCalledWith({
+      channelIds: ["a", "b"],
+      q: "",
+      show: "unwatched",
+    });
+    expect(h.setPage).toHaveBeenCalledWith("feed");
+  });
+
+  it("changes nothing in the set for a channel already picked", () => {
+    renderHook(() => useShowChannelInFeed("a")).result.current();
+    expect(h.setFilters.mock.calls[0]![0]).toMatchObject({ channelIds: ["a"] });
+  });
+});
+
+describe("the feed's scroll key", () => {
+  it("follows the filters but not the search text", () => {
+    const first = renderHook(() => useFeedScrollKey()).result.current;
+    h.filters = { ...h.filters, q: "typing" };
+    expect(renderHook(() => useFeedScrollKey()).result.current).toBe(first);
+    h.filters = { ...h.filters, show: "all" };
+    expect(renderHook(() => useFeedScrollKey()).result.current).not.toBe(first);
+  });
+
+  it("is the live search's own while it is open", () => {
+    h.ytSearch = "cats";
+    expect(renderHook(() => useFeedScrollKey()).result.current).toBe("yt:cats");
+  });
+});
diff --git a/frontend/src/modules/feed/useFeedPageHooks.ts b/frontend/src/modules/feed/useFeedPageHooks.ts
new file mode 100644
index 00000000..8bed251f
--- /dev/null
+++ b/frontend/src/modules/feed/useFeedPageHooks.ts
@@ -0,0 +1,30 @@
+import { useNavigation, useNavigationActions } from "../../features/navigation/navigationContext";
+import { useFeedFilters, useFeedFiltersActions } from "./feedFiltersContext";
+
+// "Show in feed" on a channel page: narrow the real feed to this channel and go there. The rest of
+// the feed's filters stay — the point is "this channel, the way I normally read": unwatched, my tags,
+// my date window. The channel is ADDED to the picked set, not swapped in: channels OR together, so
+// arriving from a second channel page widens the feed instead of silently dropping the first; picking
+// one already in the set changes nothing.
+export function useShowChannelInFeed(channelId: string): () => void {
+  const filters = useFeedFilters();
+  const { setFilters } = useFeedFiltersActions();
+  const { setPage } = useNavigationActions();
+  return () => {
+    setFilters({ ...filters, channelIds: [...new Set([...filters.channelIds, channelId])] });
+    // setPage already leaves an open channel page and pushes a clean history entry. Calling
+    // closeChannel() first ran history.back(), whose popstate landed AFTER this and restored whatever
+    // page the channel had been opened from.
+    setPage("feed");
+  };
+}
+
+// The feed page's scroll restore/reset key (see PageScroller): the same feed filters return you to
+// where you were; a changed filter is a new key, so the fresh result set starts at the top. `q` is
+// normalised out so typing in the search box doesn't reset the scroll on every keystroke; the
+// live-YouTube sub-view gets its own key.
+export function useFeedScrollKey(): string {
+  const filters = useFeedFilters();
+  const { ytSearch } = useNavigation();
+  return ytSearch != null ? `yt:${ytSearch}` : `feed:${JSON.stringify({ ...filters, q: "" })}`;
+}
diff --git a/frontend/src/modules/files/Files.menu.dom.test.tsx b/frontend/src/modules/files/Files.menu.dom.test.tsx
index ff8c2e62..a0640840 100644
--- a/frontend/src/modules/files/Files.menu.dom.test.tsx
+++ b/frontend/src/modules/files/Files.menu.dom.test.tsx
@@ -125,7 +125,7 @@ beforeAll(async () => {
     import("./FilePreview"),
     import("./ShareDialog"),
     import("./UploadDialog"),
-    import("../../features/player/VideoEditor"),
+    import("./VideoEditor"),
   ]);
 }, 60_000);
 
diff --git a/frontend/src/modules/files/Files.tsx b/frontend/src/modules/files/Files.tsx
index 39b1c030..e34f6b52 100644
--- a/frontend/src/modules/files/Files.tsx
+++ b/frontend/src/modules/files/Files.tsx
@@ -26,7 +26,7 @@ import { MetaEditModal } from "../../features/downloads/downloadModals";
 import { jobTitle } from "../../features/downloads/downloadTitle";
 import { FileCard } from "./FileCard";
 import { PhoneBadge, RetentionBadge, SourceBadge } from "./fileBadges";
-import { folderLabel, takesUploads } from "./fileFolders";
+import { folderLabel, takesUploads } from "../../features/folders/fileFolders";
 import { ALL_FILES, useFiles, useFilesActions, viewParam, type FilesView } from "./filesContext";
 import { useFileActions } from "./useFileActions";
 import { useFolderActions } from "./useFolderActions";
@@ -55,7 +55,7 @@ const UploadDialog = lazy(() => import("./UploadDialog"));
 const ShareDialog = lazy(() => import("./ShareDialog"));
 const LibraryPlayer = lazy(() => import("./LibraryPlayer"));
 const FilePreview = lazy(() => import("./FilePreview"));
-const VideoEditor = lazy(() => import("../../features/player/VideoEditor"));
+const VideoEditor = lazy(() => import("./VideoEditor"));
 
 // The Files library: every done file of mine, the ones shared with me, or one folder's (the rail
 // picks — FilesProvider holds it), searched by the header's box. One aligned table: every kind of
diff --git a/frontend/src/modules/files/FilesRail.tsx b/frontend/src/modules/files/FilesRail.tsx
index 5cbb15e2..a3039a0a 100644
--- a/frontend/src/modules/files/FilesRail.tsx
+++ b/frontend/src/modules/files/FilesRail.tsx
@@ -10,7 +10,7 @@ import { formatBytes } from "../../lib/format";
 import { qk } from "../../lib/queryKeys";
 import { useLiveQuery } from "../../lib/useLiveQuery";
 import FilterRail from "../../components/ui/FilterRail";
-import { folderIcon, folderLabel } from "./fileFolders";
+import { folderIcon, folderLabel } from "../../features/folders/fileFolders";
 import { sameView, useFiles, useFilesActions, type FilesView } from "./filesContext";
 import { RenameField } from "../../components/ui/RenameField";
 import { useFolderActions } from "./useFolderActions";
@@ -113,7 +113,7 @@ function StorageMeter() {
 
 export default function FilesRail() {
   // Its layout and collapse flag are its own (lib/useRail), so the shell only places it.
-  const { layout, setLayout, collapsed, onToggleCollapse } = useRail("files");
+  const { layout, setLayout, onResetLayout, collapsed, onToggleCollapse } = useRail("files");
   const { t, i18n } = useTranslation();
   const { view } = useFiles();
   const foldersQ = useQuery({ queryKey: qk.fileFolders(), queryFn: api.fileFolders });
@@ -255,7 +255,7 @@ export default function FilesRail() {
 
   return (
     <FilterRail
-      kind="files"
+      onResetLayout={onResetLayout}
       title={t("files.navLabel")}
       icon={<FolderOpen className="w-4 h-4" />}
       collapsed={collapsed}
diff --git a/frontend/src/features/player/VideoEditor.partial.dom.test.tsx b/frontend/src/modules/files/VideoEditor.partial.dom.test.tsx
similarity index 100%
rename from frontend/src/features/player/VideoEditor.partial.dom.test.tsx
rename to frontend/src/modules/files/VideoEditor.partial.dom.test.tsx
diff --git a/frontend/src/features/player/VideoEditor.tsx b/frontend/src/modules/files/VideoEditor.tsx
similarity index 100%
rename from frontend/src/features/player/VideoEditor.tsx
rename to frontend/src/modules/files/VideoEditor.tsx
diff --git a/frontend/src/modules/files/fileBadges.tsx b/frontend/src/modules/files/fileBadges.tsx
index 044d7cec..17364ab3 100644
--- a/frontend/src/modules/files/fileBadges.tsx
+++ b/frontend/src/modules/files/fileBadges.tsx
@@ -3,7 +3,7 @@ import { useTranslation } from "react-i18next";
 import { Clock, Pin, Smartphone } from "lucide-react";
 import type { LibraryFile } from "../../lib/api";
 import { formatDateTime } from "../../lib/format";
-import { sourceIcon, sourceLabel } from "./fileFolders";
+import { sourceIcon, sourceLabel } from "../../features/folders/fileFolders";
 import { Badge } from "../../components/ui/Badge";
 
 // What a library file says about itself — where it came from, whether a phone plays it, how long it
diff --git a/frontend/src/modules/files/index.ts b/frontend/src/modules/files/index.ts
index d1def32d..11f424e1 100644
--- a/frontend/src/modules/files/index.ts
+++ b/frontend/src/modules/files/index.ts
@@ -1,4 +1,3 @@
-// The Files page's public face: its store, mounted at the root, and how a folder is named and pictured.
+// The Files page's public face: its store, mounted at the root and read app-wide.
 export { useFilesActions } from "./filesContext";
-export { folderIcon, folderLabel, sourceLabel, takesUploads } from "./fileFolders";
 export { filesModule } from "./module";
diff --git a/frontend/src/modules/files/useFileActions.tsx b/frontend/src/modules/files/useFileActions.tsx
index f5aa855e..dddb3446 100644
--- a/frontend/src/modules/files/useFileActions.tsx
+++ b/frontend/src/modules/files/useFileActions.tsx
@@ -25,7 +25,7 @@ import { libraryRowActions, sharedRowActions } from "../../lib/downloadActions";
 import { useConfirm } from "../../components/ui/confirmContext";
 import { useCopyItems } from "../../components/ui/copyItems";
 import { jobTitle } from "../../features/downloads/downloadTitle";
-import { folderLabel } from "./fileFolders";
+import { folderLabel } from "../../features/folders/fileFolders";
 import { type ActionMenuItem } from "../../components/ui/ActionMenu";
 import { menuGroups } from "../../components/ui/menuGroups";
 
diff --git a/frontend/src/modules/files/useFolderActions.tsx b/frontend/src/modules/files/useFolderActions.tsx
index d361e55e..33833de9 100644
--- a/frontend/src/modules/files/useFolderActions.tsx
+++ b/frontend/src/modules/files/useFolderActions.tsx
@@ -6,7 +6,7 @@ import { api, type FileFolder, type FolderPatch } from "../../lib/api";
 import { notifyActionError } from "../../lib/actionErrors";
 import { invalidateDownloads, quickShareLink } from "../../lib/downloads";
 import { useConfirm } from "../../components/ui/confirmContext";
-import { folderLabel } from "./fileFolders";
+import { folderLabel } from "../../features/folders/fileFolders";
 import { type ActionMenuItem } from "../../components/ui/ActionMenu";
 import { menuGroups } from "../../components/ui/menuGroups";
 
diff --git a/frontend/src/modules/playlists/PlaylistsRail.tsx b/frontend/src/modules/playlists/PlaylistsRail.tsx
index 38a5ff9f..c6b21521 100644
--- a/frontend/src/modules/playlists/PlaylistsRail.tsx
+++ b/frontend/src/modules/playlists/PlaylistsRail.tsx
@@ -49,7 +49,7 @@ const ROW_BASE = "w-full flex items-center gap-2.5 p-2 rounded-lg border transit
 // (Playlists.tsx) reacts to it. Grouped into two islands: "manage" and the playlist list.
 export default function PlaylistsRail() {
   // Its layout and collapse flag are its own (lib/useRail), so the shell only places it.
-  const { layout, setLayout, collapsed, onToggleCollapse } = useRail("playlists");
+  const { layout, setLayout, onResetLayout, collapsed, onToggleCollapse } = useRail("playlists");
   const canWrite = useMe().can_write;
   // The name filter + the selected playlist live in PlaylistsProvider (shared with the header search
   // box and the Playlists detail pane); this rail owns the list query + its own controls.
@@ -391,7 +391,7 @@ export default function PlaylistsRail() {
 
   return (
     <FilterRail
-      kind="playlists"
+      onResetLayout={onResetLayout}
       title={t("playlists.title")}
       icon={<ListVideo className="w-4 h-4" />}
       collapsed={collapsed}
diff --git a/frontend/src/modules/plex/PlexSavedViewsProvider.dom.test.tsx b/frontend/src/modules/plex/PlexSavedViewsProvider.dom.test.tsx
index 8050e494..d29f84ca 100644
--- a/frontend/src/modules/plex/PlexSavedViewsProvider.dom.test.tsx
+++ b/frontend/src/modules/plex/PlexSavedViewsProvider.dom.test.tsx
@@ -1,14 +1,20 @@
 // @vitest-environment jsdom
 //
 // Plex's saved views: the same default-view seed as the feed's (parity — Plex once never applied its
-// default at all), asked for only while the Plex page is on screen. Plex's filters are mocked so we can
-// assert exactly which setFilters is called; api.savedViews is stubbed and driven through a real
+// default at all), asked for only while the Plex page is on screen, and an applied view kept across a
+// visit to another page (the store is Plex's own, mounted at the root). Plex's filters are mocked so we
+// can assert exactly which setFilters is called; api.savedViews is stubbed and driven through a real
 // QueryClient.
 import { describe, it, expect, vi, beforeEach, afterEach } from "vitest";
 import { render, screen, waitFor, cleanup, act } from "@testing-library/react";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
+import { useEffect } from "react";
 
-const h = vi.hoisted(() => ({ page: "plex" as string, setPlexFilters: vi.fn() }));
+const h = vi.hoisted(() => ({
+  page: "plex" as string,
+  filters: {} as Record<string, unknown>,
+  setPlexFilters: vi.fn(),
+}));
 
 vi.mock("react-i18next", async (importOriginal) => {
   const actual = await importOriginal<typeof import("react-i18next")>();
@@ -18,7 +24,7 @@ vi.mock("../../features/navigation/navigationContext", () => ({
   useNavigation: () => ({ page: h.page }),
 }));
 vi.mock("./plexContext", () => ({
-  usePlex: () => ({ filters: {} }),
+  usePlex: () => ({ filters: h.filters }),
   usePlexActions: () => ({ setFilters: h.setPlexFilters }),
 }));
 vi.mock("../../components/ui/confirmContext", () => ({ useConfirm: () => async () => true }));
@@ -28,6 +34,7 @@ import { usePlexSavedViews } from "./plexSavedViews";
 import { api, type SavedView } from "../../lib/api";
 import { claimLocalData, LS } from "../../lib/storage";
 import { qk } from "../../lib/queryKeys";
+import type { SavedViewsContext } from "../../features/filters/savedViewsContext";
 
 const ID = 7;
 const view = (over: Partial<SavedView>): SavedView => ({
@@ -39,9 +46,15 @@ const view = (over: Partial<SavedView>): SavedView => ({
   ...over,
 });
 
+// The store as the last commit left it, for the case that drives it directly.
+let latest: SavedViewsContext | null = null;
+const keep = (store: SavedViewsContext) => {
+  latest = store;
+};
 function Probe() {
-  const { loading } = usePlexSavedViews();
-  return <div data-testid="loading">{String(loading)}</div>;
+  const store = usePlexSavedViews();
+  useEffect(() => keep(store));
+  return <div data-testid="loading">{String(store.loading)}</div>;
 }
 
 function mount(views: SavedView[]) {
@@ -65,7 +78,9 @@ beforeEach(() => {
   localStorage.clear();
   claimLocalData(ID);
   h.page = "plex";
+  h.filters = {};
   h.setPlexFilters.mockClear();
+  latest = null;
 });
 afterEach(() => {
   cleanup();
@@ -98,4 +113,22 @@ describe("Plex's saved views", () => {
     rerender();
     await waitFor(() => expect(spy).toHaveBeenCalledWith("plex"));
   });
+
+  it("keeps the view you applied, edited since, when you come back from another page", async () => {
+    const { rerender } = mount([
+      view({ id: 5, name: "comedies", filters: { genres: ["Comedy"] } }),
+    ]);
+    await waitFor(() => expect(screen.getByTestId("loading").textContent).toBe("false"));
+    act(() => latest!.apply(latest!.views[0]!));
+    h.filters = { genres: ["Comedy", "Drama"] }; // an edit since: the view is now shown as changed
+    rerender();
+    expect(latest!.displayView?.id).toBe(5);
+    expect(latest!.isDirty).toBe(true);
+    h.page = "home";
+    rerender();
+    h.page = "plex";
+    rerender();
+    expect(latest!.displayView?.id).toBe(5);
+    expect(latest!.isDirty).toBe(true);
+  });
 });
diff --git a/frontend/src/modules/plex/PlexSidebar.tsx b/frontend/src/modules/plex/PlexSidebar.tsx
index 4271e1ca..f6890a23 100644
--- a/frontend/src/modules/plex/PlexSidebar.tsx
+++ b/frontend/src/modules/plex/PlexSidebar.tsx
@@ -8,7 +8,6 @@ import { useQuery, useQueryClient } from "@tanstack/react-query";
 import { ListMusic, Plus, SlidersHorizontal } from "lucide-react";
 import { api, plexFilterCount, type PlexFilters } from "../../lib/api";
 import { notifyActionError } from "../../lib/actionErrors";
-import { type MediaSourceKind } from "../../lib/mediaSource";
 import { useDebounced } from "../../lib/useDebounced";
 import FilterRail from "../../components/ui/FilterRail";
 import { type PanelItem } from "../../components/ui/PanelGroups";
@@ -39,7 +38,7 @@ const DURATION_BUCKETS: { key: string; min: number | null; max: number | null }[
 
 export default function PlexSidebar() {
   // Its layout and collapse flag are its own (lib/useRail), so the shell only places it.
-  const { layout, setLayout, collapsed, onToggleCollapse } = useRail("plex");
+  const { layout, setLayout, onResetLayout, collapsed, onToggleCollapse } = useRail("plex");
   const { t, i18n } = useTranslation();
   // Scope / watch-state / sort / expanded filters live in PlexProvider (shared with PlexBrowse and
   // the header search box); this rail is the primary editor of them. Opening a playlist is a
@@ -51,9 +50,6 @@ export default function PlexSidebar() {
   // They reach the shared views UI in this rail through the scope below.
   const savedViews = usePlexSavedViews();
   const { openModal, modalOpen } = savedViews;
-  // This rail's media source (the Plex library) — names the abstraction the feed and Plex rails
-  // share; drives the panel layout key. `FilterRail` owns the customize `editing` state now.
-  const source: MediaSourceKind = "plex";
   // Titles are display-only (chip labels) — keep them OUT of the facet query key so renaming/relabelling
   // never refetches. collectionMode stays IN the key: any/all changes the result set.
   const { collectionTitles: _cts, ...facetKey } = filters;
@@ -298,7 +294,7 @@ export default function PlexSidebar() {
   return (
     <SavedViewsScope value={savedViews}>
       <FilterRail
-        kind={source}
+        onResetLayout={onResetLayout}
         title={t("sidebar.filters")}
         icon={<SlidersHorizontal className="w-4 h-4" />}
         count={activeCount}
diff --git a/frontend/src/modules/plex/index.ts b/frontend/src/modules/plex/index.ts
index dbda14d6..88fa4d78 100644
--- a/frontend/src/modules/plex/index.ts
+++ b/frontend/src/modules/plex/index.ts
@@ -1,5 +1,4 @@
-// The Plex module's public face: its store, mounted at the root and read app-wide, and how its filters read as chips.
+// The Plex module's public face: its store, mounted at the root and read app-wide.
 export { usePlexSavedViews } from "./plexSavedViews";
 export { usePlex, usePlexActions } from "./plexContext";
-export { buildPlexActiveFilters } from "./usePlexActiveFilters";
 export { plexModule } from "./module";
diff --git a/frontend/src/modules/plex/usePlexActiveFilters.ts b/frontend/src/modules/plex/usePlexActiveFilters.ts
index 298d9e5b..5b95a192 100644
--- a/frontend/src/modules/plex/usePlexActiveFilters.ts
+++ b/frontend/src/modules/plex/usePlexActiveFilters.ts
@@ -1,6 +1,6 @@
 import { useTranslation } from "react-i18next";
-import { vocabI18nKey } from "../../lib/vocab";
 import { type ActiveFilter } from "../../lib/useActiveFilters";
+import { buildPlexActiveFilters } from "../../lib/plexActiveFilters";
 import { EMPTY_PLEX_FILTERS, type PlexFilters } from "../../lib/api";
 import { PLEX_SORT_FALLBACK } from "../../lib/plexSort";
 import { usePlex, usePlexActions } from "./plexContext";
@@ -12,10 +12,8 @@ import { usePlexCollectionTitles } from "../../lib/usePlexCollectionTitles";
 // the feed has, instead of the narrowing being visible only inside the collapsed sidebar. Labels reuse
 // the existing plex.* i18n keys; multi-value dimensions (genres, people, ratings) emit one chip each so
 // removing one keeps the rest (same shape as the feed's tag/channel chips). Sort is NOT a chip here —
-// it's an always-visible control above the grid, like the feed. Lives here, not in lib, because
-// it reads the Plex provider (lib stays provider-free, like useActiveFilters).
-type TFn = (key: string, options?: Record<string, unknown>) => string;
-
+// it's an always-visible control above the grid, like the feed. The hook lives here because it reads
+// the Plex store; the pure builder it calls is lib/plexActiveFilters (lib stays store-free).
 export function usePlexActiveFilters(): ActiveFilter[] {
   const { show, filters } = usePlex();
   const { setShow, setFilters } = usePlexActions();
@@ -35,126 +33,6 @@ export function usePlexActiveFilters(): ActiveFilter[] {
   );
 }
 
-// The pure builder behind the hook: turns a Plex filter set + watch-state into the source-agnostic
-// ActiveFilter[]. Extracted so the saved-views manager can DESCRIBE an arbitrary view's captured
-// filters (with no-op removes) — the labels stay in one place, no duplication with the live chip row.
-export function buildPlexActiveFilters(
-  filters: PlexFilters,
-  show: string,
-  patch: (p: Partial<PlexFilters>) => void,
-  setShow: (s: string) => void,
-  t: TFn,
-  /** Collection titles for the chip labels, resolved beyond what the filter state carries. Omitted by
-   *  the saved-views manager, which describes a stored view and has only the captured titles. */
-  collectionTitles?: Record<string, string>,
-  /** The missing titles are still loading: their chips show a placeholder, not the generic word. */
-  collectionsPending = false,
-): ActiveFilter[] {
-  const out: ActiveFilter[] = [];
-
-  const has = (x: number | null | undefined) => x != null;
-
-  for (const g of filters.genres) {
-    out.push({
-      key: `genre:${g}`,
-      label: g,
-      remove: () => patch({ genres: filters.genres.filter((x) => x !== g) }),
-    });
-  }
-  for (const r of filters.contentRatings) {
-    out.push({
-      key: `contentRating:${r}`,
-      label: vocabI18nKey("certificate", r)
-        ? t(vocabI18nKey("certificate", r), { defaultValue: r })
-        : r,
-      remove: () => patch({ contentRatings: filters.contentRatings.filter((x) => x !== r) }),
-    });
-  }
-  if (has(filters.yearMin) || has(filters.yearMax)) {
-    const range =
-      has(filters.yearMin) && has(filters.yearMax)
-        ? `${filters.yearMin}–${filters.yearMax}`
-        : has(filters.yearMin)
-          ? `≥${filters.yearMin}`
-          : `≤${filters.yearMax}`;
-    out.push({
-      key: "year",
-      label: `${t("plex.filter.year")}: ${range}`,
-      remove: () => patch({ yearMin: null, yearMax: null }),
-    });
-  }
-  if (has(filters.ratingMin)) {
-    out.push({
-      key: "ratingMin",
-      label: `${t("plex.filter.rating")}: ≥${filters.ratingMin}`,
-      remove: () => patch({ ratingMin: null }),
-    });
-  }
-  if (has(filters.durationMin) || has(filters.durationMax)) {
-    const lo = has(filters.durationMin) ? Math.round(filters.durationMin! / 60) : null;
-    const hi = has(filters.durationMax) ? Math.round(filters.durationMax! / 60) : null;
-    const u = t("plex.filter.durationUnit");
-    const range =
-      lo != null && hi != null ? `${lo}–${hi} ${u}` : lo != null ? `≥${lo} ${u}` : `≤${hi} ${u}`;
-    out.push({
-      key: "duration",
-      label: `${t("plex.filter.duration")}: ${range}`,
-      remove: () => patch({ durationMin: null, durationMax: null }),
-    });
-  }
-  if (filters.addedWithin) {
-    out.push({
-      key: "added",
-      label: `${t("plex.filter.added")}: ${t("plex.filter.addedOpt." + filters.addedWithin)}`,
-      remove: () => patch({ addedWithin: "" }),
-    });
-  }
-  for (const d of filters.directors) {
-    out.push({
-      key: `director:${d}`,
-      label: d,
-      remove: () => patch({ directors: filters.directors.filter((x) => x !== d) }),
-    });
-  }
-  for (const a of filters.actors) {
-    out.push({
-      key: `actor:${a}`,
-      label: a,
-      remove: () => patch({ actors: filters.actors.filter((x) => x !== a) }),
-    });
-  }
-  for (const s of filters.studios) {
-    out.push({
-      key: `studio:${s}`,
-      label: s,
-      remove: () => patch({ studios: filters.studios.filter((x) => x !== s) }),
-    });
-  }
-  for (const p of filters.playable) {
-    out.push({
-      key: `playable:${p}`,
-      label: t(`plex.filter.playableOpt.${p}`),
-      remove: () => patch({ playable: filters.playable.filter((x) => x !== p) }),
-    });
-  }
-  for (const k of filters.keywords) {
-    out.push({
-      key: `keyword:${k}`,
-      label: k,
-      remove: () => patch({ keywords: filters.keywords.filter((x) => x !== k) }),
-    });
-  }
-  out.push(...collectionChips(filters, patch, t, collectionTitles, collectionsPending));
-  if (show !== "all") {
-    out.push({
-      key: "show",
-      label: t("plex.filter.showOpt." + show),
-      remove: () => setShow("all"),
-    });
-  }
-  return out;
-}
-
 // The one "reset every Plex narrowing" callback, shared by the sidebar's Clear-filters and the chip
 // row's Clear-all so the two can't drift: expanded filters + watch-state + sort all go back to default.
 export function usePlexClearFilters(): () => void {
@@ -165,30 +43,3 @@ export function usePlexClearFilters(): () => void {
     setSort(PLEX_SORT_FALLBACK);
   };
 }
-
-// One chip per selected collection, named by the resolved titles (a placeholder while a link's titles
-// load), else by the ones the state carries, else the generic word.
-function collectionChips(
-  filters: PlexFilters,
-  patch: (p: Partial<PlexFilters>) => void,
-  t: TFn,
-  collectionTitles: Record<string, string> | undefined,
-  pending: boolean,
-): ActiveFilter[] {
-  return filters.collections.map((c) => ({
-    key: `collection:${c}`,
-    label: collectionTitles?.[c] ?? filters.collectionTitles?.[c] ?? t("plex.filter.collection"),
-    pending: pending && collectionTitles?.[c] === undefined,
-    // Prune the title too — collectionTitles is hashed into the plex query keys, so a stale entry
-    // splits the cache from the logically-identical no-collection state (mirrors CollectionPicker).
-    // Collapse an empty map back to undefined so the last-removed state key-matches the pristine
-    // one (an empty `{}` still hashes differently from an absent key).
-    remove: () => {
-      const { [c]: _drop, ...restTitles } = filters.collectionTitles ?? {};
-      patch({
-        collections: filters.collections.filter((x) => x !== c),
-        collectionTitles: Object.keys(restTitles).length ? restTitles : undefined,
-      });
-    },
-  }));
-}
diff --git a/frontend/src/modules/settings/ApiTokens.tsx b/frontend/src/modules/settings/ApiTokens.tsx
index 12bbe51b..7b629e90 100644
--- a/frontend/src/modules/settings/ApiTokens.tsx
+++ b/frontend/src/modules/settings/ApiTokens.tsx
@@ -18,7 +18,7 @@ import { compareText } from "../../lib/collate";
 import { formatDate } from "../../lib/format";
 import { navItemAttrs } from "../../lib/listNav";
 import { useConfirm } from "../../components/ui/confirmContext";
-import { folderIcon, folderLabel, takesUploads } from "../files";
+import { folderIcon, folderLabel, takesUploads } from "../../features/folders/fileFolders";
 import { type ActionMenuItem } from "../../components/ui/ActionMenu";
 import { Badge } from "../../components/ui/Badge";
 import { Button } from "../../components/ui/Button";
diff --git a/frontend/src/shell/App.tsx b/frontend/src/shell/App.tsx
index dcc537fc..b3cbd6de 100644
--- a/frontend/src/shell/App.tsx
+++ b/frontend/src/shell/App.tsx
@@ -11,13 +11,7 @@ import { useEntryParams } from "./useEntryParams";
 import { useAccessRequestsNudge } from "./useAccessRequestsNudge";
 import { useVerifyEntry } from "../lib/useVerifyEntry";
 import { useNavigation, useNavigationActions } from "../features/navigation/navigationContext";
-import {
-  useFeedFilters,
-  useFeedFiltersActions,
-  useFeedView,
-  useFeedViewActions,
-  ChannelPage,
-} from "../modules/feed";
+import { useFeedScrollKey, ChannelPage } from "../modules/feed";
 import { moduleDef, pageTitleKey } from "../features/navigation/moduleRegistry";
 import { LoadingState } from "../components/ui/QueryState";
 // Persistent shell — always mounted, so eagerly imported.
@@ -51,22 +45,16 @@ const ReleaseNotes = lazy(() => import("./ReleaseNotes"));
 
 export default function App() {
   const { t, i18n } = useTranslation();
-  const { page, channelView, ytSearch } = useNavigation();
+  const { page, channelView } = useNavigation();
   const { setPage } = useNavigationActions();
   // An emailed verification link is confirmed HERE, above the signed-in/signed-out branch below, so
   // it works in a browser that already holds a session. It used to be handled inside Welcome, which
   // that branch never renders when signed in — the token was silently dropped. Signed out, the
   // outcome goes to the auth card's banners; signed in, to the top-of-app bar.
   const verifyEntry = useVerifyEntry();
-  // The global feed filters live in FeedFiltersProvider (per-account persistence + the account-load
-  // effect + share-link capture all moved there). App reads them to hand to <Feed> and to the
-  // handlers that mutate the feed view (onShowInFeed, tag-click, the feed scrollKey).
-  const filters = useFeedFilters();
-  const { setFilters } = useFeedFiltersActions();
-  // The feed's view mode (card/row/tile density) lives in FeedViewProvider — server-synced, shared
-  // by the feed page and the channel page. App reads it only to hand to <Feed>/<ChannelPage>.
-  const view = useFeedView();
-  const { setView } = useFeedViewActions();
+  // The feed page restores its scroll by its own key (its filters, the live search); read always,
+  // used only while the feed is the page.
+  const feedScrollKey = useFeedScrollKey();
   const queryClient = useQueryClient();
   const [aboutOpen, setAboutOpen] = useState(false);
   const [notesOpen, setNotesOpen] = useState(false);
@@ -119,16 +107,9 @@ export default function App() {
   // preload failed), and like every loading state it stays invisible for a load that is quick anyway.
   const pageFallback = <LoadingState className="flex-1 justify-center" />;
 
-  // Scroll restore/reset key for the shared normal-page scroller (see PageScroller): the same
-  // page/feed-filters returns you to where you were (bug 1); a changed feed filter is a new key, so
-  // the fresh result set starts at the top (bug 3). `q` is normalised out so typing in the search
-  // box doesn't reset the scroll on every keystroke; the live-YouTube sub-view gets its own key.
-  const normalScrollKey =
-    page !== "feed"
-      ? `page:${page}`
-      : ytSearch != null
-        ? `yt:${ytSearch}`
-        : `feed:${JSON.stringify({ ...filters, q: "" })}`;
+  // Scroll restore/reset key for the shared normal-page scroller (see PageScroller): the same page
+  // returns you to where you were; the feed keys it by its filters (useFeedScrollKey).
+  const normalScrollKey = page === "feed" ? feedScrollKey : `page:${page}`;
 
   // The module registry drives the render from `page` alone — no per-page chrome conditionals. A page
   // the account can't reach never gets here: the navigation state already moved it to the feed
@@ -168,23 +149,6 @@ export default function App() {
                 channelId={channelView.id}
                 initialName={channelView.name}
                 me={me!}
-                view={view}
-                setView={setView}
-                onShowInFeed={() => {
-                  // Keep the rest of the feed's filters — the point is "this channel, the way I
-                  // normally read": unwatched, my tags, my date window.
-                  // ADD to the picked set, don't replace it: channels OR together now, so arriving
-                  // from a second channel page should widen the feed, not silently drop the first.
-                  // Deduped — clicking it again for a channel already picked is a no-op.
-                  setFilters({
-                    ...filters,
-                    channelIds: [...new Set([...filters.channelIds, channelView.id])],
-                  });
-                  // setPage already leaves an open channel page and pushes a clean history entry.
-                  // Calling closeChannel() first ran history.back(), whose popstate landed AFTER this
-                  // and restored whatever page the channel had been opened from.
-                  setPage("feed");
-                }}
               />
             </Suspense>
           </PageShell>
diff --git a/frontend/src/watchEntry.contract.test.ts b/frontend/src/watchEntry.contract.test.ts
index 229e7ee5..add314b3 100644
--- a/frontend/src/watchEntry.contract.test.ts
+++ b/frontend/src/watchEntry.contract.test.ts
@@ -18,13 +18,19 @@ const FORBIDDEN: Record<string, string> = {
   i18next: "the app's i18n runtime",
   "react-i18next": "the app's i18n runtime",
   "@tanstack/react-query": "the app's data layer",
-  "src/App.tsx": "the app shell",
   "src/main.tsx": "the app's entry",
   "src/lib/notifications.ts": "the app's notification center",
   "src/lib/logHooks.ts": "the app's client-log wiring",
   "flag-icons": "the app's flag sprites",
   [DYNAMIC]: "an import() of a computed path — no walk can say what it loads",
 };
+// …and the app's layers above the platform, by folder, so a file moved or added inside one is still
+// forbidden (a single path to the shell's App went stale when App moved).
+const FORBIDDEN_DIRS: Record<string, string> = {
+  "src/shell/": "the app shell",
+  "src/modules/": "an app page",
+  "src/features/": "the app's shared features",
+};
 
 function resolveSpec(from: string, spec: string): string | null {
   if (spec === DYNAMIC) return DYNAMIC;
@@ -100,6 +106,9 @@ describe("the /watch entry", () => {
     const leaks = Object.keys(FORBIDDEN)
       .filter((mod) => seen.has(mod))
       .map((mod) => `${FORBIDDEN[mod]}: ${chain(seen, mod)}`);
+    for (const mod of seen.keys())
+      for (const [dir, what] of Object.entries(FORBIDDEN_DIRS))
+        if (mod.startsWith(dir)) leaks.push(`${what}: ${chain(seen, mod)}`);
     expect(leaks).toEqual([]);
   });
 
@@ -109,6 +118,7 @@ describe("the /watch entry", () => {
     const app = reach(join(SRC, "main.tsx"));
     expect(app.has("src/i18n/index.ts")).toBe(true);
     expect(app.has("src/components/legal/Terms.tsx")).toBe(true);
+    expect([...app.keys()].some((m) => m.startsWith("src/shell/"))).toBe(true);
   });
 
   it("serves the same head as the app's page, so the server's OG block lands the same way", () => {