fix(plex): a reshuffle survives a refresh landing mid-deal; the ↻ spins for a deal only

The ↻ intent was spent as its fetch set out, so a watched toggle's resync cancelling that fetch re-ran it as a re-read of the old draw. It now lasts until the latest deal answers. The button spun on every re-read of the same titles; it now follows the deal. Comments that said the Surprise draw is never refetched are brought in line.

frontend/src/components/PlexDiscover.tsx

@@ -1,4 +1,4 @@
-import { useRef, type ReactNode } from "react";
+import { useRef, useState, type ReactNode } from "react";
 import { useTranslation } from "react-i18next";
 import { useQuery, useQueryClient } from "@tanstack/react-query";
 import { RotateCcw } from "lucide-react";
@@ -125,22 +125,31 @@ export default function PlexDiscover({
   // page. So a refetch reads the draw on screen again (`keep`: fresh watch state, same titles), and
   // only the ↻ deals — handing over that draw, so a small filtered pool deals its other titles first.
   const surpriseKey = qk.plexSurprise(scope, lang, filters);
+  // The ↻ stands until ITS deal answers, not until the fetch sets out: a refresh of the rails landing
+  // mid-deal (a watched toggle's resync) cancels that fetch and runs this one again, which read the
+  // spent flag and handed back the old draw. Only the latest deal ends it, so the cancelled one's late
+  // answer does not stop the spinner of the deal that replaced it.
   const redraw = useRef(false);
+  const lastDeal = useRef<Promise<unknown> | null>(null);
+  const [dealing, setDealing] = useState(false);
   const surpriseQ = useQuery({
     queryKey: surpriseKey,
     queryFn: () => {
       const shown = (qc.getQueryData<{ items: PlexCard[] }>(surpriseKey)?.items ?? []).map(
         (c) => c.id,
       );
-      const deal = redraw.current || shown.length === 0;
-      redraw.current = false;
-      return api.plexSurprise(
-        scope,
-        undefined,
-        filters,
-        lang,
-        deal ? { exclude: shown } : { keep: shown },
-      );
+      if (!redraw.current && shown.length > 0) {
+        return api.plexSurprise(scope, undefined, filters, lang, { keep: shown });
+      }
+      const deal = api.plexSurprise(scope, undefined, filters, lang, { exclude: shown });
+      lastDeal.current = deal;
+      const done = () => {
+        if (lastDeal.current !== deal) return;
+        redraw.current = false;
+        setDealing(false);
+      };
+      void deal.then(done, done);
+      return deal;
     },
     // Kept past the default five minutes unobserved: a film watched from the rail outlasts that, and
     // a collected draw is a new one.
@@ -148,6 +157,7 @@ export default function PlexDiscover({
   });
   const reshuffle = () => {
     redraw.current = true;
+    setDealing(true);
     void surpriseQ.refetch();
   };
 
@@ -180,8 +190,8 @@ export default function PlexDiscover({
         );
         setSurpriseStatus(card, next);
       },
-      // The resync below leaves the Surprise rail alone (a refetch would reshuffle it), so a failed
-      // toggle was left flipped there — put back in place instead.
+      // The resync below re-reads the Surprise draw too, but only once the write has answered: a
+      // refused toggle is put back at once rather than left flipped until that read lands.
       revert: () => setSurpriseStatus(card, card.status),
       resync: () => {
         qc.invalidateQueries({ queryKey: qk.plexDiscover() });
@@ -255,7 +265,9 @@ export default function PlexDiscover({
           action={
             <IconButton
               onClick={reshuffle}
-              loading={surpriseQ.isFetching}
+              // A deal, not any fetch: a refresh re-reads the same titles, and a spinning ↻ promised a
+              // new draw that never came.
+              loading={dealing}
               label={t("plex.discover.reshuffle")}
             >
               <RotateCcw />