fix(plex): resolve deep-review findings on the filter-bar overhaul

Self-review of the branch diff (feature/plex-filter-bar-overhaul) against main:

- Surprise rail query key omitted `lang` while the backend /surprise now filters
  against the language-specific genre column → a HU/EN switch under an active genre
  filter left the rail stale. Key it by scope+lang+filters, matching plexDiscover.
- Chip-removing a collection left its entry in `collectionTitles` (hashed into the
  plex query keys), splitting the cache from the pristine no-collection state and
  growing the titles map unboundedly. Prune the title on remove, like CollectionPicker.
- The saved-views default-mirror effect gained `cfg` in its deps (re-memoized on every
  live filter edit) → a synchronous localStorage write per keystroke. Depend on the
  module-stable mirror fn instead.
- Collections-browse search input had no accessible name (placeholder only). Add
  aria-label + type="search".
- Extract the tile hue-hash + gradient duplicated between PlexDiscover and
  plexBrowseLists into a shared lib/hueTile so the two surfaces can't drift.
- Document migration 0073 downgrade() as lossy and de-dup non-feed rows before
  recreating the narrow (user_id, name) constraint (verified by the drift test).
- Add unit tests for coercePlexFilters (legacy single-collection migration) and
  plexFiltersSignature (order-independence, title-ignoring).

Gate: tsc/lint/knip/prettier clean, 410 vitest; backend ruff + migration drift +
saved-views tests green.
This commit is contained in:
2026-08-23 01:39:29 +02:00
parent a20e27800c
commit b7a4eaff8d
8 changed files with 110 additions and 29 deletions
+4 -10
View File
@@ -4,6 +4,7 @@ import { useQuery } from "@tanstack/react-query";
import { Layers, ListMusic } from "lucide-react";
import { qk } from "../lib/queryKeys";
import { api } from "../lib/api";
import { hueOf, hueTileGradient } from "../lib/hueTile";
import { useDebounced } from "../lib/useDebounced";
import { LoadingState, StateMessage } from "./QueryState";
@@ -13,13 +14,6 @@ import { LoadingState, StateMessage } from "./QueryState";
// union), so this is a pure front-end surface. Tiles are coloured by a title hash (no per-item art to
// fetch/proxy), matching the Discover genre tiles.
// A stable, pleasant hue per title string — same idea as PlexDiscover's genre tiles.
function hueOf(name: string): number {
let h = 0;
for (let i = 0; i < name.length; i++) h = (h * 31 + name.charCodeAt(i)) % 360;
return h;
}
function Tile({
title,
count,
@@ -38,9 +32,7 @@ function Tile({
onClick={onClick}
title={title}
className="glass-hover group relative flex h-28 flex-col justify-end overflow-hidden rounded-xl p-3 text-left transition"
style={{
background: `linear-gradient(135deg, hsl(${hue} 55% 32%), hsl(${(hue + 40) % 360} 60% 22%))`,
}}
style={{ background: hueTileGradient(hue) }}
>
<span className="absolute right-2 top-2 text-white/70">{icon}</span>
<span className="line-clamp-2 text-sm font-semibold text-white drop-shadow">{title}</span>
@@ -98,9 +90,11 @@ export function PlexCollectionsBrowse({ onPick }: { onPick: (id: string, title:
return (
<div>
<input
type="search"
value={search}
onChange={(e) => setSearch(e.target.value)}
placeholder={t("plex.filter.collectionSearch")}
aria-label={t("plex.filter.collectionSearch")}
className="glass-card mb-4 w-full max-w-sm rounded-lg px-3 py-1.5 text-sm focus:outline-hidden focus:ring-2 focus:ring-accent/40"
/>
{q.isError && !q.data ? (