@sensiblestats/widget-react 0.60.0 → 0.60.2

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @sensiblestats/widget-react
 
+## 0.60.2
+
+### Patch Changes
+
+- Games hub refreshes today's points, tile status, streak and rank as soon as a fan returns from a game, instead of waiting for the 60-second poll or a tab switch.
+
+## 0.60.1
+
+### Patch Changes
+
+- Localize game display names for Turkish operators; rename mystery-tiger display name to Mystery Player
+
 ## 0.60.0
 
 ### Minor Changes

package/dist/index.cjs

@@ -175,6 +175,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?",
@@ -458,6 +470,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?",
@@ -2187,6 +2211,7 @@ function useLeaderboard(conversation, { activeTab }) {
     void doFetch();
     return () => {
       active = false;
+      inFlightRef.current = false;
     };
   }, [activeTab, refreshCount]);
   const refresh = (0, import_react7.useCallback)(() => {
@@ -4422,23 +4447,11 @@ function GamesLoginWall({ ui }) {
 var import_react28 = require("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);
@@ -4571,7 +4584,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__ */ (0, import_jsx_runtime56.jsxs)(import_jsx_runtime56.Fragment, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("span", { className: "ss-g-hero-text", children: [
       /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "ss-g-hero-eyebrow", children: ui.games.dailyChallenge }),
@@ -5106,7 +5119,7 @@ function MysteryTigerGame({
     /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
       GameHeader,
       {
-        title: gameTitle({ gameId: "mystery-tiger" }),
+        title: gameTitle({ gameId: "mystery-tiger" }, ui.games.titles),
         eyebrow: t.eyebrow,
         right: headerRight,
         onBack,
@@ -5278,7 +5291,7 @@ function HigherOrLowerGame({
     /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
       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__ */ (0, import_jsx_runtime68.jsx)(StatStack, { value: runLength, label: t.streak }) : void 0,
         onBack,
@@ -5379,7 +5392,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] = (0, import_react33.useState)("");
   const inputId = (0, import_react33.useId)();
   const clientState = parseClientState3(result?.clientStateJson);
@@ -5629,7 +5642,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] = (0, import_react34.useState)(null);
   const clientState = parseClientState4(result?.clientStateJson);
   const filledCells = clientState?.cells ?? [];
@@ -5883,7 +5896,7 @@ function GuessTheXiGame({
     /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
       GameHeader,
       {
-        title: gameTitle({ gameId: "guess-the-xi" }),
+        title: gameTitle({ gameId: "guess-the-xi" }, ui.games.titles),
         eyebrow: config?.poolLabel,
         right: formation ? /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(Chip, { variant: "accent", children: formation }) : void 0,
         onBack,
@@ -6004,7 +6017,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] = (0, import_react36.useState)(/* @__PURE__ */ new Map());
   const [page, setPage] = (0, import_react36.useState)(0);
   const clientState = parseClientState6(result?.clientStateJson);
@@ -6220,7 +6233,7 @@ function MatchdayPredictorGame({
   const header = /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
     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__ */ (0, import_jsx_runtime75.jsx)(Chip, { icon: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(IconLock, {}), children: ui.games.formatDayTime(config.kickoffUtc) }) : void 0,
       onBack,
@@ -6434,7 +6447,7 @@ function StartingXiGame({
   const header = /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
     GameHeader,
     {
-      title: gameTitle({ gameId: "starting-xi" }),
+      title: gameTitle({ gameId: "starting-xi" }, ui.games.titles),
       eyebrow: t.eyebrow,
       right: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(Chip, { variant: "accent", children: t.perStarter(POINTS_PER_STARTER) }),
       onBack,
@@ -6609,7 +6622,7 @@ function StatLadderGame({
   const searchId = (0, import_react39.useId)();
   const clientState = parseClientState9(result?.clientStateJson);
   const revealed = clientState != null;
-  const header = /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(GameHeader, { title: gameTitle({ gameId: "stat-ladder" }), eyebrow: t.eyebrow, onBack, backLabel: ui.back });
+  const header = /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(GameHeader, { title: gameTitle({ gameId: "stat-ladder" }, ui.games.titles), eyebrow: t.eyebrow, onBack, backLabel: ui.back });
   if (!config) {
     return /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("div", { className: "ss-g-screen", "data-testid": "game-screen-stat-ladder", children: [
       header,
@@ -6806,6 +6819,7 @@ function safeParseConfig(json) {
 function GameScreenHost({
   selected,
   onBack,
+  onPlayed,
   conversation,
   ui
 }) {
@@ -6849,7 +6863,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
@@ -6940,7 +6958,7 @@ function GameScreenHost({
           }
         );
       default:
-        return /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("div", { className: "ss-g-screen", "data-testid": `game-screen-${gameId}`, children: /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(GameHeader, { title: gameTitle({ gameId }), onBack, backLabel: ui.back }) });
+        return /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("div", { className: "ss-g-screen", "data-testid": `game-screen-${gameId}`, children: /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(GameHeader, { title: gameTitle({ gameId }, ui.games.titles), onBack, backLabel: ui.back }) });
     }
   }
   return /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("div", { className: "ss-w-gscreen", "data-testid": "gscreen", "data-lock-at": lockAtUtc ?? void 0, children: renderScreen() });
@@ -6966,7 +6984,8 @@ function GamesPanel({
   games,
   ui,
   conversation,
-  leaderboard
+  leaderboard,
+  refreshHub
 }) {
   const [selected, setSelected] = (0, import_react41.useState)(null);
   (0, import_react41.useEffect)(() => {
@@ -6978,7 +6997,11 @@ function GamesPanel({
       GameScreenHost,
       {
         selected,
-        onBack: () => setSelected(null),
+        onBack: () => {
+          setSelected(null);
+          refreshHub?.();
+        },
+        onPlayed: refreshHub,
         conversation: conversation ?? null,
         ui
       }
@@ -7228,7 +7251,20 @@ function ChatPanel({ controller, ui, slip, onDashboardTap, monitor, discovery, g
     monitor && discovery && monitor.activeTab === "today" && /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(TodayPanel, { discovery, ui, monitor }),
     monitor && monitor.activeTab === "following" && /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(MatchesPanel, { monitor, ui, slip }),
     monitor && monitor.activeTab === "odds" && /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(OddsPanel, { monitor, ui, slip }),
-    monitor && monitor.activeTab === "games" && gamesResult && /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(GamesPanel, { loggedIn: !!loggedIn, games: gamesResult.games, ui, conversation, leaderboard: leaderboardResult?.data ?? null }),
+    monitor && monitor.activeTab === "games" && gamesResult && /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
+      GamesPanel,
+      {
+        loggedIn: !!loggedIn,
+        games: gamesResult.games,
+        ui,
+        conversation,
+        leaderboard: leaderboardResult?.data ?? null,
+        refreshHub: () => {
+          gamesResult.refresh();
+          leaderboardResult?.refresh();
+        }
+      }
+    ),
     monitor && monitor.activeTab === "leaderboard" && leaderboardResult && /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
       LeaderboardPanel,
       {