@dubsdotapp/expo 0.5.14 → 0.5.15

package/dist/index.mjs

@@ -645,7 +645,7 @@ function createSecureStoreStorage() {
 }
 
 // src/provider.tsx
-import { createContext as createContext4, useContext as useContext4, useMemo as useMemo3, useCallback as useCallback20, useState as useState22, useEffect as useEffect14 } from "react";
+import { createContext as createContext4, useContext as useContext4, useMemo as useMemo3, useCallback as useCallback21, useState as useState23, useEffect as useEffect15 } from "react";
 
 // src/ui/theme.ts
 import { createContext, useContext } from "react";
@@ -1710,7 +1710,7 @@ function ManagedWalletProvider({
 }
 
 // src/ui/AuthGate.tsx
-import React2, { useState as useState21, useEffect as useEffect13, useRef as useRef6, useCallback as useCallback19 } from "react";
+import React2, { useState as useState22, useEffect as useEffect14, useRef as useRef6, useCallback as useCallback20 } from "react";
 import {
   View as View3,
   Text as Text3,
@@ -2413,25 +2413,53 @@ function useUFCFighterDetail(athleteId) {
   return { data, loading, error, refetch: fetchData };
 }
 
+// src/hooks/useHighlights.ts
+import { useState as useState14, useEffect as useEffect9, useCallback as useCallback13 } from "react";
+function useHighlights(league, limit = 8) {
+  const { client } = useDubs();
+  const [data, setData] = useState14(null);
+  const [loading, setLoading] = useState14(true);
+  const [error, setError] = useState14(null);
+  const fetchData = useCallback13(async () => {
+    setLoading(true);
+    setError(null);
+    try {
+      const qs = new URLSearchParams();
+      if (league) qs.set("league", league);
+      qs.set("limit", String(limit));
+      const res = await client.request("GET", `/highlights?${qs.toString()}`);
+      setData(res.videos || []);
+    } catch (err) {
+      setError(err instanceof Error ? err : new Error(String(err)));
+    } finally {
+      setLoading(false);
+    }
+  }, [client, league, limit]);
+  useEffect9(() => {
+    fetchData();
+  }, [fetchData]);
+  return { data, loading, error, refetch: fetchData };
+}
+
 // src/hooks/usePushNotifications.ts
-import { useState as useState14, useCallback as useCallback13, useRef as useRef3, useMemo, useEffect as useEffect9 } from "react";
+import { useState as useState15, useCallback as useCallback14, useRef as useRef3, useMemo, useEffect as useEffect10 } from "react";
 import { Platform as Platform3 } from "react-native";
 function usePushNotifications() {
   const { client, appName, pushEnabled } = useDubs();
   const channelId = useMemo(() => appName.toLowerCase().replace(/[^a-z0-9-]/g, ""), [appName]);
-  const [hasPermission, setHasPermission] = useState14(false);
-  const [pushToken, setPushToken] = useState14(null);
-  const [loading, setLoading] = useState14(false);
-  const [error, setError] = useState14(null);
+  const [hasPermission, setHasPermission] = useState15(false);
+  const [pushToken, setPushToken] = useState15(null);
+  const [loading, setLoading] = useState15(false);
+  const [error, setError] = useState15(null);
   const registering = useRef3(false);
-  const getNotificationsModule = useCallback13(() => {
+  const getNotificationsModule = useCallback14(() => {
     try {
       return __require("expo-notifications");
     } catch {
       return null;
     }
   }, []);
-  const getDeviceName = useCallback13(() => {
+  const getDeviceName = useCallback14(() => {
     try {
       const Device = __require("expo-device");
       return Device.deviceName || null;
@@ -2439,7 +2467,7 @@ function usePushNotifications() {
       return null;
     }
   }, []);
-  const setupAndroidChannels = useCallback13((Notifications) => {
+  const setupAndroidChannels = useCallback14((Notifications) => {
     if (Platform3.OS === "android") {
       Notifications.setNotificationChannelAsync(channelId || "default", {
         name: appName || "Default",
@@ -2449,7 +2477,7 @@ function usePushNotifications() {
       });
     }
   }, [channelId, appName]);
-  const registerTokenWithServer = useCallback13(async (token) => {
+  const registerTokenWithServer = useCallback14(async (token) => {
     const deviceName = getDeviceName();
     await client.registerPushToken({
       token,
@@ -2457,7 +2485,7 @@ function usePushNotifications() {
       deviceName: deviceName || void 0
     });
   }, [client, getDeviceName]);
-  const register = useCallback13(async () => {
+  const register = useCallback14(async () => {
     if (!pushEnabled) return false;
     if (registering.current) return false;
     registering.current = true;
@@ -2498,7 +2526,7 @@ function usePushNotifications() {
       return false;
     }
   }, [getNotificationsModule, registerTokenWithServer, setupAndroidChannels]);
-  const unregister = useCallback13(async () => {
+  const unregister = useCallback14(async () => {
     if (!pushToken) return;
     try {
       await client.unregisterPushToken(pushToken);
@@ -2507,7 +2535,7 @@ function usePushNotifications() {
       console.error("[usePushNotifications] Unregister error:", err);
     }
   }, [client, pushToken]);
-  const restoreIfGranted = useCallback13(async () => {
+  const restoreIfGranted = useCallback14(async () => {
     if (!pushEnabled) return;
     try {
       const Notifications = getNotificationsModule();
@@ -2526,7 +2554,7 @@ function usePushNotifications() {
     }
   }, [getNotificationsModule, registerTokenWithServer, setupAndroidChannels]);
   const didMount = useRef3(false);
-  useEffect9(() => {
+  useEffect10(() => {
     if (didMount.current) return;
     didMount.current = true;
     const Notifications = getNotificationsModule();
@@ -2556,13 +2584,13 @@ function usePushNotifications() {
 }
 
 // src/hooks/useArcadePools.ts
-import { useState as useState15, useEffect as useEffect10, useCallback as useCallback14 } from "react";
+import { useState as useState16, useEffect as useEffect11, useCallback as useCallback15 } from "react";
 function useArcadePools(gameSlug) {
   const { client } = useDubs();
-  const [pools, setPools] = useState15([]);
-  const [loading, setLoading] = useState15(false);
-  const [error, setError] = useState15(null);
-  const fetch2 = useCallback14(async () => {
+  const [pools, setPools] = useState16([]);
+  const [loading, setLoading] = useState16(false);
+  const [error, setError] = useState16(null);
+  const fetch2 = useCallback15(async () => {
     setLoading(true);
     setError(null);
     try {
@@ -2574,22 +2602,22 @@ function useArcadePools(gameSlug) {
       setLoading(false);
     }
   }, [client, gameSlug]);
-  useEffect10(() => {
+  useEffect11(() => {
     fetch2();
   }, [fetch2]);
   return { pools, loading, error, refetch: fetch2 };
 }
 
 // src/hooks/useArcadePool.ts
-import { useState as useState16, useEffect as useEffect11, useCallback as useCallback15 } from "react";
+import { useState as useState17, useEffect as useEffect12, useCallback as useCallback16 } from "react";
 function useArcadePool(poolId) {
   const { client } = useDubs();
-  const [pool, setPool] = useState16(null);
-  const [stats, setStats] = useState16(null);
-  const [leaderboard, setLeaderboard] = useState16([]);
-  const [loading, setLoading] = useState16(false);
-  const [error, setError] = useState16(null);
-  const fetch2 = useCallback15(async () => {
+  const [pool, setPool] = useState17(null);
+  const [stats, setStats] = useState17(null);
+  const [leaderboard, setLeaderboard] = useState17([]);
+  const [loading, setLoading] = useState17(false);
+  const [error, setError] = useState17(null);
+  const fetch2 = useCallback16(async () => {
     if (!poolId) return;
     setLoading(true);
     setError(null);
@@ -2607,22 +2635,22 @@ function useArcadePool(poolId) {
       setLoading(false);
     }
   }, [client, poolId]);
-  useEffect11(() => {
+  useEffect12(() => {
     fetch2();
   }, [fetch2]);
   return { pool, stats, leaderboard, loading, error, refetch: fetch2 };
 }
 
 // src/hooks/useArcadeGame.ts
-import { useState as useState17, useCallback as useCallback16 } from "react";
+import { useState as useState18, useCallback as useCallback17 } from "react";
 function useArcadeGame(poolId, maxLives = 3) {
   const { client } = useDubs();
   const { user } = useAuth();
-  const [entry, setEntry] = useState17(null);
-  const [loading, setLoading] = useState17(false);
-  const [error, setError] = useState17(null);
+  const [entry, setEntry] = useState18(null);
+  const [loading, setLoading] = useState18(false);
+  const [error, setError] = useState18(null);
   const walletAddress = user?.walletAddress || "";
-  const refreshEntry = useCallback16(async () => {
+  const refreshEntry = useCallback17(async () => {
     if (!poolId || !walletAddress) return;
     setLoading(true);
     setError(null);
@@ -2639,7 +2667,7 @@ function useArcadeGame(poolId, maxLives = 3) {
       setLoading(false);
     }
   }, [client, poolId, walletAddress]);
-  const startAttempt = useCallback16(async () => {
+  const startAttempt = useCallback17(async () => {
     if (!poolId || !walletAddress) throw new Error("Not ready");
     setError(null);
     try {
@@ -2651,7 +2679,7 @@ function useArcadeGame(poolId, maxLives = 3) {
       throw e;
     }
   }, [client, poolId, walletAddress]);
-  const submitScore = useCallback16(async (sessionToken, score, durationMs) => {
+  const submitScore = useCallback17(async (sessionToken, score, durationMs) => {
     if (!poolId || !walletAddress) throw new Error("Not ready");
     setError(null);
     try {
@@ -2688,19 +2716,19 @@ function useArcadeGame(poolId, maxLives = 3) {
 }
 
 // src/hooks/useEnterArcadePool.ts
-import { useState as useState18, useCallback as useCallback17 } from "react";
+import { useState as useState19, useCallback as useCallback18 } from "react";
 function useEnterArcadePool() {
   const { client, wallet, connection } = useDubs();
   const { user } = useAuth();
-  const [status, setStatus] = useState18("idle");
-  const [error, setError] = useState18(null);
-  const [data, setData] = useState18(null);
-  const reset = useCallback17(() => {
+  const [status, setStatus] = useState19("idle");
+  const [error, setError] = useState19(null);
+  const [data, setData] = useState19(null);
+  const reset = useCallback18(() => {
     setStatus("idle");
     setError(null);
     setData(null);
   }, []);
-  const execute = useCallback17(async (poolId) => {
+  const execute = useCallback18(async (poolId) => {
     if (!wallet.publicKey) throw new Error("Wallet not connected");
     const walletAddress = wallet.publicKey.toBase58();
     setStatus("building");
@@ -2748,7 +2776,7 @@ function useEnterArcadePool() {
 }
 
 // src/hooks/useArcadeCountdown.ts
-import { useState as useState19, useEffect as useEffect12, useRef as useRef4 } from "react";
+import { useState as useState20, useEffect as useEffect13, useRef as useRef4 } from "react";
 function formatCountdown(ms) {
   if (ms <= 0) return "Ended";
   const s2 = Math.floor(ms / 1e3);
@@ -2761,9 +2789,9 @@ function formatCountdown(ms) {
   return `${s2}s`;
 }
 function useArcadeCountdown(nextResolution) {
-  const [now, setNow] = useState19(Date.now());
+  const [now, setNow] = useState20(Date.now());
   const intervalRef = useRef4(null);
-  useEffect12(() => {
+  useEffect13(() => {
     if (!nextResolution) return;
     intervalRef.current = setInterval(() => setNow(Date.now()), 1e3);
     return () => {
@@ -2792,7 +2820,7 @@ function useArcadeCountdown(nextResolution) {
 }
 
 // src/hooks/useArcadeBridge.ts
-import { useRef as useRef5, useState as useState20, useCallback as useCallback18 } from "react";
+import { useRef as useRef5, useState as useState21, useCallback as useCallback19 } from "react";
 var PROTOCOL_VERSION = "1.0";
 function useArcadeBridge({
   canPlay,
@@ -2807,9 +2835,9 @@ function useArcadeBridge({
   const gameStartTimeRef = useRef5(0);
   const canPlayRef = useRef5(canPlay);
   canPlayRef.current = canPlay;
-  const [lastResult, setLastResult] = useState20(null);
-  const [bridgeLoading, setBridgeLoading] = useState20(false);
-  const injectSession = useCallback18((token, attemptNumber) => {
+  const [lastResult, setLastResult] = useState21(null);
+  const [bridgeLoading, setBridgeLoading] = useState21(false);
+  const injectSession = useCallback19((token, attemptNumber) => {
     webviewRef.current?.injectJavaScript(`
       window.ARCADE_SESSION_TOKEN = ${JSON.stringify(token)};
       window.ARCADE_ATTEMPT_NUMBER = ${attemptNumber};
@@ -2818,7 +2846,7 @@ function useArcadeBridge({
       true;
     `);
   }, []);
-  const triggerPlay = useCallback18(async () => {
+  const triggerPlay = useCallback19(async () => {
     if (!canPlay) return;
     setBridgeLoading(true);
     try {
@@ -2835,7 +2863,7 @@ function useArcadeBridge({
       setBridgeLoading(false);
     }
   }, [canPlay, startAttempt, injectSession, onPlayStarted, onError]);
-  const handleMessage = useCallback18(
+  const handleMessage = useCallback19(
     async (event) => {
       let data;
       try {
@@ -3048,11 +3076,11 @@ function AuthGate({
 }) {
   const { client, pushEnabled } = useDubs();
   const auth = useAuth();
-  const [phase, setPhase] = useState21("init");
-  const [registrationPhase, setRegistrationPhase] = useState21(false);
-  const [showPushSetup, setShowPushSetup] = useState21(false);
-  const [isRestoredSession, setIsRestoredSession] = useState21(false);
-  useEffect13(() => {
+  const [phase, setPhase] = useState22("init");
+  const [registrationPhase, setRegistrationPhase] = useState22(false);
+  const [showPushSetup, setShowPushSetup] = useState22(false);
+  const [isRestoredSession, setIsRestoredSession] = useState22(false);
+  useEffect14(() => {
     let cancelled = false;
     (async () => {
       try {
@@ -3079,23 +3107,23 @@ function AuthGate({
       cancelled = true;
     };
   }, []);
-  useEffect13(() => {
+  useEffect14(() => {
     if (auth.status === "needsRegistration") setRegistrationPhase(true);
   }, [auth.status]);
-  useEffect13(() => {
+  useEffect14(() => {
     if (pushEnabled && auth.status === "authenticated" && registrationPhase && !isRestoredSession) {
       setShowPushSetup(true);
     }
   }, [pushEnabled, auth.status, registrationPhase, isRestoredSession]);
-  useEffect13(() => {
+  useEffect14(() => {
     if (auth.token) onSaveToken(auth.token);
   }, [auth.token]);
-  const retry = useCallback19(() => {
+  const retry = useCallback20(() => {
     setRegistrationPhase(false);
     auth.reset();
     auth.authenticate();
   }, [auth]);
-  const handleRegister = useCallback19(
+  const handleRegister = useCallback20(
     (username, referralCode, avatarUrl) => {
       auth.register(username, referralCode, avatarUrl);
     },
@@ -3219,20 +3247,20 @@ function DefaultRegistrationScreen({
 }) {
   const t = useDubsTheme();
   const accent = accentColor || t.accent;
-  const [step, setStep] = useState21(0);
-  const [avatarSeed, setAvatarSeed] = useState21(generateSeed);
-  const [avatarStyle, setAvatarStyle] = useState21("adventurer");
-  const [avatarBg, setAvatarBg] = useState21("1a1a2e");
-  const [showStyles, setShowStyles] = useState21(false);
-  const [username, setUsername] = useState21("");
-  const [referralCode, setReferralCode] = useState21("");
-  const [checking, setChecking] = useState21(false);
-  const [availability, setAvailability] = useState21(null);
+  const [step, setStep] = useState22(0);
+  const [avatarSeed, setAvatarSeed] = useState22(generateSeed);
+  const [avatarStyle, setAvatarStyle] = useState22("adventurer");
+  const [avatarBg, setAvatarBg] = useState22("1a1a2e");
+  const [showStyles, setShowStyles] = useState22(false);
+  const [username, setUsername] = useState22("");
+  const [referralCode, setReferralCode] = useState22("");
+  const [checking, setChecking] = useState22(false);
+  const [availability, setAvailability] = useState22(null);
   const debounceRef = useRef6(null);
   const fadeAnim = useRef6(new Animated.Value(1)).current;
   const slideAnim = useRef6(new Animated.Value(0)).current;
   const avatarUrl = getAvatarUrl(avatarStyle, avatarSeed, avatarBg);
-  useEffect13(() => {
+  useEffect14(() => {
     if (debounceRef.current) clearTimeout(debounceRef.current);
     const trimmed = username.trim();
     if (trimmed.length < 3) {
@@ -3255,7 +3283,7 @@ function DefaultRegistrationScreen({
       if (debounceRef.current) clearTimeout(debounceRef.current);
     };
   }, [username, client]);
-  const animateToStep = useCallback19((newStep) => {
+  const animateToStep = useCallback20((newStep) => {
     const dir = newStep > step ? 1 : -1;
     Keyboard.dismiss();
     Animated.parallel([
@@ -3495,7 +3523,7 @@ function DefaultRegistrationScreen({
 function PushTokenRestorer() {
   const push = usePushNotifications();
   const restored = useRef6(false);
-  useEffect13(() => {
+  useEffect14(() => {
     if (restored.current) return;
     restored.current = true;
     push.restoreIfGranted();
@@ -3512,7 +3540,7 @@ function PushSetupScreen({
   const push = usePushNotifications();
   const fadeAnim = useRef6(new Animated.Value(0)).current;
   const slideAnim = useRef6(new Animated.Value(30)).current;
-  useEffect13(() => {
+  useEffect14(() => {
     Animated.parallel([
       Animated.timing(fadeAnim, { toValue: 1, duration: 300, useNativeDriver: true }),
       Animated.timing(slideAnim, { toValue: 0, duration: 300, useNativeDriver: true })
@@ -3672,9 +3700,9 @@ function DubsProvider({
   const rpcUrl = rpcUrlOverride || config.rpcUrl;
   const client = useMemo3(() => new DubsClient({ apiKey, baseUrl }), [apiKey, baseUrl]);
   const storage = useMemo3(() => tokenStorage || createSecureStoreStorage(), [tokenStorage]);
-  const [uiConfig, setUiConfig] = useState22(null);
-  const [resolvedNetwork, setResolvedNetwork] = useState22(network);
-  useEffect14(() => {
+  const [uiConfig, setUiConfig] = useState23(null);
+  const [resolvedNetwork, setResolvedNetwork] = useState23(network);
+  useEffect15(() => {
     client.getAppConfig().then((cfg) => {
       console.log("[DubsProvider] UI config loaded:", JSON.stringify(cfg));
       setUiConfig(cfg);
@@ -3766,7 +3794,7 @@ function ManagedInner({
   children
 }) {
   const managedDisconnect = useDisconnect();
-  const disconnect = useCallback20(async () => {
+  const disconnect = useCallback21(async () => {
     client.setToken(null);
     await managedDisconnect?.();
   }, [client, managedDisconnect]);
@@ -3807,7 +3835,7 @@ function ExternalWalletProvider({
   pushEnabled,
   children
 }) {
-  const disconnect = useCallback20(async () => {
+  const disconnect = useCallback21(async () => {
     client.setToken(null);
     await storage.deleteItem(STORAGE_KEYS.JWT_TOKEN).catch(() => {
     });
@@ -4128,7 +4156,7 @@ var styles5 = StyleSheet6.create({
 });
 
 // src/ui/UserProfileSheet.tsx
-import { useState as useState23, useEffect as useEffect15, useRef as useRef7, useCallback as useCallback21, useMemo as useMemo5 } from "react";
+import { useState as useState24, useEffect as useEffect16, useRef as useRef7, useCallback as useCallback22, useMemo as useMemo5 } from "react";
 import {
   View as View7,
   Text as Text7,
@@ -4161,29 +4189,29 @@ function UserProfileSheet({
   const push = usePushNotifications();
   const overlayOpacity = useRef7(new Animated2.Value(0)).current;
   const parsed = useMemo5(() => parseAvatarUrl(user.avatar), [user.avatar]);
-  const [avatarStyle, setAvatarStyle] = useState23(parsed.style);
-  const [avatarSeed, setAvatarSeed] = useState23(parsed.seed);
-  const [bgColor, setBgColor] = useState23(parsed.bg);
-  const [saving, setSaving] = useState23(false);
-  const [error, setError] = useState23(null);
-  useEffect15(() => {
+  const [avatarStyle, setAvatarStyle] = useState24(parsed.style);
+  const [avatarSeed, setAvatarSeed] = useState24(parsed.seed);
+  const [bgColor, setBgColor] = useState24(parsed.bg);
+  const [saving, setSaving] = useState24(false);
+  const [error, setError] = useState24(null);
+  useEffect16(() => {
     const p = parseAvatarUrl(user.avatar);
     setAvatarStyle(p.style);
     setAvatarSeed(p.seed);
     setBgColor(p.bg);
   }, [user.avatar]);
-  useEffect15(() => {
+  useEffect16(() => {
     Animated2.timing(overlayOpacity, {
       toValue: visible ? 1 : 0,
       duration: 250,
       useNativeDriver: true
     }).start();
   }, [visible, overlayOpacity]);
-  useEffect15(() => {
+  useEffect16(() => {
     if (visible) setError(null);
   }, [visible]);
   const currentAvatarUrl = getAvatarUrl(avatarStyle, avatarSeed, bgColor);
-  const saveAvatar = useCallback21(async (newUrl) => {
+  const saveAvatar = useCallback22(async (newUrl) => {
     setSaving(true);
     setError(null);
     try {
@@ -4196,16 +4224,16 @@ function UserProfileSheet({
       setSaving(false);
     }
   }, [client, refreshUser, onAvatarUpdated]);
-  const handleStyleChange = useCallback21((style) => {
+  const handleStyleChange = useCallback22((style) => {
     setAvatarStyle(style);
     saveAvatar(getAvatarUrl(style, avatarSeed, bgColor));
   }, [avatarSeed, bgColor, saveAvatar]);
-  const handleShuffle = useCallback21(() => {
+  const handleShuffle = useCallback22(() => {
     const newSeed = generateSeed();
     setAvatarSeed(newSeed);
     saveAvatar(getAvatarUrl(avatarStyle, newSeed, bgColor));
   }, [avatarStyle, bgColor, saveAvatar]);
-  const handleBgChange = useCallback21((color) => {
+  const handleBgChange = useCallback22((color) => {
     setBgColor(color);
     saveAvatar(getAvatarUrl(avatarStyle, avatarSeed, color));
   }, [avatarStyle, avatarSeed, saveAvatar]);
@@ -4485,7 +4513,7 @@ var styles6 = StyleSheet7.create({
 });
 
 // src/ui/game/GamePoster.tsx
-import { useState as useState24 } from "react";
+import { useState as useState25 } from "react";
 import { StyleSheet as StyleSheet8, View as View8, Text as Text8 } from "react-native";
 import { jsx as jsx10, jsxs as jsxs7 } from "react/jsx-runtime";
 function computeCountdown(lockTimestamp) {
@@ -4535,7 +4563,7 @@ function GamePoster({ game, ImageComponent }) {
   ] });
 }
 function TeamLogoInternal({ url, size, Img }) {
-  const [failed, setFailed] = useState24(false);
+  const [failed, setFailed] = useState25(false);
   if (!url || failed) {
     return /* @__PURE__ */ jsx10(View8, { style: [styles7.logoPlaceholder, { width: size, height: size, borderRadius: size / 2 }] });
   }
@@ -4715,7 +4743,7 @@ var styles8 = StyleSheet9.create({
 });
 
 // src/ui/game/PickWinnerCard.tsx
-import { useState as useState25, useMemo as useMemo7 } from "react";
+import { useState as useState26, useMemo as useMemo7 } from "react";
 import { StyleSheet as StyleSheet10, View as View10, Text as Text10, TouchableOpacity as TouchableOpacity7 } from "react-native";
 import { jsx as jsx12, jsxs as jsxs9 } from "react/jsx-runtime";
 function PickWinnerCard({
@@ -4786,7 +4814,7 @@ function TeamOption({
   ImageComponent,
   t
 }) {
-  const [imgFailed, setImgFailed] = useState25(false);
+  const [imgFailed, setImgFailed] = useState26(false);
   const Img = ImageComponent || __require("react-native").Image;
   const showImage = imageUrl && !imgFailed;
   return /* @__PURE__ */ jsxs9(
@@ -4827,7 +4855,7 @@ var styles9 = StyleSheet10.create({
 });
 
 // src/ui/game/PlayersCard.tsx
-import { useState as useState26 } from "react";
+import { useState as useState27 } from "react";
 import { StyleSheet as StyleSheet11, View as View11, Text as Text11 } from "react-native";
 import { jsx as jsx13, jsxs as jsxs10 } from "react/jsx-runtime";
 function truncateWallet(addr, chars) {
@@ -4876,7 +4904,7 @@ function BettorRow({
   ImageComponent,
   t
 }) {
-  const [imgFailed, setImgFailed] = useState26(false);
+  const [imgFailed, setImgFailed] = useState27(false);
   const Img = ImageComponent || __require("react-native").Image;
   const showAvatar = bettor.avatar && !imgFailed;
   return /* @__PURE__ */ jsxs10(View11, { style: [styles10.row, !isFirst && { borderTopColor: t.border, borderTopWidth: 1 }], children: [
@@ -4955,7 +4983,7 @@ var styles11 = StyleSheet12.create({
 });
 
 // src/ui/game/CreateCustomGameSheet.tsx
-import { useState as useState27, useEffect as useEffect16, useRef as useRef8, useCallback as useCallback22 } from "react";
+import { useState as useState28, useEffect as useEffect17, useRef as useRef8, useCallback as useCallback23 } from "react";
 import {
   View as View13,
   Text as Text13,
@@ -4992,18 +5020,18 @@ function CreateCustomGameSheet({
   const t = useDubsTheme();
   const { wallet } = useDubs();
   const mutation = useCreateCustomGame();
-  const [selectedAmount, setSelectedAmount] = useState27(null);
-  const [customAmount, setCustomAmount] = useState27("");
-  const [isCustom, setIsCustom] = useState27(false);
+  const [selectedAmount, setSelectedAmount] = useState28(null);
+  const [customAmount, setCustomAmount] = useState28("");
+  const [isCustom, setIsCustom] = useState28(false);
   const overlayOpacity = useRef8(new Animated3.Value(0)).current;
-  useEffect16(() => {
+  useEffect17(() => {
     Animated3.timing(overlayOpacity, {
       toValue: visible ? 1 : 0,
       duration: 250,
       useNativeDriver: true
     }).start();
   }, [visible, overlayOpacity]);
-  useEffect16(() => {
+  useEffect17(() => {
     if (visible) {
       setSelectedAmount(defaultAmount ?? null);
       setCustomAmount("");
@@ -5011,7 +5039,7 @@ function CreateCustomGameSheet({
       mutation.reset();
     }
   }, [visible]);
-  useEffect16(() => {
+  useEffect17(() => {
     if (mutation.status === "success" && mutation.data) {
       onSuccess?.(mutation.data);
       const timer = setTimeout(() => {
@@ -5020,23 +5048,23 @@ function CreateCustomGameSheet({
       return () => clearTimeout(timer);
     }
   }, [mutation.status, mutation.data]);
-  useEffect16(() => {
+  useEffect17(() => {
     if (mutation.status === "error" && mutation.error) {
       onError?.(mutation.error);
     }
   }, [mutation.status, mutation.error]);
-  const handlePresetSelect = useCallback22((amount) => {
+  const handlePresetSelect = useCallback23((amount) => {
     setSelectedAmount(amount);
     setIsCustom(false);
     setCustomAmount("");
     onAmountChange?.(amount);
   }, [onAmountChange]);
-  const handleCustomSelect = useCallback22(() => {
+  const handleCustomSelect = useCallback23(() => {
     setIsCustom(true);
     setSelectedAmount(null);
     onAmountChange?.(null);
   }, [onAmountChange]);
-  const handleCustomAmountChange = useCallback22((text) => {
+  const handleCustomAmountChange = useCallback23((text) => {
     const cleaned = text.replace(/[^0-9.]/g, "").replace(/(\..*?)\..*/g, "$1");
     setCustomAmount(cleaned);
     const parsed = parseFloat(cleaned);
@@ -5051,7 +5079,7 @@ function CreateCustomGameSheet({
   const winnerTakes = pot * (1 - fee / 100);
   const isMutating = mutation.status !== "idle" && mutation.status !== "success" && mutation.status !== "error";
   const canCreate = finalAmount !== null && finalAmount > 0 && !isMutating && mutation.status !== "success";
-  const handleCreate = useCallback22(async () => {
+  const handleCreate = useCallback23(async () => {
     if (!finalAmount || !wallet.publicKey) return;
     try {
       await mutation.execute({
@@ -5320,7 +5348,7 @@ var styles12 = StyleSheet13.create({
 });
 
 // src/ui/game/JoinGameSheet.tsx
-import { useState as useState29, useEffect as useEffect17, useRef as useRef10, useCallback as useCallback24, useMemo as useMemo9 } from "react";
+import { useState as useState30, useEffect as useEffect18, useRef as useRef10, useCallback as useCallback25, useMemo as useMemo9 } from "react";
 import {
   View as View16,
   Text as Text16,
@@ -5530,7 +5558,7 @@ var styles13 = StyleSheet14.create({
 });
 
 // src/ui/game/TeamButton.tsx
-import { useState as useState28 } from "react";
+import { useState as useState29 } from "react";
 import { View as View15, Text as Text15, TouchableOpacity as TouchableOpacity10, StyleSheet as StyleSheet15 } from "react-native";
 import { jsx as jsx17, jsxs as jsxs14 } from "react/jsx-runtime";
 function TeamButton({
@@ -5544,7 +5572,7 @@ function TeamButton({
   ImageComponent,
   t
 }) {
-  const [imgFailed, setImgFailed] = useState28(false);
+  const [imgFailed, setImgFailed] = useState29(false);
   const Img = ImageComponent || __require("react-native").Image;
   const showImage = imageUrl && !imgFailed;
   return /* @__PURE__ */ jsxs14(
@@ -5635,6 +5663,7 @@ function JoinGameSheet({
   shortName,
   homeColor = "#3B82F6",
   awayColor = "#EF4444",
+  drawColor = "#F59E0B",
   onSuccess,
   onError,
   onTeamSelect,
@@ -5647,20 +5676,20 @@ function JoinGameSheet({
   const { wallet } = useDubs();
   const mutation = useJoinGame();
   const isCustomGame = game.gameMode === CUSTOM_GAME_MODE;
-  const [selectedTeam, setSelectedTeam] = useState29(null);
-  const [wager, setWager] = useState29(game.buyIn);
-  const [showSuccess, setShowSuccess] = useState29(false);
+  const [selectedTeam, setSelectedTeam] = useState30(null);
+  const [wager, setWager] = useState30(game.buyIn);
+  const [showSuccess, setShowSuccess] = useState30(false);
   const overlayOpacity = useRef10(new Animated4.Value(0)).current;
   const successScale = useRef10(new Animated4.Value(0)).current;
   const successOpacity = useRef10(new Animated4.Value(0)).current;
-  useEffect17(() => {
+  useEffect18(() => {
     Animated4.timing(overlayOpacity, {
       toValue: visible ? 1 : 0,
       duration: 250,
       useNativeDriver: true
     }).start();
   }, [visible, overlayOpacity]);
-  useEffect17(() => {
+  useEffect18(() => {
     if (visible) {
       setSelectedTeam(isPoolModeEnabled ? "home" : isCustomGame ? "away" : null);
       setWager(game.buyIn);
@@ -5670,7 +5699,7 @@ function JoinGameSheet({
       mutation.reset();
     }
   }, [visible]);
-  useEffect17(() => {
+  useEffect18(() => {
     if (mutation.status === "success" && mutation.data) {
       setShowSuccess(true);
       onSuccess?.(mutation.data);
@@ -5687,7 +5716,7 @@ function JoinGameSheet({
       return () => clearTimeout(timer);
     }
   }, [mutation.status, mutation.data]);
-  useEffect17(() => {
+  useEffect18(() => {
     if (mutation.status === "error" && mutation.error) {
       onError?.(mutation.error);
     }
@@ -5697,18 +5726,29 @@ function JoinGameSheet({
   const totalPool = game.totalPool || 0;
   const homePool = game.homePool || 0;
   const awayPool = game.awayPool || 0;
+  const drawPool = game.drawPool || 0;
   const buyIn = game.buyIn;
+  const drawBettors = bettors.filter((b) => b.team === "draw");
+  const hasDrawOption = drawPool > 0 || drawBettors.length > 0 || game.league && ["English Premier League", "EPL", "MLS", "La Liga", "Serie A", "Bundesliga", "Ligue 1"].some((l) => (game.league || "").includes(l));
   const poolAfterJoin = totalPool + wager;
-  const { homeOdds, awayOdds, homeBets, awayBets } = useMemo9(() => {
+  const { homeOdds, awayOdds, drawOdds, homeBets, awayBets, drawBets } = useMemo9(() => {
+    const homeBetsCount = bettors.filter((b) => b.team === "home").length;
+    const awayBetsCount = bettors.filter((b) => b.team === "away").length;
+    const drawBetsCount = bettors.filter((b) => b.team === "draw").length;
     const newPool = totalPool + wager;
+    const newHome = homePool + (selectedTeam === "home" ? wager : 0);
+    const newAway = awayPool + (selectedTeam === "away" ? wager : 0);
+    const newDraw = drawPool + (selectedTeam === "draw" ? wager : 0);
     return {
-      homeOdds: homePool > 0 ? (newPool / (homePool + (selectedTeam === "home" ? wager : 0))).toFixed(2) : "\u2014",
-      awayOdds: awayPool > 0 ? (newPool / (awayPool + (selectedTeam === "away" ? wager : 0))).toFixed(2) : "\u2014",
-      homeBets: bettors.filter((b) => b.team === "home").length,
-      awayBets: bettors.filter((b) => b.team === "away").length
+      homeOdds: newHome > 0 ? (newPool / newHome).toFixed(2) : "\u2014",
+      awayOdds: newAway > 0 ? (newPool / newAway).toFixed(2) : "\u2014",
+      drawOdds: newDraw > 0 ? (newPool / newDraw).toFixed(2) : "\u2014",
+      homeBets: homeBetsCount,
+      awayBets: awayBetsCount,
+      drawBets: drawBetsCount
     };
-  }, [totalPool, homePool, awayPool, bettors, wager, selectedTeam]);
-  const selectedOdds = selectedTeam === "home" ? homeOdds : selectedTeam === "away" ? awayOdds : "\u2014";
+  }, [totalPool, homePool, awayPool, drawPool, bettors, wager, selectedTeam]);
+  const selectedOdds = selectedTeam === "home" ? homeOdds : selectedTeam === "away" ? awayOdds : selectedTeam === "draw" ? drawOdds : "\u2014";
   const potentialWinnings = selectedOdds !== "\u2014" ? formatSol(parseFloat(selectedOdds) * wager) : "\u2014";
   const homeName = shortName ? shortName(opponents[0]?.name) : opponents[0]?.name || "Home";
   const awayName = shortName ? shortName(opponents[1]?.name) : opponents[1]?.name || "Away";
@@ -5720,7 +5760,7 @@ function JoinGameSheet({
   const alreadyJoined = myBet !== null;
   const isMutating = mutation.status !== "idle" && mutation.status !== "success" && mutation.status !== "error";
   const canJoin = selectedTeam !== null && !isMutating && mutation.status !== "success" && !alreadyJoined;
-  const handleJoin = useCallback24(async () => {
+  const handleJoin = useCallback25(async () => {
     if (!selectedTeam || !wallet.publicKey) return;
     try {
       await mutation.execute({
@@ -5817,11 +5857,26 @@ function JoinGameSheet({
                       t
                     }
                   )
-                ] })
+                ] }),
+                hasDrawOption && /* @__PURE__ */ jsx18(View16, { style: styles15.drawRow, children: /* @__PURE__ */ jsx18(
+                  TeamButton,
+                  {
+                    name: "Draw",
+                    odds: drawOdds,
+                    bets: drawBets,
+                    color: drawColor,
+                    selected: selectedTeam === "draw",
+                    onPress: () => {
+                      setSelectedTeam("draw");
+                      onTeamSelect?.("draw");
+                    },
+                    t
+                  }
+                ) })
               ] }),
-              alreadyJoined && myBet && /* @__PURE__ */ jsxs15(View16, { style: [styles15.myBetCard, { backgroundColor: (myBet.team === "home" ? homeColor : awayColor) + "15", borderColor: myBet.team === "home" ? homeColor : awayColor }], children: [
-                /* @__PURE__ */ jsx18(Text16, { style: [styles15.myBetLabel, { color: myBet.team === "home" ? homeColor : awayColor }], children: "YOUR BET" }),
-                /* @__PURE__ */ jsx18(Text16, { style: [styles15.myBetTeam, { color: t.text }], children: myBet.team === "home" ? homeName : awayName }),
+              alreadyJoined && myBet && /* @__PURE__ */ jsxs15(View16, { style: [styles15.myBetCard, { backgroundColor: (myBet.team === "home" ? homeColor : myBet.team === "away" ? awayColor : drawColor) + "15", borderColor: myBet.team === "home" ? homeColor : myBet.team === "away" ? awayColor : drawColor }], children: [
+                /* @__PURE__ */ jsx18(Text16, { style: [styles15.myBetLabel, { color: myBet.team === "home" ? homeColor : myBet.team === "away" ? awayColor : drawColor }], children: "YOUR BET" }),
+                /* @__PURE__ */ jsx18(Text16, { style: [styles15.myBetTeam, { color: t.text }], children: myBet.team === "home" ? homeName : myBet.team === "away" ? awayName : "Draw" }),
                 /* @__PURE__ */ jsxs15(Text16, { style: [styles15.myBetAmount, { color: t.textMuted }], children: [
                   formatSol(myBet.amount),
                   " SOL"
@@ -6020,6 +6075,9 @@ var styles15 = StyleSheet16.create({
     flexDirection: "row",
     gap: 12
   },
+  drawRow: {
+    marginTop: 8
+  },
   summaryCard: {
     marginTop: 20,
     borderRadius: 16,
@@ -6095,7 +6153,7 @@ var styles15 = StyleSheet16.create({
 });
 
 // src/ui/game/ClaimPrizeSheet.tsx
-import { useState as useState30, useEffect as useEffect18, useRef as useRef11, useCallback as useCallback25 } from "react";
+import { useState as useState31, useEffect as useEffect19, useRef as useRef11, useCallback as useCallback26 } from "react";
 import {
   View as View17,
   Text as Text17,
@@ -6129,15 +6187,15 @@ function ClaimPrizeSheet({
   const overlayOpacity = useRef11(new Animated5.Value(0)).current;
   const celebrationScale = useRef11(new Animated5.Value(0)).current;
   const celebrationOpacity = useRef11(new Animated5.Value(0)).current;
-  const [showCelebration, setShowCelebration] = useState30(false);
-  useEffect18(() => {
+  const [showCelebration, setShowCelebration] = useState31(false);
+  useEffect19(() => {
     Animated5.timing(overlayOpacity, {
       toValue: visible ? 1 : 0,
       duration: 250,
       useNativeDriver: true
     }).start();
   }, [visible, overlayOpacity]);
-  useEffect18(() => {
+  useEffect19(() => {
     if (visible) {
       mutation.reset();
       setShowCelebration(false);
@@ -6145,7 +6203,7 @@ function ClaimPrizeSheet({
       celebrationOpacity.setValue(0);
     }
   }, [visible]);
-  useEffect18(() => {
+  useEffect19(() => {
     if (mutation.status === "success" && mutation.data) {
       setShowCelebration(true);
       Animated5.parallel([
@@ -6168,14 +6226,14 @@ function ClaimPrizeSheet({
       return () => clearTimeout(timer);
     }
   }, [mutation.status, mutation.data]);
-  useEffect18(() => {
+  useEffect19(() => {
     if (mutation.status === "error" && mutation.error) {
       onError?.(mutation.error);
     }
   }, [mutation.status, mutation.error]);
   const isMutating = mutation.status !== "idle" && mutation.status !== "success" && mutation.status !== "error";
   const canClaim = !isMutating && mutation.status !== "success" && !!wallet.publicKey;
-  const handleClaim = useCallback25(async () => {
+  const handleClaim = useCallback26(async () => {
     if (!wallet.publicKey) return;
     try {
       await mutation.execute({
@@ -6408,7 +6466,7 @@ var styles16 = StyleSheet17.create({
 });
 
 // src/ui/game/ClaimButton.tsx
-import { useState as useState31, useMemo as useMemo10, useCallback as useCallback26 } from "react";
+import { useState as useState32, useMemo as useMemo10, useCallback as useCallback27 } from "react";
 import { StyleSheet as StyleSheet18, Text as Text18, TouchableOpacity as TouchableOpacity13 } from "react-native";
 import { Fragment as Fragment5, jsx as jsx20, jsxs as jsxs17 } from "react/jsx-runtime";
 function ClaimButton({ gameId, style, onSuccess, onError }) {
@@ -6416,7 +6474,7 @@ function ClaimButton({ gameId, style, onSuccess, onError }) {
   const { wallet } = useDubs();
   const game = useGame(gameId);
   const claimStatus = useHasClaimed(gameId);
-  const [sheetVisible, setSheetVisible] = useState31(false);
+  const [sheetVisible, setSheetVisible] = useState32(false);
   const walletAddress = wallet.publicKey?.toBase58() ?? null;
   const myBet = useMemo10(() => {
     if (!walletAddress || !game.data?.bettors) return null;
@@ -6427,7 +6485,7 @@ function ClaimButton({ gameId, style, onSuccess, onError }) {
   const isWinner = isResolved && myBet != null && myBet.team === game.data?.winnerSide;
   const isEligible = myBet != null && isResolved && (isWinner || isRefund);
   const prizeAmount = isRefund ? myBet?.amount ?? 0 : game.data?.totalPool ?? 0;
-  const handleSuccess = useCallback26(
+  const handleSuccess = useCallback27(
     (result) => {
       claimStatus.refetch();
       onSuccess?.(result);
@@ -6514,7 +6572,7 @@ var styles17 = StyleSheet18.create({
 });
 
 // src/ui/game/EnterArcadePoolSheet.tsx
-import { useEffect as useEffect19, useRef as useRef12, useCallback as useCallback27 } from "react";
+import { useEffect as useEffect20, useRef as useRef12, useCallback as useCallback28 } from "react";
 import {
   View as View18,
   Text as Text19,
@@ -6546,19 +6604,19 @@ function EnterArcadePoolSheet({
   const { wallet } = useDubs();
   const mutation = useEnterArcadePool();
   const overlayOpacity = useRef12(new Animated6.Value(0)).current;
-  useEffect19(() => {
+  useEffect20(() => {
     Animated6.timing(overlayOpacity, {
       toValue: visible ? 1 : 0,
       duration: 250,
       useNativeDriver: true
     }).start();
   }, [visible, overlayOpacity]);
-  useEffect19(() => {
+  useEffect20(() => {
     if (visible) {
       mutation.reset();
     }
   }, [visible]);
-  useEffect19(() => {
+  useEffect20(() => {
     if (mutation.status === "success" && mutation.data) {
       onSuccess?.(mutation.data);
       const timer = setTimeout(() => {
@@ -6567,7 +6625,7 @@ function EnterArcadePoolSheet({
       return () => clearTimeout(timer);
     }
   }, [mutation.status, mutation.data]);
-  useEffect19(() => {
+  useEffect20(() => {
     if (mutation.status === "error" && mutation.error) {
       onError?.(mutation.error);
     }
@@ -6579,7 +6637,7 @@ function EnterArcadePoolSheet({
   const potSol = (pool.buy_in_lamports * Number(totalBuyIns) / 1e9).toFixed(4);
   const isMutating = mutation.status !== "idle" && mutation.status !== "success" && mutation.status !== "error";
   const canJoin = !isMutating && mutation.status !== "success";
-  const handleJoin = useCallback27(async () => {
+  const handleJoin = useCallback28(async () => {
     if (!wallet.publicKey) return;
     try {
       await mutation.execute(pool.id);
@@ -6730,7 +6788,7 @@ var styles18 = StyleSheet19.create({
 });
 
 // src/ui/game/ArcadeLeaderboardSheet.tsx
-import { useEffect as useEffect20, useRef as useRef13 } from "react";
+import { useEffect as useEffect21, useRef as useRef13 } from "react";
 import {
   View as View19,
   Text as Text20,
@@ -6759,14 +6817,14 @@ function ArcadeLeaderboardSheet({
   const t = useDubsTheme();
   const { pool, leaderboard, stats, loading, refetch } = useArcadePool(poolId);
   const overlayOpacity = useRef13(new Animated7.Value(0)).current;
-  useEffect20(() => {
+  useEffect21(() => {
     Animated7.timing(overlayOpacity, {
       toValue: visible ? 1 : 0,
       duration: 250,
       useNativeDriver: true
     }).start();
   }, [visible, overlayOpacity]);
-  useEffect20(() => {
+  useEffect21(() => {
     if (visible) refetch();
   }, [visible]);
   const renderItem = ({ item, index }) => {
@@ -6913,7 +6971,7 @@ var styles19 = StyleSheet20.create({
 });
 
 // src/ui/game/CreateGameSheet.tsx
-import { useState as useState33, useEffect as useEffect21, useRef as useRef14, useCallback as useCallback28 } from "react";
+import { useState as useState34, useEffect as useEffect22, useRef as useRef14, useCallback as useCallback29 } from "react";
 import {
   View as View20,
   Text as Text21,
@@ -6952,20 +7010,20 @@ function CreateGameSheet({
   const t = useDubsTheme();
   const { wallet } = useDubs();
   const mutation = useCreateGame();
-  const [selectedTeam, setSelectedTeam] = useState33(null);
-  const [wager, setWager] = useState33(0.01);
-  const [showSuccess, setShowSuccess] = useState33(false);
+  const [selectedTeam, setSelectedTeam] = useState34(null);
+  const [wager, setWager] = useState34(0.01);
+  const [showSuccess, setShowSuccess] = useState34(false);
   const overlayOpacity = useRef14(new Animated8.Value(0)).current;
   const successScale = useRef14(new Animated8.Value(0)).current;
   const successOpacity = useRef14(new Animated8.Value(0)).current;
-  useEffect21(() => {
+  useEffect22(() => {
     Animated8.timing(overlayOpacity, {
       toValue: visible ? 1 : 0,
       duration: 250,
       useNativeDriver: true
     }).start();
   }, [visible]);
-  useEffect21(() => {
+  useEffect22(() => {
     if (visible) {
       setSelectedTeam(null);
       setWager(0.01);
@@ -6975,7 +7033,7 @@ function CreateGameSheet({
       mutation.reset();
     }
   }, [visible]);
-  useEffect21(() => {
+  useEffect22(() => {
     if (mutation.status === "success" && mutation.data) {
       setShowSuccess(true);
       onSuccess?.(mutation.data);
@@ -6992,7 +7050,7 @@ function CreateGameSheet({
       return () => clearTimeout(timer);
     }
   }, [mutation.status, mutation.data]);
-  useEffect21(() => {
+  useEffect22(() => {
     if (mutation.status === "error" && mutation.error) {
       onError?.(mutation.error);
     }
@@ -7002,7 +7060,7 @@ function CreateGameSheet({
   const awayName = shortName ? shortName(opponents[1]?.name) : opponents[1]?.name || "Away";
   const isMutating = mutation.status !== "idle" && mutation.status !== "success" && mutation.status !== "error";
   const canCreate = selectedTeam !== null && !isMutating && mutation.status !== "success";
-  const handleCreate = useCallback28(async () => {
+  const handleCreate = useCallback29(async () => {
     if (!selectedTeam || !wallet.publicKey) return;
     try {
       await mutation.execute({
@@ -7202,6 +7260,7 @@ export {
   useGame,
   useGames,
   useHasClaimed,
+  useHighlights,
   useJoinGame,
   useNetworkGames,
   usePushNotifications,