@tastic/shell 0.2.0 → 0.2.1

package/dist/index.js

@@ -557,6 +557,7 @@ var styles = import_react_native2.StyleSheet.create({
 // src/screens/GameRoute.tsx
 var import_expo_router5 = require("expo-router");
 var import_react14 = require("react");
+var import_react_native5 = require("react-native");
 
 // src/routes.ts
 var playHref = (game) => ({ pathname: "/play/[game]", params: { game } });
@@ -1006,7 +1007,9 @@ function useResumePoint(gameId) {
   (0, import_react14.useEffect)(() => {
     if (!gameId) return;
     setLastActiveGame(gameId);
-    return clearLastActiveGame;
+    return () => {
+      if (import_react_native5.AppState.currentState === "active") clearLastActiveGame();
+    };
   }, [gameId, setLastActiveGame, clearLastActiveGame]);
 }
 
@@ -1018,7 +1021,7 @@ var import_chrome5 = require("@tastic/hud/chrome");
 var import_profile7 = require("@tastic/profile");
 var import_expo_router6 = require("expo-router");
 var import_react16 = require("react");
-var import_react_native5 = require("react-native");
+var import_react_native6 = require("react-native");
 var import_react_native_paper = require("react-native-paper");
 
 // src/hooks/useFrozenWhileHidden.ts
@@ -1124,9 +1127,9 @@ function HomeMenu() {
   const [settingsOpen, setSettingsOpen] = (0, import_react16.useState)(false);
   const [rulesGame, setRulesGame] = (0, import_react16.useState)(null);
   const isFocused = (0, import_expo_router6.useIsFocused)();
-  const [appState, setAppState] = (0, import_react16.useState)(import_react_native5.AppState.currentState);
+  const [appState, setAppState] = (0, import_react16.useState)(import_react_native6.AppState.currentState);
   (0, import_react16.useEffect)(() => {
-    const subscription = import_react_native5.AppState.addEventListener("change", setAppState);
+    const subscription = import_react_native6.AppState.addEventListener("change", setAppState);
     return () => subscription.remove();
   }, []);
   const heroActive = isFocused && appState === "active";
@@ -1161,20 +1164,20 @@ function HomeMenu() {
   const picker = /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_profile7.ProfilePicker, { idPrefix: SEAT_ONE_PICKER, host: pickerHost, profiles, selectedId: lastSelected[1], color: p1Drawn, dark, guestLabel: pack.guestLabel ?? "P1", nullLabel: pack.nullLabel, onSelect: (profile) => selectProfile(1, profile?.id ?? null), onManage: () => import_expo_router6.router.push(PROFILES_HREF), colorSection, alignOverride: pickerAlign, triggerStyle });
   const pressAway = /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_chrome5.PressAwayOverlay, { active: pickerHost.openId !== null, onPress: pickerHost.close, style: styles4.pressAway });
   const RulesSheet = rulesGame?.Rules;
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_react_native5.View, { style: [styles4.container, { backgroundColor: bg }], children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_react_native6.View, { style: [styles4.container, { backgroundColor: bg }], children: [
     /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_core12.FakeLandscapeView, { style: styles4.rotatable, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(RulesHost, { enabled: pack.games.some((game) => game.Rules), children: [
       isWide ? /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_jsx_runtime14.Fragment, { children: [
         pressAway,
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_auto_paper5.FadingScrollView, { style: [styles4.wideRightPane, { left: layout.paddingLeft + layout.leftPaneWidth + HOME_WIDE_PANE_GAP }], contentContainerStyle: { paddingTop: 16 + insets.top, paddingBottom: 16 + insets.bottom, paddingRight: layout.paddingRight }, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react_native5.View, { style: [styles4.grid, { width: layout.rightPaneWidth }], children: pack.games.map((game) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(GameTile, { game, width: layout.tileWidth, previewWidth: layout.previewWidth, previewRevealed: previewsRevealed, dark, p1Color, p2Color, onPress: () => openGame(game), onRules: hasRules(game) ? () => openRules(game) : void 0 }, game.id)) }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_react_native5.View, { style: [styles4.wideLeftPane, { left: layout.paddingLeft, width: layout.leftPaneWidth, paddingTop: HOME_TOP_BAND + insets.top, paddingBottom: 16 + insets.bottom }, pickerHost.openId !== null && styles4.pickerOpen], children: [
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_auto_paper5.FadingScrollView, { style: [styles4.wideRightPane, { left: layout.paddingLeft + layout.leftPaneWidth + HOME_WIDE_PANE_GAP }], contentContainerStyle: { paddingTop: 16 + insets.top, paddingBottom: 16 + insets.bottom, paddingRight: layout.paddingRight }, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react_native6.View, { style: [styles4.grid, { width: layout.rightPaneWidth }], children: pack.games.map((game) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(GameTile, { game, width: layout.tileWidth, previewWidth: layout.previewWidth, previewRevealed: previewsRevealed, dark, p1Color, p2Color, onPress: () => openGame(game), onRules: hasRules(game) ? () => openRules(game) : void 0 }, game.id)) }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_react_native6.View, { style: [styles4.wideLeftPane, { left: layout.paddingLeft, width: layout.leftPaneWidth, paddingTop: HOME_TOP_BAND + insets.top, paddingBottom: 16 + insets.bottom }, pickerHost.openId !== null && styles4.pickerOpen], children: [
           /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(pack.HeroTitle, { words: pack.wordmark, color: fg, p1Color, p2Color, active: heroActive, fit: layout.heroFit }),
-          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react_native5.View, { style: styles4.widePicker, children: picker })
+          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react_native6.View, { style: styles4.widePicker, children: picker })
         ] })
       ] }) : /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_auto_paper5.FadingScrollView, { style: styles4.scroll, contentContainerStyle: [styles4.content, { paddingTop: 56 + insets.top, paddingBottom: 24 + insets.bottom, paddingLeft: 16 + insets.left, paddingRight: 16 + insets.right }], children: [
         pressAway,
         /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(pack.HeroTitle, { words: pack.wordmark, color: fg, p1Color, p2Color, active: heroActive }),
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react_native5.View, { style: [styles4.picker, pickerHost.openId !== null && styles4.pickerOpen], children: picker }),
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react_native5.View, { style: styles4.list, children: pack.games.map((game) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(GameRow, { game, dark, p1Color, p2Color, previewRevealed: previewsRevealed, onPress: () => openGame(game), onRules: hasRules(game) ? () => openRules(game) : void 0 }, game.id)) })
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react_native6.View, { style: [styles4.picker, pickerHost.openId !== null && styles4.pickerOpen], children: picker }),
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react_native6.View, { style: styles4.list, children: pack.games.map((game) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(GameRow, { game, dark, p1Color, p2Color, previewRevealed: previewsRevealed, onPress: () => openGame(game), onRules: hasRules(game) ? () => openRules(game) : void 0 }, game.id)) })
       ] }),
       /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_feedback_press3.IconButton, { icon: "trophy", iconColor: fg, size: 24, style: [styles4.corner, { top: 8 + insets.top, left: 8 + insets.left }], onPress: () => import_expo_router6.router.push(STATS_HREF), accessibilityLabel: "Stats & Achievements" }),
       /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_feedback_press3.IconButton, { icon: "cog", iconColor: fg, size: 24, style: [styles4.corner, { top: 8 + insets.top, right: 8 + insets.right }], onPress: () => setSettingsOpen(true), accessibilityLabel: "Settings" }),
@@ -1197,10 +1200,10 @@ function GameRow({ game, dark, p1Color, p2Color, previewRevealed, onPress, onRul
   return (
     // The rules button sits beside the row's own button, laid over its end, not inside it: a button
     // inside a button is invalid on the web.
-    /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_react_native5.View, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_react_native6.View, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_feedback_press3.Pressable, { onPress, style: [styles4.row, { backgroundColor: well.bg }], accessibilityRole: "button", accessibilityLabel: game.title, children: [
-        game.Preview ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(PreviewBox, { game, width: ROW_PREVIEW_WIDTH, revealed: previewRevealed, dark, p1Color, p2Color }) : /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react_native5.View, { style: [styles4.rowIcon, { backgroundColor: dark ? ICON_DARK_BG : ICON_LIGHT_BG }], children: GameIcon && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(GameIcon, { size: ROW_ICON_SIZE, p1Color, p2Color, dark }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_react_native5.View, { style: styles4.rowText, children: [
+        game.Preview ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(PreviewBox, { game, width: ROW_PREVIEW_WIDTH, revealed: previewRevealed, dark, p1Color, p2Color }) : /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react_native6.View, { style: [styles4.rowIcon, { backgroundColor: dark ? ICON_DARK_BG : ICON_LIGHT_BG }], children: GameIcon && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(GameIcon, { size: ROW_ICON_SIZE, p1Color, p2Color, dark }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_react_native6.View, { style: styles4.rowText, children: [
           /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react_native_paper.Text, { variant: "titleLarge", style: [styles4.rowTitle, { color: well.fg }], numberOfLines: 1, children: game.title }),
           /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react_native_paper.Text, { variant: "bodyMedium", style: { color: well.fgMuted }, numberOfLines: 2, children: game.blurb })
         ] })
@@ -1211,7 +1214,7 @@ function GameRow({ game, dark, p1Color, p2Color, previewRevealed, onPress, onRul
 }
 function GameTile({ game, width, previewWidth, dark, p1Color, p2Color, previewRevealed, onPress, onRules }) {
   const well = (0, import_chrome5.useWellColors)();
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_react_native5.View, { style: { width }, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_react_native6.View, { style: { width }, children: [
     /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_feedback_press3.Pressable, { onPress, style: [styles4.tile, { backgroundColor: well.bg }], accessibilityRole: "button", accessibilityLabel: game.title, children: [
       /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(PreviewBox, { game, width: previewWidth, revealed: previewRevealed, dark, p1Color, p2Color }),
       /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react_native_paper.Text, { variant: "titleMedium", style: [styles4.rowTitle, { color: well.fg }], numberOfLines: 1, children: game.title }),
@@ -1224,13 +1227,13 @@ function PreviewBox({ game, width, revealed, dark, p1Color, p2Color }) {
   const height = Math.round(width / PREVIEW_ASPECT);
   const { Preview, icon: GameIcon } = game;
   const iconSize = Math.min(height, ROW_ICON_SIZE);
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react_native5.View, { style: [styles4.preview, { width, height, backgroundColor: dark ? ICON_DARK_BG : ICON_LIGHT_BG }], children: Preview ? revealed && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Preview, { width, height, p1Color, p2Color, dark }) : GameIcon && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react_native5.View, { style: [styles4.previewIcon, { width: iconSize, height: iconSize, borderRadius: iconSize * 0.22 }], children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(GameIcon, { size: iconSize, p1Color, p2Color, dark }) }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react_native6.View, { style: [styles4.preview, { width, height, backgroundColor: dark ? ICON_DARK_BG : ICON_LIGHT_BG }], children: Preview ? revealed && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Preview, { width, height, p1Color, p2Color, dark }) : GameIcon && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react_native6.View, { style: [styles4.previewIcon, { width: iconSize, height: iconSize, borderRadius: iconSize * 0.22 }], children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(GameIcon, { size: iconSize, p1Color, p2Color, dark }) }) });
 }
 var ROW_ICON_SIZE = 56;
 var ICON_LIGHT_BG = "#FAFAFA";
 var ICON_DARK_BG = "#050505";
 var RULES_BUTTON_SPACE = 44;
-var styles4 = import_react_native5.StyleSheet.create({
+var styles4 = import_react_native6.StyleSheet.create({
   container: {
     flex: 1
   },
@@ -1377,7 +1380,7 @@ var import_auto_paper7 = require("@rific/auto-paper");
 var import_chrome7 = require("@tastic/hud/chrome");
 var import_profile9 = require("@tastic/profile");
 var import_react17 = require("react");
-var import_react_native6 = require("react-native");
+var import_react_native7 = require("react-native");
 var import_react_native_paper2 = require("react-native-paper");
 var import_react_native_safe_area_context4 = require("react-native-safe-area-context");
 var import_react_redux10 = require("react-redux");
@@ -1400,7 +1403,7 @@ function StatsScreen() {
   return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(StatsPressAway, { host: pickerHost, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_chrome7.RotatedFrame, { rotatedSafeArea: true, portalHost: true, maxContentWidth: STATS_MAX_WIDTH, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(StatsContent, { pickerHost }) }) });
 }
 function StatsPressAway({ host, children }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_react_native6.View, { testID: "stats-press-away", style: styles5.screen, onStartShouldSetResponder: () => host.openId !== null, onResponderRelease: host.close, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_react_native7.View, { testID: "stats-press-away", style: styles5.screen, onStartShouldSetResponder: () => host.openId !== null, onResponderRelease: host.close, children });
 }
 var useNoPackReset = () => null;
 var noPickerAlign2 = () => void 0;
@@ -1437,7 +1440,7 @@ function StatsContent({ pickerHost }) {
   return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_chrome7.BaseStatsScreen, { title, onBack: import_core8.safeBack, insets, onReset: reset.onReset, resetLabel: reset.label, resetConfirmTitle: reset.title, resetConfirmBody: reset.body, fg: pack.foreground, bg: pack.Backdrop ? "transparent" : void 0, rotation: 0, children: [
     /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_chrome7.PressAwayOverlay, { active: pickerHost.openId !== null, onPress: pickerHost.close, style: styles5.pressAway }),
     /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_react_native_paper2.SegmentedButtons, { value: tab, onValueChange: setTab, buttons: tabButtons, style: [styles5.tabs, surface] }),
-    /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_react_native6.View, { style: [styles5.filters, pickerHost.openId !== null && styles5.filtersOpen], onStartShouldSetResponder: () => pickerHost.openId !== null, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_react_native7.View, { style: [styles5.filters, pickerHost.openId !== null && styles5.filtersOpen], onStartShouldSetResponder: () => pickerHost.openId !== null, children: [
       profiles.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_profile9.OptionPicker, { id: PLAYER_PICKER_ID, host: pickerHost, options: playerOptions, value: profileId ?? EVERYONE, onChange: (value) => setSelectedProfileId(value === EVERYONE ? null : value), color: colors.primary, dark, icon: profileId ? "account" : "account-group", alignOverride: playerAlign, triggerStyle }),
       showGamePicker && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_profile9.OptionPicker, { id: GAME_PICKER_ID, host: pickerHost, options: gameOptions, value: gameId, onChange: setGameId, color: colors.primary, dark, icon: "view-grid-outline", alignOverride: gameAlign, triggerStyle })
     ] }),
@@ -1458,12 +1461,12 @@ function GameStats({ game, tab, profileId, showTitle, titleColor }) {
   const { StatsSections, AchievementList } = game;
   const Sections = tab === STATS ? StatsSections : AchievementList;
   if (!Sections) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_react_native6.View, { style: styles5.game, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_react_native7.View, { style: styles5.game, children: [
     showTitle && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_react_native_paper2.Text, { variant: "titleLarge", style: [styles5.gameTitle, { color: titleColor }], children: game.title }),
     /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Sections, { profileId })
   ] });
 }
-var styles5 = import_react_native6.StyleSheet.create({
+var styles5 = import_react_native7.StyleSheet.create({
   filters: {
     flexDirection: "row",
     flexWrap: "wrap",
@@ -1497,11 +1500,11 @@ var styles5 = import_react_native6.StyleSheet.create({
 });
 
 // src/components/imageGameIcon.tsx
-var import_react_native7 = require("react-native");
+var import_react_native8 = require("react-native");
 var import_jsx_runtime17 = require("react/jsx-runtime");
 function imageGameIcon(images) {
   return function ImageGameIcon({ size, dark }) {
-    return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_react_native7.Image, { source: dark ? images.dark : images.light, style: { height: size, width: size }, accessibilityIgnoresInvertColors: true });
+    return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_react_native8.Image, { source: dark ? images.dark : images.light, style: { height: size, width: size }, accessibilityIgnoresInvertColors: true });
   };
 }
 

package/dist/index.mjs

@@ -483,6 +483,7 @@ var styles = StyleSheet.create({
 // src/screens/GameRoute.tsx
 import { Redirect, useLocalSearchParams } from "expo-router";
 import { useEffect as useEffect5 } from "react";
+import { AppState } from "react-native";
 
 // src/routes.ts
 var playHref = (game) => ({ pathname: "/play/[game]", params: { game } });
@@ -932,7 +933,9 @@ function useResumePoint(gameId) {
   useEffect5(() => {
     if (!gameId) return;
     setLastActiveGame(gameId);
-    return clearLastActiveGame;
+    return () => {
+      if (AppState.currentState === "active") clearLastActiveGame();
+    };
   }, [gameId, setLastActiveGame, clearLastActiveGame]);
 }
 
@@ -944,7 +947,7 @@ import { PressAwayOverlay as PressAwayOverlay2, usePopoverHost as usePopoverHost
 import { getProfilePickerContentSize, ProfilePicker } from "@tastic/profile";
 import { Redirect as Redirect2, router as router3, useIsFocused } from "expo-router";
 import { useCallback as useCallback10, useEffect as useEffect6, useMemo as useMemo6, useState as useState6 } from "react";
-import { AppState, StyleSheet as StyleSheet4, View as View4 } from "react-native";
+import { AppState as AppState2, StyleSheet as StyleSheet4, View as View4 } from "react-native";
 import { Icon, Portal, Text } from "react-native-paper";
 
 // src/hooks/useFrozenWhileHidden.ts
@@ -1050,9 +1053,9 @@ function HomeMenu() {
   const [settingsOpen, setSettingsOpen] = useState6(false);
   const [rulesGame, setRulesGame] = useState6(null);
   const isFocused = useIsFocused();
-  const [appState, setAppState] = useState6(AppState.currentState);
+  const [appState, setAppState] = useState6(AppState2.currentState);
   useEffect6(() => {
-    const subscription = AppState.addEventListener("change", setAppState);
+    const subscription = AppState2.addEventListener("change", setAppState);
     return () => subscription.remove();
   }, []);
   const heroActive = isFocused && appState === "active";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tastic/shell",
-  "version": "0.2.0",
+  "version": "0.2.1",
   "description": "The app around a pack of React Native games, two-seat or for one player: Home, the loadout, the stats screen, Profiles and Settings, the pack's Redux store and its root providers, driven by one PackDefinition",
   "keywords": [
     "react-native",

package/src/screens/GameRoute.tsx

@@ -1,5 +1,6 @@
 import { Redirect, useLocalSearchParams } from 'expo-router'
 import { useEffect } from 'react'
+import { AppState } from 'react-native'
 
 import { useLastActiveGame } from '../hooks/useLastActiveGame'
 import { usePackGame } from '../PackContext'
@@ -36,14 +37,20 @@ export function PlayRoute() {
 }
 
 // A resumable game's play screen (GameDefinition.resumable) is where a cold launch comes back to:
-// remembered as it mounts, and forgotten when it unmounts, which is the player backing out of it
-// (its own back, hardware back or a browser back). Backgrounding the app leaves the screen mounted,
-// so it stays remembered. Runs once per play screen: the context's functions never change.
+// remembered as it mounts, and forgotten when the player backs out of it (its own back, hardware back
+// or a browser back), which unmounts it while the app is in use. Backgrounding the app leaves the
+// screen mounted, so it stays remembered. An unmount with the app NOT active keeps it too: when iOS
+// terminates an app it hasn't suspended yet (swiped away from the app switcher soon after leaving
+// it), React Native's renderer stops every surface (RCTSurfacePresenter's will-terminate handler),
+// which unmounts the whole tree, and clearing then sent every such relaunch to Home. Runs once per
+// play screen: the context's functions never change.
 function useResumePoint(gameId: string | null) {
   const { setLastActiveGame, clearLastActiveGame } = useLastActiveGame()
   useEffect(() => {
     if (!gameId) return
     setLastActiveGame(gameId)
-    return clearLastActiveGame
+    return () => {
+      if (AppState.currentState === 'active') clearLastActiveGame()
+    }
   }, [gameId, setLastActiveGame, clearLastActiveGame])
 }