@sensiblestats/widget-react 0.60.0 → 0.60.2

package/dist/index.js

@@ -138,6 +138,18 @@ var STRINGS = {
       alreadyPlayedTitle: "Played today",
       guess: "Guess",
       formatDayTime: (iso) => new Intl.DateTimeFormat("en-GB", { weekday: "short", hour: "2-digit", minute: "2-digit" }).format(new Date(iso)),
+      titles: {
+        "mystery-tiger": "Mystery Player",
+        "daily-quiz": "Daily Quiz",
+        "career-path": "Career Path",
+        "beat-the-grid": "Beat the Grid",
+        "guess-the-xi": "Guess the XI",
+        "higher-or-lower": "Higher or Lower",
+        "matchday-predictor": "Matchday Predictor",
+        "starting-xi": "Starting XI",
+        "stat-ladder": "Stat Ladder",
+        "fan-motm": "Fan MOTM"
+      },
       taglines: {
         "mystery-tiger": "One player. Six guesses.",
         "higher-or-lower": "Who had more?",
@@ -421,6 +433,18 @@ var STRINGS = {
       alreadyPlayedTitle: "Bug\xFCn oynad\u0131n",
       guess: "Tahmin",
       formatDayTime: (iso) => new Intl.DateTimeFormat("tr-TR", { weekday: "short", hour: "2-digit", minute: "2-digit" }).format(new Date(iso)),
+      titles: {
+        "mystery-tiger": "Gizemli Oyuncu",
+        "daily-quiz": "G\xFCn\xFCn Testi",
+        "career-path": "Kariyer Yolu",
+        "beat-the-grid": "Tabloyu Tamamla",
+        "guess-the-xi": "Bu 11 Kimin?",
+        "higher-or-lower": "Fazla m\u0131, Az m\u0131?",
+        "matchday-predictor": "Skor Tahmini",
+        "starting-xi": "\u0130lk 11 Tahmini",
+        "stat-ladder": "\u0130statistik Merdiveni",
+        "fan-motm": "Ma\xE7\u0131n Oyuncusu"
+      },
       taglines: {
         "mystery-tiger": "Bir oyuncu. Alt\u0131 tahmin.",
         "higher-or-lower": "Kimin daha fazlas\u0131 var?",
@@ -2150,6 +2174,7 @@ function useLeaderboard(conversation, { activeTab }) {
     void doFetch();
     return () => {
       active = false;
+      inFlightRef.current = false;
     };
   }, [activeTab, refreshCount]);
   const refresh = useCallback5(() => {
@@ -4385,23 +4410,11 @@ function GamesLoginWall({ ui }) {
 import { useEffect as useEffect13, useState as useState22 } from "react";
 
 // src/components/games/ui/gameMeta.ts
-var GAME_TITLES = {
-  "mystery-tiger": "Mystery Tiger",
-  "daily-quiz": "Daily Quiz",
-  "career-path": "Career Path",
-  "beat-the-grid": "Beat the Grid",
-  "guess-the-xi": "Guess the XI",
-  "higher-or-lower": "Higher or Lower",
-  "matchday-predictor": "Matchday Predictor",
-  "starting-xi": "Starting XI",
-  "stat-ladder": "Stat Ladder",
-  "fan-motm": "Fan MOTM"
-};
 function prettifyGameId(gameId) {
   return gameId.split("-").map((w) => w ? w[0].toUpperCase() + w.slice(1) : w).join(" ");
 }
-function gameTitle(g) {
-  return g.title ?? GAME_TITLES[g.gameId] ?? prettifyGameId(g.gameId);
+function gameTitle(g, titles) {
+  return g.title ?? titles[g.gameId] ?? prettifyGameId(g.gameId);
 }
 function splitName(full) {
   const parts = full.trim().split(/\s+/).filter(Boolean);
@@ -4534,7 +4547,7 @@ var DISABLED = /* @__PURE__ */ new Set(["locked", "voided"]);
 function GameTile({ game, onOpen, ui, variant = "tile" }) {
   const status = tileStatus(game, ui);
   const disabled = DISABLED.has(game.status);
-  const title = gameTitle(game);
+  const title = gameTitle(game, ui.games.titles);
   const body = variant === "hero" ? /* @__PURE__ */ jsxs49(Fragment9, { children: [
     /* @__PURE__ */ jsxs49("span", { className: "ss-g-hero-text", children: [
       /* @__PURE__ */ jsx56("span", { className: "ss-g-hero-eyebrow", children: ui.games.dailyChallenge }),
@@ -5069,7 +5082,7 @@ function MysteryTigerGame({
     /* @__PURE__ */ jsx67(
       GameHeader,
       {
-        title: gameTitle({ gameId: "mystery-tiger" }),
+        title: gameTitle({ gameId: "mystery-tiger" }, ui.games.titles),
         eyebrow: t.eyebrow,
         right: headerRight,
         onBack,
@@ -5241,7 +5254,7 @@ function HigherOrLowerGame({
     /* @__PURE__ */ jsx68(
       GameHeader,
       {
-        title: gameTitle({ gameId: "higher-or-lower" }),
+        title: gameTitle({ gameId: "higher-or-lower" }, ui.games.titles),
         eyebrow: t.eyebrow(POINTS_PER_CORRECT),
         right: config ? /* @__PURE__ */ jsx68(StatStack, { value: runLength, label: t.streak }) : void 0,
         onBack,
@@ -5342,7 +5355,7 @@ function CareerPathGame({
   ui
 }) {
   const s = ui.games.careerPath;
-  const title = gameTitle({ gameId: "career-path" });
+  const title = gameTitle({ gameId: "career-path" }, ui.games.titles);
   const [query, setQuery] = useState27("");
   const inputId = useId3();
   const clientState = parseClientState3(result?.clientStateJson);
@@ -5592,7 +5605,7 @@ function BeatTheGridGame({
   playerPool
 }) {
   const s = ui.games.beatTheGrid;
-  const title = gameTitle({ gameId: "beat-the-grid" });
+  const title = gameTitle({ gameId: "beat-the-grid" }, ui.games.titles);
   const [activeCell, setActiveCell] = useState28(null);
   const clientState = parseClientState4(result?.clientStateJson);
   const filledCells = clientState?.cells ?? [];
@@ -5846,7 +5859,7 @@ function GuessTheXiGame({
     /* @__PURE__ */ jsx73(
       GameHeader,
       {
-        title: gameTitle({ gameId: "guess-the-xi" }),
+        title: gameTitle({ gameId: "guess-the-xi" }, ui.games.titles),
         eyebrow: config?.poolLabel,
         right: formation ? /* @__PURE__ */ jsx73(Chip, { variant: "accent", children: formation }) : void 0,
         onBack,
@@ -5967,7 +5980,7 @@ function DailyQuizGame({
   ui
 }) {
   const s = ui.games.dailyQuiz;
-  const title = gameTitle({ gameId: "daily-quiz" });
+  const title = gameTitle({ gameId: "daily-quiz" }, ui.games.titles);
   const [selections, setSelections] = useState30(/* @__PURE__ */ new Map());
   const [page, setPage] = useState30(0);
   const clientState = parseClientState6(result?.clientStateJson);
@@ -6183,7 +6196,7 @@ function MatchdayPredictorGame({
   const header = /* @__PURE__ */ jsx75(
     GameHeader,
     {
-      title: gameTitle({ gameId: "matchday-predictor" }),
+      title: gameTitle({ gameId: "matchday-predictor" }, ui.games.titles),
       eyebrow: config ? t.eyebrow(config.homeTeam.name, config.awayTeam.name) : void 0,
       right: config ? /* @__PURE__ */ jsx75(Chip, { icon: /* @__PURE__ */ jsx75(IconLock, {}), children: ui.games.formatDayTime(config.kickoffUtc) }) : void 0,
       onBack,
@@ -6397,7 +6410,7 @@ function StartingXiGame({
   const header = /* @__PURE__ */ jsx76(
     GameHeader,
     {
-      title: gameTitle({ gameId: "starting-xi" }),
+      title: gameTitle({ gameId: "starting-xi" }, ui.games.titles),
       eyebrow: t.eyebrow,
       right: /* @__PURE__ */ jsx76(Chip, { variant: "accent", children: t.perStarter(POINTS_PER_STARTER) }),
       onBack,
@@ -6572,7 +6585,7 @@ function StatLadderGame({
   const searchId = useId8();
   const clientState = parseClientState9(result?.clientStateJson);
   const revealed = clientState != null;
-  const header = /* @__PURE__ */ jsx77(GameHeader, { title: gameTitle({ gameId: "stat-ladder" }), eyebrow: t.eyebrow, onBack, backLabel: ui.back });
+  const header = /* @__PURE__ */ jsx77(GameHeader, { title: gameTitle({ gameId: "stat-ladder" }, ui.games.titles), eyebrow: t.eyebrow, onBack, backLabel: ui.back });
   if (!config) {
     return /* @__PURE__ */ jsxs65("div", { className: "ss-g-screen", "data-testid": "game-screen-stat-ladder", children: [
       header,
@@ -6769,6 +6782,7 @@ function safeParseConfig(json) {
 function GameScreenHost({
   selected,
   onBack,
+  onPlayed,
   conversation,
   ui
 }) {
@@ -6812,7 +6826,11 @@ function GameScreenHost({
   const sharedProps = {
     result,
     submitting,
-    onSubmit: submit,
+    // Refresh only after the play is saved: a fan can tap Back while a submit is still in flight,
+    // and a refetch fired from Back alone would read the hub's pre-play state.
+    onSubmit: (answerJson) => {
+      void submit(answerJson).then(() => onPlayed?.());
+    },
     ui,
     onBack,
     lockAtUtc
@@ -6903,7 +6921,7 @@ function GameScreenHost({
           }
         );
       default:
-        return /* @__PURE__ */ jsx79("div", { className: "ss-g-screen", "data-testid": `game-screen-${gameId}`, children: /* @__PURE__ */ jsx79(GameHeader, { title: gameTitle({ gameId }), onBack, backLabel: ui.back }) });
+        return /* @__PURE__ */ jsx79("div", { className: "ss-g-screen", "data-testid": `game-screen-${gameId}`, children: /* @__PURE__ */ jsx79(GameHeader, { title: gameTitle({ gameId }, ui.games.titles), onBack, backLabel: ui.back }) });
     }
   }
   return /* @__PURE__ */ jsx79("div", { className: "ss-w-gscreen", "data-testid": "gscreen", "data-lock-at": lockAtUtc ?? void 0, children: renderScreen() });
@@ -6929,7 +6947,8 @@ function GamesPanel({
   games,
   ui,
   conversation,
-  leaderboard
+  leaderboard,
+  refreshHub
 }) {
   const [selected, setSelected] = useState35(null);
   useEffect16(() => {
@@ -6941,7 +6960,11 @@ function GamesPanel({
       GameScreenHost,
       {
         selected,
-        onBack: () => setSelected(null),
+        onBack: () => {
+          setSelected(null);
+          refreshHub?.();
+        },
+        onPlayed: refreshHub,
         conversation: conversation ?? null,
         ui
       }
@@ -7191,7 +7214,20 @@ function ChatPanel({ controller, ui, slip, onDashboardTap, monitor, discovery, g
     monitor && discovery && monitor.activeTab === "today" && /* @__PURE__ */ jsx85(TodayPanel, { discovery, ui, monitor }),
     monitor && monitor.activeTab === "following" && /* @__PURE__ */ jsx85(MatchesPanel, { monitor, ui, slip }),
     monitor && monitor.activeTab === "odds" && /* @__PURE__ */ jsx85(OddsPanel, { monitor, ui, slip }),
-    monitor && monitor.activeTab === "games" && gamesResult && /* @__PURE__ */ jsx85(GamesPanel, { loggedIn: !!loggedIn, games: gamesResult.games, ui, conversation, leaderboard: leaderboardResult?.data ?? null }),
+    monitor && monitor.activeTab === "games" && gamesResult && /* @__PURE__ */ jsx85(
+      GamesPanel,
+      {
+        loggedIn: !!loggedIn,
+        games: gamesResult.games,
+        ui,
+        conversation,
+        leaderboard: leaderboardResult?.data ?? null,
+        refreshHub: () => {
+          gamesResult.refresh();
+          leaderboardResult?.refresh();
+        }
+      }
+    ),
     monitor && monitor.activeTab === "leaderboard" && leaderboardResult && /* @__PURE__ */ jsx85(
       LeaderboardPanel,
       {