@dubsdotapp/expo 0.5.9 → 0.5.10

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dubsdotapp/expo",
-  "version": "0.5.9",
+  "version": "0.5.10",
   "description": "React Native SDK for the Dubs betting platform",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",

package/src/ui/game/JoinGameSheet.tsx

@@ -170,12 +170,14 @@ export function JoinGameSheet({
   const homeName = shortName ? shortName(opponents[0]?.name) : (opponents[0]?.name || 'Home');
   const awayName = shortName ? shortName(opponents[1]?.name) : (opponents[1]?.name || 'Away');
 
-  const alreadyJoined = useMemo(() => {
-    if (!wallet.publicKey) return false;
+  const myBet = useMemo(() => {
+    if (!wallet.publicKey) return null;
     const addr = wallet.publicKey.toBase58();
-    return bettors.some(b => b.wallet === addr);
+    return bettors.find(b => b.wallet === addr) ?? null;
   }, [bettors, wallet.publicKey]);
 
+  const alreadyJoined = myBet !== null;
+
   const isMutating = mutation.status !== 'idle' && mutation.status !== 'success' && mutation.status !== 'error';
   const canJoin = selectedTeam !== null && !isMutating && mutation.status !== 'success' && !alreadyJoined;
 
@@ -268,7 +270,7 @@ export function JoinGameSheet({
             )}
 
             {/* Team Selection — hidden in pool mode and custom games */}
-            {!isCustomGame && !isPoolModeEnabled && (
+            {!isCustomGame && !isPoolModeEnabled && !alreadyJoined && (
               <View style={styles.section}>
                 <Text style={[styles.sectionLabel, { color: t.textSecondary }]}>Pick Your Side</Text>
                 <View style={styles.teamsRow}>
@@ -298,6 +300,19 @@ export function JoinGameSheet({
               </View>
             )}
 
+            {/* Already joined — show which side */}
+            {alreadyJoined && myBet && (
+              <View style={[styles.myBetCard, { backgroundColor: (myBet.team === 'home' ? homeColor : awayColor) + '15', borderColor: myBet.team === 'home' ? homeColor : awayColor }]}>
+                <Text style={[styles.myBetLabel, { color: myBet.team === 'home' ? homeColor : awayColor }]}>YOUR BET</Text>
+                <Text style={[styles.myBetTeam, { color: t.text }]}>
+                  {myBet.team === 'home' ? homeName : awayName}
+                </Text>
+                <Text style={[styles.myBetAmount, { color: t.textMuted }]}>
+                  {formatSol(myBet.amount)} SOL
+                </Text>
+              </View>
+            )}
+
             {/* Summary Card */}
             <View style={[styles.summaryCard, { backgroundColor: t.surface, borderColor: t.border }]}>
               <View style={styles.summaryRow}>
@@ -335,7 +350,7 @@ export function JoinGameSheet({
             </View>
 
             {/* SOL Slider — sits right below summary card */}
-            {selectedTeam && !isPoolModeEnabled && (
+            {selectedTeam && !isPoolModeEnabled && !alreadyJoined && (
               <SolSlider
                 value={wager}
                 min={game.buyIn}
@@ -579,6 +594,27 @@ const styles = StyleSheet.create({
     height: 1,
     marginHorizontal: 16,
   },
+  myBetCard: {
+    marginTop: 16,
+    borderRadius: 14,
+    borderWidth: 1.5,
+    padding: 16,
+    alignItems: 'center',
+    gap: 4,
+  },
+  myBetLabel: {
+    fontSize: 10,
+    fontWeight: '900',
+    letterSpacing: 1.5,
+  },
+  myBetTeam: {
+    fontSize: 18,
+    fontWeight: '700',
+  },
+  myBetAmount: {
+    fontSize: 14,
+    fontWeight: '600',
+  },
   errorBox: {
     marginTop: 16,
     borderRadius: 12,