stream-chat-react-native-core 5.28.1 → 5.29.0-beta.1

package/src/icons/Lock.tsx

@@ -0,0 +1,22 @@
+import React from 'react';
+
+import { G, Path, Svg } from 'react-native-svg';
+
+import { ColorValue } from 'react-native/types';
+
+type Props = {
+  color: ColorValue;
+  size: number;
+};
+
+export const Lock = ({ color, size }: Props) => (
+  <Svg fill={'none'} height={size} viewBox={`0 0 ${size} ${size}`} width={size}>
+    <G id='Lock'>
+      <Path
+        d='M10.5039 26.9062H21.4844C23.2656 26.9062 24.1914 25.957 24.1914 24.0352V15.7383C24.1914 14.0391 23.4648 13.1016 22.0586 12.9141V10.125C22.0586 5.80078 19.1992 3.5625 16 3.5625C12.8008 3.5625 9.94141 5.80078 9.94141 10.125V12.9141C8.53516 13.1016 7.79688 14.0391 7.79688 15.7383V24.0352C7.79688 25.957 8.72266 26.9062 10.5039 26.9062ZM12.1328 9.91406C12.1328 7.17188 13.9023 5.67188 16 5.67188C18.0859 5.67188 19.8672 7.17188 19.8672 9.91406V12.8789H12.1328V9.91406ZM10.8438 24.8086C10.3633 24.8086 10.0703 24.5156 10.0703 23.9531V15.8203C10.0703 15.2578 10.3633 14.9766 10.8438 14.9766H21.1562C21.6484 14.9766 21.918 15.2578 21.918 15.8203V23.9531C21.918 24.5156 21.6484 24.8086 21.1562 24.8086H10.8438Z'
+        fill={color}
+        id='Lock'
+      />
+    </G>
+  </Svg>
+);

package/src/icons/Mic.tsx

@@ -0,0 +1,20 @@
+import React from 'react';
+
+import { G, Path, Svg } from 'react-native-svg';
+
+import { IconProps } from './utils/base';
+
+type Props = IconProps & {
+  size: number;
+};
+
+export const Mic = ({ size, ...rest }: Props) => (
+  <Svg height={size} viewBox={`0 0 ${size} ${size}`} width={size} {...rest}>
+    <G id='24 / mic_iOS'>
+      <Path
+        d='M11.5234 13.9922C11.5234 16.8047 13.375 18.7734 16 18.7734C18.6367 18.7734 20.4766 16.8047 20.4766 13.9922V6.69141C20.4766 3.86719 18.6367 1.89844 16 1.89844C13.375 1.89844 11.5234 3.86719 11.5234 6.69141V13.9922ZM13.7383 14.0273V6.64453C13.7383 5.08594 14.6172 4.01953 16 4.01953C17.3828 4.01953 18.2617 5.08594 18.2617 6.64453V14.0273C18.2617 15.5977 17.3828 16.6523 16 16.6523C14.6172 16.6523 13.7383 15.5977 13.7383 14.0273ZM7.10547 14.5078C7.10547 19.3242 10.3047 22.6289 14.9336 23.0742V25.4766H10.6211C10.0234 25.4766 9.51953 25.9688 9.51953 26.5781C9.51953 27.1758 10.0234 27.668 10.6211 27.668H21.3789C21.9883 27.668 22.4922 27.1758 22.4922 26.5781C22.4922 25.9688 21.9883 25.4766 21.3789 25.4766H17.0781V23.0742C21.6953 22.6289 24.9062 19.3242 24.9062 14.5078V12.1875C24.9062 11.5781 24.4141 11.0977 23.8047 11.0977C23.1953 11.0977 22.6914 11.5781 22.6914 12.1875V14.4258C22.6914 18.4102 19.9961 21.0469 16 21.0469C12.0039 21.0469 9.30859 18.4102 9.30859 14.4258V12.1875C9.30859 11.5781 8.81641 11.0977 8.20703 11.0977C7.59766 11.0977 7.10547 11.5781 7.10547 12.1875V14.5078Z'
+        {...rest}
+      />
+    </G>
+  </Svg>
+);

package/src/icons/Pause.tsx

@@ -1,14 +1,15 @@
 import React from 'react';
-import { Rect } from 'react-native-svg';
+import Svg, { Path } from 'react-native-svg';
 
-import { IconProps, RootSvg } from './utils/base';
+import { IconProps } from './utils/base';
 
-export const Pause = (props: IconProps) => {
-  const { height, width } = props;
-  return (
-    <RootSvg height={height} viewBox={`0 0 ${height} ${width}`} width={width} {...props}>
-      <Rect fill={props.pathFill} height={14} width={4} x={6} y={5} />
-      <Rect fill={props.pathFill} height={14} width={4} x={14} y={5} />
-    </RootSvg>
-  );
-};
+type Props = IconProps;
+
+export const Pause = ({ height, width, ...rest }: Props) => (
+  <Svg height={height} viewBox={`0 0 ${height} ${width}`} width={width} {...rest}>
+    <Path
+      d='M8 25.3333H13.3333V6.66663H8V25.3333ZM18.6667 6.66663V25.3333H24V6.66663H18.6667Z'
+      {...rest}
+    />
+  </Svg>
+);

package/src/icons/Play.tsx

@@ -1,17 +1,13 @@
 import React from 'react';
 
-import { IconProps, RootPath, RootSvg } from './utils/base';
+import Svg, { Path } from 'react-native-svg';
 
-export const Play = (props: IconProps) => (
-  <RootSvg
-    height={props.height}
-    viewBox={`0 0 ${props.height} ${props.width}`}
-    width={props.width}
-    {...props}
-  >
-    <RootPath
-      d='M 9.5547 5.03647 C 8.89014 4.59343 8 5.06982 8 5.86852 V 18.1315 C 8 18.9302 8.89015 19.4066 9.5547 18.9635 L 18.7519 12.8321 C 19.3457 12.4362 19.3457 11.5638 18.7519 11.1679 L 9.5547 5.03647 Z'
-      {...props}
-    />
-  </RootSvg>
+import { IconProps } from './utils/base';
+
+type Props = IconProps;
+
+export const Play = ({ height, width, ...rest }: Props) => (
+  <Svg height={height} viewBox={`0 0 ${height} ${width}`} width={width} {...rest}>
+    <Path d='M8.66602 6.66663V25.3333L23.3327 16L8.66602 6.66663Z' {...rest} />
+  </Svg>
 );

package/src/icons/SendCheck.tsx

@@ -0,0 +1,18 @@
+import React from 'react';
+
+import Svg, { Path } from 'react-native-svg';
+
+import { IconProps } from './utils/base';
+
+type Props = IconProps & {
+  size: number;
+};
+
+export const SendCheck = ({ size, ...rest }: Props) => (
+  <Svg height={size} viewBox={`0 0 ${size} ${size}`} width={size} {...rest}>
+    <Path
+      d='M16 32C7.24879 32 0 24.7667 0 16C0 7.24879 7.2333 0 15.9845 0C24.7512 0 32 7.24879 32 16C32 24.7667 24.7512 32 16 32ZM14.2807 23.6515C14.8538 23.6515 15.3495 23.3572 15.7057 22.8306L22.9545 11.5237C23.1713 11.183 23.3572 10.7957 23.3572 10.4395C23.3572 9.63408 22.6602 9.09197 21.8858 9.09197C21.3901 9.09197 20.9564 9.35528 20.6312 9.89739L14.2188 20.151L11.2294 16.3562C10.8422 15.8606 10.4705 15.6747 9.99032 15.6747C9.1849 15.6747 8.56534 16.3253 8.56534 17.1152C8.56534 17.5024 8.70474 17.8742 8.98354 18.2149L12.7783 22.8306C13.212 23.3882 13.6922 23.6515 14.2807 23.6515Z'
+      {...rest}
+    />
+  </Svg>
+);

package/src/icons/SendRight.tsx

@@ -1,12 +1,21 @@
 import React from 'react';
 
-import { IconProps, RootPath, RootSvg } from './utils/base';
+import Svg, { Circle, Path } from 'react-native-svg';
 
-export const SendRight = (props: IconProps) => (
-  <RootSvg {...props}>
-    <RootPath
-      d='M22 12c0-5.52-4.48-10-10-10S2 6.48 2 12s4.48 10 10 10 10-4.48 10-10zM8 11h4V8l4 4-4 4v-3H8v-2z'
-      {...props}
+import { IconProps } from './utils/base';
+
+type Props = IconProps & {
+  size: number;
+};
+
+export const SendRight = ({ size, ...rest }: Props) => (
+  <Svg height={size} viewBox={`0 0 ${size} ${size}`} width={size} {...rest}>
+    <Circle cx={size / 2} cy={size / 2} r={size / 2} {...rest} />
+    <Path
+      clipRule='evenodd'
+      d='M9.33398 14.6666H16.0007V9.33325L22.6673 15.9999L16.0007 22.6666V17.3333H9.33398V14.6666Z'
+      fill={'white'}
+      fillRule='evenodd'
     />
-  </RootSvg>
+  </Svg>
 );

package/src/icons/SendUp.tsx

@@ -1,12 +1,21 @@
 import React from 'react';
 
-import { IconProps, RootPath, RootSvg } from './utils/base';
+import Svg, { Circle, Path } from 'react-native-svg';
 
-export const SendUp = (props: IconProps) => (
-  <RootSvg {...props}>
-    <RootPath
-      d='M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-1 14v-4H8l4-4 4 4h-3v4h-2z'
-      {...props}
+import { IconProps } from './utils/base';
+
+type Props = IconProps & {
+  size: number;
+};
+
+export const SendUp = ({ size, ...rest }: Props) => (
+  <Svg height={size} viewBox={`0 0 ${size} ${size}`} width={size} {...rest}>
+    <Circle cx={size / 2} cy={size / 2} r={size / 2} {...rest} />
+    <Path
+      clipRule='evenodd'
+      d='M14.6673 16V22.6667H17.334V16H22.6673L16.0007 9.33337L9.33398 16H14.6673Z'
+      fill={'white'}
+      fillRule='evenodd'
     />
-  </RootSvg>
+  </Svg>
 );

package/src/icons/Stop.tsx

@@ -0,0 +1,12 @@
+import React from 'react';
+
+import { IconProps, RootPath, RootSvg } from './utils/base';
+
+export const Stop: React.FC<IconProps> = (props) => (
+  <RootSvg {...props}>
+    <RootPath
+      d='M 14 0.666687 C 6.41 0.666687 0.25 6.64002 0.25 14 C 0.25 21.36 6.41 27.3334 14 27.3334 C 21.59 27.3334 27.75 21.36 27.75 14 C 27.75 6.64002 21.59 0.666687 14 0.666687 Z M 14 24.6667 C 7.9225 24.6667 3 19.8934 3 14 C 3 8.10669 7.9225 3.33335 14 3.33335 C 20.0775 3.33335 25 8.10669 25 14 C 25 19.8934 20.0775 24.6667 14 24.6667 Z M 19.5 19.3334 H 8.5 V 8.66669 H 19.5 V 19.3334 Z'
+      {...props}
+    />
+  </RootSvg>
+);

package/src/icons/index.ts

@@ -1,6 +1,8 @@
 export * from './utils/base';
 
 export * from './ArrowRight';
+export * from './ArrowLeft';
+export * from './ArrowUp';
 export * from './AtMentions';
 export * from './Attach';
 export * from './Audio';
@@ -9,6 +11,7 @@ export * from './Check';
 export * from './CheckAll';
 export * from './CheckSend';
 export * from './CircleClose';
+export * from './CircleStop';
 export * from './Close';
 export * from './Copy';
 export * from './CSV';
@@ -33,6 +36,7 @@ export * from './Imgur';
 export * from './Lightning';
 export * from './Link';
 export * from './Loading';
+export * from './Lock';
 export * from './Logo';
 export * from './LOLReaction';
 export * from './LoveReaction';
@@ -42,6 +46,7 @@ export * from './MenuPointHorizontal';
 export * from './MenuPointVertical';
 export * from './MessageFlag';
 export * from './MessageIcon';
+export * from './Mic';
 export * from './Mute';
 export * from './Notification';
 export * from './ODT';
@@ -57,6 +62,7 @@ export * from './RAR';
 export * from './Refresh';
 export * from './RTF';
 export * from './Search';
+export * from './SendCheck';
 export * from './SendRight';
 export * from './SendUp';
 export * from './SEVEN_Z';
@@ -64,6 +70,7 @@ export * from './Share';
 export * from './ShareRightArrow';
 export * from './Smile';
 export * from './Sound';
+export * from './Stop';
 export * from './TAR';
 export * from './ThreadReply';
 export * from './ThumbsDownReaction';

package/src/native.ts

@@ -108,14 +108,18 @@ type TriggerHaptic = (method: HapticFeedbackMethod) => void | never;
 export let triggerHaptic: TriggerHaptic = fail;
 
 export type PlaybackStatus = {
+  currentPosition: number;
   didJustFinish: boolean;
+  duration: number;
   durationMillis: number;
   error: string;
   isBuffering: boolean;
   isLoaded: boolean;
   isLooping: boolean;
+  isMuted: boolean;
   isPlaying: boolean;
   positionMillis: number;
+  shouldPlay: boolean;
 };
 
 export type AVPlaybackStatusToSet = {
@@ -152,13 +156,18 @@ export type SoundReturnType = {
   onPlaybackStatusUpdate?: (playbackStatus: PlaybackStatus) => void;
   onProgress?: (data: VideoProgressData) => void;
   onReadyForDisplay?: () => void;
+  pause?: () => void;
   pauseAsync?: () => void;
   play?: () => void;
   playAsync?: () => void;
+  rate?: number;
   replayAsync?: () => void;
   resizeMode?: string;
+  resume?: () => void;
   seek?: (progress: number) => void;
   setPositionAsync?: (millis: number) => void;
+  setProgressUpdateIntervalAsync?: (progressUpdateIntervalMillis: number) => void;
+  setRateAsync?: (rate: number) => void;
   soundRef?: React.RefObject<SoundReturnType>;
   stopAsync?: () => void;
   style?: StyleProp<ViewStyle>;
@@ -175,6 +184,60 @@ export type SoundType = {
   Player: React.ComponentType<SoundReturnType> | null;
 };
 
+export type RecordingStatus = {
+  canRecord: boolean;
+  currentMetering: number;
+  currentPosition: number;
+  durationMillis: number;
+  isDoneRecording: boolean;
+  isRecording: boolean;
+  metering: number;
+  mediaServicesDidReset?: boolean;
+  uri?: string | null;
+};
+
+export type AudioRecordingReturnType =
+  | string
+  | {
+      getStatusAsync: () => Promise<RecordingStatus>;
+      getURI: () => string | null;
+      pauseAsync: () => Promise<RecordingStatus>;
+      recording: string;
+      setProgressUpdateInterval: (progressUpdateIntervalMillis: number) => void;
+      stopAndUnloadAsync: () => Promise<RecordingStatus>;
+    }
+  | undefined;
+
+export type AudioReturnType = {
+  accessGranted: boolean;
+  recording?: AudioRecordingReturnType;
+};
+
+export type RecordingOptions = {
+  /**
+   * A boolean that determines whether audio level information will be part of the status object under the "metering" key.
+   */
+  isMeteringEnabled?: boolean;
+};
+
+export type AudioType = {
+  startRecording: (
+    options?: RecordingOptions,
+    onRecordingStatusUpdate?: (recordingStatus: RecordingStatus) => void,
+  ) => Promise<AudioReturnType>;
+  stopRecording: () => Promise<void>;
+  pausePlayer?: () => Promise<void>;
+  resumePlayer?: () => Promise<void>;
+  startPlayer?: (
+    uri?: AudioRecordingReturnType,
+    initialStatus?: Partial<AVPlaybackStatusToSet>,
+    onPlaybackStatusUpdate?: (playbackStatus: PlaybackStatus) => void,
+  ) => Promise<void>;
+  stopPlayer?: () => Promise<void>;
+};
+
+export let Audio: AudioType;
+
 export let Sound: SoundType;
 
 export type VideoProgressData = {
@@ -221,6 +284,7 @@ export type VideoType = {
 export let Video: React.ComponentType<VideoType>;
 
 type Handlers = {
+  Audio?: AudioType;
   compressImage?: CompressImage;
   deleteFile?: DeleteFile;
   FlatList?: typeof DefaultFlatList;
@@ -241,6 +305,10 @@ type Handlers = {
 };
 
 export const registerNativeHandlers = (handlers: Handlers) => {
+  if (handlers.Audio) {
+    Audio = handlers.Audio;
+  }
+
   if (handlers.compressImage) {
     compressImage = handlers.compressImage;
   }
@@ -311,3 +379,4 @@ export const registerNativeHandlers = (handlers: Handlers) => {
 
 export const isVideoPackageAvailable = () => !!Video;
 export const isAudioPackageAvailable = () => !!Sound.Player || !!Sound.initializeSound;
+export const isRecordingPackageAvailable = () => !!Audio;

package/src/types/types.ts

@@ -20,8 +20,10 @@ export type File = {
   id?: string;
   mimeType?: string;
   size?: number;
+  type?: 'file' | 'image' | 'video' | 'audio' | 'voiceRecording';
   // The uri should be of type `string`. But is `string|undefined` because the same type is used for the response from Stream's Attachment. This shall be fixed.
   uri?: string;
+  waveform_data?: number[];
 };
 
 export type FileUpload = {
@@ -32,7 +34,9 @@ export type FileUpload = {
   paused?: boolean;
   progress?: number;
   thumb_url?: string;
+  type?: string;
   url?: string;
+  waveform_data?: number[];
 };
 
 export type ImageUpload = {
@@ -45,10 +49,12 @@ export type ImageUpload = {
 };
 
 export type DefaultAttachmentType = UnknownType & {
+  duration?: number;
   file_size?: number;
   mime_type?: string;
   originalFile?: File;
   originalImage?: Partial<Asset>;
+  waveform_data?: number[];
 };
 
 interface DefaultUserType extends UnknownType {

package/src/utils/getTrimmedAttachmentTitle.ts

@@ -0,0 +1,5 @@
+export const getTrimmedAttachmentTitle = (title?: string) => {
+  if (!title) return '';
+  const lastIndexOfDot = title.lastIndexOf('.');
+  return title.length < 12 ? title : title.slice(0, 12) + '...' + title.slice(lastIndexOfDot);
+};

package/src/version.json

@@ -1,3 +1,3 @@
 {
-  "version": "5.28.1"
+  "version": "5.29.0-beta.1"
 }