refactor(frontend): honest effect deps in the app shell and the ui layer (E27 S2)

Burns the first 14 of the 113 hook suppressions. Three verdicts, applied per site:

A useEffect that should not exist (6):
- Avatar remembered "the image failed" as a boolean an effect reset on src change. The
  component is recycled across items in the virtualized feed, so after one avatar 429s the
  next item's slot committed the fallback initial over a perfectly good image and only the
  post-paint effect cleared it. The failure is now keyed BY URL; derived state cannot be stale.
- Combobox cleared the typed query from an effect on `open`. Moved into setOpenAnd, the single
  funnel every close goes through. That also stops a spurious onQueryChange("") AT MOUNT, which
  told a controlled caller its own initial query had been cleared before the user touched it.
- CommandPalette reset query + picked row from an effect. Closed now means UNMOUNTED, not
  hidden, so a fresh open starts blank because mounting already means that -- and the ranking
  memo over every channel, playlist and saved view stops running while the palette is shut.
- Pager's page box held a copy of the page that an effect re-synced; it now derives it and
  keeps a draft only while being edited.
- App's ?link= / ?oauth= / ?admin= one-shots asserted "once per mount" with an empty dep list.
  The ref guard the codebase already uses in 22 places ENFORCES it, so the honest deps can
  include `t` -- which a language switch legitimately changes, and which would otherwise have
  re-fired the toast.

Honest deps that also fix something (5):
- App's module preload was keyed on the account id, so a permission change that alters the
  module set without moving the id never re-preloaded. `preload()` is idempotent, so depending
  on `me` costs nothing.
- App's access-request nudge now re-issues on a language switch; it used to stay in the old
  language until the pending count changed.
- App's diagnostics effect: applyDiagnostics already no-ops on an unchanged effective level,
  so picking four fields out by hand was guarding nothing and missed any field added later.
- DataTable's two filter effects: a ref holds the latest onFiltersChange so commitFilters can
  be stable, which is what lets the effects name it instead of switching the check off.

Genuine escape hatches (7) moved OUT of eslint-suppressions.json into inline directives that
name the invariant at the site -- the toast handover's render-phase global, the live region's
deliberate arming tick, the docked one-slot component, the popover engine's floating-ui list
state, dnd-kit's per-drag `moved` flag, BackToTop's DOM read and the palette's debounced
announcement. A reader of the code now sees why; a JSON file no one opens does not.

Tests: Avatar (3, new file) and Pager (3) pin the derived-state frames with a layout-phase
probe -- layout effects run before any passive effect, so they read the frame the browser would
paint. Combobox (2) pins the close-clears-query contract and the no-callback-at-mount rule.
All three sets mutation-checked against the effect-based originals.

Suppressions 113 -> 99; exhaustive-deps 45 -> 35.

frontend/src/components/ui/DataTable.tsx

@@ -1,4 +1,4 @@
-import { useEffect, useRef, useState, type ReactNode } from "react";
+import { useCallback, useEffect, useRef, useState, type ReactNode } from "react";
 import { useTranslation } from "react-i18next";
 import { sortRows, cycleSort, type SortState } from "../../lib/columnSort";
 import Pager from "./Pager";
@@ -149,10 +149,19 @@ export default function DataTable<T>({
   // `filters` as a dep (which would re-run them on every filter change).
   const filtersRef = useRef(filters);
   filtersRef.current = filters;
-  const commitFilters = (next: FilterMap) => {
-    if (controlledFilters) onFiltersChange!(next);
-    else setInternalFilters(next);
-  };
+  // …and the same trick for the CALLBACK, one line further: a controlled caller almost always
+  // passes an inline arrow, so `onFiltersChange` is a fresh function on every render. Reading it
+  // through a ref is what lets `commitFilters` be stable, and a stable commitFilters is what lets
+  // the two effects below NAME it in their dep lists instead of switching the check off.
+  const onFiltersChangeRef = useRef(onFiltersChange);
+  onFiltersChangeRef.current = onFiltersChange;
+  const commitFilters = useCallback(
+    (next: FilterMap) => {
+      if (controlledFilters) onFiltersChangeRef.current!(next);
+      else setInternalFilters(next);
+    },
+    [controlledFilters],
+  );
 
   // Persist page/size always, but only the sort/filter slices this table actually OWNS — a controlled
   // caller persists those itself, so writing them here would just leave a stale, never-read duplicate.
@@ -169,12 +178,16 @@ export default function DataTable<T>({
     );
   }, [persistKey, controlledSort, controlledFilters, sort, filters, page, size]);
 
+  // Destructured so the deps are the values the body actually reads. `externalFilter` itself is an
+  // object literal at every call site, so depending on it would re-apply the filter — and reset the
+  // page — on every parent render.
+  const externalKey = externalFilter?.key;
+  const externalValue = externalFilter?.value;
   useEffect(() => {
-    if (!externalFilter) return;
-    commitFilters({ ...filtersRef.current, [externalFilter.key]: externalFilter.value });
+    if (externalKey === undefined || externalValue === undefined) return;
+    commitFilters({ ...filtersRef.current, [externalKey]: externalValue });
     setPage(0);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [externalFilter?.key, externalFilter?.value]);
+  }, [externalKey, externalValue, commitFilters]);
 
   // Clear column filters when the reset token advances. The ref starts at 0 (not at the prop)
   // so a navigation that bumped the token still clears even when it remounts this table fresh
@@ -186,8 +199,7 @@ export default function DataTable<T>({
     resetRef.current = resetFiltersToken;
     commitFilters({});
     setPage(0);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [resetFiltersToken]);
+  }, [resetFiltersToken, commitFilters]);
 
   const sorted = sortRows(filterRows(rows, columns, filters), columns, sort);