@bettoredge/calcutta 0.2.0

package/src/components/sealed/SealedBidTabBar.tsx

@@ -0,0 +1,172 @@
+import React from 'react';
+import { StyleSheet, TouchableOpacity } from 'react-native';
+import { View, Text, useTheme } from '@bettoredge/styles';
+import { Ionicons } from '@expo/vector-icons';
+import type { CalcuttaLifecycleState } from '../../helpers/lifecycleState';
+
+export type SealedBidTab =
+    | 'items'
+    | 'my_bids'
+    | 'players'
+    | 'info'
+    | 'my_items'
+    | 'results'
+    | 'leaderboard';
+
+interface TabDef {
+    key: SealedBidTab;
+    label: string;
+    icon: keyof typeof Ionicons.glyphMap;
+    count?: number;
+}
+
+interface SealedBidTabBarProps {
+    activeTab: SealedBidTab;
+    onTabChange: (tab: SealedBidTab) => void;
+    itemCount: number;
+    myBidCount: number;
+    playerCount: number;
+    lifecycleState: CalcuttaLifecycleState;
+}
+
+function getTabsForState(
+    state: CalcuttaLifecycleState,
+    itemCount: number,
+    myBidCount: number,
+    playerCount: number,
+): TabDef[] {
+    switch (state) {
+        case 'pending':
+        case 'scheduled':
+            return [
+                { key: 'items', label: 'Items', icon: 'list-outline', count: itemCount },
+                { key: 'players', label: 'Players', icon: 'people-outline', count: playerCount },
+                { key: 'info', label: 'Info', icon: 'information-circle-outline' },
+            ];
+        case 'auctioning':
+            return [
+                { key: 'items', label: 'Items', icon: 'list-outline', count: itemCount },
+                { key: 'my_bids', label: 'My Bids', icon: 'pricetag-outline', count: myBidCount },
+                { key: 'players', label: 'Players', icon: 'people-outline', count: playerCount },
+                { key: 'info', label: 'Info', icon: 'information-circle-outline' },
+            ];
+        case 'tournament':
+        case 'completed':
+            return [
+                { key: 'my_items', label: 'My Items', icon: 'ribbon-outline', count: myBidCount },
+                { key: 'results', label: 'Results', icon: 'trophy-outline' },
+                { key: 'leaderboard', label: 'Leaderboard', icon: 'podium-outline' },
+                { key: 'info', label: 'Info', icon: 'information-circle-outline' },
+            ];
+    }
+}
+
+export const SealedBidTabBar: React.FC<SealedBidTabBarProps> = ({
+    activeTab,
+    onTabChange,
+    itemCount,
+    myBidCount,
+    playerCount,
+    lifecycleState,
+}) => {
+    const { theme } = useTheme();
+
+    const tabs = getTabsForState(lifecycleState, itemCount, myBidCount, playerCount);
+
+    return (
+        <View variant="transparent" style={[styles.container, { borderColor: theme.colors.border.subtle }]}>
+            {tabs.map((tab) => {
+                const isActive = activeTab === tab.key;
+                return (
+                    <TouchableOpacity
+                        key={tab.key}
+                        style={styles.tab}
+                        onPress={() => onTabChange(tab.key)}
+                        activeOpacity={0.7}
+                    >
+                        <View variant="transparent" style={styles.tabContent}>
+                            <Ionicons
+                                name={tab.icon}
+                                size={16}
+                                color={isActive ? theme.colors.primary.default : theme.colors.text.tertiary}
+                            />
+                            <Text
+                                variant="caption"
+                                bold={isActive}
+                                style={{
+                                    color: isActive ? theme.colors.primary.default : theme.colors.text.tertiary,
+                                    marginLeft: 4,
+                                    fontSize: 11,
+                                }}
+                            >
+                                {tab.label}
+                            </Text>
+                            {tab.count != null && tab.count > 0 && (
+                                <View
+                                    variant="transparent"
+                                    style={[
+                                        styles.badge,
+                                        {
+                                            backgroundColor: isActive
+                                                ? theme.colors.primary.default
+                                                : theme.colors.surface.elevated,
+                                        },
+                                    ]}
+                                >
+                                    <Text
+                                        variant="caption"
+                                        style={{
+                                            color: isActive ? '#FFFFFF' : theme.colors.text.tertiary,
+                                            fontSize: 9,
+                                        }}
+                                    >
+                                        {tab.count}
+                                    </Text>
+                                </View>
+                            )}
+                        </View>
+                        {isActive && (
+                            <View
+                                variant="transparent"
+                                style={[styles.indicator, { backgroundColor: theme.colors.primary.default }]}
+                            />
+                        )}
+                    </TouchableOpacity>
+                );
+            })}
+        </View>
+    );
+};
+
+const styles = StyleSheet.create({
+    container: {
+        flexDirection: 'row',
+        borderBottomWidth: 1,
+    },
+    tab: {
+        flex: 1,
+        alignItems: 'center',
+        paddingVertical: 10,
+    },
+    tabContent: {
+        flexDirection: 'row',
+        alignItems: 'center',
+    },
+    badge: {
+        minWidth: 16,
+        height: 16,
+        borderRadius: 8,
+        alignItems: 'center',
+        justifyContent: 'center',
+        marginLeft: 4,
+        paddingHorizontal: 4,
+    },
+    indicator: {
+        position: 'absolute',
+        bottom: 0,
+        left: '15%',
+        right: '15%',
+        height: 2,
+        borderRadius: 1,
+    },
+});

package/src/helpers/formatting.ts

@@ -0,0 +1,56 @@
+export const formatCurrency = (amount: number | string | undefined | null, market_type: string = 'FOR_MONEY'): string => {
+    const prefix = market_type === 'FOR_MONEY' ? '$' : 'E';
+    const num = Number(amount) || 0;
+    return `${prefix}${num.toFixed(2)}`;
+};
+
+export const formatPlace = (place: number): string => {
+    if (place <= 0) return '-';
+    const suffixes = ['th', 'st', 'nd', 'rd'];
+    const v = place % 100;
+    return place + (suffixes[(v - 20) % 10] || suffixes[v] || suffixes[0]);
+};
+
+export const getStatusLabel = (status: string): string => {
+    switch (status) {
+        case 'pending': return 'Pending';
+        case 'scheduled': return 'Scheduled';
+        case 'auction_open': return 'Auction Open';
+        case 'auction_closed': return 'Auction Closed';
+        case 'inprogress': return 'In Progress';
+        case 'closed': return 'Closed';
+        case 'not_started': return 'Not Started';
+        case 'in_progress': return 'In Progress';
+        case 'active': return 'Active';
+        case 'sold': return 'Sold';
+        case 'unsold': return 'Unsold';
+        case 'eliminated': return 'Eliminated';
+        case 'advanced': return 'Advanced';
+        case 'won': return 'Won';
+        case 'placed': return 'Placed';
+        case 'outbid': return 'Outbid';
+        case 'cancelled': return 'Cancelled';
+        default: return status;
+    }
+};
+
+export const getItemStatusColor = (status: string): string => {
+    switch (status) {
+        case 'active': return '#3B82F6';
+        case 'sold': return '#10B981';
+        case 'unsold': return '#6B7280';
+        case 'eliminated': return '#EF4444';
+        case 'pending': return '#F59E0B';
+        default: return '#6B7280';
+    }
+};
+
+export const getBidStatusColor = (status: string): string => {
+    switch (status) {
+        case 'active': return '#3B82F6';
+        case 'won': return '#10B981';
+        case 'outbid': return '#EF4444';
+        case 'cancelled': return '#6B7280';
+        default: return '#6B7280';
+    }
+};

package/src/helpers/lifecycleState.ts

@@ -0,0 +1,71 @@
+/**
+ * Calcutta lifecycle state derivation and predicates.
+ *
+ * Maps the two server fields (status + auction_status) into one of five
+ * user-facing lifecycle states so the UI can branch cleanly.
+ */
+
+export type CalcuttaLifecycleState =
+    | 'pending'
+    | 'scheduled'
+    | 'auctioning'
+    | 'tournament'
+    | 'completed';
+
+/**
+ * Derive the lifecycle state from competition.status and competition.auction_status.
+ *
+ * CRITICAL: auction_status === 'closed' is the hard gate. If the server says
+ * the auction is closed we NEVER return 'auctioning', no matter what `status` says.
+ *
+ * NOTE: We intentionally do NOT accept a client-side timer override here.
+ * When the countdown expires but the server hasn't confirmed, the lifecycle
+ * stays 'auctioning' and the orchestrator uses a separate `auctionExpired`
+ * flag to disable all bid actions. This prevents showing empty results
+ * before the server has resolved winners.
+ */
+export function deriveLifecycleState(
+    status?: string,
+    auction_status?: string,
+): CalcuttaLifecycleState {
+    // ── Hard gate: server confirmed auction closed ──
+    if (auction_status === 'closed') {
+        return status === 'closed' ? 'completed' : 'tournament';
+    }
+
+    if (!status) {
+        // No status but auction is in_progress — must be auctioning
+        if (auction_status === 'in_progress') return 'auctioning';
+        return 'pending';
+    }
+
+    switch (status) {
+        case 'pending':
+            return 'pending';
+        case 'scheduled':
+            return 'scheduled';
+        case 'auction_open':
+            return auction_status === 'in_progress' ? 'auctioning' : 'scheduled';
+        case 'auction_closed':
+        case 'inprogress':
+            return 'tournament';
+        case 'closed':
+            return 'completed';
+        default:
+            // Unknown status — fall back to auction_status
+            if (auction_status === 'in_progress') return 'auctioning';
+            return 'pending';
+    }
+}
+
+/** True when users can place / update / cancel bids */
+export const canBid = (state: CalcuttaLifecycleState): boolean =>
+    state === 'auctioning';
+
+/** True when escrow deposit / withdraw controls should be interactive */
+export const canManageEscrow = (state: CalcuttaLifecycleState): boolean =>
+    state === 'scheduled' || state === 'auctioning';
+
+/** True when round results / leaderboard data is meaningful */
+export const showResults = (state: CalcuttaLifecycleState): boolean =>
+    state === 'tournament' || state === 'completed';

package/src/helpers/payout.ts

@@ -0,0 +1,39 @@
+import type { CalcuttaPayoutRuleProps } from '@bettoredge/types';
+
+export const calculatePayoutPreview = (
+    total_pot: number,
+    rules: CalcuttaPayoutRuleProps[]
+): { description: string; payout_pct: number; payout_amount: number }[] => {
+    return rules.map(rule => ({
+        description: rule.description || `${rule.payout_type === 'round' ? `Round ${rule.round_number}` : `${rule.placement}${getOrdinal(rule.placement || 0)} Place`}`,
+        payout_pct: Number(rule.payout_pct),
+        payout_amount: (total_pot * Number(rule.payout_pct)) / 100,
+    }));
+};
+
+export const validatePayoutRules = (rules: CalcuttaPayoutRuleProps[]): string[] => {
+    const errors: string[] = [];
+    if (rules.length === 0) {
+        errors.push('At least one payout rule is required');
+        return errors;
+    }
+
+    const totalPct = rules.reduce((sum, r) => sum + Number(r.payout_pct), 0);
+    if (Math.abs(totalPct - 100) > 0.01) {
+        errors.push(`Payout percentages must sum to 100% (currently ${totalPct.toFixed(1)}%)`);
+    }
+
+    for (const rule of rules) {
+        if (Number(rule.payout_pct) <= 0) {
+            errors.push(`Payout percentage must be greater than 0`);
+        }
+    }
+
+    return errors;
+};
+
+const getOrdinal = (n: number): string => {
+    const suffixes = ['th', 'st', 'nd', 'rd'];
+    const v = n % 100;
+    return suffixes[(v - 20) % 10] || suffixes[v] || suffixes[0];
+};

package/src/helpers/validation.ts

@@ -0,0 +1,64 @@
+import type { CalcuttaCompetitionProps, CalcuttaEscrowProps } from '@bettoredge/types';
+
+export const validateBidAmount = (
+    amount: number,
+    current_bid: number,
+    min_bid: number,
+    bid_increment: number,
+    auction_type: string,
+    escrow?: CalcuttaEscrowProps,
+    existing_bid_amount?: number
+): string[] => {
+    const errors: string[] = [];
+
+    if (isNaN(amount) || amount <= 0) {
+        errors.push('Please enter a valid bid amount');
+        return errors;
+    }
+
+    if (amount < min_bid) {
+        errors.push(`Minimum bid is $${min_bid.toFixed(2)}`);
+    }
+
+    if (amount <= current_bid) {
+        errors.push(`Bid must exceed current bid of $${current_bid.toFixed(2)}`);
+    }
+
+    if (auction_type === 'live' && amount < current_bid + bid_increment) {
+        errors.push(`Minimum bid is $${(current_bid + bid_increment).toFixed(2)}`);
+    }
+
+    if (escrow) {
+        const available = Number(escrow.escrow_balance) + (existing_bid_amount || 0);
+        if (amount > available) {
+            errors.push(`Insufficient escrow balance. Available: $${available.toFixed(2)}`);
+        }
+    }
+
+    return errors;
+};
+
+export const validateEscrowDeposit = (amount: number, max_escrow?: number, net_deposited?: number): string[] => {
+    const errors: string[] = [];
+    if (isNaN(amount) || amount <= 0) {
+        errors.push('Please enter a valid amount');
+    }
+    if (max_escrow != null && max_escrow > 0 && net_deposited != null) {
+        const remaining = max_escrow - net_deposited;
+        if (amount > remaining) {
+            errors.push(`Budget cap is $${max_escrow.toFixed(2)}. You can deposit up to $${Math.max(0, remaining).toFixed(2)} more.`);
+        }
+    }
+    return errors;
+};
+
+export const validateEscrowWithdraw = (amount: number, available: number): string[] => {
+    const errors: string[] = [];
+    if (isNaN(amount) || amount <= 0) {
+        errors.push('Please enter a valid amount');
+    }
+    if (amount > available) {
+        errors.push(`Maximum withdrawal is $${available.toFixed(2)}`);
+    }
+    return errors;
+};

package/src/hooks/useCalcuttaAuction.ts

@@ -0,0 +1,164 @@
+import { useState, useEffect, useCallback, useRef } from 'react';
+import { getCalcuttaAuctionStatus } from '@bettoredge/api';
+import type {
+    CalcuttaCompetitionProps,
+    CalcuttaAuctionItemProps,
+    CalcuttaBidProps,
+} from '@bettoredge/types';
+
+export interface CalcuttaAuctionState {
+    loading: boolean;
+    competition?: CalcuttaCompetitionProps;
+    items: CalcuttaAuctionItemProps[];
+    bids: CalcuttaBidProps[];
+    my_bids: CalcuttaBidProps[];
+    paused: boolean;
+}
+
+export const useCalcuttaAuction = (calcutta_competition_id?: string, poll_interval: number = 5000, player_id?: string) => {
+    const [state, setState] = useState<CalcuttaAuctionState>({
+        loading: false,
+        items: [],
+        bids: [],
+        my_bids: [],
+        paused: false,
+    });
+    const intervalRef = useRef<ReturnType<typeof setInterval> | null>(null);
+
+    const fetchStatus = useCallback(async () => {
+        if (!calcutta_competition_id) return;
+        try {
+            const resp = await getCalcuttaAuctionStatus(calcutta_competition_id);
+            setState({
+                loading: false,
+                competition: resp.competition,
+                items: resp.items,
+                bids: resp.bids,
+                my_bids: resp.my_bids,
+                paused: resp.competition?.auction_status === 'paused',
+            });
+        } catch {
+            // Silently fail on poll
+        }
+    }, [calcutta_competition_id]);
+
+    useEffect(() => {
+        if (!calcutta_competition_id) return;
+        setState(prev => ({ ...prev, loading: true }));
+        fetchStatus();
+
+        // Start polling
+        intervalRef.current = setInterval(fetchStatus, poll_interval);
+        return () => {
+            if (intervalRef.current) clearInterval(intervalRef.current);
+        };
+    }, [calcutta_competition_id, poll_interval, fetchStatus]);
+
+    const stopPolling = useCallback(() => {
+        if (intervalRef.current) {
+            clearInterval(intervalRef.current);
+            intervalRef.current = null;
+        }
+    }, []);
+
+    // Socket event handlers for live mode — update local state directly
+    const handleBidUpdate = useCallback((data: { item: CalcuttaAuctionItemProps; bid: CalcuttaBidProps; item_deadline?: string }) => {
+        setState(prev => {
+            const newState = {
+                ...prev,
+                items: prev.items.map(i =>
+                    i.calcutta_auction_item_id === data.item.calcutta_auction_item_id ? data.item : i
+                ),
+                bids: [...prev.bids.filter(b => b.calcutta_bid_id !== data.bid.calcutta_bid_id), data.bid],
+                my_bids: prev.my_bids,
+            };
+            // Update my_bids if this bid belongs to the current user
+            if (player_id && data.bid.player_id === player_id) {
+                newState.my_bids = [
+                    ...prev.my_bids.filter(b => b.calcutta_auction_item_id !== data.bid.calcutta_auction_item_id),
+                    data.bid,
+                ];
+            }
+            return newState;
+        });
+    }, [player_id]);
+
+    const handleItemActive = useCallback((data: { item: CalcuttaAuctionItemProps; item_deadline?: string }) => {
+        setState(prev => ({
+            ...prev,
+            competition: prev.competition ? { ...prev.competition, current_auction_item_id: data.item.calcutta_auction_item_id } : prev.competition,
+            items: prev.items.map(i =>
+                i.calcutta_auction_item_id === data.item.calcutta_auction_item_id ? data.item : i
+            ),
+        }));
+    }, []);
+
+    const handleItemSold = useCallback((data: { item: CalcuttaAuctionItemProps; winning_bid: CalcuttaBidProps; winning_player_id: string }) => {
+        setState(prev => ({
+            ...prev,
+            items: prev.items.map(i =>
+                i.calcutta_auction_item_id === data.item.calcutta_auction_item_id
+                    ? { ...data.item, winning_bid: data.winning_bid?.bid_amount ?? data.item.winning_bid, winning_player_id: data.winning_player_id }
+                    : i
+            ),
+        }));
+    }, []);
+
+    const handleItemUnsold = useCallback((data: { item: CalcuttaAuctionItemProps }) => {
+        setState(prev => ({
+            ...prev,
+            items: prev.items.map(i =>
+                i.calcutta_auction_item_id === data.item.calcutta_auction_item_id ? data.item : i
+            ),
+        }));
+    }, []);
+
+    const handleAuctionPaused = useCallback(() => {
+        setState(prev => ({
+            ...prev,
+            paused: true,
+            competition: prev.competition ? { ...prev.competition, auction_status: 'paused' } : prev.competition,
+            // Clear item deadline on active item
+            items: prev.items.map(i =>
+                i.calcutta_auction_item_id === prev.competition?.current_auction_item_id
+                    ? { ...i, item_deadline: null }
+                    : i
+            ),
+        }));
+    }, []);
+
+    const handleAuctionResumed = useCallback((data: { item?: CalcuttaAuctionItemProps; item_deadline?: string }) => {
+        setState(prev => ({
+            ...prev,
+            paused: false,
+            competition: prev.competition ? { ...prev.competition, auction_status: 'in_progress' } : prev.competition,
+            items: data.item
+                ? prev.items.map(i =>
+                    i.calcutta_auction_item_id === data.item!.calcutta_auction_item_id ? data.item! : i
+                )
+                : prev.items,
+        }));
+    }, []);
+
+    const handleAuctionClosed = useCallback((data: { competition: CalcuttaCompetitionProps }) => {
+        setState(prev => ({
+            ...prev,
+            competition: data.competition,
+            paused: false,
+        }));
+    }, []);
+
+    return {
+        ...state,
+        refresh: fetchStatus,
+        stopPolling,
+        // Socket event handlers for CalcuttaAuction to wire up
+        handleBidUpdate,
+        handleItemActive,
+        handleItemSold,
+        handleItemUnsold,
+        handleAuctionPaused,
+        handleAuctionResumed,
+        handleAuctionClosed,
+    };
+};

package/src/hooks/useCalcuttaBid.ts

@@ -0,0 +1,43 @@
+import { useState, useCallback } from 'react';
+import { placeCalcuttaBid, cancelCalcuttaBid } from '@bettoredge/api';
+import type { CalcuttaBidProps } from '@bettoredge/types';
+
+export interface CalcuttaBidState {
+    loading: boolean;
+    error?: string;
+    last_bid?: CalcuttaBidProps;
+}
+
+export const useCalcuttaBid = () => {
+    const [state, setState] = useState<CalcuttaBidState>({ loading: false });
+
+    const placeBid = useCallback(async (calcutta_auction_item_id: string, amount: number) => {
+        setState({ loading: true });
+        try {
+            const resp = await placeCalcuttaBid({ calcutta_auction_item_id, amount });
+            setState({ loading: false, last_bid: resp.bid });
+            return resp.bid;
+        } catch (e: any) {
+            setState({ loading: false, error: e.message });
+            throw e;
+        }
+    }, []);
+
+    const cancelBid = useCallback(async (calcutta_bid_id: string) => {
+        setState(prev => ({ ...prev, loading: true }));
+        try {
+            const resp = await cancelCalcuttaBid(calcutta_bid_id);
+            setState({ loading: false, last_bid: resp.bid });
+            return resp.bid;
+        } catch (e: any) {
+            setState(prev => ({ ...prev, loading: false, error: e.message }));
+            throw e;
+        }
+    }, []);
+
+    const clearError = useCallback(() => {
+        setState(prev => ({ ...prev, error: undefined }));
+    }, []);
+
+    return { ...state, placeBid, cancelBid, clearError };
+};

package/src/hooks/useCalcuttaCompetition.ts

@@ -0,0 +1,63 @@
+import { useState, useEffect, useCallback } from 'react';
+import { getCalcuttaCompetition } from '@bettoredge/api';
+import type {
+    CalcuttaCompetitionProps,
+    CalcuttaRoundProps,
+    CalcuttaAuctionItemProps,
+    CalcuttaParticipantProps,
+    CalcuttaPayoutRuleProps,
+    CalcuttaItemResultProps,
+    CalcuttaBidProps,
+    CalcuttaEscrowProps,
+} from '@bettoredge/types';
+
+export interface CalcuttaCompetitionState {
+    loading: boolean;
+    competition?: CalcuttaCompetitionProps;
+    rounds: CalcuttaRoundProps[];
+    items: CalcuttaAuctionItemProps[];
+    participants: CalcuttaParticipantProps[];
+    payout_rules: CalcuttaPayoutRuleProps[];
+    item_results: CalcuttaItemResultProps[];
+    my_bids: CalcuttaBidProps[];
+    my_escrow?: CalcuttaEscrowProps;
+}
+
+export const useCalcuttaCompetition = (calcutta_competition_id?: string) => {
+    const [state, setState] = useState<CalcuttaCompetitionState>({
+        loading: false,
+        rounds: [],
+        items: [],
+        participants: [],
+        payout_rules: [],
+        item_results: [],
+        my_bids: [],
+    });
+
+    const fetchCompetition = useCallback(async () => {
+        if (!calcutta_competition_id) return;
+        setState(prev => ({ ...prev, loading: true }));
+        try {
+            const resp = await getCalcuttaCompetition(calcutta_competition_id);
+            setState({
+                loading: false,
+                competition: resp.competition,
+                rounds: resp.rounds,
+                items: resp.items,
+                participants: resp.participants,
+                payout_rules: resp.payout_rules,
+                item_results: resp.item_results,
+                my_bids: resp.my_bids,
+                my_escrow: resp.my_escrow,
+            });
+        } catch {
+            setState(prev => ({ ...prev, loading: false }));
+        }
+    }, [calcutta_competition_id]);
+
+    useEffect(() => {
+        fetchCompetition();
+    }, [fetchCompetition]);
+
+    return { ...state, refresh: fetchCompetition };
+};