chore: resolve conflict from base branch

Author: khushal87

package/src/components/Channel/Channel.tsx

@@ -167,7 +167,6 @@ import { AttachmentUploadProgressIndicator as AttachmentUploadProgressIndicatorD
 import { AudioAttachmentUploadPreview as AudioAttachmentUploadPreviewDefault } from '../MessageInput/components/AttachmentPreview/AudioAttachmentUploadPreview';
 import { FileAttachmentUploadPreview as FileAttachmentUploadPreviewDefault } from '../MessageInput/components/AttachmentPreview/FileAttachmentUploadPreview';
 import { ImageAttachmentUploadPreview as ImageAttachmentUploadPreviewDefault } from '../MessageInput/components/AttachmentPreview/ImageAttachmentUploadPreview';
-import { VideoAttachmentUploadPreview as VideoAttachmentUploadPreviewDefault } from '../MessageInput/components/AttachmentPreview/VideoAttachmentUploadPreview';
 import { AudioRecorder as AudioRecorderDefault } from '../MessageInput/components/AudioRecorder/AudioRecorder';
 import { AudioRecordingButton as AudioRecordingButtonDefault } from '../MessageInput/components/AudioRecorder/AudioRecordingButton';
 import { AudioRecordingInProgress as AudioRecordingInProgressDefault } from '../MessageInput/components/AudioRecorder/AudioRecordingInProgress';
@@ -535,7 +534,6 @@ const ChannelWithContext = (props: PropsWithChildren<ChannelPropsWithContext>) =
     numberOfAttachmentImagesToLoadPerCall = 60,
     numberOfAttachmentPickerImageColumns = 3,
 
-    autoCompleteSuggestionsLimit,
     bottomInset = 0,
     CameraSelectorIcon = DefaultCameraSelectorIcon,
     FileSelectorIcon = DefaultFileSelectorIcon,
@@ -606,7 +604,6 @@ const ChannelWithContext = (props: PropsWithChildren<ChannelPropsWithContext>) =
     ImageReloadIndicator = ImageReloadIndicatorDefault,
     ImageUploadPreview = ImageUploadPreviewDefault,
     initialScrollToFirstUnreadMessage = false,
-    initialValue,
     InlineDateSeparator = InlineDateSeparatorDefault,
     InlineUnreadIndicator = InlineUnreadIndicatorDefault,
     Input,
@@ -628,8 +625,6 @@ const ChannelWithContext = (props: PropsWithChildren<ChannelPropsWithContext>) =
     markReadOnMount = true,
     maxNumberOfFiles = 10,
     maxTimeBetweenGroupedMessages,
-    mentionAllAppUsersEnabled = false,
-    mentionAllAppUsersQuery,
     Message = MessageDefault,
     MessageActionList = MessageActionListDefault,
     MessageActionListItem = MessageActionListItemDefault,
@@ -707,9 +702,9 @@ const ChannelWithContext = (props: PropsWithChildren<ChannelPropsWithContext>) =
     TypingIndicator = TypingIndicatorDefault,
     TypingIndicatorContainer = TypingIndicatorContainerDefault,
     UnreadMessagesNotification = UnreadMessagesNotificationDefault,
-    UploadProgressIndicator = AttachmentUploadProgressIndicatorDefault,
+    AttachmentUploadProgressIndicator = AttachmentUploadProgressIndicatorDefault,
     UrlPreview = CardDefault,
-    VideoAttachmentUploadPreview = VideoAttachmentUploadPreviewDefault,
+    VideoAttachmentUploadPreview = FileAttachmentUploadPreviewDefault,
     VideoThumbnail = VideoThumbnailDefault,
   } = props;
 
@@ -1789,6 +1784,7 @@ const ChannelWithContext = (props: PropsWithChildren<ChannelPropsWithContext>) =
     attachmentPickerBottomSheetHeight,
     AttachmentPickerSelectionBar,
     attachmentSelectionBarHeight,
+    AttachmentUploadProgressIndicator,
     AudioAttachmentUploadPreview,
     AudioRecorder,
     audioRecordingEnabled,
@@ -1799,7 +1795,6 @@ const ChannelWithContext = (props: PropsWithChildren<ChannelPropsWithContext>) =
     AutoCompleteSuggestionHeader,
     AutoCompleteSuggestionItem,
     AutoCompleteSuggestionList,
-    autoCompleteSuggestionsLimit,
     CameraSelectorIcon,
     channelId,
     clearEditingState,
@@ -1823,15 +1818,12 @@ const ChannelWithContext = (props: PropsWithChildren<ChannelPropsWithContext>) =
     ImageAttachmentUploadPreview,
     ImageSelectorIcon,
     ImageUploadPreview,
-    initialValue,
     Input,
     InputButtons,
     InputEditingStateHeader,
     InputReplyStateHeader,
     isCommandUIEnabled,
     maxNumberOfFiles,
-    mentionAllAppUsersEnabled,
-    mentionAllAppUsersQuery,
     MoreOptionsButton,
     openPollCreationDialog,
     SendButton,
@@ -1841,7 +1833,6 @@ const ChannelWithContext = (props: PropsWithChildren<ChannelPropsWithContext>) =
     ShowThreadMessageInChannelButton,
     StartAudioRecordingButton,
     StopMessageStreamingButton,
-    UploadProgressIndicator,
     VideoAttachmentUploadPreview,
     VideoRecorderSelectorIcon,
   });

package/src/components/Channel/hooks/useCreateInputMessageInputContext.ts

@@ -14,6 +14,7 @@ export const useCreateInputMessageInputContext = ({
   attachmentPickerBottomSheetHeight,
   AttachmentPickerSelectionBar,
   attachmentSelectionBarHeight,
+  AttachmentUploadProgressIndicator,
   AudioAttachmentUploadPreview,
   AudioRecorder,
   audioRecordingEnabled,
@@ -24,7 +25,6 @@ export const useCreateInputMessageInputContext = ({
   AutoCompleteSuggestionHeader,
   AutoCompleteSuggestionItem,
   AutoCompleteSuggestionList,
-  autoCompleteSuggestionsLimit,
   channelId,
   clearEditingState,
   CameraSelectorIcon,
@@ -48,15 +48,12 @@ export const useCreateInputMessageInputContext = ({
   ImageAttachmentUploadPreview,
   ImageSelectorIcon,
   ImageUploadPreview,
-  initialValue,
   Input,
   InputButtons,
   InputEditingStateHeader,
   InputReplyStateHeader,
   isCommandUIEnabled,
   maxNumberOfFiles,
-  mentionAllAppUsersEnabled,
-  mentionAllAppUsersQuery,
   MoreOptionsButton,
   openPollCreationDialog,
   SendButton,
@@ -67,7 +64,6 @@ export const useCreateInputMessageInputContext = ({
   ShowThreadMessageInChannelButton,
   StartAudioRecordingButton,
   StopMessageStreamingButton,
-  UploadProgressIndicator,
   VideoAttachmentUploadPreview,
   VideoRecorderSelectorIcon,
 }: InputMessageInputContextValue & {
@@ -91,6 +87,7 @@ export const useCreateInputMessageInputContext = ({
       attachmentPickerBottomSheetHeight,
       AttachmentPickerSelectionBar,
       attachmentSelectionBarHeight,
+      AttachmentUploadProgressIndicator,
       AudioAttachmentUploadPreview,
       AudioRecorder,
       audioRecordingEnabled,
@@ -101,7 +98,6 @@ export const useCreateInputMessageInputContext = ({
       AutoCompleteSuggestionHeader,
       AutoCompleteSuggestionItem,
       AutoCompleteSuggestionList,
-      autoCompleteSuggestionsLimit,
       CameraSelectorIcon,
       clearEditingState,
       CommandInput,
@@ -124,15 +120,12 @@ export const useCreateInputMessageInputContext = ({
       ImageAttachmentUploadPreview,
       ImageSelectorIcon,
       ImageUploadPreview,
-      initialValue,
       Input,
       InputButtons,
       InputEditingStateHeader,
       InputReplyStateHeader,
       isCommandUIEnabled,
       maxNumberOfFiles,
-      mentionAllAppUsersEnabled,
-      mentionAllAppUsersQuery,
       MoreOptionsButton,
       openPollCreationDialog,
       SendButton,
@@ -143,19 +136,11 @@ export const useCreateInputMessageInputContext = ({
       ShowThreadMessageInChannelButton,
       StartAudioRecordingButton,
       StopMessageStreamingButton,
-      UploadProgressIndicator,
       VideoAttachmentUploadPreview,
       VideoRecorderSelectorIcon,
     }),
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    [
-      compressImageQuality,
-      channelId,
-      editingDep,
-      initialValue,
-      CreatePollContent,
-      showPollCreationDialog,
-    ],
+    [compressImageQuality, channelId, editingDep, CreatePollContent, showPollCreationDialog],
   );
 
   return inputMessageInputContext;

package/src/components/MessageInput/CommandsButton.tsx

@@ -12,6 +12,10 @@ import { Lightning } from '../../icons/Lightning';
 export type CommandsButtonProps = {
   /** Function that opens commands selector */
   handleOnPress?: PressableProps['onPress'];
+  /**
+   * Determins if the text input has text
+   */
+  hasText?: boolean;
 };
 
 const textComposerStateSelector = (state: TextComposerState) => ({
@@ -24,10 +28,10 @@ const searchSourceStateSelector = (nextValue: SearchSourceState) => ({
 });
 
 export const CommandsButton = (props: CommandsButtonProps) => {
-  const { handleOnPress } = props;
+  const { handleOnPress, hasText } = props;
   const messageComposer = useMessageComposer();
   const { textComposer } = messageComposer;
-  const { suggestions, text } = useStateStore(textComposer.state, textComposerStateSelector);
+  const { suggestions } = useStateStore(textComposer.state, textComposerStateSelector);
   const { items } = useStateStore(suggestions?.searchSource.state, searchSourceStateSelector) ?? {};
   const trigger = suggestions?.trigger;
 
@@ -60,7 +64,7 @@ export const CommandsButton = (props: CommandsButtonProps) => {
     },
   } = useTheme();
 
-  if (text) {
+  if (hasText) {
     return null;
   }
 

package/src/components/MessageInput/FileUploadPreview.tsx

@@ -8,9 +8,11 @@ import {
   isLocalImageAttachment,
   isLocalVideoAttachment,
   isLocalVoiceRecordingAttachment,
+  isVideoAttachment,
   isVoiceRecordingAttachment,
   LocalAudioAttachment,
   LocalFileAttachment,
+  LocalVideoAttachment,
   LocalVoiceRecordingAttachment,
 } from 'stream-chat';
 
@@ -28,20 +30,25 @@ const FILE_PREVIEW_HEIGHT = 60;
 
 export type FileUploadPreviewPropsWithContext = Pick<
   MessageInputContextValue,
-  'AudioAttachmentUploadPreview' | 'FileAttachmentUploadPreview'
+  'AudioAttachmentUploadPreview' | 'FileAttachmentUploadPreview' | 'VideoAttachmentUploadPreview'
 >;
 
 type FileAttachmentType<CustomLocalMetadata = Record<string, unknown>> =
   | LocalFileAttachment<CustomLocalMetadata>
   | LocalAudioAttachment<CustomLocalMetadata>
-  | LocalVoiceRecordingAttachment<CustomLocalMetadata>;
+  | LocalVoiceRecordingAttachment<CustomLocalMetadata>
+  | LocalVideoAttachment<CustomLocalMetadata>;
 
 /**
  * FileUploadPreview
  * UI Component to preview the files set for upload
  */
 const UnMemoizedFileUploadPreview = (props: FileUploadPreviewPropsWithContext) => {
-  const { AudioAttachmentUploadPreview, FileAttachmentUploadPreview } = props;
+  const {
+    AudioAttachmentUploadPreview,
+    FileAttachmentUploadPreview,
+    VideoAttachmentUploadPreview,
+  } = props;
   const { attachmentManager } = useMessageComposer();
   const { attachments } = useAttachmentManagerState();
   const [audioAttachmentsStateMap, setAudioAttachmentsStateMap] = useState<
@@ -54,8 +61,9 @@ const UnMemoizedFileUploadPreview = (props: FileUploadPreviewPropsWithContext) =
     return attachments.filter(
       (attachment) =>
         isLocalFileAttachment(attachment) ||
-        isAudioAttachment(attachment) ||
-        isVoiceRecordingAttachment(attachment),
+        isLocalFileAttachment(attachment) ||
+        isLocalVoiceRecordingAttachment(attachment) ||
+        isLocalVideoAttachment(attachment),
     );
   }, [attachments]);
 
@@ -143,7 +151,7 @@ const UnMemoizedFileUploadPreview = (props: FileUploadPreviewPropsWithContext) =
 
   const renderItem = useCallback(
     ({ item }: { item: FileAttachmentType }) => {
-      if (isLocalImageAttachment(item) || isLocalVideoAttachment(item)) {
+      if (isLocalImageAttachment(item)) {
         // This is already handled in the `ImageUploadPreview` component
         return null;
       } else if (isLocalVoiceRecordingAttachment(item)) {
@@ -181,6 +189,15 @@ const UnMemoizedFileUploadPreview = (props: FileUploadPreviewPropsWithContext) =
             />
           );
         }
+      } else if (isVideoAttachment(item)) {
+        return (
+          <VideoAttachmentUploadPreview
+            attachment={item}
+            flatListWidth={flatListWidth}
+            handleRetry={attachmentManager.uploadAttachment}
+            removeAttachments={attachmentManager.removeAttachments}
+          />
+        );
       } else if (isLocalFileAttachment(item)) {
         return (
           <FileAttachmentUploadPreview
@@ -195,6 +212,7 @@ const UnMemoizedFileUploadPreview = (props: FileUploadPreviewPropsWithContext) =
     [
       AudioAttachmentUploadPreview,
       FileAttachmentUploadPreview,
+      VideoAttachmentUploadPreview,
       attachmentManager.removeAttachments,
       attachmentManager.uploadAttachment,
       audioAttachmentsStateMap,
@@ -250,12 +268,17 @@ const MemoizedFileUploadPreviewWithContext = React.memo(UnMemoizedFileUploadPrev
  * UI Component to preview the files set for upload
  */
 export const FileUploadPreview = (props: FileUploadPreviewProps) => {
-  const { AudioAttachmentUploadPreview, FileAttachmentUploadPreview } = useMessageInputContext();
+  const {
+    AudioAttachmentUploadPreview,
+    FileAttachmentUploadPreview,
+    VideoAttachmentUploadPreview,
+  } = useMessageInputContext();
   return (
     <MemoizedFileUploadPreviewWithContext
       {...{
         AudioAttachmentUploadPreview,
         FileAttachmentUploadPreview,
+        VideoAttachmentUploadPreview,
       }}
       {...props}
     />