be-components 2.4.7 → 2.4.8

package/src/LocationTracker/api/index.tsx

@@ -112,13 +112,29 @@ const LocationHelpers = {
         let region = '';
         let location:LocationProps | undefined
         let administrative = addresses.find(r => r.types.includes('administrative_area_level_1'))?.address_components;
+        let street_address_components = addresses.find(r => r.types.includes('street_address'))?.address_components;
+        let route_address_component = addresses.find(r => r.types.includes('route'))?.address_components;
+
         if(administrative){
             let region_component = administrative.find((a:any) => a.types.includes('administrative_area_level_1'));
             if(region_component){ 
                 region = region_component.long_name
                 location = locations.find(l => l.label.toLowerCase() == region?.toLowerCase())
             }
+        } else if (!street_address_components){
+            let region_component = street_address_components.find((a:any) => a.types.includes('administrative_area_level_1'));
+            if(region_component){ 
+                region = region_component.long_name
+                location = locations.find(l => l.label.toLowerCase() == region?.toLowerCase())
+            }
+        }  else if (route_address_component){
+            let region_component = route_address_component.find((a:any) => a.types.includes('administrative_area_level_1'));
+            if(region_component){ 
+                region = region_component.long_name
+                location = locations.find(l => l.label.toLowerCase() == region?.toLowerCase())
+            }
         }
+
         let street_address = addresses.find(r => r.types.includes('premise'))?.address_components
         if(!street_address){ return { region, location } }
         street_address = addresses.find(r => r.types.includes('street_address'))?.address_components

package/src/MarketMaker/api/index.ts

@@ -0,0 +1,178 @@
+import axios from "axios";
+import { APIOverrides } from "../../ApiOverrides";
+import type { BestAvailableOrderProps, BestAvailableResponseProps, EventOrderStatProps, EventProps, ExternalPriceProps, LeagueProps, MarketProps, MatchProps, OrderProps, SortedContestProps, TournamentProps, TradeProps } from "../../types";
+import moment from "moment-mini";
+
+let EVENT_SVC_API = '';
+let MK_SVC_API = '';
+//let AUTH_SVC_API = '';
+
+export { MarketMakerApi, MarketMaketHelpers }
+
+const MarketMakerApi = {
+    setEnvironment: () => {
+        const endpoints = APIOverrides.getEndpoints();
+        EVENT_SVC_API = endpoints['EVENT_SVC_API'] as string;
+        MK_SVC_API = endpoints['MK_SVC_API'] as string;
+        //AUTH_SVC_API = endpoints['AUTH_SVC_API'] as string;
+    },
+    getLeagues: async():Promise<LeagueProps[]> => {
+        try {
+            const resp = await axios.get(`${EVENT_SVC_API}/v1/leagues`);
+            return resp.data.leagues
+        } catch (e) {
+            return []
+        }
+    },
+    getMarkets: async():Promise<MarketProps[]> => {
+        try {
+            const resp = await axios.get(`${MK_SVC_API}/v1/markets/all`);
+            return resp.data.markets
+        } catch (e) {
+            return []
+        }
+    },
+    getMyAction: async():Promise<OrderProps[]> => {
+        try {
+            const resp = await axios.get(`${MK_SVC_API}/v1/orders/action/me`);
+            return resp.data.orders
+        } catch (e) {
+            return []
+        }
+    },
+    getActiveEvents: async():Promise<EventProps[]> => {
+        try {
+            const resp = await axios.get(`${EVENT_SVC_API}/v1/events/active?expanded=true`);
+            return resp.data.events
+        } catch (e) {
+            return []
+        }
+    },
+    getEventsByEventIds: async(event_ids:string[]):Promise<EventProps[]> => {
+        if(event_ids.length == 0){ return [] }
+        try {
+            const resp = await axios.post(`${EVENT_SVC_API}/v1/events/bulk/get`, { attribute:'event_id', values: event_ids })
+            return resp.data.events
+        } catch (e) {
+            return []
+        }
+    },
+    getBestAvailableOrders: async():Promise<BestAvailableResponseProps> => {
+        try {
+            const resp = await axios.get(`${MK_SVC_API}/v1/orders/available`)
+            return resp.data
+        } catch (e) {
+            return { events: [], tournaments: [], matches:[] }
+        }
+    },
+    getPricesByEvent: async(event_id:string, event_type:string):Promise<ExternalPriceProps[]> => {
+        try {
+            const resp = await axios.get(`${EVENT_SVC_API}/v1/prices/latest/${event_id}/${event_type}`);
+            console.log(resp.data)
+            return resp.data.prices
+        } catch (e) {
+            console.log(e);
+            return []
+        }
+    },
+    getLatestTradesByEvents: async(event_type: string, event_ids:string[]) => {
+        try {
+            if(event_ids.length == 0){ return [] }
+            const resp = await axios.post(`${MK_SVC_API}/v1/trades/event/latest/bulk/get`, { event_type, event_ids })
+            return resp.data.trades
+        } catch (e) {
+            console.log(e)
+            return []
+        }
+    },
+}
+
+const MarketMaketHelpers = {
+    getOrderStats:(orders:OrderProps[]) => {
+        const open_amt = orders.reduce((a,b) => a + b.open_amt, 0);
+        const called_amt = orders.reduce((a,b) => a + b.called_amt, 0);
+        return { open_amt, called_amt }
+    },
+    sortContests: (events:EventProps[], tournaments:TournamentProps[], matches:MatchProps[], markets:MarketProps[]):SortedContestProps[] => {
+        let contests:SortedContestProps[] = []
+        events.map(e => {
+            let e_markets = e.supported_markets ? markets.filter(m => e.supported_markets?.map(sm => sm.market_id.toString()).includes(m.market_id.toString())) : []
+            contests.push({ 
+                league_id: e.league_id, 
+                id: e.event_id, 
+                title: e.event_title, 
+                contest_type: 'team', 
+                time_detail: e.time_detail == 'scheduled' ? moment(e.scheduled_datetime).format('MMM DD : hh:mm a'): e.time_detail ?? '', 
+                scheduled_datetime: moment(e.scheduled_datetime),
+                markets: e_markets
+            })
+        })
+        tournaments.map(t => {
+            let t_markets = t.supported_markets ? markets.filter(m => t.supported_markets?.map(sm => sm.market_id.toString()).includes(m.market_id.toString())) : []
+
+            contests.push({ markets: t_markets, league_id: t.league_id, id: t.tournament_id, title: t.tournament_name, contest_type: 'tournament', time_detail: moment(t.scheduled_datetime).format('MMM DD : hh:mm a'), scheduled_datetime: moment(t.scheduled_datetime) })
+        })
+        matches.map(m => {
+            const tourney = tournaments.find(t => t.tournament_id == m.tournament_id);
+            let m_markets = m.supported_markets ? markets.filter(mk => m.supported_markets?.map(sm => sm.market_id.toString()).includes(mk.market_id.toString())) : []
+            contests.push({ markets:m_markets, league_id:tourney?.league_id, id: m.match_id, title: m.match_title, contest_type: 'match', time_detail: moment(m.scheduled_datetime).format('MMM DD : hh:mm a'), scheduled_datetime: moment(m.scheduled_datetime) })
+        })
+        return contests
+    },
+    getSelectableMarkets: (events:EventProps[], tournaments:TournamentProps[], matches:MatchProps[], markets:MarketProps[]):MarketProps[] => {
+        let market_ids:string[] = []
+        events.map(e => {
+            if(e.supported_markets){
+                market_ids = market_ids.concat(e.supported_markets.map(sm => sm.market_id))
+            }
+        });
+        tournaments.map(e => {
+            if(e.supported_markets){
+                market_ids = market_ids.concat(e.supported_markets.map(sm => sm.market_id))
+            }
+        })
+        matches.map(e => {
+            if(e.supported_markets){
+                market_ids = market_ids.concat(e.supported_markets.map(sm => sm.market_id))
+            }
+        })
+        market_ids = [ ...new Set(market_ids.map(id => id.toString())) ]
+        return markets.filter(m => market_ids.includes(m.market_id.toString()))
+    },
+    getMarketDataFromBestAvailable: (ba:BestAvailableResponseProps):{ updated:boolean, latest_trades:TradeProps[], event_order_stats:EventOrderStatProps[], available_orders:BestAvailableOrderProps[] } => {
+        let updated = false;
+        let event_order_stats:EventOrderStatProps[] = []
+        let available_orders:BestAvailableOrderProps[] = []
+        let latest_trades:TradeProps[] = []
+        ba.events.map(ba_event => {
+            if(!ba_event.supported_markets){ return }
+            updated = true
+            ba_event.supported_markets.map(sm => {
+                if(sm.available_orders){ available_orders = available_orders.concat(sm.available_orders) }
+                if(sm.order_stats){ event_order_stats = event_order_stats.concat(sm.order_stats) }
+                if(sm.latest_trades){ latest_trades = latest_trades.concat(sm.latest_trades) }
+            })
+        })
+
+        ba.tournaments.map(ba_event => {
+            if(!ba_event.supported_markets){ return }
+            updated = true
+            ba_event.supported_markets.map(sm => {
+                if(sm.available_orders){ available_orders = available_orders.concat(sm.available_orders) }
+                if(sm.order_stats){ event_order_stats = event_order_stats.concat(sm.order_stats) }
+                if(sm.latest_trades){ latest_trades = latest_trades.concat(sm.latest_trades) }
+            })
+        })
+
+        ba.matches.map(ba_event => {
+            if(!ba_event.supported_markets){ return }
+            updated = true
+            ba_event.supported_markets.map(sm => {
+                if(sm.available_orders){ available_orders = available_orders.concat(sm.available_orders) }
+                if(sm.order_stats){ event_order_stats = event_order_stats.concat(sm.order_stats) }
+                if(sm.latest_trades){ latest_trades = latest_trades.concat(sm.latest_trades) }
+            })
+        })
+        return { updated, event_order_stats, available_orders, latest_trades }
+    }
+}

package/src/MarketMaker/components/Contest.tsx

@@ -0,0 +1,70 @@
+import React from 'react';
+import { View, Image, FlatList } from 'react-native';
+import type { BestAvailableOrderProps, ExternalPriceProps, LeagueProps, MarketProps, OrderProps, TradeProps } from '../../types';
+import { view_styles } from '../../constants/styles';
+import { Text } from '../../Components';
+import ContestMarket from './ContestMarkets';
+import { MarketMaketHelpers } from '../api';
+import Colors from '../../constants/colors';
+
+type ContestProps = {
+    league?:LeagueProps,
+    contest_id:string,
+    contest_type:string,
+    contest_title:string,
+    best_available_orders:BestAvailableOrderProps[],
+    latest_trades:TradeProps[],
+    external_prices:ExternalPriceProps[],
+    orders:OrderProps[],
+    markets:MarketProps[]
+}
+
+const Contest = ({ contest_id, contest_type, league, contest_title, best_available_orders, latest_trades, orders, markets }:ContestProps) => {
+
+    const { open_amt, called_amt } = MarketMaketHelpers.getOrderStats(orders);
+
+    const renderMarkets = (data:{ item:MarketProps, index:number }) => {
+        const market_orders = orders.filter(o => o.market_id == data.item.market_id); 
+        const market_trades = latest_trades.filter(t => t.market_id == data.item.market_id);
+        const market_available_orders = best_available_orders.filter(o => o.market_id == data.item.market_id);
+        return (
+            <ContestMarket
+                contest_id={contest_id}
+                contest_type={contest_type}
+                market={data.item}
+                orders={market_orders}
+                latest_trades={market_trades}
+                best_available_orders={market_available_orders}
+            />
+        )
+    }
+
+    return (
+        <View style={{ ...view_styles.section,  }}>
+            <View style={{ ...view_styles.section_header }}>
+                {league ?
+                <Image
+                    source={{ uri: league.league_image }}
+                    style={{ height:20, width:20 }}
+                    resizeMode='cover'
+                />
+                :<></>}
+                <View style={{ flex:1 }}>
+                    <Text theme='header'>{contest_title}</Text>
+                </View>
+                <View>
+                    <Text size={12} color={Colors.brand.midnight}>${open_amt.toFixed(2)} Open (${called_amt.toFixed(2)} Filled)</Text>
+                </View>
+            </View>
+            <View>
+                <FlatList
+                    data={markets}
+                    renderItem={renderMarkets}
+                    keyExtractor={(item) => item.market_id.toString()}
+                />
+            </View>
+        </View>
+    )
+}
+
+export default Contest

package/src/MarketMaker/components/ContestMarkets.tsx

@@ -0,0 +1,24 @@
+import React from 'react';
+import { View } from 'react-native';
+import type { BestAvailableOrderProps, MarketProps, OrderProps, TradeProps } from '../../types';
+import { Text } from '../../Components';
+
+type ContestMarketProps = {
+    contest_id:string,
+    contest_type:string,
+    market:MarketProps,
+    best_available_orders:BestAvailableOrderProps[],
+    latest_trades:TradeProps[],
+    orders:OrderProps[]
+}
+
+const ContestMarket = ({  market,  orders }:ContestMarketProps) => {
+    console.log(orders)
+    return (
+        <View>
+            <Text>{market.description}</Text>
+        </View>
+    )
+}
+
+export default ContestMarket

package/src/MarketMaker/components/ContestSelector.tsx

@@ -0,0 +1,84 @@
+import React, { useEffect, useState } from 'react';
+import { View, FlatList, TouchableOpacity } from 'react-native';
+
+import type { EventProps, LeagueProps, MatchProps, TournamentProps } from "../../types"
+import { view_styles } from '../../constants/styles';
+import { Checkbox, Text } from '../../Components';
+import DropDown from '../../Components/Dropdown';
+import moment from 'moment-mini';
+import Colors from '../../constants/colors';
+
+type ContestSelectorProps = {
+    leagues:LeagueProps[],
+    maxHeight?:number,
+    events:EventProps[],
+    tournaments:TournamentProps[],
+    matches:MatchProps[],
+    selected_events:string[],
+    onSelectEvent:(e:EventProps) => void,
+    onDeselectEvent:(e:EventProps) => void,
+    selected_tournaments:string[],
+    onSelectTournament:(t:TournamentProps) => void
+    selected_matches:string[],
+    onSelectMatch:(m:MatchProps) => void
+}
+
+const ContestSelector = ({ maxHeight, leagues, events, onSelectEvent, selected_events, onDeselectEvent }:ContestSelectorProps) => {
+    const [ selector_data, setSelectorData ] = useState<{
+        selected_league?:LeagueProps
+    }>({
+        
+    });
+    const { selected_league } = selector_data;
+
+    useEffect(() => {
+        if(!selected_league){ setSelectorData({ ...selector_data, selected_league: leagues.find(l => l.priority == 1) }) }
+    },[leagues.length]);
+
+    const filtered_events = events.filter(e => e.league_id == selected_league?.league_id).sort((a,b) => moment(a.scheduled_datetime).unix() - moment(b.scheduled_datetime).unix());
+
+
+    const renderEvents = (data:{ item:EventProps, index:number }) => {
+        const selected = selected_events.find(se => se == data.item.event_id) ? true : false;
+        return (
+            <TouchableOpacity style={{ ...view_styles.body_row, borderBottomWidth:1, borderBottomColor:Colors.shades.shade600 }} onPress={() => selected ? onDeselectEvent(data.item) : onSelectEvent(data.item)}>
+                <Checkbox checked={selected} disabled onSelect={() => console.log('')}/>
+                <View style={{ flex:1, marginLeft:10 }}>
+                    <Text size={12} weight='bold' color={Colors.brand.midnight}>{data.item.event_title}</Text>
+                    <Text style={{ marginTop:3 }} theme='body_2'>{data.item.time_detail == 'scheduled' ? moment(data.item.scheduled_datetime).format('MMM DD : hh:mm a') : data.item.time_detail}</Text>
+                </View>
+            </TouchableOpacity>
+        )
+    }
+
+
+    return (
+        <View style={{ ...view_styles.section, maxHeight }}>
+            <View style={{ ...view_styles.section_header }}>
+                <View style={{ flex:1 }}>
+                    <Text theme='header'>Select Contest</Text>
+                    <Text theme='body' style={{ marginTop:3 }}>Use league dropdown to filter</Text>
+                </View>
+                <DropDown
+                    selected_value={selected_league?.league_name ?? ''}
+                    dropdown_options={[
+                        { value: 'league', eligible_options: leagues.sort((a,b) => a.priority - b.priority).map(l => l.league_name) }
+                    ]}
+                    onOptionSelect={(option) => {
+                        let league = leagues.find(l => l.league_name == option);
+                        setSelectorData({ ...selector_data, selected_league: league })
+                    }}
+                />
+            </View>
+            <View style={{ ...view_styles.section_body }}>
+                <FlatList
+                    data={filtered_events}
+                    renderItem={renderEvents}
+                    keyExtractor={(item) => item.event_id.toString()}
+                />
+            </View>
+        </View>
+    )
+}
+
+export default ContestSelector

package/src/MarketMaker/components/Dashboard.tsx

@@ -0,0 +1,72 @@
+import React from 'react';
+import { View, FlatList, ActivityIndicator } from 'react-native';
+import { view_styles } from "../../constants/styles"
+import type { BestAvailableOrderProps, EventProps, LeagueProps, MarketProps, MatchProps, OrderProps, SortedContestProps, TournamentProps, TradeProps } from "../../types"
+import { Text } from '../../Components';
+import Contest from './Contest';
+import { MarketMaketHelpers } from '../api';
+import Colors from '../../constants/colors';
+
+type DashboardProps = {
+    loaded:boolean,
+    leagues:LeagueProps[],
+    events:EventProps[],
+    markets:MarketProps[],
+    tournaments:TournamentProps[],
+    matches:MatchProps[],
+    best_available_orders:BestAvailableOrderProps[],
+    trades:TradeProps[],
+    orders:OrderProps[]
+}
+
+const Dashboard = ({ loaded, leagues, events, tournaments, matches, markets, orders, best_available_orders, trades }:DashboardProps) => {
+    const contests = MarketMaketHelpers.sortContests(events, tournaments, matches, markets)
+    const renderContests = (data:{item:SortedContestProps, index:number}) => {
+        const league = leagues.find(l => l.league_id == data.item.league_id)
+        const contest_orders = orders.filter(o => o.event_type == data.item.contest_type && o.event_id == data.item.id);
+        const contest_trades = trades.filter(t => t.event_type == data.item.contest_type && t.event_id == data.item.id);
+        const contest_ba = best_available_orders.filter(o => o.event_type == data.item.contest_type && o.event_id == data.item.id);
+        return (
+            <Contest
+                contest_id={data.item.id}
+                contest_type={data.item.contest_type}
+                league={league}
+                contest_title={data.item.title}
+                latest_trades={contest_trades}
+                best_available_orders={contest_ba}
+                external_prices={[]}
+                orders={contest_orders}
+                markets={data.item.markets}
+
+            />
+        )
+    }
+
+    return (
+        <View style={{ ...view_styles.section, flexGrow:1 }}>
+            <View style={{ ...view_styles.section_header }}>
+                <View style={{ flex:1 }}>
+                    <Text theme='header'>Dashboard</Text>
+                    <Text style={{ marginTop:3 }} theme='body'>Select contests and markets to see activity and market options</Text>
+                </View>
+            </View>
+            <View style={{ ...view_styles.section_body }}>
+                <FlatList
+                    data={contests}
+                    renderItem={renderContests}
+                    keyExtractor={(item) => `${item.contest_type}${item.id}`}
+                />
+            </View>
+            {!loaded ?
+            <View style={{ position:'absolute', top:0, left:0, right:0, bottom:0, backgroundColor:Colors.shades.black_faded, justifyContent:'center', alignItems:'center' }}>
+                <View style={{ ...view_styles.section, minWidth:200, minHeight:200, justifyContent:'center', alignItems:'center' }}>
+                    <ActivityIndicator style={{ alignSelf:'center'}} size='large' color={Colors.brand.midnight} />
+                    <Text style={{ marginTop:10 }} theme='header_2'>Loading Your Data...</Text>
+                </View>
+            </View>
+            :<></>}
+        </View>
+    )
+}
+
+export default Dashboard

package/src/MarketMaker/components/MarketSelector.tsx

@@ -0,0 +1,50 @@
+import React from 'react';
+import { View, FlatList, TouchableOpacity } from 'react-native';
+import { view_styles } from "../../constants/styles"
+import type { MarketProps } from '../../types';
+import { Checkbox, Text } from '../../Components';
+import Colors from '../../constants/colors';
+
+
+type MarketSelectorProps = {
+    maxHeight?:number,
+    markets:MarketProps[],
+    selected_markets:string[],
+    onSelectMarket:(m:MarketProps) => void,
+    onDeselectMarket:(m:MarketProps) => void
+}
+const MarketSelector = ({ maxHeight, markets, selected_markets, onSelectMarket, onDeselectMarket }:MarketSelectorProps) => {
+
+    const renderMarkets = (data:{item:MarketProps, index:number}) => {
+        const selected = selected_markets.find(se => se == data.item.market_id) ? true : false;
+        return (
+            <TouchableOpacity style={{ ...view_styles.body_row, borderBottomWidth:1, borderBottomColor:Colors.shades.shade600 }} onPress={() => selected ? onDeselectMarket(data.item) : onSelectMarket(data.item)}>
+                <Checkbox checked={selected} disabled onSelect={() => console.log('')}/>
+                <View style={{ flex:1, marginLeft:10 }}>
+                    <Text size={12} weight='bold' color={Colors.brand.midnight}>{data.item.type == 'Stat' ? data.item.stat_label : data.item.type}</Text>
+                    <Text style={{ marginTop:3 }} theme='body_2'>{data.item.description}</Text>
+                </View>
+            </TouchableOpacity>
+        )
+    }
+    return (
+        <View style={{ ...view_styles.section, maxHeight }}>
+            <View style={{ ...view_styles.section_header }}>
+                <View style={{ flex:1 }}>
+                    <Text theme='header'>Select Market</Text>
+                    <Text style={{ marginTop:3 }} theme='body_2'>Manage the markets that are shown on the dashboard</Text>
+                </View>
+            </View>
+            <View style={{ ...view_styles.section_body }}>
+                <FlatList
+                    key={'market_selector'}
+                    data={markets}
+                    renderItem={renderMarkets}
+                    keyExtractor={(item) => item.market_id.toString()}
+                />
+            </View>
+        </View>
+    )
+}
+
+export default MarketSelector