@dubsdotapp/expo 0.5.16 → 0.5.18

package/src/index.ts

@@ -77,6 +77,13 @@ export type {
   BuildArcadeEntryResult,
   EnterArcadePoolResult,
   ArcadePoolResult,
+  JackpotRound,
+  JackpotLastWinner,
+  JackpotEntry,
+  JackpotRoundResult,
+  JackpotConfig,
+  BuildJackpotEnterResult,
+  ConfirmJackpotEnterResult,
 } from './types';
 
 // Provider
@@ -111,6 +118,9 @@ export {
   useEnterArcadePool,
   useArcadeCountdown,
   useArcadeBridge,
+  useJackpot,
+  useJackpotHistory,
+  useEnterJackpot,
 } from './hooks';
 export type {
   CreateGameMutationResult,
@@ -129,6 +139,9 @@ export type {
   UseArcadeBridgeResult,
   HighlightVideo,
   ShortVideo,
+  UseJackpotResult,
+  UseJackpotHistoryResult,
+  EnterJackpotMutationResult,
 } from './hooks';
 
 export { useHighlights, useShorts } from './hooks';
@@ -155,6 +168,48 @@ export type {
   ArcadeLeaderboardSheetProps,
 } from './ui';
 
+// Jackpot widgets
+export { JackpotCard, JackpotSheet, JackpotWidget } from './ui';
+export type { JackpotCardProps, JackpotSheetProps, JackpotWidgetProps } from './ui';
+
+// Chat module
+export {
+  ChatProvider,
+  useChatContext,
+  ChatSocket,
+  useChatStatus,
+  useChatMessages,
+  useSendMessage,
+  useOnlineUsers,
+  useUnreadCount,
+  useConversations,
+  useDirectMessages,
+  useFriends,
+  useFriendRequests,
+  useSearchUsers,
+  useSendFriendRequest,
+  useRespondToFriendRequest,
+} from './chat';
+export type {
+  ChatProviderProps,
+  ChatContextValue,
+  ChatSocketConfig,
+  ChatSocketListeners,
+  ChatMessage,
+  ChatMention,
+  ChatPayment,
+  DirectMessage,
+  Conversation,
+  FriendUser,
+  FriendRequest,
+  OnlineUser,
+  TypingEvent,
+  ChatNotification,
+  ChatConnectionStatus,
+  SendMessageParams,
+  SendDMParams,
+} from './chat';
+
 // Utils
 export { signAndSendBase64Transaction } from './utils/transaction';
 export { getDeviceInfo, isSolanaSeeker } from './utils/device';

package/src/types.ts

@@ -581,6 +581,66 @@ export interface ArcadePoolResult {
   best_score: number;
 }
 
+// ── Jackpot ──
+
+export interface JackpotRound {
+  roundId: string;
+  status: 'Open' | 'Locked' | 'Resolved';
+  totalPotLamports: string;
+  totalPotSol: number;
+  entryCount: number;
+  totalWeight: string;
+  timeRemainingSlots: number;
+}
+
+export interface JackpotLastWinner {
+  roundId: string;
+  winner: string;
+  winAmount: string;
+  winAmountSol: number;
+  totalPot: string;
+  entryCount: number;
+  timestamp: string | null;
+}
+
+export interface JackpotEntry {
+  player: string;
+  weight: string;
+  weightSol: number;
+  oddsPercent: string;
+}
+
+export interface JackpotRoundResult {
+  roundId: string;
+  winner: string;
+  winAmount: string;
+  winAmountSol: number;
+  totalPot: string;
+  totalPotSol: number;
+  entryCount: number;
+  timestamp: string;
+}
+
+export interface JackpotConfig {
+  feeBasisPoints: number;
+  roundDurationSlots: string;
+  minEntryLamports: number;
+  minEntrySol: number;
+}
+
+export interface BuildJackpotEnterResult {
+  transaction: string;
+  roundId: string;
+  amount: string;
+  amountSol: number;
+}
+
+export interface ConfirmJackpotEnterResult {
+  attributed: boolean;
+  appId: number;
+  signature: string;
+}
+
 // ── UI Config (developer branding) ──
 
 export interface UiConfig {

package/src/ui/game/JoinGameSheet.tsx

@@ -88,7 +88,7 @@ export function JoinGameSheet({
 
   const isCustomGame = game.gameMode === CUSTOM_GAME_MODE;
 
-  const [selectedTeam, setSelectedTeam] = useState<'home' | 'away' | null>(null);
+  const [selectedTeam, setSelectedTeam] = useState<'home' | 'away' | 'draw' | null>(null);
   const [wager, setWager] = useState(game.buyIn);
   const [showSuccess, setShowSuccess] = useState(false);
 
@@ -288,11 +288,14 @@ export function JoinGameSheet({
 
             {/* Team Selection — hidden in pool mode and custom games */}
             {!isCustomGame && !isPoolModeEnabled && !alreadyJoined && (
-              <View style={styles.section}>
-                <Text style={[styles.sectionLabel, { color: t.textSecondary }]}>Pick Your Side</Text>
-                <View style={styles.teamsRow}>
-                  <TeamButton
+              hasDrawOption ? (
+                /* ── 3-way layout: Home / VS / Away / OR / Draw ── */
+                <View style={styles.section}>
+                  <Text style={[styles.sectionLabel, { color: t.textSecondary }]}>Who will win?</Text>
+
+                  <PickRow
                     name={homeName}
+                    subtitle="Home Team"
                     imageUrl={opponents[0]?.imageUrl}
                     odds={homeOdds}
                     bets={homeBets}
@@ -302,8 +305,16 @@ export function JoinGameSheet({
                     ImageComponent={ImageComponent}
                     t={t}
                   />
-                  <TeamButton
+
+                  <View style={styles.dividerRow}>
+                    <View style={[styles.dividerLine, { backgroundColor: t.border }]} />
+                    <Text style={[styles.dividerText, { color: t.textMuted }]}>VS</Text>
+                    <View style={[styles.dividerLine, { backgroundColor: t.border }]} />
+                  </View>
+
+                  <PickRow
                     name={awayName}
+                    subtitle="Away Team"
                     imageUrl={opponents[1]?.imageUrl}
                     odds={awayOdds}
                     bets={awayBets}
@@ -313,21 +324,54 @@ export function JoinGameSheet({
                     ImageComponent={ImageComponent}
                     t={t}
                   />
+
+                  <View style={styles.dividerRow}>
+                    <View style={[styles.dividerLine, { backgroundColor: t.border }]} />
+                    <Text style={[styles.dividerText, { color: t.textMuted }]}>OR</Text>
+                    <View style={[styles.dividerLine, { backgroundColor: t.border }]} />
+                  </View>
+
+                  <PickRow
+                    name="Draw"
+                    subtitle="Match ends in a tie"
+                    odds={drawOdds}
+                    bets={drawBets}
+                    color={drawColor}
+                    selected={selectedTeam === 'draw'}
+                    onPress={() => { setSelectedTeam('draw' as any); onTeamSelect?.('draw' as any); }}
+                    t={t}
+                  />
                 </View>
-                {hasDrawOption && (
-                  <View style={styles.drawRow}>
+              ) : (
+                /* ── 2-way layout: side by side ── */
+                <View style={styles.section}>
+                  <Text style={[styles.sectionLabel, { color: t.textSecondary }]}>Pick Your Side</Text>
+                  <View style={styles.teamsRow}>
                     <TeamButton
-                      name="Draw"
-                      odds={drawOdds}
-                      bets={drawBets}
-                      color={drawColor}
-                      selected={selectedTeam === 'draw'}
-                      onPress={() => { setSelectedTeam('draw' as any); onTeamSelect?.('draw' as any); }}
+                      name={homeName}
+                      imageUrl={opponents[0]?.imageUrl}
+                      odds={homeOdds}
+                      bets={homeBets}
+                      color={homeColor}
+                      selected={selectedTeam === 'home'}
+                      onPress={() => { setSelectedTeam('home'); onTeamSelect?.('home'); }}
+                      ImageComponent={ImageComponent}
+                      t={t}
+                    />
+                    <TeamButton
+                      name={awayName}
+                      imageUrl={opponents[1]?.imageUrl}
+                      odds={awayOdds}
+                      bets={awayBets}
+                      color={awayColor}
+                      selected={selectedTeam === 'away'}
+                      onPress={() => { setSelectedTeam('away'); onTeamSelect?.('away'); }}
+                      ImageComponent={ImageComponent}
                       t={t}
                     />
                   </View>
-                )}
-              </View>
+                </View>
+              )
             )}
 
             {/* Already joined — show which side */}
@@ -443,6 +487,105 @@ export function JoinGameSheet({
 }
 
 
+// ── PickRow (vertical 3-way layout for draw-supported leagues) ──
+
+function PickRow({
+  name, subtitle, imageUrl, odds, bets, color, selected, onPress, ImageComponent, t,
+}: {
+  name: string; subtitle?: string; imageUrl?: string | null; odds: string; bets: number;
+  color: string; selected: boolean; onPress: () => void;
+  ImageComponent?: React.ComponentType<any>; t: any;
+}) {
+  const [imgFailed, setImgFailed] = useState(false);
+  const Img = ImageComponent || require('react-native').Image;
+  const showImage = imageUrl && !imgFailed;
+
+  return (
+    <TouchableOpacity
+      style={[pickStyles.row, { borderColor: selected ? color : t.border, backgroundColor: selected ? color + '12' : t.background }]}
+      onPress={onPress}
+      activeOpacity={0.7}
+    >
+      {showImage ? (
+        <Img source={{ uri: imageUrl }} style={pickStyles.logo} resizeMode="contain" onError={() => setImgFailed(true)} />
+      ) : (
+        <View style={[pickStyles.logoPlaceholder, { backgroundColor: color + '20' }]}>
+          <Text style={[pickStyles.logoEmoji, { color }]}>{name === 'Draw' ? '🤝' : name.charAt(0)}</Text>
+        </View>
+      )}
+      <View style={pickStyles.info}>
+        <Text style={[pickStyles.name, { color: t.text }]}>{name}</Text>
+        {subtitle && <Text style={[pickStyles.subtitle, { color: t.textMuted }]}>{subtitle}</Text>}
+      </View>
+      {odds !== '—' && <Text style={[pickStyles.odds, { color }]}>{odds}x</Text>}
+      {bets > 0 && <Text style={[pickStyles.bets, { color: t.textMuted }]}>{bets}</Text>}
+      {selected && (
+        <View style={[pickStyles.check, { backgroundColor: color }]}>
+          <Text style={pickStyles.checkText}>✓</Text>
+        </View>
+      )}
+    </TouchableOpacity>
+  );
+}
+
+const pickStyles = StyleSheet.create({
+  row: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    borderWidth: 1.5,
+    borderRadius: 14,
+    paddingVertical: 12,
+    paddingHorizontal: 14,
+    gap: 12,
+  },
+  logo: {
+    width: 36,
+    height: 36,
+    borderRadius: 18,
+  },
+  logoPlaceholder: {
+    width: 36,
+    height: 36,
+    borderRadius: 18,
+    alignItems: 'center',
+    justifyContent: 'center',
+  },
+  logoEmoji: {
+    fontSize: 16,
+    fontWeight: '800',
+  },
+  info: {
+    flex: 1,
+  },
+  name: {
+    fontSize: 15,
+    fontWeight: '700',
+  },
+  subtitle: {
+    fontSize: 12,
+    marginTop: 1,
+  },
+  odds: {
+    fontSize: 16,
+    fontWeight: '800',
+  },
+  bets: {
+    fontSize: 12,
+  },
+  check: {
+    width: 22,
+    height: 22,
+    borderRadius: 11,
+    alignItems: 'center',
+    justifyContent: 'center',
+  },
+  checkText: {
+    color: '#FFF',
+    fontSize: 13,
+    fontWeight: '800',
+  },
+});
+
 const styles = StyleSheet.create({
   overlay: {
     ...StyleSheet.absoluteFillObject,
@@ -568,6 +711,20 @@ const styles = StyleSheet.create({
   drawRow: {
     marginTop: 8,
   },
+  dividerRow: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    gap: 12,
+    marginVertical: 6,
+  },
+  dividerLine: {
+    flex: 1,
+    height: 1,
+  },
+  dividerText: {
+    fontSize: 12,
+    fontWeight: '700',
+  },
   summaryCard: {
     marginTop: 20,
     borderRadius: 16,

package/src/ui/index.ts

@@ -15,6 +15,10 @@ export type { DubsTheme } from './theme';
 
 // Game widgets
 export { GamePoster, LivePoolsCard, PickWinnerCard, PlayersCard, JoinGameButton, CreateCustomGameSheet, CreateGameSheet, JoinGameSheet, ClaimPrizeSheet, ClaimButton, EnterArcadePoolSheet, ArcadeLeaderboardSheet, SolSlider } from './game';
+
+// Jackpot widgets
+export { JackpotCard, JackpotSheet, JackpotWidget } from './jackpot';
+export type { JackpotCardProps, JackpotSheetProps, JackpotWidgetProps } from './jackpot';
 export type {
   GamePosterProps,
   LivePoolsCardProps,