@stream-io/video-react-native-sdk 1.13.3 → 1.14.0

package/dist/module/components/Livestream/LivestreamTopView/DurationBadge.js

@@ -1,7 +1,6 @@
-import React, { useEffect, useState } from 'react';
+import React, { useEffect, useMemo, useState } from 'react';
 import { StyleSheet, Text, View } from 'react-native';
 import { useTheme } from '../../../contexts';
-import { ShieldBadge } from '../../../icons';
 import { useCall, useCallStateHooks } from '@stream-io/video-react-bindings';
 
 /**
@@ -14,6 +13,7 @@ import { useCall, useCallStateHooks } from '@stream-io/video-react-bindings';
 export const DurationBadge = ({
   mode
 }) => {
+  const styles = useStyles();
   const {
     useCallSession
   } = useCallStateHooks();
@@ -30,9 +30,6 @@ export const DurationBadge = ({
   const {
     theme: {
       colors,
-      variants: {
-        iconSizes
-      },
       durationBadge
     }
   } = useTheme();
@@ -103,33 +100,40 @@ export const DurationBadge = ({
       backgroundColor: colors.sheetTertiary
     }, durationBadge.container]
   }, /*#__PURE__*/React.createElement(View, {
-    style: [styles.icon, {
-      height: iconSizes.xs,
-      width: iconSizes.xs
-    }, durationBadge.icon]
-  }, /*#__PURE__*/React.createElement(ShieldBadge, null)), /*#__PURE__*/React.createElement(Text, {
+    style: [styles.dot, durationBadge.icon]
+  }), /*#__PURE__*/React.createElement(Text, {
     style: [styles.label, {
       color: colors.textPrimary
     }, durationBadge.label]
   }, formatDuration(duration)));
 };
-const styles = StyleSheet.create({
-  container: {
-    paddingHorizontal: 8,
-    paddingVertical: 4,
-    borderRadius: 4,
-    flexDirection: 'row',
-    alignItems: 'center',
-    justifyContent: 'center'
-  },
-  icon: {},
-  label: {
-    textAlign: 'center',
-    fontSize: 13,
-    fontWeight: '400',
-    flexShrink: 1,
-    includeFontPadding: false,
-    paddingLeft: 4
-  }
-});
+const useStyles = () => {
+  const {
+    theme
+  } = useTheme();
+  return useMemo(() => StyleSheet.create({
+    container: {
+      paddingHorizontal: theme.variants.spacingSizes.sm,
+      paddingVertical: theme.variants.spacingSizes.sm,
+      borderRadius: theme.variants.borderRadiusSizes.sm,
+      flexDirection: 'row',
+      alignItems: 'center',
+      justifyContent: 'center'
+    },
+    dot: {
+      backgroundColor: theme.colors.iconWarning,
+      marginRight: theme.variants.spacingSizes.xs,
+      borderRadius: 90,
+      height: 10,
+      width: 10
+    },
+    label: {
+      textAlign: 'center',
+      fontSize: theme.variants.fontSizes.md,
+      fontWeight: '600',
+      flexShrink: 1,
+      paddingLeft: theme.variants.spacingSizes.xs
+    }
+  }), [theme]);
+};
 //# sourceMappingURL=DurationBadge.js.map

package/dist/module/components/Livestream/LivestreamTopView/DurationBadge.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useEffect","useState","StyleSheet","Text","View","useTheme","ShieldBadge","useCall","useCallStateHooks","DurationBadge","mode","useCallSession","session","duration","setDuration","live_started_at","liveStartTime","Date","now","Math","floor","getTime","call","theme","colors","variants","iconSizes","durationBadge","intervalId","handleLiveStarted","setInterval","d","handleLiveEnded","event","callDetails","live_ended_at","clearInterval","callLiveStartedUnsubscribe","on","callUpdatedUnsubscribe","formatDuration","durationInMs","days","hours","minutes","seconds","createElement","style","styles","container","backgroundColor","sheetTertiary","icon","height","xs","width","label","color","textPrimary","create","paddingHorizontal","paddingVertical","borderRadius","flexDirection","alignItems","justifyContent","textAlign","fontSize","fontWeight","flexShrink","includeFontPadding","paddingLeft"],"sourceRoot":"../../../../../src","sources":["components/Livestream/LivestreamTopView/DurationBadge.tsx"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","useEffect","useMemo","useState","StyleSheet","Text","View","useTheme","useCall","useCallStateHooks","DurationBadge","mode","styles","useStyles","useCallSession","session","duration","setDuration","live_started_at","liveStartTime","Date","now","Math","floor","getTime","call","theme","colors","durationBadge","intervalId","handleLiveStarted","setInterval","d","handleLiveEnded","event","callDetails","live_ended_at","clearInterval","callLiveStartedUnsubscribe","on","callUpdatedUnsubscribe","formatDuration","durationInMs","days","hours","minutes","seconds","createElement","style","container","backgroundColor","sheetTertiary","dot","icon","label","color","textPrimary","create","paddingHorizontal","variants","spacingSizes","sm","paddingVertical","borderRadius","borderRadiusSizes","flexDirection","alignItems","justifyContent","iconWarning","marginRight","xs","height","width","textAlign","fontSize","fontSizes","md","fontWeight","flexShrink","paddingLeft"],"sourceRoot":"../../../../../src","sources":["components/Livestream/LivestreamTopView/DurationBadge.tsx"],"mappings":"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","ignoreList":[]}

package/dist/module/components/Livestream/LivestreamTopView/FollowerCount.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useMemo } from 'react';
 import { StyleSheet, Text, View } from 'react-native';
 import { useTheme } from '../../../contexts';
 import { useCallStateHooks } from '@stream-io/video-react-bindings';
@@ -12,12 +12,9 @@ import { Eye } from '../../../icons';
  * The FollowerCount component that displays the number of participants while in the call.
  */
 export const FollowerCount = ({}) => {
+  const styles = useStyles();
   const {
     theme: {
-      colors,
-      variants: {
-        iconSizes
-      },
       followerCount
     }
   } = useTheme();
@@ -26,38 +23,41 @@ export const FollowerCount = ({}) => {
   } = useCallStateHooks();
   const totalParticipants = useParticipantCount();
   return /*#__PURE__*/React.createElement(View, {
-    style: [styles.container, {
-      backgroundColor: colors.sheetTertiary
-    }, followerCount.container]
+    style: [styles.container, followerCount.container]
   }, /*#__PURE__*/React.createElement(View, {
-    style: [styles.icon, {
-      height: iconSizes.xs,
-      width: iconSizes.xs
-    }, followerCount.icon]
+    style: [styles.icon, followerCount.icon]
   }, /*#__PURE__*/React.createElement(Eye, null)), /*#__PURE__*/React.createElement(Text, {
-    style: [styles.label, {
-      color: colors.textPrimary
-    }, followerCount.label]
+    style: [styles.label, followerCount.label]
   }, totalParticipants));
 };
-const styles = StyleSheet.create({
-  container: {
-    paddingHorizontal: 8,
-    paddingVertical: 4,
-    borderTopRightRadius: 4,
-    borderBottomRightRadius: 4,
-    flexDirection: 'row',
-    alignItems: 'center',
-    justifyContent: 'center'
-  },
-  icon: {},
-  label: {
-    fontSize: 13,
-    fontWeight: '400',
-    flexShrink: 1,
-    textAlign: 'center',
-    includeFontPadding: false,
-    marginLeft: 4
-  }
-});
+const useStyles = () => {
+  const {
+    theme
+  } = useTheme();
+  return useMemo(() => StyleSheet.create({
+    container: {
+      paddingHorizontal: theme.variants.spacingSizes.sm,
+      paddingVertical: 4,
+      borderTopRightRadius: 4,
+      borderBottomRightRadius: 4,
+      flexDirection: 'row',
+      alignItems: 'center',
+      justifyContent: 'center',
+      backgroundColor: theme.colors.sheetTertiary
+    },
+    icon: {
+      height: theme.variants.iconSizes.sm,
+      width: theme.variants.iconSizes.sm
+    },
+    label: {
+      fontSize: theme.variants.fontSizes.md,
+      fontWeight: '600',
+      flexShrink: 1,
+      textAlign: 'center',
+      includeFontPadding: false,
+      marginLeft: theme.variants.spacingSizes.xs,
+      color: theme.colors.textPrimary
+    }
+  }), [theme]);
+};
 //# sourceMappingURL=FollowerCount.js.map

package/dist/module/components/Livestream/LivestreamTopView/FollowerCount.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","StyleSheet","Text","View","useTheme","useCallStateHooks","Eye","FollowerCount","theme","colors","variants","iconSizes","followerCount","useParticipantCount","totalParticipants","createElement","style","styles","container","backgroundColor","sheetTertiary","icon","height","xs","width","label","color","textPrimary","create","paddingHorizontal","paddingVertical","borderTopRightRadius","borderBottomRightRadius","flexDirection","alignItems","justifyContent","fontSize","fontWeight","flexShrink","textAlign","includeFontPadding","marginLeft"],"sourceRoot":"../../../../../src","sources":["components/Livestream/LivestreamTopView/FollowerCount.tsx"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,UAAU,EAAEC,IAAI,EAAEC,IAAI,QAAQ,cAAc;AACrD,SAASC,QAAQ,QAAQ,mBAAmB;AAC5C,SAASC,iBAAiB,QAAQ,iCAAiC;AACnE,SAASC,GAAG,QAAQ,gBAAgB;;AAEpC;AACA;AACA;;AAGA;AACA;AACA;AACA,OAAO,MAAMC,aAAa,GAAGA,CAAC,CAAqB,CAAC,KAAK;EACvD,MAAM;IACJC,KAAK,EAAE;MACLC,MAAM;MACNC,QAAQ,EAAE;QAAEC;MAAU,CAAC;MACvBC;IACF;EACF,CAAC,GAAGR,QAAQ,CAAC,CAAC;EACd,MAAM;IAAES;EAAoB,CAAC,GAAGR,iBAAiB,CAAC,CAAC;EACnD,MAAMS,iBAAiB,GAAGD,mBAAmB,CAAC,CAAC;EAC/C,oBACEb,KAAA,CAAAe,aAAA,CAACZ,IAAI;IACHa,KAAK,EAAE,CACLC,MAAM,CAACC,SAAS,EAChB;MAAEC,eAAe,EAAEV,MAAM,CAACW;IAAc,CAAC,EACzCR,aAAa,CAACM,SAAS;EACvB,gBAEFlB,KAAA,CAAAe,aAAA,CAACZ,IAAI;IACHa,KAAK,EAAE,CACLC,MAAM,CAACI,IAAI,EACX;MAAEC,MAAM,EAAEX,SAAS,CAACY,EAAE;MAAEC,KAAK,EAAEb,SAAS,CAACY;IAAG,CAAC,EAC7CX,aAAa,CAACS,IAAI;EAClB,gBAEFrB,KAAA,CAAAe,aAAA,CAACT,GAAG,MAAE,CACF,CAAC,eACPN,KAAA,CAAAe,aAAA,CAACb,IAAI;IACHc,KAAK,EAAE,CACLC,MAAM,CAACQ,KAAK,EACZ;MAAEC,KAAK,EAAEjB,MAAM,CAACkB;IAAY,CAAC,EAC7Bf,aAAa,CAACa,KAAK;EACnB,GAEDX,iBACG,CACF,CAAC;AAEX,CAAC;AAED,MAAMG,MAAM,GAAGhB,UAAU,CAAC2B,MAAM,CAAC;EAC/BV,SAAS,EAAE;IACTW,iBAAiB,EAAE,CAAC;IACpBC,eAAe,EAAE,CAAC;IAClBC,oBAAoB,EAAE,CAAC;IACvBC,uBAAuB,EAAE,CAAC;IAC1BC,aAAa,EAAE,KAAK;IACpBC,UAAU,EAAE,QAAQ;IACpBC,cAAc,EAAE;EAClB,CAAC;EACDd,IAAI,EAAE,CAAC,CAAC;EACRI,KAAK,EAAE;IACLW,QAAQ,EAAE,EAAE;IACZC,UAAU,EAAE,KAAK;IACjBC,UAAU,EAAE,CAAC;IACbC,SAAS,EAAE,QAAQ;IACnBC,kBAAkB,EAAE,KAAK;IACzBC,UAAU,EAAE;EACd;AACF,CAAC,CAAC","ignoreList":[]}
+{"version":3,"names":["React","useMemo","StyleSheet","Text","View","useTheme","useCallStateHooks","Eye","FollowerCount","styles","useStyles","theme","followerCount","useParticipantCount","totalParticipants","createElement","style","container","icon","label","create","paddingHorizontal","variants","spacingSizes","sm","paddingVertical","borderTopRightRadius","borderBottomRightRadius","flexDirection","alignItems","justifyContent","backgroundColor","colors","sheetTertiary","height","iconSizes","width","fontSize","fontSizes","md","fontWeight","flexShrink","textAlign","includeFontPadding","marginLeft","xs","color","textPrimary"],"sourceRoot":"../../../../../src","sources":["components/Livestream/LivestreamTopView/FollowerCount.tsx"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,OAAO,QAAQ,OAAO;AACtC,SAASC,UAAU,EAAEC,IAAI,EAAEC,IAAI,QAAQ,cAAc;AACrD,SAASC,QAAQ,QAAQ,mBAAmB;AAC5C,SAASC,iBAAiB,QAAQ,iCAAiC;AACnE,SAASC,GAAG,QAAQ,gBAAgB;;AAEpC;AACA;AACA;;AAGA;AACA;AACA;AACA,OAAO,MAAMC,aAAa,GAAGA,CAAC,CAAqB,CAAC,KAAK;EACvD,MAAMC,MAAM,GAAGC,SAAS,CAAC,CAAC;EAC1B,MAAM;IACJC,KAAK,EAAE;MAAEC;IAAc;EACzB,CAAC,GAAGP,QAAQ,CAAC,CAAC;EAEd,MAAM;IAAEQ;EAAoB,CAAC,GAAGP,iBAAiB,CAAC,CAAC;EACnD,MAAMQ,iBAAiB,GAAGD,mBAAmB,CAAC,CAAC;EAE/C,oBACEb,KAAA,CAAAe,aAAA,CAACX,IAAI;IAACY,KAAK,EAAE,CAACP,MAAM,CAACQ,SAAS,EAAEL,aAAa,CAACK,SAAS;EAAE,gBACvDjB,KAAA,CAAAe,aAAA,CAACX,IAAI;IAACY,KAAK,EAAE,CAACP,MAAM,CAACS,IAAI,EAAEN,aAAa,CAACM,IAAI;EAAE,gBAC7ClB,KAAA,CAAAe,aAAA,CAACR,GAAG,MAAE,CACF,CAAC,eACPP,KAAA,CAAAe,aAAA,CAACZ,IAAI;IAACa,KAAK,EAAE,CAACP,MAAM,CAACU,KAAK,EAAEP,aAAa,CAACO,KAAK;EAAE,GAC9CL,iBACG,CACF,CAAC;AAEX,CAAC;AAED,MAAMJ,SAAS,GAAGA,CAAA,KAAM;EACtB,MAAM;IAAEC;EAAM,CAAC,GAAGN,QAAQ,CAAC,CAAC;EAC5B,OAAOJ,OAAO,CACZ,MACEC,UAAU,CAACkB,MAAM,CAAC;IAChBH,SAAS,EAAE;MACTI,iBAAiB,EAAEV,KAAK,CAACW,QAAQ,CAACC,YAAY,CAACC,EAAE;MACjDC,eAAe,EAAE,CAAC;MAClBC,oBAAoB,EAAE,CAAC;MACvBC,uBAAuB,EAAE,CAAC;MAC1BC,aAAa,EAAE,KAAK;MACpBC,UAAU,EAAE,QAAQ;MACpBC,cAAc,EAAE,QAAQ;MACxBC,eAAe,EAAEpB,KAAK,CAACqB,MAAM,CAACC;IAChC,CAAC;IACDf,IAAI,EAAE;MACJgB,MAAM,EAAEvB,KAAK,CAACW,QAAQ,CAACa,SAAS,CAACX,EAAE;MACnCY,KAAK,EAAEzB,KAAK,CAACW,QAAQ,CAACa,SAAS,CAACX;IAClC,CAAC;IACDL,KAAK,EAAE;MACLkB,QAAQ,EAAE1B,KAAK,CAACW,QAAQ,CAACgB,SAAS,CAACC,EAAE;MACrCC,UAAU,EAAE,KAAK;MACjBC,UAAU,EAAE,CAAC;MACbC,SAAS,EAAE,QAAQ;MACnBC,kBAAkB,EAAE,KAAK;MACzBC,UAAU,EAAEjC,KAAK,CAACW,QAAQ,CAACC,YAAY,CAACsB,EAAE;MAC1CC,KAAK,EAAEnC,KAAK,CAACqB,MAAM,CAACe;IACtB;EACF,CAAC,CAAC,EACJ,CAACpC,KAAK,CACR,CAAC;AACH,CAAC","ignoreList":[]}

package/dist/module/components/Livestream/LivestreamTopView/LiveIndicator.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useMemo } from 'react';
 import { StyleSheet, Text, View } from 'react-native';
 import { useTheme } from '../../../contexts';
 import { useI18n } from '@stream-io/video-react-bindings';
@@ -11,6 +11,7 @@ import { useI18n } from '@stream-io/video-react-bindings';
  * The LiveIndicator component displays whether the live stream is live or not.
  */
 export const LiveIndicator = ({}) => {
+  const styles = useStyles();
   const {
     theme: {
       colors,
@@ -31,17 +32,22 @@ export const LiveIndicator = ({}) => {
     }, typefaces.subtitleBold, liveIndicator.label]
   }, t('Live')));
 };
-const styles = StyleSheet.create({
-  container: {
-    paddingHorizontal: 8,
-    paddingVertical: 4,
-    borderTopLeftRadius: 4,
-    borderBottomLeftRadius: 4,
-    justifyContent: 'center'
-  },
-  label: {
-    textAlign: 'center',
-    includeFontPadding: false
-  }
-});
+const useStyles = () => {
+  const {
+    theme
+  } = useTheme();
+  return useMemo(() => StyleSheet.create({
+    container: {
+      paddingHorizontal: theme.variants.spacingSizes.sm,
+      paddingVertical: theme.variants.spacingSizes.sm,
+      borderTopLeftRadius: theme.variants.borderRadiusSizes.sm,
+      borderBottomLeftRadius: theme.variants.borderRadiusSizes.sm,
+      justifyContent: 'center'
+    },
+    label: {
+      textAlign: 'center',
+      includeFontPadding: false
+    }
+  }), [theme]);
+};
 //# sourceMappingURL=LiveIndicator.js.map

package/dist/module/components/Livestream/LivestreamTopView/LiveIndicator.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","StyleSheet","Text","View","useTheme","useI18n","LiveIndicator","theme","colors","typefaces","liveIndicator","t","createElement","style","styles","container","backgroundColor","buttonPrimary","label","color","textPrimary","subtitleBold","create","paddingHorizontal","paddingVertical","borderTopLeftRadius","borderBottomLeftRadius","justifyContent","textAlign","includeFontPadding"],"sourceRoot":"../../../../../src","sources":["components/Livestream/LivestreamTopView/LiveIndicator.tsx"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,UAAU,EAAEC,IAAI,EAAEC,IAAI,QAAQ,cAAc;AACrD,SAASC,QAAQ,QAAQ,mBAAmB;AAC5C,SAASC,OAAO,QAAQ,iCAAiC;;AAEzD;AACA;AACA;;AAGA;AACA;AACA;AACA,OAAO,MAAMC,aAAa,GAAGA,CAAC,CAAqB,CAAC,KAAK;EACvD,MAAM;IACJC,KAAK,EAAE;MAAEC,MAAM;MAAEC,SAAS;MAAEC;IAAc;EAC5C,CAAC,GAAGN,QAAQ,CAAC,CAAC;EACd,MAAM;IAAEO;EAAE,CAAC,GAAGN,OAAO,CAAC,CAAC;EACvB,oBACEL,KAAA,CAAAY,aAAA,CAACT,IAAI;IACHU,KAAK,EAAE,CACLC,MAAM,CAACC,SAAS,EAChB;MAAEC,eAAe,EAAER,MAAM,CAACS;IAAc,CAAC,EACzCP,aAAa,CAACK,SAAS;EACvB,gBAEFf,KAAA,CAAAY,aAAA,CAACV,IAAI;IACHW,KAAK,EAAE,CACLC,MAAM,CAACI,KAAK,EACZ;MAAEC,KAAK,EAAEX,MAAM,CAACY;IAAY,CAAC,EAC7BX,SAAS,CAACY,YAAY,EACtBX,aAAa,CAACQ,KAAK;EACnB,GAEDP,CAAC,CAAC,MAAM,CACL,CACF,CAAC;AAEX,CAAC;AAED,MAAMG,MAAM,GAAGb,UAAU,CAACqB,MAAM,CAAC;EAC/BP,SAAS,EAAE;IACTQ,iBAAiB,EAAE,CAAC;IACpBC,eAAe,EAAE,CAAC;IAClBC,mBAAmB,EAAE,CAAC;IACtBC,sBAAsB,EAAE,CAAC;IACzBC,cAAc,EAAE;EAClB,CAAC;EACDT,KAAK,EAAE;IACLU,SAAS,EAAE,QAAQ;IACnBC,kBAAkB,EAAE;EACtB;AACF,CAAC,CAAC","ignoreList":[]}
+{"version":3,"names":["React","useMemo","StyleSheet","Text","View","useTheme","useI18n","LiveIndicator","styles","useStyles","theme","colors","typefaces","liveIndicator","t","createElement","style","container","backgroundColor","buttonPrimary","label","color","textPrimary","subtitleBold","create","paddingHorizontal","variants","spacingSizes","sm","paddingVertical","borderTopLeftRadius","borderRadiusSizes","borderBottomLeftRadius","justifyContent","textAlign","includeFontPadding"],"sourceRoot":"../../../../../src","sources":["components/Livestream/LivestreamTopView/LiveIndicator.tsx"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,OAAO,QAAQ,OAAO;AACtC,SAASC,UAAU,EAAEC,IAAI,EAAEC,IAAI,QAAQ,cAAc;AACrD,SAASC,QAAQ,QAAQ,mBAAmB;AAC5C,SAASC,OAAO,QAAQ,iCAAiC;;AAEzD;AACA;AACA;;AAGA;AACA;AACA;AACA,OAAO,MAAMC,aAAa,GAAGA,CAAC,CAAqB,CAAC,KAAK;EACvD,MAAMC,MAAM,GAAGC,SAAS,CAAC,CAAC;EAC1B,MAAM;IACJC,KAAK,EAAE;MAAEC,MAAM;MAAEC,SAAS;MAAEC;IAAc;EAC5C,CAAC,GAAGR,QAAQ,CAAC,CAAC;EACd,MAAM;IAAES;EAAE,CAAC,GAAGR,OAAO,CAAC,CAAC;EACvB,oBACEN,KAAA,CAAAe,aAAA,CAACX,IAAI;IACHY,KAAK,EAAE,CACLR,MAAM,CAACS,SAAS,EAChB;MAAEC,eAAe,EAAEP,MAAM,CAACQ;IAAc,CAAC,EACzCN,aAAa,CAACI,SAAS;EACvB,gBAEFjB,KAAA,CAAAe,aAAA,CAACZ,IAAI;IACHa,KAAK,EAAE,CACLR,MAAM,CAACY,KAAK,EACZ;MAAEC,KAAK,EAAEV,MAAM,CAACW;IAAY,CAAC,EAC7BV,SAAS,CAACW,YAAY,EACtBV,aAAa,CAACO,KAAK;EACnB,GAEDN,CAAC,CAAC,MAAM,CACL,CACF,CAAC;AAEX,CAAC;AAED,MAAML,SAAS,GAAGA,CAAA,KAAM;EACtB,MAAM;IAAEC;EAAM,CAAC,GAAGL,QAAQ,CAAC,CAAC;EAC5B,OAAOJ,OAAO,CACZ,MACEC,UAAU,CAACsB,MAAM,CAAC;IAChBP,SAAS,EAAE;MACTQ,iBAAiB,EAAEf,KAAK,CAACgB,QAAQ,CAACC,YAAY,CAACC,EAAE;MACjDC,eAAe,EAAEnB,KAAK,CAACgB,QAAQ,CAACC,YAAY,CAACC,EAAE;MAC/CE,mBAAmB,EAAEpB,KAAK,CAACgB,QAAQ,CAACK,iBAAiB,CAACH,EAAE;MACxDI,sBAAsB,EAAEtB,KAAK,CAACgB,QAAQ,CAACK,iBAAiB,CAACH,EAAE;MAC3DK,cAAc,EAAE;IAClB,CAAC;IACDb,KAAK,EAAE;MACLc,SAAS,EAAE,QAAQ;MACnBC,kBAAkB,EAAE;IACtB;EACF,CAAC,CAAC,EACJ,CAACzB,KAAK,CACR,CAAC;AACH,CAAC","ignoreList":[]}

package/dist/module/components/Livestream/ViewerLivestream/ViewerLivestream.js

@@ -1,13 +1,14 @@
-import React, { useEffect, useMemo } from 'react';
+import React, { useEffect, useMemo, useState } from 'react';
 import { StyleSheet, View } from 'react-native';
 import InCallManager from 'react-native-incall-manager';
 import { useTheme } from '../../../contexts';
-import { ViewerLivestreamTopView as DefaultViewerLivestreamTopView } from '../LivestreamTopView/ViewerLivestreamTopView';
 import { ViewerLivestreamControls as DefaultViewerLivestreamControls } from '../LivestreamControls/ViewerLivestreamControls';
 import { LivestreamLayout as DefaultLivestreamLayout } from '../LivestreamLayout';
-import { useCallStateHooks } from '@stream-io/video-react-bindings';
+import { useCall, useCallStateHooks } from '@stream-io/video-react-bindings';
 import { FloatingParticipantView as DefaultFloatingParticipantView } from '../../Participant';
-import { hasVideo } from '@stream-io/video-client';
+import { CallingState, hasVideo } from '@stream-io/video-client';
+import { CallEndedView } from '../LivestreamPlayer/LivestreamEnded';
+import { ViewerLobby } from './ViewerLobby';
 
 /**
  * Props for the ViewerLivestream component.
@@ -17,7 +18,7 @@ import { hasVideo } from '@stream-io/video-client';
  * The ViewerLivestream component renders the UI for the Viewer's live stream.
  */
 export const ViewerLivestream = ({
-  ViewerLivestreamTopView = DefaultViewerLivestreamTopView,
+  ViewerLivestreamTopView,
   ViewerLivestreamControls = DefaultViewerLivestreamControls,
   LivestreamLayout = DefaultLivestreamLayout,
   FloatingParticipantView = DefaultFloatingParticipantView,
@@ -25,9 +26,11 @@ export const ViewerLivestream = ({
   FollowerCount,
   DurationBadge,
   ViewerLeaveStreamButton,
-  onLeaveStreamHandler
+  onLeaveStreamHandler,
+  joinBehavior
 }) => {
   const styles = useStyles();
+  const call = useCall();
   const {
     theme: {
       viewerLivestream
@@ -35,11 +38,21 @@ export const ViewerLivestream = ({
   } = useTheme();
   const {
     useHasOngoingScreenShare,
-    useParticipants
+    useParticipants,
+    useCallCallingState,
+    useCallEndedAt,
+    useIsCallLive,
+    useOwnCapabilities
   } = useCallStateHooks();
+  const canJoinLive = useIsCallLive();
+  const callingState = useCallCallingState();
+  const endedAt = useCallEndedAt();
   const hasOngoingScreenShare = useHasOngoingScreenShare();
   const [currentSpeaker] = useParticipants();
   const floatingParticipant = hasOngoingScreenShare && currentSpeaker && hasVideo(currentSpeaker) && currentSpeaker;
+  const [hasLeft, setHasLeft] = useState(false);
+  const canJoinEarly = useCanJoinEarly();
+  const canJoinBackstage = useOwnCapabilities()?.includes('join-backstage') ?? false;
   const [topViewHeight, setTopViewHeight] = React.useState();
   const [controlsHeight, setControlsHeight] = React.useState();
 
@@ -50,6 +63,11 @@ export const ViewerLivestream = ({
     });
     return () => InCallManager.stop();
   }, []);
+  useEffect(() => {
+    if (callingState === CallingState.LEFT) {
+      setHasLeft(true);
+    }
+  }, [callingState]);
   const topViewProps = {
     LiveIndicator,
     FollowerCount,
@@ -58,6 +76,29 @@ export const ViewerLivestream = ({
       setTopViewHeight(event.nativeEvent.layout.height);
     }
   };
+  useEffect(() => {
+    const handleJoinCall = async () => {
+      try {
+        await call?.join();
+      } catch (error) {
+        console.error('Failed to join call', error);
+      }
+    };
+    const canJoinAsap = canJoinLive || canJoinEarly || canJoinBackstage;
+    const join = joinBehavior ?? 'asap';
+    const canJoin = join === 'asap' && canJoinAsap || join === 'live' && canJoinLive;
+    if (call && callingState === CallingState.IDLE && canJoin && !hasLeft) {
+      handleJoinCall();
+    }
+  }, [canJoinLive, call, canJoinBackstage, canJoinEarly, joinBehavior, callingState, hasLeft]);
+  if (endedAt != null) {
+    return /*#__PURE__*/React.createElement(CallEndedView, null);
+  }
+  if (!canJoinLive || callingState !== CallingState.JOINED) {
+    return /*#__PURE__*/React.createElement(ViewerLobby, {
+      isLive: canJoinLive
+    });
+  }
   return /*#__PURE__*/React.createElement(View, {
     style: [styles.container, viewerLivestream.container]
   }, ViewerLivestreamTopView && /*#__PURE__*/React.createElement(ViewerLivestreamTopView, topViewProps), FloatingParticipantView && floatingParticipant && topViewHeight && controlsHeight && /*#__PURE__*/React.createElement(FloatingParticipantView, {
@@ -74,6 +115,31 @@ export const ViewerLivestream = ({
     }
   }));
 };
+const useCanJoinEarly = () => {
+  const {
+    useCallStartsAt,
+    useCallSettings
+  } = useCallStateHooks();
+  const startsAt = useCallStartsAt();
+  const settings = useCallSettings();
+  const joinAheadTimeSeconds = settings?.backstage.join_ahead_time_seconds;
+  const [canJoinEarly, setCanJoinEarly] = useState(() => checkCanJoinEarly(startsAt, joinAheadTimeSeconds));
+  useEffect(() => {
+    if (!canJoinEarly) {
+      const handle = setInterval(() => {
+        setCanJoinEarly(checkCanJoinEarly(startsAt, joinAheadTimeSeconds));
+      }, 1000);
+      return () => clearInterval(handle);
+    }
+  }, [canJoinEarly, startsAt, joinAheadTimeSeconds]);
+  return canJoinEarly;
+};
+const checkCanJoinEarly = (startsAt, joinAheadTimeSeconds) => {
+  if (!startsAt) {
+    return false;
+  }
+  return Date.now() >= +startsAt - (joinAheadTimeSeconds ?? 0) * 1000;
+};
 const useStyles = () => {
   const {
     theme

package/dist/module/components/Livestream/ViewerLivestream/ViewerLivestream.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useEffect","useMemo","StyleSheet","View","InCallManager","useTheme","ViewerLivestreamTopView","DefaultViewerLivestreamTopView","ViewerLivestreamControls","DefaultViewerLivestreamControls","LivestreamLayout","DefaultLivestreamLayout","useCallStateHooks","FloatingParticipantView","DefaultFloatingParticipantView","hasVideo","ViewerLivestream","LiveIndicator","FollowerCount","DurationBadge","ViewerLeaveStreamButton","onLeaveStreamHandler","styles","useStyles","theme","viewerLivestream","useHasOngoingScreenShare","useParticipants","hasOngoingScreenShare","currentSpeaker","floatingParticipant","topViewHeight","setTopViewHeight","useState","controlsHeight","setControlsHeight","start","media","stop","topViewProps","onLayout","event","nativeEvent","layout","height","createElement","style","container","participant","draggableContainerStyle","absoluteFill","top","bottom","create","flex","paddingBottom","variants","insets","paddingLeft","left","paddingRight","right","paddingTop","backgroundColor","colors","sheetPrimary"],"sourceRoot":"../../../../../src","sources":["components/Livestream/ViewerLivestream/ViewerLivestream.tsx"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","useEffect","useMemo","useState","StyleSheet","View","InCallManager","useTheme","ViewerLivestreamControls","DefaultViewerLivestreamControls","LivestreamLayout","DefaultLivestreamLayout","useCall","useCallStateHooks","FloatingParticipantView","DefaultFloatingParticipantView","CallingState","hasVideo","CallEndedView","ViewerLobby","ViewerLivestream","ViewerLivestreamTopView","LiveIndicator","FollowerCount","DurationBadge","ViewerLeaveStreamButton","onLeaveStreamHandler","joinBehavior","styles","useStyles","call","theme","viewerLivestream","useHasOngoingScreenShare","useParticipants","useCallCallingState","useCallEndedAt","useIsCallLive","useOwnCapabilities","canJoinLive","callingState","endedAt","hasOngoingScreenShare","currentSpeaker","floatingParticipant","hasLeft","setHasLeft","canJoinEarly","useCanJoinEarly","canJoinBackstage","includes","topViewHeight","setTopViewHeight","controlsHeight","setControlsHeight","start","media","stop","LEFT","topViewProps","onLayout","event","nativeEvent","layout","height","handleJoinCall","join","error","console","canJoinAsap","canJoin","IDLE","createElement","JOINED","isLive","style","container","participant","draggableContainerStyle","absoluteFill","top","bottom","useCallStartsAt","useCallSettings","startsAt","settings","joinAheadTimeSeconds","backstage","join_ahead_time_seconds","setCanJoinEarly","checkCanJoinEarly","handle","setInterval","clearInterval","Date","now","create","flex","paddingBottom","variants","insets","paddingLeft","left","paddingRight","right","paddingTop","backgroundColor","colors","sheetPrimary"],"sourceRoot":"../../../../../src","sources":["components/Livestream/ViewerLivestream/ViewerLivestream.tsx"],"mappings":"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","ignoreList":[]}

package/dist/module/components/Livestream/ViewerLivestream/ViewerLobby.js

@@ -0,0 +1,136 @@
+import { useCall, useCallStateHooks, useI18n } from '@stream-io/video-react-bindings';
+import React, { useEffect, useMemo, useState } from 'react';
+import { ActivityIndicator, Button, StyleSheet, Text, View } from 'react-native';
+import { useTheme } from '../../../contexts';
+import { CallingState } from '@stream-io/video-client';
+import { getLogger } from '@stream-io/video-client';
+export const ViewerLobby = ({
+  isLive
+}) => {
+  const styles = useStyles();
+  const {
+    theme
+  } = useTheme();
+  const {
+    t
+  } = useI18n();
+  const {
+    useCallStartsAt,
+    useParticipants,
+    useCallCallingState
+  } = useCallStateHooks();
+  const callingState = useCallCallingState();
+  const call = useCall();
+  const startsAt = useCallStartsAt();
+  const [error, setError] = useState(undefined);
+  const [countdown, setCountdown] = React.useState(getCountdown(startsAt));
+  const participants = useParticipants();
+  useEffect(() => {
+    if (!startsAt || isLive) return;
+    const updateCountdown = () => {
+      const timeRemaining = Math.max(0, startsAt.getTime() - Date.now());
+      if (timeRemaining <= 0) {
+        setCountdown('0:00');
+        clearInterval(intervalId);
+        return;
+      }
+      setCountdown(getCountdown(startsAt));
+    };
+    updateCountdown();
+    const intervalId = setInterval(updateCountdown, 1000);
+    return () => clearInterval(intervalId);
+  }, [startsAt, isLive]);
+
+  /**
+   * Getting the call details is done through `call.get()`.
+   * It is essential so that the call is watched and any changes in the call is intercepted.
+   */
+  useEffect(() => {
+    const getCall = async () => {
+      if (!call) {
+        return;
+      }
+      try {
+        await call.get();
+      } catch (err) {
+        if (err instanceof Error) {
+          const logger = getLogger(['ViewerLobby']);
+          logger('error', 'Error getting call:', err);
+          setError(err);
+        }
+      }
+    };
+    getCall();
+  }, [call]);
+  if (error) {
+    return /*#__PURE__*/React.createElement(View, {
+      style: styles.container
+    }, /*#__PURE__*/React.createElement(Text, {
+      style: styles.text
+    }, "Error joining the livestream. Please try again later."));
+  }
+  const isJoiningLiveCall = callingState === CallingState.JOINING;
+  if (isJoiningLiveCall) {
+    return /*#__PURE__*/React.createElement(View, {
+      style: styles.container
+    }, /*#__PURE__*/React.createElement(ActivityIndicator, {
+      size: "large",
+      color: theme.colors.textPrimary
+    }));
+  }
+  return /*#__PURE__*/React.createElement(View, {
+    style: styles.container
+  }, /*#__PURE__*/React.createElement(Text, {
+    style: styles.text
+  }, isLive ? t('Livestream is still in progress') : startsAt ? t('Livestream will start in:') : t('Livestream will start soon')), startsAt && !isLive && /*#__PURE__*/React.createElement(Text, {
+    style: styles.countdownText
+  }, countdown), !isLive && participants.length > 0 && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Text, {
+    style: styles.participantsText
+  }, `${participants.length} ${t('participants have joined early')}`)), isLive && /*#__PURE__*/React.createElement(Button, {
+    title: t('Join Livestream'),
+    onPress: () => call?.join()
+  }));
+};
+const useStyles = () => {
+  const {
+    theme
+  } = useTheme();
+  return useMemo(() => StyleSheet.create({
+    container: {
+      flex: 1,
+      justifyContent: 'center',
+      alignItems: 'center',
+      backgroundColor: theme.colors.sheetPrimary,
+      padding: theme.variants.spacingSizes.lg
+    },
+    text: {
+      color: theme.colors.textPrimary,
+      fontSize: theme.variants.fontSizes.lg,
+      margin: theme.variants.spacingSizes.md,
+      textAlign: 'center'
+    },
+    countdownText: {
+      color: theme.colors.textPrimary,
+      fontSize: theme.variants.fontSizes.xl,
+      fontWeight: 'bold',
+      marginBottom: theme.variants.spacingSizes.md,
+      textAlign: 'center'
+    },
+    participantsText: {
+      color: theme.colors.textSecondary,
+      fontSize: theme.variants.fontSizes.md,
+      marginBottom: theme.variants.spacingSizes.sm
+    }
+  }), [theme]);
+};
+const getCountdown = startsAt => {
+  if (!startsAt) {
+    return '';
+  }
+  const now = Date.now();
+  const timeRemaining = Math.max(0, startsAt.getTime() - now);
+  const minutes = Math.floor(timeRemaining / (1000 * 60));
+  const seconds = Math.floor(timeRemaining % (1000 * 60) / 1000);
+  return `${minutes}:${seconds.toString().padStart(2, '0')}`;
+};
+//# sourceMappingURL=ViewerLobby.js.map

package/dist/module/components/Livestream/ViewerLivestream/ViewerLobby.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useCall","useCallStateHooks","useI18n","React","useEffect","useMemo","useState","ActivityIndicator","Button","StyleSheet","Text","View","useTheme","CallingState","getLogger","ViewerLobby","isLive","styles","useStyles","theme","t","useCallStartsAt","useParticipants","useCallCallingState","callingState","call","startsAt","error","setError","undefined","countdown","setCountdown","getCountdown","participants","updateCountdown","timeRemaining","Math","max","getTime","Date","now","clearInterval","intervalId","setInterval","getCall","get","err","Error","logger","createElement","style","container","text","isJoiningLiveCall","JOINING","size","color","colors","textPrimary","countdownText","length","Fragment","participantsText","title","onPress","join","create","flex","justifyContent","alignItems","backgroundColor","sheetPrimary","padding","variants","spacingSizes","lg","fontSize","fontSizes","margin","md","textAlign","xl","fontWeight","marginBottom","textSecondary","sm","minutes","floor","seconds","toString","padStart"],"sourceRoot":"../../../../../src","sources":["components/Livestream/ViewerLivestream/ViewerLobby.tsx"],"mappings":"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","ignoreList":[]}