feat(plex): search cast & crew names + clickable person cards

Backend (migration 0046_plex_people_search): a new people_text column (cast +
director names, de-duped) is folded into the generated search_vector at weight B,
so the top search box finds titles by an actor/director name and ranks them above
summary-only mentions. New /api/plex/people endpoint returns the cast/crew matching
the term (name prefix or word-start) with a film count + a headshot (pulled from one
representative film's live metadata; image bytes disk-cached).

Frontend: PlexBrowse shows matching people as virtual cards above the grid; clicking
one adds them to the actor/director filter (multi-value, from the C1 work) and clears
the search box so you land on exactly that person's films. Answers the 'why does
"drew" match Rambo?' confusion — it was matching the word in the synopsis; now names
are searchable. i18n en/hu/de.

⚠️ Prod needs a Plex re-sync after deploy to populate people_text (search_vector
regenerates automatically once the column has data).

frontend/src/App.tsx

@@ -818,6 +818,7 @@ export default function App() {
           ) : page === "plex" && meQuery.data!.plex_enabled ? (
             <PlexBrowse
               q={filters.q}
+              onClearSearch={() => setFilters({ ...filters, q: "" })}
               library={plexLib}
               show={plexShowFilter}
               sort={plexSort}

frontend/src/components/PlexBrowse.tsx

@@ -2,7 +2,7 @@ import { lazy, Suspense, useEffect, useLayoutEffect, useRef, type CSSProperties
 import { useTranslation } from "react-i18next";
 import { useInfiniteQuery, useQuery, useQueryClient } from "@tanstack/react-query";
 import { ArrowLeft, CheckCircle2, Info, Play } from "lucide-react";
-import { api, type PlexCard, type PlexFilters } from "../lib/api";
+import { api, type PlexCard, type PlexFilters, type PlexPerson } from "../lib/api";
 import { useDebounced } from "../lib/useDebounced";
 import { useHistorySubview } from "../lib/history";
 
@@ -24,6 +24,7 @@ type Sub =
 
 type Props = {
   q: string;
+  onClearSearch: () => void;
   library: string;
   show: string;
   sort: string;
@@ -40,7 +41,7 @@ function dur(n?: number | null): string {
   return h ? `${h}h ${m}m` : `${m}m`;
 }
 
-export default function PlexBrowse({ q, library, show, sort, filters, setFilters }: Props) {
+export default function PlexBrowse({ q, onClearSearch, library, show, sort, filters, setFilters }: Props) {
   const { t } = useTranslation();
   const qc = useQueryClient();
   const dq = useDebounced(q.trim(), 350);
@@ -82,6 +83,21 @@ export default function PlexBrowse({ q, library, show, sort, filters, setFilters
   const items = browseQ.data?.pages.flatMap((p) => p.items) ?? [];
   const total = browseQ.data?.pages[0]?.total ?? 0;
 
+  // Cast/crew whose name matches the current search → virtual cards above the grid; clicking one
+  // adds that person to the filter. Only meaningful for movie libraries (the endpoint returns [] else).
+  const peopleQ = useQuery({
+    queryKey: ["plex-people", library, dq],
+    queryFn: () => api.plexPeople(library, dq),
+    enabled: !!library && dq.length >= 2 && sub.view.kind === "grid",
+  });
+  const people = peopleQ.data?.people ?? [];
+  function addPerson(p: PlexPerson) {
+    const key = p.kind === "director" ? "directors" : "actors";
+    const cur = filters[key];
+    if (!cur.includes(p.name)) setFilters({ ...filters, [key]: [...cur, p.name] });
+    onClearSearch(); // switch from the name search to the person filter (clears the search box)
+  }
+
   // Infinite scroll: auto-load the next page when the sentinel scrolls into view.
   const sentinel = useRef<HTMLDivElement>(null);
   const { hasNextPage, isFetchingNextPage, fetchNextPage } = browseQ;
@@ -162,6 +178,45 @@ export default function PlexBrowse({ q, library, show, sort, filters, setFilters
         {browseQ.isLoading ? " " : dq ? t("plex.searchCount", { count: total }) : t("plex.count", { count: total })}
       </p>
 
+      {/* Virtual person cards for a name search — click to add them to the filter. */}
+      {people.length > 0 && (
+        <div className="mb-4">
+          <p className="text-[11px] uppercase tracking-wide text-muted mb-2">{t("plex.people.match")}</p>
+          <div className="flex flex-wrap gap-2">
+            {people.map((p) => {
+              const added = (p.kind === "director" ? filters.directors : filters.actors).includes(p.name);
+              return (
+                <button
+                  key={`${p.kind}:${p.name}`}
+                  onClick={() => addPerson(p)}
+                  disabled={added}
+                  className={`flex items-center gap-2.5 rounded-xl border p-1.5 pr-3 text-left transition ${
+                    added ? "border-accent bg-accent/10" : "border-border bg-card hover:border-accent"
+                  }`}
+                >
+                  <div className="h-11 w-11 shrink-0 overflow-hidden rounded-full border border-border bg-surface">
+                    {p.photo ? (
+                      <img src={p.photo} alt="" className="h-full w-full object-cover" />
+                    ) : (
+                      <div className="grid h-full w-full place-items-center text-sm opacity-40">
+                        {p.name.charAt(0)}
+                      </div>
+                    )}
+                  </div>
+                  <div className="min-w-0">
+                    <div className="truncate text-sm font-medium">{p.name}</div>
+                    <div className="text-xs text-muted">
+                      {t(`plex.people.${p.kind}`)} · {t("plex.people.count", { count: p.count })}
+                      {added ? ` · ${t("plex.people.added")}` : ""}
+                    </div>
+                  </div>
+                </button>
+              );
+            })}
+          </div>
+        </div>
+      )}
+
       {browseQ.isLoading ? (
         <p className="text-muted text-sm">{t("plex.loading")}</p>
       ) : items.length === 0 ? (

frontend/src/i18n/locales/de/plex.json

@@ -49,6 +49,13 @@
   "markUnwatched": "Als ungesehen markieren",
   "seasons": "{{count}} Staffeln",
   "playerSoon": "Player kommt bald — „{{title}}“",
+  "people": {
+    "match": "Personen",
+    "actor": "Schauspieler",
+    "director": "Regie",
+    "count": "{{count}} Titel",
+    "added": "hinzugefügt"
+  },
   "player": {
     "loading": "Wird geladen…",
     "back": "Zurück",

frontend/src/i18n/locales/en/plex.json

@@ -49,6 +49,13 @@
   "markUnwatched": "Mark unwatched",
   "seasons": "{{count}} seasons",
   "playerSoon": "Player coming soon — “{{title}}”",
+  "people": {
+    "match": "People",
+    "actor": "Actor",
+    "director": "Director",
+    "count": "{{count}} titles",
+    "added": "added"
+  },
   "player": {
     "loading": "Loading…",
     "back": "Back",

frontend/src/i18n/locales/hu/plex.json

@@ -49,6 +49,13 @@
   "markUnwatched": "Nem-nézettnek jelöl",
   "seasons": "{{count}} évad",
   "playerSoon": "A lejátszó hamarosan jön — „{{title}}”",
+  "people": {
+    "match": "Személyek",
+    "actor": "Színész",
+    "director": "Rendező",
+    "count": "{{count}} cím",
+    "added": "hozzáadva"
+  },
   "player": {
     "loading": "Betöltés…",
     "back": "Vissza",

frontend/src/lib/api.ts

@@ -756,6 +756,12 @@ export function plexFilterCount(f: PlexFilters): number {
     f.studios.length
   );
 }
+export interface PlexPerson {
+  name: string;
+  kind: "actor" | "director";
+  count: number;
+  photo?: string | null;
+}
 export interface PlexFacets {
   genres: { value: string; count: number }[];
   content_ratings: { value: string; count: number }[];
@@ -1122,6 +1128,8 @@ export const api = {
   },
   plexFacets: (library: string): Promise<PlexFacets> =>
     req(`/api/plex/facets?library=${encodeURIComponent(library)}`),
+  plexPeople: (library: string, q: string): Promise<{ people: PlexPerson[] }> =>
+    req(`/api/plex/people?library=${encodeURIComponent(library)}&q=${encodeURIComponent(q)}`),
   plexShow: (id: string): Promise<PlexShowDetail> =>
     req(`/api/plex/show/${encodeURIComponent(id)}`),
   plexItem: (id: string): Promise<PlexItemDetail> =>

frontend/src/lib/releaseNotes.ts

@@ -14,6 +14,15 @@ export interface ReleaseEntry {
 }
 
 export const RELEASE_NOTES: ReleaseEntry[] = [
+  {
+    version: "0.27.0",
+    date: "2026-07-06",
+    summary: "Search Plex by cast & crew — find every film an actor or director is in, with clickable person cards.",
+    features: [
+      "Plex search: the top search box now matches cast and crew names, not just titles — search “drew” and Drew Barrymore's films come up first (ranked above films that merely mention the word).",
+      "Plex search: matching actors and directors appear as person cards (photo + how many titles) above the results — click one to filter the library to their films and add them to the sidebar filter.",
+    ],
+  },
   {
     version: "0.26.0",
     date: "2026-07-05",