@stream-io/video-react-native-sdk 0.0.27 → 0.1.0

package/src/components/Call/CallParticipantsList/CallParticipantsList.tsx

@@ -21,6 +21,7 @@ import {
   ParticipantViewComponentProps,
   ParticipantViewProps,
 } from '../../Participant/ParticipantView';
+import { CallContentProps } from '../CallContent';
 
 type FlatListProps = React.ComponentProps<
   typeof FlatList<StreamVideoParticipant | StreamVideoLocalParticipant>
@@ -42,21 +43,27 @@ export type CallParticipantsListComponentProps =
 /**
  * Props of the CallParticipantsList component
  */
-export type CallParticipantsListProps = CallParticipantsListComponentProps & {
-  /**
-   * The list of participants to display in the list
-   */
-  participants: (StreamVideoParticipant | StreamVideoLocalParticipant)[];
-  /**
-   * The number of columns to display in the list of participants while in vertical or horizontal scrolling mode. This property is only used when there are more than 2 participants.
-   * @default 2
-   */
-  numberOfColumns?: number;
-  /**
-   * If true, the list will be displayed in horizontal scrolling mode
-   */
-  horizontal?: boolean;
-};
+export type CallParticipantsListProps = CallParticipantsListComponentProps &
+  Pick<CallContentProps, 'supportedReactions'> & {
+    /**
+     * The list of participants to display in the list
+     */
+    participants: (StreamVideoParticipant | StreamVideoLocalParticipant)[];
+    /**
+     * The number of columns to display in the list of participants while in vertical or horizontal scrolling mode. This property is only used when there are more than 2 participants.
+     * @default 2
+     */
+    numberOfColumns?: number;
+    /**
+     * If true, the list will be displayed in horizontal scrolling mode
+     */
+    horizontal?: boolean;
+    /**
+     * Check if phone is in landscape mode.
+     * This will apply the landscape mode styles to the component.
+     */
+    landscape?: boolean;
+  };
 
 /**
  * This component displays a list of participants in a FlatList.
@@ -74,6 +81,8 @@ export const CallParticipantsList = ({
   ParticipantReaction,
   ParticipantVideoFallback,
   VideoRenderer,
+  supportedReactions,
+  landscape,
 }: CallParticipantsListProps) => {
   const [containerLayout, setContainerLayout] = useState({
     width: 0,
@@ -162,8 +171,11 @@ export const CallParticipantsList = ({
     if (horizontal) {
       return [styles.participantWrapperHorizontal, style];
     }
+    if (landscape) {
+      return [styles.landScapeStyle, style];
+    }
     return style;
-  }, [itemWidth, itemHeight, horizontal]);
+  }, [itemWidth, itemHeight, horizontal, landscape]);
 
   const participantProps: ParticipantViewComponentProps = {
     ParticipantLabel,
@@ -186,6 +198,7 @@ export const CallParticipantsList = ({
               style={itemContainerStyle}
               trackType="videoTrack"
               isVisible={isVisible}
+              supportedReactions={supportedReactions}
               {...participantProps}
             />
           )}
@@ -211,6 +224,7 @@ export const CallParticipantsList = ({
                 style={styles.flexed}
                 trackType="videoTrack"
                 key={keyExtractor(participant, index)}
+                supportedReactions={supportedReactions}
                 {...participantProps}
               />
             )
@@ -247,6 +261,9 @@ const styles = StyleSheet.create({
     marginHorizontal: 8,
     borderRadius: 10,
   },
+  landScapeStyle: {
+    borderRadius: 10,
+  },
 });
 
 /**

package/src/components/Call/CallTopView/CallTopView.tsx

@@ -50,6 +50,7 @@ export const CallTopView = ({
   ParticipantsInfoBadge = DefaultParticipantsInfoBadge,
 }: CallTopViewProps) => {
   const [callTopViewHeight, setCallTopViewHeight] = useState<number>(0);
+  const [callTopViewWidth, setCallTopViewWidth] = useState<number>(0);
   const {
     theme: {
       colors,
@@ -64,16 +65,17 @@ export const CallTopView = ({
   const isCallReconnecting = callingState === CallingState.RECONNECTING;
 
   const onLayout: React.ComponentProps<typeof View>['onLayout'] = (event) => {
-    const { height } = event.nativeEvent.layout;
+    const { height, width } = event.nativeEvent.layout;
     if (setCallTopViewHeight) {
       setCallTopViewHeight(height);
+      setCallTopViewWidth(width);
     }
   };
 
   return (
     <View style={[styleProp, callTopView.container]}>
       {/* Component for the background of the CallTopView. Since it has a Linear Gradient, an SVG is used to render it. */}
-      <TopViewBackground height={callTopViewHeight} width={'100%'} />
+      <TopViewBackground height={callTopViewHeight} width={callTopViewWidth} />
       <View style={[styles.content, callTopView.content]} onLayout={onLayout}>
         <View style={styles.leftElement}>
           {onBackPressed && (

package/src/components/Call/RingingCallContent/RingingCallContent.tsx

@@ -42,6 +42,11 @@ export type RingingCallContentProps = {
    * Prop to customize the JoiningCallIndicator component in the RingingCallContent. It is shown when the call is accepted and is waiting to be joined.
    */
   JoiningCallIndicator?: React.ComponentType | null;
+  /**
+   * Check if device is in landscape mode.
+   * This will apply the landscape mode styles to the component.
+   */
+  landscape?: boolean;
 };
 
 const RingingCallPanel = ({
@@ -50,6 +55,7 @@ const RingingCallPanel = ({
   CallContent = DefaultCallContent,
   JoiningCallIndicator = DefaultJoiningCallIndicator,
   CallTopView,
+  landscape,
 }: RingingCallContentProps) => {
   const call = useCall();
   const isCallCreatedByMe = call?.isCreatedByMe;
@@ -63,7 +69,11 @@ const RingingCallPanel = ({
         ? OutgoingCall && <OutgoingCall CallTopView={CallTopView} />
         : IncomingCall && <IncomingCall CallTopView={CallTopView} />;
     case CallingState.JOINED:
-      return CallContent && <CallContent CallTopView={CallTopView} />;
+      return (
+        CallContent && (
+          <CallContent CallTopView={CallTopView} landscape={landscape} />
+        )
+      );
     case CallingState.JOINING:
       return JoiningCallIndicator && <JoiningCallIndicator />;
     default:

package/src/components/Participant/FloatingParticipantView/index.tsx

@@ -10,7 +10,10 @@ import { FLOATING_VIDEO_VIEW_STYLE, Z_INDEX } from '../../../constants';
 import { ComponentTestIds } from '../../../constants/TestIds';
 import { VideoSlash } from '../../../icons';
 import FloatingView from './FloatingView';
-import { CallParticipantsListProps } from '../../Call';
+import {
+  CallContentProps,
+  CallParticipantsListComponentProps,
+} from '../../Call';
 import { FloatingViewAlignment } from './FloatingView/common';
 import {
   ParticipantView as DefaultParticipantView,
@@ -29,7 +32,8 @@ export type FloatingParticipantViewAlignment =
  * Props to be passed for the LocalVideoView component.
  */
 export type FloatingParticipantViewProps = ParticipantViewComponentProps &
-  Pick<CallParticipantsListProps, 'ParticipantView'> & {
+  Pick<CallParticipantsListComponentProps, 'ParticipantView'> &
+  Pick<CallContentProps, 'supportedReactions'> & {
     /**
      * Determines where the floating participant video will be placed.
      */
@@ -85,6 +89,7 @@ export const FloatingParticipantView = ({
   ParticipantNetworkQualityIndicator,
   ParticipantReaction,
   VideoRenderer,
+  supportedReactions,
 }: FloatingParticipantViewProps) => {
   const {
     theme: { colors, floatingParticipantsView },
@@ -160,6 +165,7 @@ export const FloatingParticipantView = ({
                 // video z order must be one above the one used in grid view
                 // (which uses the default: 0)
                 videoZOrder={1}
+                supportedReactions={supportedReactions}
                 {...participantViewProps}
               />
             )}
@@ -188,6 +194,7 @@ const styles = StyleSheet.create({
     shadowOpacity: 0.23,
     shadowRadius: 2.62,
     elevation: 4,
+    borderWidth: 0,
   },
   videoFallback: {
     ...StyleSheet.absoluteFillObject,

package/src/components/Participant/ParticipantView/ParticipantReaction.tsx

@@ -1,10 +1,10 @@
-import React, { useEffect, useState } from 'react';
+import React, { useEffect } from 'react';
 import { StyleSheet, Text, View } from 'react-native';
 import { useCall } from '@stream-io/video-react-bindings';
-import { StreamVideoRN } from '../../../utils';
-import { Z_INDEX } from '../../../constants';
+import { Z_INDEX, defaultEmojiReactions } from '../../../constants';
 import { ParticipantViewProps } from './ParticipantView';
 import { useTheme } from '../../../contexts/ThemeContext';
+import { CallContentProps } from '../../Call';
 
 /**
  * Props for the ParticipantReaction component.
@@ -12,23 +12,24 @@ import { useTheme } from '../../../contexts/ThemeContext';
 export type ParticipantReactionProps = Pick<
   ParticipantViewProps,
   'participant'
-> & {
-  /**
-   * The duration after which the reaction should disappear.
-   *
-   * @default 5500
-   */
-  hideAfterTimeoutInMs?: number;
-};
+> &
+  Pick<CallContentProps, 'supportedReactions'> & {
+    /**
+     * The duration after which the reaction should disappear.
+     *
+     * @default 5500
+     */
+    hideAfterTimeoutInMs?: number;
+  };
 
 /**
  * This component is used to display the current participant reaction.
  */
 export const ParticipantReaction = ({
   participant,
+  supportedReactions = defaultEmojiReactions,
   hideAfterTimeoutInMs = 5500,
 }: ParticipantReactionProps) => {
-  const { supportedReactions } = StreamVideoRN.getConfig();
   const { reaction, sessionId } = participant;
   const call = useCall();
   const {
@@ -38,14 +39,11 @@ export const ParticipantReaction = ({
       participantReaction,
     },
   } = useTheme();
-  const [isShowing, setIsShowing] = useState<boolean>(false);
 
   useEffect(() => {
     let timeoutId: NodeJS.Timeout;
     if (call) {
-      setIsShowing(true);
       timeoutId = setTimeout(() => {
-        setIsShowing(false);
         call.resetReaction(sessionId);
       }, hideAfterTimeoutInMs);
     }
@@ -61,19 +59,6 @@ export const ParticipantReaction = ({
         supportedReaction.emoji_code === reaction.emoji_code,
     );
 
-  let component;
-  if (isShowing) {
-    if (typeof currentReaction?.icon !== 'string') {
-      component = currentReaction?.icon;
-    } else {
-      component = (
-        <Text style={[participantReaction.reaction, typefaces.heading6]}>
-          {currentReaction.icon}
-        </Text>
-      );
-    }
-  }
-
   return (
     <View
       style={[
@@ -85,7 +70,9 @@ export const ParticipantReaction = ({
         participantReaction.container,
       ]}
     >
-      {component}
+      <Text style={[participantReaction.reaction, typefaces.heading6]}>
+        {currentReaction?.icon}
+      </Text>
     </View>
   );
 };

package/src/components/Participant/ParticipantView/ParticipantView.tsx

@@ -25,8 +25,7 @@ import {
   VideoRendererProps,
 } from './VideoRenderer';
 import { useTheme } from '../../../contexts/ThemeContext';
-
-export type ParticipantVideoType = VideoTrackType;
+import { CallContentProps } from '../../Call';
 
 export type ParticipantViewComponentProps = {
   /**
@@ -54,35 +53,36 @@ export type ParticipantViewComponentProps = {
 /**
  * Props to be passed for the Participant component.
  */
-export type ParticipantViewProps = ParticipantViewComponentProps & {
-  /**
-   * The participant that will be displayed.
-   */
-  participant: StreamVideoParticipant;
-  /**
-   * The zOrder for the video that will be displayed.
-   * For example, a video call
-   * application usually needs a maximum of two zOrder values: 0 for the
-   * remote video(s) which appear in the background, and 1 for the local
-   * video(s) which appear above the remote video(s).
-   * @default 0
-   */
-  videoZOrder?: number;
-  /**
-   * The video track that is to be displayed.
-   */
-  trackType?: ParticipantVideoType;
-  /**
-   * Custom style to be merged with the participant view.
-   */
-  style?: StyleProp<ViewStyle>;
-  /**
-   * When set to false, the video stream will not be shown even if it is available.
-   *
-   * @default true
-   */
-  isVisible?: boolean;
-};
+export type ParticipantViewProps = ParticipantViewComponentProps &
+  Pick<CallContentProps, 'supportedReactions'> & {
+    /**
+     * The participant that will be displayed.
+     */
+    participant: StreamVideoParticipant;
+    /**
+     * The zOrder for the video that will be displayed.
+     * For example, a video call
+     * application usually needs a maximum of two zOrder values: 0 for the
+     * remote video(s) which appear in the background, and 1 for the local
+     * video(s) which appear above the remote video(s).
+     * @default 0
+     */
+    videoZOrder?: number;
+    /**
+     * The video track that is to be displayed.
+     */
+    trackType?: VideoTrackType;
+    /**
+     * Custom style to be merged with the participant view.
+     */
+    style?: StyleProp<ViewStyle>;
+    /**
+     * When set to false, the video stream will not be shown even if it is available.
+     *
+     * @default true
+     */
+    isVisible?: boolean;
+  };
 
 /**
  * A component that renders the participants' video track or screenShare track
@@ -100,6 +100,7 @@ export const ParticipantView = ({
   ParticipantNetworkQualityIndicator = DefaultParticipantNetworkQualityIndicator,
   ParticipantVideoFallback = DefaultParticipantVideoFallback,
   videoZOrder = 0,
+  supportedReactions,
 }: ParticipantViewProps) => {
   const {
     theme: { colors, participantView },
@@ -124,7 +125,12 @@ export const ParticipantView = ({
           : `participant-${userId}-is-not-speaking`
       }
     >
-      {ParticipantReaction && <ParticipantReaction participant={participant} />}
+      {ParticipantReaction && (
+        <ParticipantReaction
+          participant={participant}
+          supportedReactions={supportedReactions}
+        />
+      )}
       {VideoRenderer && (
         <VideoRenderer
           isVisible={isVisible}
@@ -151,7 +157,8 @@ const styles = StyleSheet.create({
     justifyContent: 'space-between',
     padding: 4,
     overflow: 'hidden',
-    margin: 2,
+    borderWidth: 2,
+    borderColor: 'transparent',
   },
   footerContainer: {
     flexDirection: 'row',

package/src/constants/index.ts

@@ -1,4 +1,4 @@
-import { StreamVideoConfig } from '../utils/StreamVideoRN/types';
+import { StreamReactionType } from '../components';
 
 export const FLOATING_VIDEO_VIEW_STYLE = {
   height: 140,
@@ -8,7 +8,7 @@ export const FLOATING_VIDEO_VIEW_STYLE = {
 
 export const LOBBY_VIDEO_VIEW_HEIGHT = 280;
 
-export const defaultEmojiReactions: StreamVideoConfig['supportedReactions'] = [
+export const defaultEmojiReactions: StreamReactionType[] = [
   {
     type: 'reaction',
     emoji_code: ':like:',

package/src/utils/StreamVideoRN/index.ts

@@ -1,10 +1,8 @@
 import { AndroidImportance } from '@notifee/react-native';
-import { defaultEmojiReactions } from '../../constants';
 import { setupFirebaseHandlerAndroid } from '../push/android';
 import { StreamVideoConfig } from './types';
 
 const DEFAULT_STREAM_VIDEO_CONFIG: StreamVideoConfig = {
-  supportedReactions: defaultEmojiReactions,
   foregroundService: {
     android: {
       channel: {
@@ -24,6 +22,7 @@ const DEFAULT_STREAM_VIDEO_CONFIG: StreamVideoConfig = {
 
 export class StreamVideoRN {
   private static config = DEFAULT_STREAM_VIDEO_CONFIG;
+
   /**
    * Update the global config for StreamVideoRN except for push config.
    * To set push config use `StreamVideoRN.setPushConfig` instead.

package/src/utils/StreamVideoRN/types.ts

@@ -1,17 +1,7 @@
-import { StreamReaction, StreamVideoClient } from '@stream-io/video-client';
+import { StreamVideoClient } from '@stream-io/video-client';
 import { AndroidChannel } from '@notifee/react-native';
 
-type StreamReactionType = Required<StreamReaction> & {
-  icon: string | JSX.Element;
-};
-
 export type StreamVideoConfig = {
-  /**
-   * Reactions that are to be supported in the app.
-   *
-   * Note: This is an array of reactions that is rendered in the Reaction list.
-   */
-  supportedReactions: StreamReactionType[];
   /**
    * The configuration to be used for push notifications.
    * If undefined, push notifications will not be enabled for the app

package/src/version.ts

@@ -1 +1 @@
-export const version = '0.0.27';
+export const version = '0.1.0';

package/dist/commonjs/components/Call/CallControls/ReactionButton.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["_videoReactBindings","require","_react","_interopRequireWildcard","_CallControlsButton","_videoClient","_TestIds","_icons","_ReactionsPicker","_utils","_ThemeContext","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","ReactionButton","_ref","onPressHandler","showReactionsPicker","setShowReactionsPicker","useState","reactionsButtonLayoutRectangle","setReactionsButtonLayoutRectangle","theme","colors","useTheme","onReactionsButtonLayout","event","layout","nativeEvent","prev","width","height","x","y","reactionButtonHandler","createElement","Fragment","Restricted","requiredGrants","OwnCapability","CREATE_REACTION","CallControlsButton","testID","ButtonTestIds","REACTION","onPress","onLayout","Reaction","color","static_black","ReactionsPicker","reactions","StreamVideoRN","getConfig","supportedReactions","onRequestedClose","exports"],"sourceRoot":"../../../../../src","sources":["components/Call/CallControls/ReactionButton.tsx"],"mappings":"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"}

package/dist/module/components/Call/CallControls/ReactionButton.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["Restricted","React","useState","CallControlsButton","OwnCapability","ButtonTestIds","Reaction","ReactionsPicker","StreamVideoRN","useTheme","ReactionButton","_ref","onPressHandler","showReactionsPicker","setShowReactionsPicker","reactionsButtonLayoutRectangle","setReactionsButtonLayoutRectangle","theme","colors","onReactionsButtonLayout","event","layout","nativeEvent","prev","width","height","x","y","reactionButtonHandler","createElement","Fragment","requiredGrants","CREATE_REACTION","testID","REACTION","onPress","onLayout","color","static_black","reactions","getConfig","supportedReactions","onRequestedClose"],"sourceRoot":"../../../../../src","sources":["components/Call/CallControls/ReactionButton.tsx"],"mappings":"AAAA,SAASA,UAAU,QAAQ,iCAAiC;AAC5D,OAAOC,KAAK,IAAIC,QAAQ,QAAQ,OAAO;AACvC,SAASC,kBAAkB,QAAQ,sBAAsB;AACzD,SAASC,aAAa,QAAQ,yBAAyB;AACvD,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,QAAQ,QAAQ,gBAAgB;AACzC,SAASC,eAAe,QAAQ,4BAA4B;AAC5D,SAASC,aAAa,QAAQ,gBAAgB;AAE9C,SAASC,QAAQ,QAAQ,gCAAgC;;AAEzD;AACA;AACA;;AAQA;AACA;AACA;AACA;AACA,OAAO,MAAMC,cAAc,GAAGC,IAAA,IAA6C;EAAA,IAA5C;IAAEC;EAAoC,CAAC,GAAAD,IAAA;EACpE,MAAM,CAACE,mBAAmB,EAAEC,sBAAsB,CAAC,GACjDZ,QAAQ,CAAU,KAAK,CAAC;EAC1B,MAAM,CAACa,8BAA8B,EAAEC,iCAAiC,CAAC,GACvEd,QAAQ,CAAkB,CAAC;EAC7B,MAAM;IACJe,KAAK,EAAE;MAAEC;IAAO;EAClB,CAAC,GAAGT,QAAQ,CAAC,CAAC;EACd;EACA,MAAMU,uBAAuB,GAAIC,KAAwB,IAAK;IAC5D,MAAMC,MAAM,GAAGD,KAAK,CAACE,WAAW,CAACD,MAAM;IACvCL,iCAAiC,CAAEO,IAAI,IAAK;MAC1C,IACEA,IAAI,IACJA,IAAI,CAACC,KAAK,KAAKH,MAAM,CAACG,KAAK,IAC3BD,IAAI,CAACE,MAAM,KAAKJ,MAAM,CAACI,MAAM,IAC7BF,IAAI,CAACG,CAAC,KAAKL,MAAM,CAACK,CAAC,IACnBH,IAAI,CAACI,CAAC,KAAKN,MAAM,CAACM,CAAC,EACnB;QACA,OAAOJ,IAAI;MACb;MACA,OAAOF,MAAM;IACf,CAAC,CAAC;EACJ,CAAC;EAED,MAAMO,qBAAqB,GAAGA,CAAA,KAAM;IAClC,IAAIhB,cAAc,EAAE;MAClBA,cAAc,CAAC,CAAC;MAChB;IACF;IACAE,sBAAsB,CAAC,IAAI,CAAC;EAC9B,CAAC;EAED,oBACEb,KAAA,CAAA4B,aAAA,CAAA5B,KAAA,CAAA6B,QAAA,qBACE7B,KAAA,CAAA4B,aAAA,CAAC7B,UAAU;IAAC+B,cAAc,EAAE,CAAC3B,aAAa,CAAC4B,eAAe;EAAE,gBAC1D/B,KAAA,CAAA4B,aAAA,CAAC1B,kBAAkB;IACjB8B,MAAM,EAAE5B,aAAa,CAAC6B,QAAS;IAC/BC,OAAO,EAAEP,qBAAsB;IAC/BQ,QAAQ,EAAEjB;EAAwB,gBAElClB,KAAA,CAAA4B,aAAA,CAACvB,QAAQ;IAAC+B,KAAK,EAAEnB,MAAM,CAACoB;EAAa,CAAE,CACrB,CACV,CAAC,EACZzB,mBAAmB,iBAClBZ,KAAA,CAAA4B,aAAA,CAACtB,eAAe;IACdgC,SAAS,EAAE/B,aAAa,CAACgC,SAAS,CAAC,CAAC,CAACC,kBAAmB;IACxD1B,8BAA8B,EAAEA,8BAA+B;IAC/D2B,gBAAgB,EAAEA,CAAA,KAAM;MACtB5B,sBAAsB,CAAC,KAAK,CAAC;IAC/B;EAAE,CACH,CAEH,CAAC;AAEP,CAAC"}

package/dist/typescript/components/Call/CallControls/ReactionButton.d.ts

@@ -1,15 +0,0 @@
-/**
- * Props for the Reaction button
- */
-export type ReactionButtonProps = {
-    /**
-     * Handler to be called when the reaction button is pressed.
-     */
-    onPressHandler?: () => void;
-};
-/**
- * Button to display the list of Reactions supported in the call.
- * On press, it opens a view that can be used to send Reaction.
- */
-export declare const ReactionButton: ({ onPressHandler }: ReactionButtonProps) => JSX.Element;
-//# sourceMappingURL=ReactionButton.d.ts.map

package/dist/typescript/components/Call/CallControls/ReactionButton.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ReactionButton.d.ts","sourceRoot":"","sources":["../../../../../src/components/Call/CallControls/ReactionButton.tsx"],"names":[],"mappings":"AAWA;;GAEG;AACH,MAAM,MAAM,mBAAmB,GAAG;IAChC;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;CAC7B,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,cAAc,uBAAwB,mBAAmB,gBAuDrE,CAAC"}