be-components 1.4.9 → 1.5.1

package/src/CompetitionSeasonManager/index.tsx

@@ -0,0 +1,151 @@
+import React, { useEffect, useState } from 'react';
+import { View, ScrollView, ActivityIndicator } from 'react-native';
+import SeasonInfoForm from './components/SeasonInfoForm';
+import { ManageSeasonApi, ManageSeasonHelpers } from './api';
+import type { CompetitionPayoutTypeProps, CompetitionProps, CompetitionResultTypeProps, CompetitionSeasonProps, CompetitionTypeProps, MyPlayerProps } from '../types';
+import Colors from '../constants/colors';
+import CompetitionsForm from './components/CompetitionsForm';
+import SeasonSettingsForm from './components/SeasonSettingsForm';
+import CreateCompetitionForm from '../CompetitionManager/components/CreateCompetitionForm';
+import SeasonHeader from './components/SeasonHeader';
+
+type SeasonManagerProps = {
+    competition_season_id:string,
+    player_id?:string
+}
+
+const SeasonManager = ({ competition_season_id }:SeasonManagerProps) => {
+    const [ show_create_competition, setShowCreateCompetition ] = useState(false);
+    const [ module_size, setModuleSize ] = useState({ width: 0, height: 0 });
+    const [ season_data, setData ] = useState<{
+        loading: boolean,
+        action_loading:boolean,
+        player?:MyPlayerProps,
+        competition_season?:CompetitionSeasonProps,
+        competition_types:CompetitionTypeProps[],
+        competition_result_types:CompetitionResultTypeProps[],
+        competition_payout_types:CompetitionPayoutTypeProps[],
+        competitions:CompetitionProps[]
+    }>({
+        loading:false,
+        action_loading: false,
+        competition_payout_types:[],
+        competition_result_types: [],
+        competition_types:[],
+        competitions: []
+    })
+    const { action_loading, player, competition_types, competition_result_types, competition_season, competitions } = season_data;
+
+    useEffect(() => {
+        ManageSeasonApi.setEnvironment();
+        getDataFromServer(competition_season_id);
+    },[competition_season_id])
+
+    const getDataFromServer = async(id:string) => {
+        setData({ ...season_data, loading: true });
+        const cs = await ManageSeasonApi.getSeasonById(id);
+        const comps = await ManageSeasonApi.getCompetitionsBySeasonId(id);
+        const opts = await ManageSeasonApi.getCompetitionOptions();
+        const me = await ManageSeasonApi.getMyDetails();
+        setData({ 
+            ...season_data,
+            competition_season: cs,
+            competitions: comps,
+            player:me,
+            competition_payout_types: opts.competition_payout_types,
+            competition_result_types: opts.competition_result_types,
+            competition_types: opts.competition_types
+        })
+    }
+
+
+    if(!competition_season){
+        return (
+            <View style={{ flex:1 }}>
+                <ActivityIndicator size={'large'} color={Colors.brand.midnight} style={{ padding:20, alignSelf:'center' }} />
+            </View>
+        )
+    }
+
+    const errors = ManageSeasonHelpers.isSeasonValid(competition_season)
+
+
+    return (
+        <View style={{ flex:1 }}>
+            <ScrollView style={{ flex:1 }} onLayout={(ev) => {
+                const { width, height } = ev.nativeEvent.layout;
+                setModuleSize({ width, height })
+            }}>
+                <SeasonHeader
+                    competition_season={competition_season}
+                    width={module_size.width}
+                    action_loading={action_loading}
+                    season_valid={errors.length > 0 ? false : true}
+                    onActivate={async() => {
+                        setData({ ...season_data, action_loading: true })
+                        const new_cs = await ManageSeasonApi.activateSeason(competition_season.competition_season_id);
+                        setData({
+                            ...season_data,
+                            action_loading: false,
+                            competition_season:new_cs
+                        })
+                    }}
+                    onDelete={async() => {
+                        setData({ ...season_data, action_loading: true })
+                        const new_cs = await ManageSeasonApi.deleteSeason(competition_season.competition_season_id);
+                        setData({
+                            ...season_data,
+                            action_loading: false,
+                            competition_season:new_cs
+                        })
+                    }}
+                />
+                <SeasonInfoForm
+                    width={module_size.width}
+                    player={player}
+                    competition_season={competition_season}
+                    onSeasonUpdate={async(cs) => {
+                        setData({ ...season_data, action_loading: true })
+                        const new_s = await ManageSeasonApi.updateSeason(cs);
+                        setData({ ...season_data, action_loading: false, competition_season: new_s })
+                    }}
+                />
+                <SeasonSettingsForm
+                    width={module_size.width}
+                    competition_season={competition_season}
+                    competition_types={competition_types}
+                    competition_result_types={competition_result_types}
+                    onSeasonUpdate={async(cs) => {
+                        setData({ ...season_data, action_loading: true })
+                        const new_s = await ManageSeasonApi.updateSeason(cs);
+                        setData({ ...season_data, action_loading: false, competition_season: new_s })
+                    }}
+                />
+                <CompetitionsForm
+                    onAddCompetition={() => setShowCreateCompetition(true)}
+                    competitions={competitions}
+                    competition_season={competition_season}
+                    competition_result_types={competition_result_types}
+                    competition_types={competition_types}
+                />
+            </ScrollView>
+            {show_create_competition ?
+            <View style={{ position:'absolute', top:0, left:0, right:0, bottom:0, backgroundColor:Colors.shades.black_faded, justifyContent:'flex-end' }}>
+                <CreateCompetitionForm
+                    width={module_size.width}
+                    competition_season={competition_season}
+                    onClose={() => setShowCreateCompetition(false)}
+                    onCreate={(competition) => {
+                        setData({
+                            ...season_data,
+                            competitions: competitions.concat(competition)
+                        })
+                    }}
+                />
+            </View>
+            :<></>}
+        </View>
+    )
+}
+
+export default SeasonManager

package/src/Components/Switch.tsx

@@ -6,9 +6,10 @@ import Colors from '../constants/colors';
 type SwitchProps = { 
     value: boolean, 
     switch_type: 'binary' | 'on_off', 
+    disabled?:boolean,
     onChange:(value:boolean) => void 
 }
-const Switch = ({ value, switch_type, onChange }:SwitchProps) => {
+const Switch = ({ value, disabled, switch_type, onChange }:SwitchProps) => {
 
     const handleChange = () => {
         if(onChange){
@@ -19,7 +20,9 @@ const Switch = ({ value, switch_type, onChange }:SwitchProps) => {
     return (
         <View style={{ flexDirection:'row', alignItems:'flex-start' }}>
             {switch_type == 'on_off' ?
-            <TouchableOpacity style={{flexDirection:'row', justifyContent:'space-between', alignItems:'center', backgroundColor:value?Colors.highlights.highlight400:Colors.brand.slate, padding:3, borderRadius:12, width:48,height:24}} onPress={() => handleChange()}>
+            <TouchableOpacity 
+            disabled={disabled}
+            style={{flexDirection:'row', justifyContent:'space-between', alignItems:'center', backgroundColor:value?Colors.highlights.highlight400:Colors.brand.slate, padding:3, borderRadius:12, width:48,height:24}} onPress={() => handleChange()}>
             { value ? 
                 <>
                 <View />
@@ -33,7 +36,9 @@ const Switch = ({ value, switch_type, onChange }:SwitchProps) => {
             }
         </TouchableOpacity>
         :
-        <TouchableOpacity style={{flexDirection:'row', justifyContent:'space-between', alignItems:'center', backgroundColor:Colors.shades.white, padding:3, borderRadius:12, width:48,height:24}} onPress={() => handleChange()}>
+        <TouchableOpacity 
+        disabled={disabled}
+        style={{flexDirection:'row', justifyContent:'space-between', alignItems:'center', backgroundColor:Colors.shades.white, padding:3, borderRadius:12, width:48,height:24}} onPress={() => handleChange()}>
             { value ? 
                 <>
                 <View />

package/src/Engage/api/index.ts

@@ -1,6 +1,6 @@
 import axios from 'axios';
 import { APIOverrides } from "../../ApiOverrides";
-import type { BracketCompetitionProps, BracketProps, CompanyProps, CompetitionPayoutTypeProps, CompetitionProps, CompetitionResultTypeProps, CompetitionTypeProps, EventProps, LeagueProps, PublicPlayerProps, SquaresCompetitionProps } from '../../types';
+import type { BracketCompetitionProps, BracketProps, CompanyProps, CompetitionPayoutTypeProps, CompetitionProps, CompetitionResultTypeProps, CompetitionSeasonProps, CompetitionTypeProps, EventProps, LeagueProps, PublicPlayerProps, SquaresCompetitionProps } from '../../types';
 
 let AUTH_SVC_API = ''
 let TP_SVC_API = ''
@@ -24,6 +24,16 @@ const EngageApi = {
             return []
         }
     },
+    getActivePublicSeasons: async():Promise<CompetitionSeasonProps[]> => {
+        try {
+            const resp = await axios.get(`${TP_SVC_API}/v2/competitions/seasons/public`)
+            console.log(resp.data)
+            return resp.data.competition_seasons
+        } catch (e) {
+            console.log(e)
+            return []
+        }
+    },
     getActivePublicSquares: async():Promise<SquaresCompetitionProps[]> => {
         try {
             const resp = await axios.get(`${TP_SVC_API}/v1/squares/public`)
@@ -120,5 +130,14 @@ const EngageHelpers = {
     getBracketIdsFromBracketComps: (bc:BracketCompetitionProps[]) => {
         const ids = bc.map(c => c.bracket_id)
         return [ ...new Set(ids.map(id => id)) ] 
-    }
+    },
+    getSeasonPayoutAmounts: (competition_season:CompetitionSeasonProps) => {
+        let total_payout = competition_season.ticket_revenue
+        if(competition_season.promo_amt){ total_payout = total_payout + parseFloat(competition_season.promo_amt as string) }
+        if(competition_season.guaranteed_payout && competition_season.guaranteed_payout > total_payout){ total_payout = competition_season.guaranteed_payout }
+
+        let season_payout = parseFloat(competition_season.payout_allocation as string) * total_payout
+        let competition_payout = total_payout - season_payout
+        return { season_payout, competition_payout }
+    },
 }

package/src/Engage/components/SeasonCard.tsx

@@ -0,0 +1,42 @@
+import React from 'react';
+import { View, Image, TouchableOpacity } from 'react-native';
+import type { CompetitionSeasonProps } from '../../types';
+import { view_styles } from '../../constants/styles';
+import { Text } from '../../Components';
+import Colors from '../../constants/colors';
+import moment from 'moment-mini';
+
+type SeasonCardProps = {
+    competition_season:CompetitionSeasonProps,
+    width: number,
+    onSelectSeason: (cs:CompetitionSeasonProps) => void
+}
+const MAX_IMAGE_WIDTH = 175
+
+const SeasonCard = ({ competition_season, width, onSelectSeason }:SeasonCardProps) => {
+    const image_width = width > MAX_IMAGE_WIDTH ? MAX_IMAGE_WIDTH : width
+
+    return (
+        <TouchableOpacity style={{ ...view_styles.section, width:image_width, backgroundColor:Colors.brand.mint, borderRadius:8 }} onPress={() => onSelectSeason(competition_season)}>
+            <View style={{ padding:10, flexDirection:'row', alignItems:'center' }}>
+                <View style={{ flex:1 }}>
+                    <Text theme='header'>SEASON</Text>
+                </View>
+                <Text theme='header'>${parseFloat(competition_season.ticket_price as string).toFixed(2)}</Text>
+            </View>
+            <View style={{ backgroundColor:Colors.shades.shade100 }}>
+                <Image
+                    source={{ uri: competition_season.image?.url }}
+                    style={{ height:image_width, width:image_width, borderRadius:8 }}
+                    resizeMode='cover'
+                />
+                 <View style={{ position:'absolute', backgroundColor:Colors.shades.white, bottom:0, left:0, right:0, padding:10, borderBottomRightRadius:8, borderBottomLeftRadius:8 }}>
+                    <Text theme='header_2'>{competition_season.season_name}</Text>
+                    <Text style={{ marginTop:3 }} theme='body_2'>Starts {moment(competition_season.scheduled_datetime).format('MMM DD hh:mm a')}</Text>
+                </View>
+            </View>
+        </TouchableOpacity>
+    )
+}
+
+export default SeasonCard

package/src/Engage/index.tsx

@@ -1,6 +1,6 @@
 import React, { useEffect, useState } from 'react';
 import { View, ActivityIndicator, FlatList } from 'react-native';
-import type { BracketCompetitionProps, BracketProps, CompanyProps, CompetitionPayoutTypeProps, CompetitionProps, CompetitionResultTypeProps, CompetitionTypeProps, EventProps, LeagueProps, PublicPlayerProps, SquaresCompetitionProps } from '../types';
+import type { BracketCompetitionProps, BracketProps, CompanyProps, CompetitionPayoutTypeProps, CompetitionProps, CompetitionResultTypeProps, CompetitionSeasonProps, CompetitionTypeProps, EventProps, LeagueProps, PublicPlayerProps, SquaresCompetitionProps } from '../types';
 import Colors from '../constants/colors';
 import { EngageApi, EngageHelpers } from './api';
 import CompetitionCard from './components/CompetitionCard';
@@ -10,16 +10,19 @@ import SquaresCompetitionCard from './components/SquaresCompetitionCard';
 import BracketCompetitionCard from './components/BracketCompetitionCard';
 import moment from 'moment-mini';
 import SocketManager from '../Socket';
+import SeasonCard from './components/SeasonCard';
 
 
 type EngageModuleProps = {
     player_id?:string,
     onSelectCompetition:(c:CompetitionProps) => void,
     onSelectBracketCompetition:(bc:BracketCompetitionProps) => void,
-    onSelectSquaresCompetition:(sc:SquaresCompetitionProps) => void
+    onSelectSquaresCompetition:(sc:SquaresCompetitionProps) => void,
+    onSelectCompetitionSeason:(cs:CompetitionSeasonProps) => void
 }
 
-const EngageModule = ({ onSelectBracketCompetition, onSelectCompetition, onSelectSquaresCompetition }:EngageModuleProps) => {
+const EngageModule = ({ onSelectBracketCompetition, onSelectCompetition, onSelectSquaresCompetition, onSelectCompetitionSeason }:EngageModuleProps) => {
+    const [ module_size, setModuleSize ] = useState({ width:0, height:0 });
     const [ socket_state, setSocketState ] = useState<{
         connected:boolean,
         reload_needed?:boolean
@@ -30,6 +33,7 @@ const EngageModule = ({ onSelectBracketCompetition, onSelectCompetition, onSelec
     const [ module_data, setModuleData ] = useState<{
         loading:boolean,
         competitions:CompetitionProps[],
+        competition_seasons:CompetitionSeasonProps[],
         competition_types:CompetitionTypeProps[],
         competition_result_types:CompetitionResultTypeProps[],
         competition_payouts:CompetitionPayoutTypeProps[],
@@ -43,6 +47,7 @@ const EngageModule = ({ onSelectBracketCompetition, onSelectCompetition, onSelec
     }>({
         loading:false,
         competitions: [],
+        competition_seasons:[],
         companies:[],
         leagues:[],
         events:[],
@@ -54,7 +59,8 @@ const EngageModule = ({ onSelectBracketCompetition, onSelectCompetition, onSelec
         bracket_competitions:[],
         players:[]
     });
-    const { loading, competitions, competition_result_types, squares_competitions, brackets, leagues, bracket_competitions, events, competition_types, companies, players } = module_data;
+    const { loading, competitions, competition_seasons, competition_result_types, squares_competitions, brackets, leagues, bracket_competitions, events, competition_types, companies, players } = module_data;
+
 
     useEffect(() => {
         EngageApi.setEnvironment();
@@ -75,6 +81,7 @@ const EngageModule = ({ onSelectBracketCompetition, onSelectCompetition, onSelec
         })
         const lgs = await EngageApi.getLeagues();
         const comps = await EngageApi.getActivePublicCompetitions();
+        const seasons = await EngageApi.getActivePublicSeasons();
         const brackets = await EngageApi.getActivePublicBrackets();
         const squares = await EngageApi.getActivePublicSquares();
         const company_ids = EngageHelpers.getCompanyIdsFromEngage(comps, squares, brackets);
@@ -91,6 +98,7 @@ const EngageModule = ({ onSelectBracketCompetition, onSelectCompetition, onSelec
             ...module_data,
             loading:false,
             competitions:comps,
+            competition_seasons: seasons,
             bracket_competitions:brackets,
             competition_types: opts.competition_types,
             competition_result_types: opts.competition_result_types,
@@ -143,7 +151,17 @@ const EngageModule = ({ onSelectBracketCompetition, onSelectCompetition, onSelec
             </View>
         )
     }
-
+    const renderSeasons = (data: { item:CompetitionSeasonProps, index:number }) => {
+        return (
+            <View>
+                <SeasonCard
+                    competition_season={data.item}
+                    width={module_size.width / 2.5}
+                    onSelectSeason={(cs) => onSelectCompetitionSeason(cs)}
+                />
+            </View>
+        )
+    }
 
     const renderCompetitions = (data: { item:CompetitionProps, index:number }) => {
         const admin = players.find(p => p.player_id == data.item.admin_id);
@@ -176,7 +194,10 @@ const EngageModule = ({ onSelectBracketCompetition, onSelectCompetition, onSelec
     }
 
     return (
-        <View style={{ flex:1, backgroundColor:Colors.shades.white }}>
+        <View style={{ flex:1, backgroundColor:Colors.shades.white }} onLayout={(ev) => {
+            const { height, width } = ev.nativeEvent.layout;
+            setModuleSize({ width, height })
+        }}>
             <View style={{ ...view_styles.body_row, margin:10, backgroundColor:Colors.shades.white, borderRadius:22, borderWidth:4, borderColor:Colors.shades.shade100}}>
                 <Button
                     title='COMPETITIONS'
@@ -223,7 +244,23 @@ const EngageModule = ({ onSelectBracketCompetition, onSelectCompetition, onSelec
                 />
             </View>
             {active_tab == 'competitions' ?
-            <View style={{ ...view_styles.section_body, padding:0 }}>
+            <View style={{ ...view_styles.section_body, justifyContent:'flex-start', padding:0 }}>
+                {competition_seasons.length > 0 ?
+                <View>
+                    <View style={{ ...view_styles.section_header, backgroundColor:Colors.shades.shade100, borderRadius:0, marginBottom:10 }}>
+                        <View style={{ flex:1 }}>
+                            <Text theme='header'>Public Seasons</Text>
+                            <Text style={{ marginTop:3 }} theme='body'>Seasons are multi-competition contests. Payouts are split between each competition and the season long winners.</Text>
+                        </View>
+                    </View>
+                    <FlatList
+                        data={competition_seasons}
+                        horizontal
+                        keyExtractor={(item) => item.competition_season_id.toString()}
+                        renderItem={renderSeasons}
+                    />
+                </View>
+                :<></>}
                 <View style={{ marginBottom:15, marginTop:10 }}>
                     <View style={{ ...view_styles.section_header, backgroundColor:Colors.shades.shade100, borderRadius:0 }}>
                         <View style={{ flex:1 }}>

package/src/index.tsx

@@ -22,7 +22,8 @@ import CompetitionManager from "./CompetitionManager";
 import CreateCompetitionForm from "./CompetitionManager/components/CreateCompetitionForm";
 import AdminCompetitionList from "./CompetitionManager/components/AdminCompetitionList";
 import EngageModule from "./Engage";
-
+import SeasonManager from "./CompetitionSeasonManager";
+import SeasonModule from "./CompetitionSeason";
 
 export {
   Authenticator,
@@ -44,7 +45,9 @@ export {
   PollCampaignApi,
   PollApi,
   CompetitionModule,
+  SeasonManager,
   CreateCompetitionForm,
+  SeasonModule,
   AdminCompetitionList,
   AdServer,
   AdProvider,

package/src/types.d.ts

@@ -1185,25 +1185,68 @@ export interface CompetitionResultProps {
 export interface CompetitionSeasonProps {
     competition_season_id:string;
     season_name: string;
-    season_description:string;
+    season_description: string;
     image?:{ url:string };
+    ticket_price:number | string;
+    ticket_revenue: number;
     payout_amt: number;
-    sponsor_id?:string;
-    competition_result_type_id:string;
+    promo_amt?:number | string;
+    max_picks: number | string;
+    initial_balance:number | string;
+    invite_only:boolean,
+    company_id?:string,
+    balance_rollover:boolean;
     admin_id:string;
+    unallocated_funds:number;
     template?:boolean;
+    competition_result_type_id:string;
+    competition_type_id:string;
+    sponsor_id?:string;
+    entered?:boolean;
+    expected_competition_count:number | string;
+    pacer_id?:string;
     following_season_id?:string;
-    payout_allocation:number;
+    payout_allocation:number | string;
     single_buy_in:boolean; //If true - then once you enter, you are automatically entered into all remaining competitions in season.  If false - you need to re-enter each week
     allow_late_buy_in:boolean; //If true - then you will allow users to buy in at later dates
     scheduled_datetime:any;
     league_id?:string,
-    status: 'active' | 'inactive' | 'pending';
+    status: 'active' | 'inactive' | 'closed'|'pending';
     market_type: 'FOR_MONEY' | 'FREE';
+    guaranteed_payout?:number,
+    tickets_sold:number,
+    tickets_available:number,
     create_datetime:any;
     last_update_datetime:any;
 }
 
+
+export interface CompetitionSeasonPlayerProps {
+    competition_season_player_id:string,
+    competition_season_id:string,
+    player_id:string,
+    status: 'active'|'inactive',
+    wins: number,
+    losses:number,
+    draws: number,
+    wager_based_balance:number,
+    earnings:number,
+    create_datetime:any,
+    last_update_datetime: any
+}
+
+export interface CompetitionSeasonResultProps {
+    competition_season_result_id:string,
+    competition_season_id:string,
+    place:number,
+    status:string,
+    winnings:number,
+    player_id:string,
+    processed:boolean,
+    create_datetime:any,
+    last_update_datetime:any
+}
+
 export interface CompetitionTypeProps {
     competition_type_id:string,
     type: string,