@devrongx/games 0.4.7 → 0.4.8

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@devrongx/games",
-  "version": "0.4.7",
+  "version": "0.4.8",
   "description": "Game UI components for sports prediction markets",
   "license": "MIT",
   "main": "./src/index.ts",

package/src/games/prematch-bets/PreMatchBetsPopup.tsx

@@ -177,6 +177,30 @@ export const PreMatchBetsPopup = ({ poolId, matchId: _matchId, match: matchProp
     return () => { if (saveDraftTimerRef.current) clearTimeout(saveDraftTimerRef.current); };
   }, [bets, poolId, config]);
 
+  // Debounced save triggered from PreMatchQuestions on each option pick
+  const handleQuestionSelectionChange = useCallback((selections: IUserBets) => {
+    if (!poolId || !config) return;
+    if (saveDraftTimerRef.current) clearTimeout(saveDraftTimerRef.current);
+    saveDraftTimerRef.current = setTimeout(async () => {
+      try {
+        const draft = config.markets
+          .map((m, mIdx) => {
+            const b = selections[mIdx];
+            if (!b || !m.backendChallengeId) return null;
+            const option = m.options[b.optionIdx];
+            if (!option) return null;
+            return {
+              challenge_id: m.backendChallengeId,
+              selected_option: option.label.toLowerCase().replace(/\s+/g, "_"),
+              coin_amount: 0,
+            };
+          })
+          .filter((b): b is NonNullable<typeof b> => b !== null);
+        if (draft.length > 0) await saveTDDraftBetsApi(poolId, draft);
+      } catch { /* best-effort */ }
+    }, 1000);
+  }, [poolId, config]);
+
   const betSummary = useMemo(
     () => config ? calcBetSummary(bets, config) : { selectedCount: 0, compoundMultiplier: 0, totalEntry: 0, baseReward: 0, compoundedReward: 0, remainingBalance: 0, riskPercent: 0, potentialBalance: 0 },
     [bets, config],
@@ -328,7 +352,7 @@ export const PreMatchBetsPopup = ({ poolId, matchId: _matchId, match: matchProp
       )}
 
       {activeView === "questions" && (
-        <PreMatchQuestions config={config} onComplete={handleQuestionsComplete} />
+        <PreMatchQuestions config={config} onComplete={handleQuestionsComplete} onSelectionChange={handleQuestionSelectionChange} />
       )}
 
       {activeView === "game" && (

package/src/games/prematch-bets/PreMatchQuestions.tsx

@@ -11,6 +11,7 @@ import { useGamePopupStore } from "../../core/gamePopupStore";
 interface PreMatchQuestionsProps {
     config: IChallengeConfig;
     onComplete: (selections: IUserBets) => void;
+    onSelectionChange?: (selections: IUserBets) => void;
 }
 
 // ── Smooth typewriter — constant speed, clean and simple ──
@@ -263,7 +264,7 @@ const QuestionSlide = ({
 };
 
 // ── Main component ──
-export const PreMatchQuestions = ({ config, onComplete }: PreMatchQuestionsProps) => {
+export const PreMatchQuestions = ({ config, onComplete, onSelectionChange }: PreMatchQuestionsProps) => {
     const goTo = useGamePopupStore(s => s.goTo);
 
     // -1 = start slide, 0..N-1 = question slides
@@ -283,19 +284,21 @@ export const PreMatchQuestions = ({ config, onComplete }: PreMatchQuestionsProps
     }, []);
 
     const handleOptionSelect = useCallback((mIdx: number, optionIdx: number) => {
+        const isDeselect = selections[mIdx]?.optionIdx === optionIdx;
+
         setSelections(prev => {
-            // Deselect if same option tapped again
-            if (prev[mIdx]?.optionIdx === optionIdx) {
+            if (isDeselect) {
                 const next = { ...prev };
                 delete next[mIdx];
+                onSelectionChange?.(next);
                 return next;
             }
-            // Only record the option pick — no points spent yet. User sets bet amounts on game screen.
-            return { ...prev, [mIdx]: { optionIdx, amount: 0, parlaySlot: null } };
+            const next = { ...prev, [mIdx]: { optionIdx, amount: 0, parlaySlot: null } };
+            onSelectionChange?.(next);
+            return next;
         });
 
         // Auto-advance after a brief pause (only if selecting, not deselecting)
-        const isDeselect = selections[mIdx]?.optionIdx === optionIdx;
         if (!isDeselect) {
             setTimeout(() => {
                 if (mIdx < totalQuestions - 1) {
@@ -311,7 +314,7 @@ export const PreMatchQuestions = ({ config, onComplete }: PreMatchQuestionsProps
                 }
             }, 500);
         }
-    }, [config.markets, selections, totalQuestions, onComplete, goTo]);
+    }, [config.markets, selections, totalQuestions, onComplete, onSelectionChange, goTo]);
 
     const seekNext = useCallback(() => {
         if (step === -1) {