be-components 2.3.5 → 2.3.8

package/lib/typescript/src/SocialComponents/PodcastCard.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import type { PodcastProps } from '../types';
+type PodcastCardType = {
+    podcast: PodcastProps;
+    width: number;
+    onSelectPodcast: (podcast: PodcastProps) => void;
+};
+declare const PodcastCard: ({ podcast, width, onSelectPodcast }: PodcastCardType) => React.JSX.Element;
+export default PodcastCard;
+//# sourceMappingURL=PodcastCard.d.ts.map

package/lib/typescript/src/SocialComponents/PodcastCard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PodcastCard.d.ts","sourceRoot":"","sources":["../../../../src/SocialComponents/PodcastCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAM7C,KAAK,eAAe,GAAG;IACnB,OAAO,EAAC,YAAY,CAAC;IACrB,KAAK,EAAC,MAAM,CAAC;IACb,eAAe,EAAC,CAAC,OAAO,EAAC,YAAY,KAAK,IAAI,CAAA;CACjD,CAAA;AACD,QAAA,MAAM,WAAW,wCAAwC,eAAe,sBAgBvE,CAAA;AACD,eAAe,WAAW,CAAA"}

package/lib/typescript/src/SocialComponents/PodcastEpisodeCard.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import type { PodcastEpisodesProps, PodcastProps } from '../types';
+type PodcastEpisodeCardProps = {
+    podcast_episode: PodcastEpisodesProps;
+    podcast?: PodcastProps;
+    width: number;
+    onSelectEpisode: (pe: PodcastEpisodesProps) => void;
+};
+declare const PodcastEpisodeCard: ({ width, podcast_episode, podcast, onSelectEpisode }: PodcastEpisodeCardProps) => React.JSX.Element;
+export default PodcastEpisodeCard;
+//# sourceMappingURL=PodcastEpisodeCard.d.ts.map

package/lib/typescript/src/SocialComponents/PodcastEpisodeCard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PodcastEpisodeCard.d.ts","sourceRoot":"","sources":["../../../../src/SocialComponents/PodcastEpisodeCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,KAAK,EAAE,oBAAoB,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAKnE,KAAK,uBAAuB,GAAG;IAC3B,eAAe,EAAC,oBAAoB,CAAA;IACpC,OAAO,CAAC,EAAC,YAAY,CAAC;IACtB,KAAK,EAAC,MAAM,CAAC;IACb,eAAe,EAAC,CAAC,EAAE,EAAC,oBAAoB,KAAK,IAAI,CAAA;CACpD,CAAA;AAED,QAAA,MAAM,kBAAkB,yDAA0D,uBAAuB,sBAuBxG,CAAA;AAED,eAAe,kBAAkB,CAAA"}

package/lib/typescript/src/SocialComponents/PodcastModule/api/index.d.ts

@@ -0,0 +1,9 @@
+import type { PodcastEpisodesProps, PodcastProps, PublicPlayerProps } from "../../../types";
+export { PodcastApi };
+declare const PodcastApi: {
+    setEnvironment: () => void;
+    getPodcastById: (podcast_id: string) => Promise<PodcastProps | undefined>;
+    getPodcastEpisodesByPodcast: (podcast_id: string, offset: number) => Promise<PodcastEpisodesProps[]>;
+    getPlayersByPlayerIds: (player_ids?: string[]) => Promise<PublicPlayerProps[]>;
+};
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/src/SocialComponents/PodcastModule/api/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/SocialComponents/PodcastModule/api/index.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,oBAAoB,EAAE,YAAY,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAK5F,OAAO,EAAE,UAAU,EAAE,CAAA;AAErB,QAAA,MAAM,UAAU;;iCAMqB,MAAM,KAAE,OAAO,CAAC,YAAY,GAAG,SAAS,CAAC;8CAQ5B,MAAM,UAAS,MAAM,KAAE,OAAO,CAAC,oBAAoB,EAAE,CAAC;yCASzD,MAAM,EAAE,KAAG,OAAO,CAAC,iBAAiB,EAAE,CAAC;CAWrF,CAAA"}

package/lib/typescript/src/SocialComponents/PodcastModule/index.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import type { PodcastEpisodesProps } from '../../types';
+type PodcastModuleProps = {
+    podcast_id: string;
+    padding_insets?: {
+        top: number;
+        bottom: number;
+    };
+    onBack?: () => void;
+    onSelectEpisode: (pe: PodcastEpisodesProps) => void;
+};
+declare const PodcastModule: ({ podcast_id, padding_insets, onSelectEpisode, onBack }: PodcastModuleProps) => React.JSX.Element;
+export default PodcastModule;
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/src/SocialComponents/PodcastModule/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/SocialComponents/PodcastModule/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAEnD,OAAO,KAAK,EAAE,oBAAoB,EAAmC,MAAM,aAAa,CAAC;AASzF,KAAK,kBAAkB,GAAG;IACtB,UAAU,EAAC,MAAM,CAAC;IAClB,cAAc,CAAC,EAAC;QAAE,GAAG,EAAC,MAAM,CAAC;QAAC,MAAM,EAAC,MAAM,CAAA;KAAE,CAAC;IAC9C,MAAM,CAAC,EAAC,MAAM,IAAI,CAAC;IACnB,eAAe,EAAC,CAAC,EAAE,EAAC,oBAAoB,KAAK,IAAI,CAAA;CACpD,CAAA;AAED,QAAA,MAAM,aAAa,4DAA4D,kBAAkB,sBA4IhG,CAAA;AAED,eAAe,aAAa,CAAA"}

package/lib/typescript/src/SocialComponents/api/index.d.ts

@@ -1,5 +1,5 @@
-import type { AthleteProps, EventProps, LeagueProps, MatchProps, OrderProps, PlayerFollowerProps, PostReactionProps, TeamProps, TournamentProps } from "../../types";
-export { SocialComponentApi, SocialOrderHelpers };
+import type { AthleteProps, EventProps, LeagueProps, MatchProps, OrderProps, PlayerFollowerProps, PodcastEpisodesProps, PodcastProps, PostReactionProps, TeamProps, TournamentProps } from "../../types";
+export { SocialComponentApi, SocialOrderHelpers, SocialPodcastHelpers };
 declare const SocialComponentApi: {
     setEnvironment: () => void;
     getLeagues: () => Promise<LeagueProps[]>;
@@ -37,4 +37,8 @@ declare const SocialOrderHelpers: {
     };
     getOddsLabel: (odds: number, decimals?: number) => string;
 };
+declare const SocialPodcastHelpers: {
+    getPodcastImage: (podcast: PodcastProps) => string;
+    getEpisodeImage: (podcast_episode: PodcastEpisodesProps) => string;
+};
 //# sourceMappingURL=index.d.ts.map

package/lib/typescript/src/SocialComponents/api/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/SocialComponents/api/index.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,WAAW,EAAE,UAAU,EAAE,UAAU,EAAE,mBAAmB,EAAE,iBAAiB,EAAE,SAAS,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAQrK,OAAO,EAAE,kBAAkB,EAAE,kBAAkB,EAAE,CAAA;AAEjD,QAAA,MAAM,kBAAkB;;sBAQA,OAAO,CAAC,WAAW,EAAE,CAAC;0BAQhB,UAAU,KAAE,OAAO,CAAC,UAAU,GAAG,SAAS,CAAC;yCAQ5B,MAAM,EAAE;0CAIP,mBAAmB,KAAE,OAAO,CAAC,mBAAmB,CAAC;qCAItD,MAAM,EAAE,KAAE,OAAO,CAAC,UAAU,EAAE,CAAC;sCAS9B,MAAM,EAAE,KAAE,OAAO,CAAC,UAAU,EAAE,CAAC;oCAShC,MAAM,EAAE,KAAE,OAAO,CAAC,YAAY,EAAE,CAAC;oDASlB,MAAM,EAAE,KAAE,OAAO,CAAC,eAAe,EAAE,CAAC;8BAS1D,MAAM,EAAE;wCASE,iBAAiB,KAAE,OAAO,CAAC,iBAAiB,GAAC,SAAS,CAAC;wCAStD,iBAAiB,KAAE,OAAO,CAAC,iBAAiB,GAAC,SAAS,CAAC;CASnG,CAAA;AAGD,QAAA,MAAM,kBAAkB;0BACC,UAAU;8BAYN,UAAU;;;;kCAYN,MAAM,OAAM,MAAM;+BAWrB,UAAU,EAAE;;;;;;;+BAWZ,UAAU,UAAS,UAAU,EAAE,eAAc,eAAe,EAAE,WAAU,UAAU,EAAE,YAAW,YAAY,EAAE,SAAQ,SAAS,EAAE,WAAU,WAAW,EAAE,KAAE;QAAE,KAAK,EAAC,MAAM,CAAC;QAAC,IAAI,EAAC,MAAM,CAAC;QAAC,MAAM,CAAC,EAAC,WAAW,CAAC;QAAC,OAAO,CAAC,EAAC,YAAY,CAAC;QAAC,IAAI,CAAC,EAAC,SAAS,CAAA;KAAE;yBAwBzP,MAAM,aAAY,MAAM;CAM/C,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/SocialComponents/api/index.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,WAAW,EAAE,UAAU,EAAE,UAAU,EAAE,mBAAmB,EAAE,oBAAoB,EAAE,YAAY,EAAE,iBAAiB,EAAE,SAAS,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAQzM,OAAO,EAAE,kBAAkB,EAAE,kBAAkB,EAAE,oBAAoB,EAAE,CAAA;AAEvE,QAAA,MAAM,kBAAkB;;sBAQA,OAAO,CAAC,WAAW,EAAE,CAAC;0BAQhB,UAAU,KAAE,OAAO,CAAC,UAAU,GAAG,SAAS,CAAC;yCAQ5B,MAAM,EAAE;0CAIP,mBAAmB,KAAE,OAAO,CAAC,mBAAmB,CAAC;qCAItD,MAAM,EAAE,KAAE,OAAO,CAAC,UAAU,EAAE,CAAC;sCAS9B,MAAM,EAAE,KAAE,OAAO,CAAC,UAAU,EAAE,CAAC;oCAShC,MAAM,EAAE,KAAE,OAAO,CAAC,YAAY,EAAE,CAAC;oDASlB,MAAM,EAAE,KAAE,OAAO,CAAC,eAAe,EAAE,CAAC;8BAS1D,MAAM,EAAE;wCASE,iBAAiB,KAAE,OAAO,CAAC,iBAAiB,GAAC,SAAS,CAAC;wCAStD,iBAAiB,KAAE,OAAO,CAAC,iBAAiB,GAAC,SAAS,CAAC;CASnG,CAAA;AAGD,QAAA,MAAM,kBAAkB;0BACC,UAAU;8BAYN,UAAU;;;;kCAYN,MAAM,OAAM,MAAM;+BAWrB,UAAU,EAAE;;;;;;;+BAWZ,UAAU,UAAS,UAAU,EAAE,eAAc,eAAe,EAAE,WAAU,UAAU,EAAE,YAAW,YAAY,EAAE,SAAQ,SAAS,EAAE,WAAU,WAAW,EAAE,KAAE;QAAE,KAAK,EAAC,MAAM,CAAC;QAAC,IAAI,EAAC,MAAM,CAAC;QAAC,MAAM,CAAC,EAAC,WAAW,CAAC;QAAC,OAAO,CAAC,EAAC,YAAY,CAAC;QAAC,IAAI,CAAC,EAAC,SAAS,CAAA;KAAE;yBAwBzP,MAAM,aAAY,MAAM;CAM/C,CAAA;AAED,QAAA,MAAM,oBAAoB;+BACI,YAAY,KAAE,MAAM;uCAMZ,oBAAoB,KAAE,MAAM;CAMjE,CAAA"}

package/lib/typescript/src/SocialComponents/index.d.ts

@@ -1,5 +1,7 @@
 import PlayerCard from "./PlayerCard";
 import PlayerList from "./PlayerList";
 import PlayerProfile from "./PlayerProfile";
-export { PlayerCard, PlayerList, PlayerProfile };
+import CompanyProfile from './CompanyProfile';
+import PodcastModule from './PodcastModule';
+export { PlayerCard, PlayerList, PlayerProfile, CompanyProfile, PodcastModule };
 //# sourceMappingURL=index.d.ts.map

package/lib/typescript/src/SocialComponents/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/SocialComponents/index.tsx"],"names":[],"mappings":"AAAA,OAAO,UAAU,MAAM,cAAc,CAAC;AACtC,OAAO,UAAU,MAAM,cAAc,CAAC;AACtC,OAAO,aAAa,MAAM,iBAAiB,CAAC;AAE5C,OAAO,EACH,UAAU,EACV,UAAU,EACV,aAAa,EAChB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/SocialComponents/index.tsx"],"names":[],"mappings":"AAAA,OAAO,UAAU,MAAM,cAAc,CAAC;AACtC,OAAO,UAAU,MAAM,cAAc,CAAC;AACtC,OAAO,aAAa,MAAM,iBAAiB,CAAC;AAC5C,OAAO,cAAc,MAAM,kBAAkB,CAAC;AAC9C,OAAO,aAAa,MAAM,iBAAiB,CAAC;AAC5C,OAAO,EACH,UAAU,EACV,UAAU,EACV,aAAa,EACb,cAAc,EACd,aAAa,EAChB,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "be-components",
-  "version": "2.3.5",
+  "version": "2.3.8",
   "description": "Components for BettorEdge Apps",
   "main": "lib/commonjs/index",
   "module": "lib/module/index",

package/src/Engage/components/CompanyCard.tsx

@@ -1,17 +1,38 @@
-import React from 'react';
+import React, { useEffect, useRef } from 'react';
 import { View, Image, Linking, TouchableOpacity } from 'react-native';
-import type { CompanyProps } from '../../types';
+import type { BEEventProps, CompanyProps } from '../../types';
 import { view_styles } from '../../constants/styles';
 import { Text } from '../../Components';
 import Colors from '../../constants/colors';
+import { useIsInViewport } from '../../Components/ViewportObserver';
 
 type CompanyCardProps = {
     company:CompanyProps,
-    width:number
+    width:number,
+    onEvent?:(be_event:BEEventProps) => void,
+    onSelectCompany?:(company:CompanyProps) => void
 }
 const MAX_IMAGE_WIDTH = 175
 
-const CompanyCard = ({company, width}:CompanyCardProps) => {
+const CompanyCard = ({company, width, onEvent, onSelectCompany}:CompanyCardProps) => {
+    
+    const company_ref = useRef(null)
+    const isInViewport = useIsInViewport(company_ref);
+    useEffect(() => {
+        if(isInViewport && onEvent){
+            let be_event:BEEventProps = {
+                event_name:'company_view',
+                event_data: {
+                    view_type: 'engage',
+                    view_location: 'header',
+                },
+                level:2
+            }
+            
+            onEvent(be_event)
+        }
+    },[isInViewport])
+
     const image_width = width > MAX_IMAGE_WIDTH ? MAX_IMAGE_WIDTH : width
 
     let description = company.company_description
@@ -20,8 +41,9 @@ const CompanyCard = ({company, width}:CompanyCardProps) => {
     }
 
     return (
-        <TouchableOpacity style={{ ...view_styles.section ,width:image_width, backgroundColor:company.brand_primary ?? Colors.shades.shade100, borderRadius:8  }}
+        <TouchableOpacity ref={company_ref} style={{ ...view_styles.section, width:image_width, backgroundColor:company.brand_primary ?? Colors.shades.shade100, borderRadius:8  }}
         onPress={() => {
+            if(onSelectCompany){ onSelectCompany(company) }
             if(company.company_url){ Linking.openURL(company.company_url) }
             return
         }}>

package/src/Engage/components/EngageHeader.tsx

@@ -1,6 +1,6 @@
 import React, { useEffect, useState } from 'react';
 import { View, Image, FlatList, TouchableOpacity, ActivityIndicator } from "react-native";
-import type { CompanyProps } from '../../types';
+import type { BEEventProps, CompanyProps } from '../../types';
 import LinearGradient from 'react-native-linear-gradient';
 import Colors from '../../constants/colors';
 import { Button, Icons, Text } from '../../Components';
@@ -12,10 +12,12 @@ import { EngageApi } from '../api';
 type EngageHeaderProps = {
     companies:CompanyProps[],
     width:number,
+    onEvent?:(be_event:BEEventProps) => void,
+    onSelectCompany?:(company:CompanyProps) => void,
     onManage?:() => void
 }
 
-const EngageHeader = ({ companies, width, onManage }:EngageHeaderProps) => {
+const EngageHeader = ({ companies, width, onManage, onEvent, onSelectCompany }:EngageHeaderProps) => {
     const [ active_company, setActiveComany ] = useState<number>(0);
     const [ search, setSearch ] = useState<{
         loading:boolean,
@@ -65,6 +67,8 @@ const EngageHeader = ({ companies, width, onManage }:EngageHeaderProps) => {
                 <CompanyCard
                     company={data.item}
                     width={width / 2.5}
+                    onEvent={onEvent}
+                    onSelectCompany={onSelectCompany}
                 />
             </View>
         )

package/src/Engage/index.tsx

@@ -1,6 +1,6 @@
 import React, { useEffect, useState } from 'react';
 import { View, ActivityIndicator, FlatList, ScrollView } from 'react-native';
-import type { BracketCompetitionProps, BracketProps, CompanyProps, CompetitionPayoutTypeProps, CompetitionProps, CompetitionResultTypeProps, CompetitionSeasonProps, CompetitionTypeProps, EventProps, LeagueProps, PublicPlayerProps, SquaresCompetitionProps } from '../types';
+import type { BEEventProps, 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';
@@ -17,8 +17,10 @@ import PrivateCodePrompt from './components/PrivateCodePrompt';
 
 type EngageModuleProps = {
     player_id?:string,
+    onEvent?:(be_event:BEEventProps) => void,
     onManage:() => void,
     onCreateSeason?:() => void,
+    onSelectCompany?:(c:CompanyProps) => void,
     onCreateCompetition?:() => void,
     onCreateSquares?: () => void,
     onCreateBracketCompetition?:() => void,
@@ -29,7 +31,7 @@ type EngageModuleProps = {
 }
 
 const EngageModule = ({ onSelectBracketCompetition, onSelectCompetition, onSelectSquaresCompetition, onSelectCompetitionSeason,
-    onCreateSeason, onCreateCompetition, onCreateBracketCompetition, onCreateSquares, onManage
+    onCreateSeason, onCreateCompetition, onCreateBracketCompetition, onCreateSquares, onManage, onEvent, onSelectCompany
  }:EngageModuleProps) => {
     const [ module_size, setModuleSize ] = useState({ width:0, height:0 });
     const [ show_code_prompt, setShowCodePrompt ] = useState(false);
@@ -213,6 +215,8 @@ const EngageModule = ({ onSelectBracketCompetition, onSelectCompetition, onSelec
                     companies={companies}
                     width={module_size.width}
                     onManage={onManage}
+                    onEvent={onEvent}
+                    onSelectCompany={onSelectCompany}
                 />
                 <View style={{ ...view_styles.body_row, margin:10, backgroundColor:Colors.shades.white, borderRadius:22, borderWidth:4, borderColor:Colors.shades.shade100}}>
                     <Button

package/src/MarketComponents/components/OrderGradeBar.tsx

@@ -45,7 +45,7 @@ const OrderGradeBar = ({ grade, view_type, mask, onSelectGrade }:OrderGradeBarPr
         if(!grade && grade !== 0){ return <></> }
         //Check if the grade is greater than the minumum of the box
         const filled = grade >= data.item.min ? true : false
-        const success = grade > 97.5 ? true : false
+        const success = grade > 98 ? true : false
         const locked = !premium ? true : false
         //Render the box
         return (
@@ -68,7 +68,7 @@ const OrderGradeBar = ({ grade, view_type, mask, onSelectGrade }:OrderGradeBarPr
         if(!grade && grade !== 0){ return <></> }
         //Check if the grade is greater than the minumum of the box
         const filled = grade >= data.item.min ? true : false
-        const success = grade > 100 ? true : false
+        const success = grade > 98 ? true : false
         const locked = !premium ? true : false
 
         //Render the box
@@ -84,7 +84,7 @@ const OrderGradeBar = ({ grade, view_type, mask, onSelectGrade }:OrderGradeBarPr
     }
 
     if(view_type == 'market'){
-        const success = grade > 100 ? true : false
+        const success = grade > 98 ? true : false
         if(!premium){
             return (<></>)
         }

package/src/SocialComponents/ArticleCard.tsx

@@ -0,0 +1,54 @@
+import React from 'react';
+import { View, Image, TouchableOpacity } from 'react-native';
+import type { ArticleFeedProps, ArticleProps, BEEventProps } from "../types"
+import { Text } from '../Components';
+import { view_styles } from '../constants/styles';
+import Colors from '../constants/colors';
+
+type ArticleCardProps = {
+    article_feed?:ArticleFeedProps,
+    article:ArticleProps,
+    width:number,
+    onEvent?:(be_event:BEEventProps) => void,
+    onSelectArticle:(article:ArticleProps) => void
+}
+const ArticleCard = ({ article_feed, article, width, onSelectArticle, onEvent }:ArticleCardProps) => {
+
+    return (
+        <TouchableOpacity style={{ ...view_styles.section, width, flex:1 }} onPress={() => {
+                onSelectArticle(article)
+                if(onEvent){
+                    onEvent({
+                        event_name: 'article_click',
+                        event_data: {
+                            article_id: article.article_id,
+                            company_id: article.company_id,
+                        },
+                        level:2
+                    })
+                }
+            }}>
+            {article_feed ?
+            <View style={{ ...view_styles.section_header, backgroundColor:Colors.shades.shade100 }}>
+                <View style={{ flex:1 }}>
+                    <Text theme='header_2'>{article_feed.feed_name}</Text>
+                </View>
+            </View>
+            :<></>}
+            <View style={{ ...view_styles.section_body, padding:0 }}>
+                <View>
+                    <Image
+                        source={{ uri: article.image?.url }}
+                        style={{ width:width, height:width * 0.66 }}
+                        resizeMode='cover'
+                    />
+                </View>
+                <View style={{ padding:5 }}>
+                    <Text theme='header_2'>{article.title}</Text>
+                </View>
+            </View>
+        </TouchableOpacity>
+    )
+}
+
+export default ArticleCard

package/src/SocialComponents/CompanyProfile/api/index.ts

@@ -0,0 +1,151 @@
+import axios from "axios";
+import { APIOverrides } from "../../../ApiOverrides";
+import type { ArticleFeedProps, ArticleProps, BracketCompetitionProps, BracketProps, CompanyProps, CompetitionPayoutTypeProps, CompetitionProps, CompetitionResultTypeProps, CompetitionTypeProps, EventProps, LeagueProps, PodcastProps, PublicPlayerProps, SquaresCompetitionProps } from "../../../types";
+import type { CompanyMemberProps } from "../../../Authenticator/api/types";
+import moment from "moment-mini";
+
+let AUTH_SVC_API = '';
+let SOCIAL_SVC_API = '';
+let TP_SVC_API = '';
+let EVENT_SVC_API = '';
+
+export { CompanyProfileApi, CompanyProfileHelpers }
+
+const CompanyProfileApi = {
+    setEnvironment: () => {
+        const endpoints = APIOverrides.getEndpoints();
+        SOCIAL_SVC_API = endpoints['SOCIAL_SVC_API'] as string;
+        AUTH_SVC_API = endpoints['AUTH_SVC_API'] as string;
+        TP_SVC_API = endpoints['TP_SVC_API'] as string;
+        EVENT_SVC_API = endpoints['EVENT_SVC_API'] as string;
+    },
+    getCompanyById: async (company_id: string): Promise<{ company: CompanyProps, company_members: CompanyMemberProps[] } | undefined> => {
+        try {
+            const resp = await axios.get(`${AUTH_SVC_API}/v1/companies/company/id/${company_id}`)
+            return resp.data
+        } catch (e) {
+            return undefined
+        }
+    },
+    getPlayersByPlayerIds: async (player_ids: string[]): Promise<PublicPlayerProps[]> => {
+        if (player_ids.length == 0) { return [] }
+        try {
+            const resp = await axios.post(`${AUTH_SVC_API}/v1/players/bulk/get`, { player_ids })
+            return resp.data.players
+        } catch (e) {
+            console.log(e);
+            return []
+        }
+    },
+    getLeagues: async():Promise<LeagueProps[]> => {
+        try {
+            const resp = await axios.get(`${EVENT_SVC_API}/v1/leagues?status=active`)
+            return resp.data.leagues
+        } catch (e) {
+            return []
+        }
+    },
+    getEventsByEventIds: async(event_ids:string[]):Promise<EventProps[]> => {
+        try {
+            if(event_ids.length == 0){ return [] }
+            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 []
+        }
+    },
+    getBracketsByIds: async(bracket_ids:string[]):Promise<BracketProps[]> => {
+        try {
+            if(bracket_ids.length == 0){ return [] }
+            const resp = await axios.post(`${EVENT_SVC_API}/v1/brackets/bulk/get`, { bracket_ids })
+            return resp.data.brackets
+        } catch (e) {
+            console.log(e)
+            return []
+        }
+    },
+    getCompetitionOptions: async():Promise<undefined | {competition_types:CompetitionTypeProps[], competition_result_types:CompetitionResultTypeProps[], competition_payout_types:CompetitionPayoutTypeProps[]}> => {
+        try {
+            const resp = await axios.get(`${TP_SVC_API}/v1/competitions/options`)
+            return resp.data
+        } catch (e) {
+            console.log(e)
+            return undefined
+        }
+
+    },
+    getCompetitionsByCompanyId: async (company_id: string, offset: number, status: 'active' | 'closed'): Promise<CompetitionProps[]> => {
+        try {
+            const resp = await axios.get(`${TP_SVC_API}/v1/competitions/company/${company_id}?offset=${offset}&status=${status}`)
+            return resp.data.competitions
+        } catch (e) {
+            console.log(e);
+            return []
+        }
+    },
+    
+    getSquaresByCompanyId: async (company_id: string, offset: number, status: 'active' | 'closed'): Promise<CompetitionProps[]> => {
+        try {
+            const resp = await axios.get(`${TP_SVC_API}/v1/competitions/company/${company_id}?offset=${offset}&status=${status}`)
+            return resp.data.competitions
+        } catch (e) {
+            console.log(e);
+            return []
+        }
+    },
+    getSquaresCompsByCompanyId: async (company_id: string, status: string): Promise<SquaresCompetitionProps[]> => {
+        try {
+            const resp = await axios.get(`${TP_SVC_API}/tp/squares/company/${company_id}?status=${status}`);
+            return resp.data.squares_competitions
+        } catch (e) {
+            console.log(e);
+            return []
+        }
+    },
+    getBracketCompetitionsByCompanyId: async (company_id: string, offset: number, status?: 'active' | 'closed'): Promise<BracketCompetitionProps[]> => {
+        try {
+            const resp = await axios.get(`${TP_SVC_API}/v1/brackets/competitions/company/${company_id}?offset=${offset}&status=${status}`)
+            return resp.data.bracket_competitions
+        } catch (e) {
+            console.log(e);
+            return []
+        }
+    },
+    getPodcastsByCompanyId:async(company_id:string, offset:number):Promise<PodcastProps[]> => {
+        try {
+            const resp = await axios.get(`${SOCIAL_SVC_API}/v1/podcasts/company/${company_id}?offset=${offset}`);
+            return resp.data.podcasts
+        } catch (e) {
+            console.log(e);
+            return []
+        }
+    },
+    getArticlesByCompanyId: async(company_id:string, offset:number):Promise<ArticleProps[]> => {
+        try {
+            const resp = await axios.get(`${SOCIAL_SVC_API}/v1/articles/company/${company_id}?offset=${offset}`);
+            console.log(resp.data)
+            return resp.data.articles
+        } catch (e) {
+            return []
+        }
+    },
+    getArticleFeedsByCompanyId: async(company_id:string):Promise<ArticleFeedProps[]> => {
+        try {
+            const resp = await axios.get(`${SOCIAL_SVC_API}/v1/articles/feeds/company/${company_id}`)
+            console.log(resp.data)
+            return resp.data.article_feeds
+        } catch (e) {
+            return []
+        }
+    }
+}
+
+const CompanyProfileHelpers = {
+    sortComps: (comps:CompetitionProps[], bcs:BracketCompetitionProps[], scs:SquaresCompetitionProps[]):{ type: 'competition'|'squares_competition'|'bracket_competition', id:string, start_time:any }[] => {
+        let sorted_comps:{ type:'competition'|'squares_competition'|'bracket_competition', id:string, start_time:any }[] = [];
+        comps.map(c => sorted_comps.push({ type: 'competition', id: c.competition_id, start_time: moment(c.scheduled_datetime) }));
+        bcs.map(bc => sorted_comps.push({ type: 'bracket_competition', id:bc.bracket_competition_id, start_time: moment(bc.scheduled_datetime) }));
+        scs.map(s => sorted_comps.push({ type: 'squares_competition', id:s.sq_comp_id, start_time: moment(s.begin_datetime) }));
+        return sorted_comps
+    }
+}