be-components 7.1.4 → 7.1.6

package/src/PartnerPortal/components/SquaresSelector.tsx

@@ -0,0 +1,88 @@
+import React, { useEffect, useState } from "react";
+import type { SquaresCompetitionProps } from "../../types";
+import { useColors } from "../../constants/useColors";
+import { Button, Text, View } from "../../Components/Themed";
+import { FlatList, Image } from "react-native";
+import { Checkbox, Icons, SearchBox } from "../../Components";
+import moment from "moment-mini";
+import { PartnerPortalApi } from "../api";
+
+type SquaresSelectorProps = {
+    company_id:string,
+    active_competitions:string[],
+    onSelectCompetition:(sc:SquaresCompetitionProps) => void,
+    onDeselectCompetition:(sc:SquaresCompetitionProps) => void
+}
+const SquaresSelector = ({ company_id, active_competitions, onSelectCompetition, onDeselectCompetition }:SquaresSelectorProps) => {
+    const Colors = useColors();
+    const [ visible, setVisible ] = useState(false);
+    const [ competitions, setCompetitions ] = useState<SquaresCompetitionProps[]>([])
+    const [ search, setSearch ] = useState('');
+
+    const filtered_competitions = competitions.filter(pr => pr.sq_comp_name.toLowerCase().includes(search.toLowerCase())).slice(0,10)
+
+    useEffect(() => {
+        getCompetitions()
+    },[company_id]);
+    
+    const getCompetitions = async() => {
+        PartnerPortalApi.setEnvironment();
+        const s_resp = await PartnerPortalApi.EngagementApi.getActiveSquaresCompetitions(company_id);
+        setCompetitions(s_resp);
+    }
+
+    const renderCompetitions = (data:{ item:SquaresCompetitionProps, index:number }) => {
+        const selected = active_competitions.includes(data.item.sq_comp_id.toString());
+
+        return (
+            <Button 
+                transparent 
+                style={{ flexDirection:'row', alignItems:'center', padding:10, borderRadius:0, borderBottomWidth:1, borderColor:Colors.borders.light }}
+                onPress={() => {
+                    if(selected){ return onDeselectCompetition(data.item) }
+                    return onSelectCompetition(data.item);
+                }}
+            >
+                <Image
+                    source={{ uri: data.item.image?.url }}
+                    style={{ height: 35, width:35 }}
+                    resizeMode="cover"
+                />
+                <View transparent style={{ flex:1, marginLeft:10 }}>
+                    <Text theme='h1'>{data.item.sq_comp_name}</Text>
+                    <Text theme='description' style={{ marginTop:3 }}>{data.item.sq_comp_description}</Text>
+                </View>
+                <Checkbox
+                    checked={selected}
+                    disabled
+                    onSelect={() => console.log('')}
+                />
+            </Button>
+        )
+    }
+
+    return (
+        <View float style={{ padding:15 }}>
+            <Button transparent style={{ padding:0, flexDirection:'row', alignItems:'center' }} onPress={() => setVisible(!visible)}>
+                <Text style={{ flex:1, marginRight:10 }} theme='h1'>{active_competitions.length} Comeptitions</Text>
+                <Icons.ChevronIcon direction={visible?'up':'down'} color={Colors.text.h1} size={8} />
+            </Button>
+            {visible ?
+            <View transparent style={{ marginTop:20 }}>
+            <SearchBox
+                onChange={(text) => setSearch(text)}
+                hide_search_button
+            />
+            <FlatList
+                data={filtered_competitions.sort((a,b) => moment(a.begin_datetime).unix() - moment(b.begin_datetime).unix())}
+                key={'comp_selector'}
+                keyExtractor={item => item.sq_comp_id.toString()}
+                renderItem={renderCompetitions}
+            />
+            </View>
+            :<></>}
+        </View>
+    )
+}
+
+export default SquaresSelector

package/src/PartnerPortal/index.tsx

@@ -0,0 +1,475 @@
+import React, { useEffect, useState } from 'react';
+import { Button, Text, View } from "../Components/Themed"
+import type { BracketCompetitionProps, CompanyEmbedProps, CompanyProps, CompetitionProps, EmbedPropertyProps, EmbedProps, ExternalKeyProps, MyPlayerProps, PollCampaignProps, PublicPlayerProps, SquaresCompetitionProps } from '../types';
+import type { CompanyMemberProps } from '../Authenticator/api/types';
+import { PartnerPortalApi } from './api';
+import { FlatList, Image } from 'react-native';
+import { useColors } from '../constants/useColors';
+import ImageUploader from '../Components/ImageUploader';
+import moment from 'moment-mini';
+import { Icons } from '../Components';
+
+type PartnerPortalProps = {
+    me:MyPlayerProps,
+    company_id:string,
+    onCreateEngagement: (init_engagement?:string) => void,
+    onSelectCompanyEmbed: (company_embed:CompanyEmbedProps) => void,
+    onSelectCompetition: (competition:CompetitionProps) => void,
+    onSelectBracketCompetition:(bracket_competition:BracketCompetitionProps) => void,
+    onSelectSquaresCompetition: (squares_competition:SquaresCompetitionProps) => void,
+    onSelectFlashCampaign: (flash_campaign:PollCampaignProps) => void
+}
+
+const sections = ['top_row','second_row','third_row']
+
+const PartnerPortal = ({ me, company_id, onCreateEngagement, onSelectBracketCompetition, onSelectCompanyEmbed, onSelectCompetition, onSelectFlashCampaign, onSelectSquaresCompetition }:PartnerPortalProps) => {
+    const Colors = useColors();
+    const [ engagement_state, setEngagementState ] = useState<{
+        loading: boolean,
+        competitions:CompetitionProps[],
+        squares_competitions:SquaresCompetitionProps[],
+        bracket_competitions:BracketCompetitionProps[],
+        flash_campaigns:PollCampaignProps[],
+        embeds:EmbedProps[],
+        embed_properties:EmbedPropertyProps[],
+        company_embeds:CompanyEmbedProps[]
+    }>({
+        loading:false,
+        competitions: [],
+        squares_competitions: [],
+        bracket_competitions: [],
+        flash_campaigns:[],
+        embeds:[],
+        embed_properties: [],
+        company_embeds:[]
+    });
+    const { competitions, squares_competitions, bracket_competitions, flash_campaigns, embeds, company_embeds } = engagement_state;
+    const [ state, setState ] = useState<{
+        loading: boolean,
+        company?:CompanyProps,
+        my_member?:CompanyMemberProps,
+        company_members:CompanyMemberProps[],
+        external_keys:ExternalKeyProps[],
+        players:PublicPlayerProps[],
+    }>({
+        loading:false,
+        company_members: [],
+        external_keys: [],
+        players: []
+    })
+    const { company, external_keys, players, company_members } = state;
+
+    useEffect(() => {
+        PartnerPortalApi.setEnvironment();
+        getStateData();
+        getActiveEngagementData();
+    },[me.player_id, company_id]);
+
+    const getStateData = async() => {
+        setState({ ...state, loading:true });
+        //First get company data
+        const company_response = await PartnerPortalApi.CompanyApi.getCompanyById(company_id);
+        let player_ids = company_response ? company_response.company_members.map(cm => cm.player_id) : []
+        const s_playes = await PartnerPortalApi.getPlayersByPlayerIds(player_ids);
+        const my_co_member = company_response?.company_members.find(cm => cm.player_id == me.player_id);
+        const s_keys = await PartnerPortalApi.CompanyApi.getApiKeys(company_id);
+        setState({
+            ...state,
+            loading: false,
+            company: company_response?.company,
+            external_keys: s_keys,
+            players: s_playes,
+            my_member:my_co_member,
+            company_members: company_response?.company_members ?? []
+        });
+    }
+
+    const getActiveEngagementData = async() => {
+        setEngagementState({ ...engagement_state, loading:true });
+        //Now lets grab our engagements
+        const s_comps = await PartnerPortalApi.EngagementApi.getActiveCompetitions(company_id);
+        const s_squares = await PartnerPortalApi.EngagementApi.getActiveSquaresCompetitions(company_id);
+        const s_brackets = await PartnerPortalApi.EngagementApi.getActiveBracketCompetitions(company_id);
+
+        const s_embeds = await PartnerPortalApi.CompanyEmbedApi.getEmbedsByCompanyId(company_id, 0);
+        const s_flash = await PartnerPortalApi.EngagementApi.getActiveFlashCampaigns(company_id);
+        setEngagementState({
+            ...engagement_state,
+            loading:false,
+            competitions: s_comps.competitions,
+            squares_competitions: s_squares,
+            bracket_competitions: s_brackets,
+            company_embeds: s_embeds.company_embeds,
+            embeds:s_embeds.embeds,
+            flash_campaigns: s_flash,
+            embed_properties:s_embeds.embed_properties
+        })
+    }
+
+    const renderCompetitions = (data:{ item:CompetitionProps, index:number }) => {
+        return (
+            <Button 
+                transparent 
+                style={{ padding:10, borderRadius:0, flexDirection:'row', alignItems:'center', borderBottomWidth:1, borderColor:Colors.borders.light }}
+                onPress={() => onSelectCompetition(data.item)}>
+                <Image
+                    source={{ uri: data.item.image?.url }}
+                    style={{ height:35, width:35, borderRadius:4 }}
+                    resizeMode='cover'
+                />
+                <View transparent style={{ flex:1, marginLeft:10 }}>
+                    <Text theme='h1'>{data.item.competition_name}</Text>
+                    <Text theme='description' style={{ marginTop:3 }}>{data.item.competition_description}</Text>
+                </View>
+            </Button>
+        )
+    }
+
+    const renderSquares = (data:{ item:SquaresCompetitionProps, index:number }) => {
+        return (
+            <Button 
+                transparent 
+                style={{ padding:10, borderRadius:0, flexDirection:'row', alignItems:'center', borderBottomWidth:1, borderColor:Colors.borders.light }}
+                onPress={() => onSelectSquaresCompetition(data.item)}>
+                <Image
+                    source={{ uri: data.item.image?.url }}
+                    style={{ height:35, width:35, borderRadius:4 }}
+                    resizeMode='cover'
+                />
+                <View transparent style={{ flex:1, marginLeft:10 }}>
+                    <Text theme='h1'>{data.item.sq_comp_name}</Text>
+                    <Text theme='description' style={{ marginTop:3 }}>{data.item.sq_comp_description}</Text>
+                </View>
+            </Button>
+        )
+    }
+
+    const renderBrackets = (data:{ item:BracketCompetitionProps, index:number }) => {
+        return (
+            <Button 
+                transparent 
+                style={{ padding:10, borderRadius:0, flexDirection:'row', alignItems:'center', borderBottomWidth:1, borderColor:Colors.borders.light }}
+                onPress={() => onSelectBracketCompetition(data.item)}>
+                <Image
+                    source={{ uri: data.item.image?.url }}
+                    style={{ height:35, width:35, borderRadius:4 }}
+                    resizeMode='cover'
+                />
+                <View transparent style={{ flex:1, marginLeft:10 }}>
+                    <Text theme='h1'>{data.item.competition_name}</Text>
+                    <Text theme='description' style={{ marginTop:3 }}>{data.item.competition_description}</Text>
+                </View>
+            </Button>
+        )
+    }
+
+        const renderKeys = (data:{ item:ExternalKeyProps, index:number }) => {
+        return (
+            <Button 
+                transparent 
+                style={{ padding:10, borderRadius:0, flexDirection:'row', alignItems:'center', borderBottomWidth:1, borderColor:Colors.borders.light }}
+                onPress={() => console.log(data.item)}>
+                <Icons.LinkIcon size={40} color={Colors.text.h1} />
+                <View transparent style={{ flex:1, marginLeft:10 }}>
+                    <Text theme='h2'>{data.item.key}</Text>
+                    <Text theme='description' style={{ marginTop:3 }}>{data.item.key_source}</Text>
+                </View>
+            </Button>
+        )
+    }
+
+    const renderFlashCampaigns = (data:{ item:PollCampaignProps, index:number }) => {
+        return (
+            <Button 
+                transparent 
+                style={{ padding:10, borderRadius:0, flexDirection:'row', alignItems:'center', borderBottomWidth:1, borderColor:Colors.borders.light }}
+                onPress={() => onSelectFlashCampaign(data.item)}>
+                <Image
+                    source={{ uri: data.item.campaign_image?.url }}
+                    style={{ height:35, width:35, borderRadius:4 }}
+                    resizeMode='cover'
+                />
+                <View transparent style={{ flex:1, marginLeft:10 }}>
+                    <Text theme='h1'>{data.item.name}</Text>
+                    <Text theme='description' style={{ marginTop:3 }}>Flash markets</Text>
+                </View>
+            </Button>
+        )
+    }
+
+    const renderEmbeds = (data:{ item:CompanyEmbedProps, index:number }) => {
+        const embed = embeds.find(e => e.embed_id == data.item.embed_id);
+        if(!embed){ return <></> }
+        return (
+            <Button 
+                transparent 
+                style={{ padding:10, borderRadius:0, flexDirection:'row', alignItems:'center', borderBottomWidth:1, borderColor:Colors.borders.light }}
+                onPress={() => onSelectCompanyEmbed(data.item)}>
+                <Icons.EmbedIcon size={24} color={Colors.text.h1} />
+                <View transparent style={{ flex:1, marginLeft:10 }}>
+                    <Text theme='h1'>{data.item.name}</Text>
+                    <Text theme='description' style={{ marginTop:3 }}>{embed.name}</Text>
+                </View>
+            </Button>
+        )
+    }
+
+    const renderMembers = (data:{ item:CompanyMemberProps, index:number }) => {
+        const player = players.find(p => p.player_id == data.item.player_id);
+        if(!player){ return <></> }
+        return (
+            <View transparent type='row' style={{ padding:10, margin:4, minWidth:300, flexGrow:1, borderBottomWidth:1, borderColor:Colors.borders.light }}>
+                <Image
+                    source={{ uri: player.profile_pic }}
+                    style={{ height:40, width:40, borderRadius:100 }}
+                    resizeMode='cover'
+                />
+                <View transparent style={{ flex:1, marginLeft:10 }}>
+                    <Text theme='h1'>{player.first_name} {player.last_name}</Text>
+                    <Text theme='description' style={{ marginTop:3 }}>{data.item.role}</Text>
+                </View>
+            </View>
+        )
+    }
+
+    const renderSections = (data:{ item:string, index:number }) => {
+        switch(data.item){
+            case 'top_row':
+                if(!company){ return <></> }
+                //Top Rows will consist of all the metrics
+                return (
+                    <View transparent style={{ flexDirection:'row', flexWrap:'wrap' }}>
+                        
+                        <View float nativeID='company_info' style={{ flexGrow:1, flexBasis:1, minWidth:200, margin:10 }}>
+                            <View type='header' style={{ flexDirection:'row', alignItems:'center', padding:10, borderTopRightRadius:8, borderTopLeftRadius:8 }}>
+                              <View transparent style={{ flex:1 }}>
+                                <Text theme='h1'>Company Information</Text>
+                              </View>
+                            </View>
+                            <View type='body' transparent style={{  padding:10 }}>
+                                <View transparent type='row'>
+                                    <View transparent style={{ flex:1 }}>
+                                        <Text theme='h1' size={32}>{company.company_name}</Text>
+                                        <Text theme='h2' style={{ marginTop:3, flexWrap:'wrap', flexShrink:1 }} size={14}>{company.company_description} with more long text</Text>
+                                    </View>
+                                    <ImageUploader onFinishUpload={(obj) => console.log(obj.secure_url)} public_id={`company_logo_${company_id}_${Math.random()*100000}`}>
+                                        <Image
+                                            source={{ uri: company.company_image?.url }}
+                                            style={{ height:75, width:75 }}
+                                            resizeMode='contain'
+                                        />
+                                    </ImageUploader>
+                                </View>
+                            </View>
+                        </View>
+
+                        <View float nativeID='company_details' style={{ flexGrow:1, flexBasis:1, minWidth: 200, margin:10 }}>
+                            <View type='header' style={{ flexDirection:'row', alignItems:'center', padding:10, borderTopRightRadius:8, borderTopLeftRadius:8 }}>
+                              <View transparent style={{ flex:1 }}>
+                                <Text theme='h1'>Company Members</Text>
+                              </View>
+                              <Button
+                                type='success'
+                                title='NEW MEMBER'
+                                style={{ padding:10 }}
+                                onPress={() => console.log('hey')}
+                              />
+                            </View>
+                            <View transparent style={{ flexDirection:'row', flexWrap:'wrap'}}>
+                                {company_members.map((m,i) => {
+                                    return renderMembers({ item: m, index:i })
+                                })}
+                            </View>
+                        </View>
+
+                         <View float nativeID='company_competitions' style={{ flexGrow:1, flexBasis:1, minWidth:300, margin:10 }}>
+                            <View type='header' style={{ flexDirection:'row', alignItems:'center', padding:10, borderTopRightRadius:8, borderTopLeftRadius:8 }}>
+                              <View transparent style={{ flex:1 }}>
+                                <Text theme='h1'>Keys</Text>
+                                <Text theme='description' style={{ marginTop:3 }}>Your active API Keys</Text>
+                              </View>
+                              <Button
+                                title='REQUEST'
+                                type='success'
+                                style={{ padding:10 }}
+                                onPress={() => console.log('CREATE A NEW KEY!!!')}
+                              />
+                            </View>
+                            <View transparent type='body'>
+                                <FlatList
+                                    data={external_keys.sort((a,b) => moment(a.create_datetime).unix() - moment(b.create_datetime).unix()).slice(0,3)}
+                                    key={'company_keys'}
+                                    keyExtractor={item => item.external_key_id.toString()}
+                                    renderItem={renderKeys}
+                                />
+                            </View>
+                        </View>
+
+                    </View>
+                )
+            case 'second_row':
+                const active_embeds = company_embeds.length
+                return (
+                    <View transparent style={{ flexDirection:'row', flexWrap:'wrap' }}>
+                        
+                         <View float nativeID='active_embeds' style={{ minWidth: 250, margin:10 }}>
+                            <View transparent style={{ flex:1, justifyContent:'center', alignItems:'center', padding:10 }}>
+                                <Text theme='h1' size={40}>{active_embeds}</Text>
+                            </View>
+                            <View type='footer' style={{ flexDirection:'row', alignItems:'center', padding:10, borderBottomRightRadius:8, borderBottomLeftRadius:8 }}>
+                              <View transparent style={{ flex:1 }}>
+                                <Text theme='h1' color={Colors.text.success}>Active Embeds</Text>
+                              </View>
+                            </View>
+                        </View>
+                        
+                        <View float nativeID='company_competitions' style={{ flexGrow:4, flexBasis:4, minWidth:300, margin:10 }}>
+                            <View type='header' style={{ flexDirection:'row', alignItems:'center', padding:10, borderTopRightRadius:8, borderTopLeftRadius:8 }}>
+                              <View transparent style={{ flex:1 }}>
+                                <Text theme='h1'>Embeds</Text>
+                                <Text theme='description' style={{ marginTop:3 }}>Active Embeds</Text>
+                              </View>
+                              <Button
+                                title='CREATE'
+                                type='success'
+                                style={{ padding:10 }}
+                                onPress={() => console.log('CREATE A NEW EMBED!!!')}
+                              />
+                            </View>
+                            <View transparent type='body'>
+                                <FlatList
+                                    data={company_embeds.sort((a,b) => moment(a.create_datetime).unix() - moment(b.create_datetime).unix())}
+                                    key={'company_embeds'}
+                                    keyExtractor={item => item.company_embed_id.toString()}
+                                    renderItem={renderEmbeds}
+                                />
+                            </View>
+                        </View>
+                    </View>
+                )
+            case 'third_row':
+                const active_engagements = competitions.length + squares_competitions.length + bracket_competitions.length + flash_campaigns.length
+                return (
+                    <View transparent style={{ flexDirection:'row', flexWrap:'wrap' }}>
+                        
+                        <View float nativeID='active_engagements' style={{ minWidth: 250, margin:10 }}>
+                            <View transparent style={{ flex:1, justifyContent:'center', alignItems:'center', padding:10 }}>
+                                <Text theme='h1' size={40}>{active_engagements}</Text>
+                            </View>
+                            <View type='footer' style={{ flexDirection:'row', alignItems:'center', padding:10, borderBottomRightRadius:8, borderBottomLeftRadius:8 }}>
+                              <View transparent style={{ flex:1 }}>
+                                <Text theme='h1' color={Colors.text.success}>Active Engagements</Text>
+                              </View>
+                            </View>
+                        </View>
+                        
+                        <View float nativeID='company_competitions' style={{ flexGrow:1, flexBasis:1, minWidth:300, margin:10 }}>
+                            <View type='header' style={{ flexDirection:'row', alignItems:'center', padding:10, borderTopRightRadius:8, borderTopLeftRadius:8 }}>
+                              <View transparent style={{ flex:1 }}>
+                                <Text theme='h1'>Competitions</Text>
+                                <Text theme='description' style={{ marginTop:3 }}>Pick-ems / Wager competitions that are currently active</Text>
+                              </View>
+                              <Button
+                                title='CREATE'
+                                type='success'
+                                style={{ padding:10 }}
+                                onPress={() => onCreateEngagement('competition')}
+                              />
+                            </View>
+                            <View transparent type='body'>
+                                <FlatList
+                                    data={competitions.sort((a,b) => moment(a.scheduled_datetime).unix() - moment(b.scheduled_datetime).unix())}
+                                    key={'company_comps'}
+                                    keyExtractor={item => item.competition_id.toString()}
+                                    renderItem={renderCompetitions}
+                                />
+                            </View>
+                        </View>
+                        <View float nativeID='company_squares' style={{ flexGrow:1, flexBasis:1, minWidth:300, margin:10 }}>
+                            <View type='header' style={{ flexDirection:'row', alignItems:'center', padding:10, borderTopRightRadius:8, borderTopLeftRadius:8 }}>
+                              <View transparent style={{ flex:1 }}>
+                                <Text theme='h1'>Squares</Text>
+                                <Text theme='description' style={{ marginTop:3 }}>Bid on squares and win at the end of each quarter</Text>
+                              </View>
+                              <Button
+                                title='CREATE'
+                                type='success'
+                                style={{ padding:10 }}
+                                onPress={() => onCreateEngagement('squares')}
+                              />
+                            </View>
+                            <View transparent type='body'>
+                                <FlatList
+                                    data={squares_competitions.sort((a,b) => moment(a.begin_datetime).unix() - moment(b.begin_datetime).unix())}
+                                    key={'company_comps'}
+                                    keyExtractor={item => item.sq_comp_id.toString()}
+                                    renderItem={renderSquares}
+                                />
+                            </View>
+                        </View>
+
+                        <View float nativeID='company_brackets' style={{ flexGrow:1, flexBasis:1, minWidth:300, margin:10 }}>
+                            <View type='header' style={{ flexDirection:'row', alignItems:'center', padding:10, borderTopRightRadius:8, borderTopLeftRadius:8 }}>
+                              <View transparent style={{ flex:1 }}>
+                                <Text theme='h1'>Brackets</Text>
+                                <Text theme='description' style={{ marginTop:3 }}>Active Bracket Competitions</Text>
+                              </View>
+                              <Button
+                                title='CREATE'
+                                type='success'
+                                style={{ padding:10 }}
+                                onPress={() => onCreateEngagement('bracket')}
+                              />
+                            </View>
+                            <View transparent type='body'>
+                                <FlatList
+                                    data={bracket_competitions.sort((a,b) => moment(a.scheduled_datetime).unix() - moment(b.scheduled_datetime).unix())}
+                                    key={'company_comps'}
+                                    keyExtractor={item => item.bracket_competition_id.toString()}
+                                    renderItem={renderBrackets}
+                                />
+                            </View>
+                        </View>
+
+                         <View float nativeID='company_flash' style={{ flexGrow:1, flexBasis:1, minWidth:300, margin:10 }}>
+                            <View type='header' style={{ flexDirection:'row', alignItems:'center', padding:10, borderTopRightRadius:8, borderTopLeftRadius:8 }}>
+                              <View transparent style={{ flex:1 }}>
+                                <Text theme='h1'>Flash Market Campaigns</Text>
+                                <Text theme='description' style={{ marginTop:3 }}>Active Flash Campaigns</Text>
+                              </View>
+                              <Button
+                                title='CREATE'
+                                type='success'
+                                style={{ padding:10 }}
+                                onPress={() => onCreateEngagement('flash')}
+                              />
+                            </View>
+                            <View transparent type='body'>
+                                <FlatList
+                                    data={flash_campaigns.sort((a,b) => moment(a.create_datetime).unix() - moment(b.create_datetime).unix())}
+                                    key={'company_flash'}
+                                    keyExtractor={item => item.poll_campaign_id.toString()}
+                                    renderItem={renderFlashCampaigns}
+                                />
+                            </View>
+                        </View>
+
+                    </View>
+                )
+            default: return <></>
+        }
+    }
+
+    return (
+        <View style={{ flex:1 }}>
+            <FlatList
+                data={sections}
+                key={'partner_portal_sections'}
+                keyExtractor={item => item}
+                renderItem={renderSections}
+            />
+        </View>
+    )
+}
+
+export default PartnerPortal

package/src/index.tsx

@@ -63,15 +63,20 @@ import CreateEngagement from './CreateEngagement';
 import SquaresManager from './SquaresManager';
 import DiscordConnectionManager from './Discord';
 import ManageFlashMarket from './FlashMarket/components/ManageFlashMarket';
+import PartnerPortal from './PartnerPortal';
+import EmbedManager from './PartnerPortal/components/EmbedManager';
+
 export {
   Authenticator,
   Observer,
   CreateEngagement,
   DiscordConnectionManager,
   BEEventApi,
+  EmbedManager,
   RankingsCard,
   ManageFlashMarket,
   BELinkApi,
+  PartnerPortal,
   SquaresManager,
   GuideView,
   BetMatch,

package/src/types.d.ts

@@ -384,6 +384,31 @@ export interface PodcastEpisodesProps {
     last_update_datetime: any,
 }
 
+
+export interface ExternalKeyProps {
+    external_key_id:string,
+    company_id:string,
+    key:string,
+    key_level:string,
+    key_source:'svc'|'origin',
+    status:string,
+    origin?:string,
+    create_datetime:any,
+    last_update_datetime:any,
+    expire_datetime:any
+}
+
+export interface ExternalKeyRequestProps {
+    external_key_request_id:string, 
+    external_key_id: string,
+    status:string,
+    operation_name: string, 
+    error_description: string,
+    create_datetime:any,
+    last_update_datetime:any,
+    invalid_key_attempted?:string
+}
+
 export interface CompanyProps {
     company_id:string,
     company_name: string,
@@ -3073,6 +3098,9 @@ export interface EmbedPropertyProps {
     property:string,
     description: string,
     status: 'active'|'archived',
+    component:string,
+    label:string,
+    priority:number
     create_datetime: any,
     last_update_datetime:any
 }
@@ -3081,6 +3109,7 @@ export interface CompanyEmbedProps {
     company_embed_id:string,
     company_id:string,
     identifier:string,
+    name:string,
     status:'pending'|'active'|'inactive'|'archived',
     embed_id:string,
     properties: { [key:string]:any }