chore: resolve conflicts from base branch

Author: khushal87

package/src/components/Channel/Channel.tsx

@@ -55,6 +55,7 @@ import { ChannelContextValue, ChannelProvider } from '../../contexts/channelCont
 import type { UseChannelStateValue } from '../../contexts/channelsStateContext/useChannelState';
 import { useChannelState } from '../../contexts/channelsStateContext/useChannelState';
 import { ChatContextValue, useChatContext } from '../../contexts/chatContext/ChatContext';
+import { MessageComposerProvider } from '../../contexts/messageComposerContext/MessageComposerContext';
 import {
   InputMessageInputContextValue,
   MessageInputProvider,
@@ -1695,7 +1696,6 @@ const ChannelWithContext = (props: PropsWithChildren<ChannelPropsWithContext>) =
     channel,
     channelUnreadState,
     disabled: !!channel?.data?.frozen,
-    editing,
     EmptyStateIndicator,
     enableMessageGroupingByUser,
     enforceUniqueReaction,
@@ -1946,6 +1946,11 @@ const ChannelWithContext = (props: PropsWithChildren<ChannelPropsWithContext>) =
     typing: channelState.typing ?? {},
   });
 
+  const messageComposerContext = useMemo(
+    () => ({ channel, editing, thread, threadInstance }),
+    [channel, editing, thread, threadInstance],
+  );
+
   // TODO: replace the null view with appropriate message. Currently this is waiting a design decision.
   if (deleted) {
     return null;
@@ -1977,10 +1982,12 @@ const ChannelWithContext = (props: PropsWithChildren<ChannelPropsWithContext>) =
               <MessagesProvider value={messagesContext}>
                 <ThreadProvider value={threadContext}>
                   <AttachmentPickerProvider value={attachmentPickerContext}>
-                    <MessageInputProvider value={inputMessageInputContext}>
-                      <View style={{ height: '100%' }}>{children}</View>
-                      <AttachmentPicker ref={bottomSheetRef} {...attachmentPickerProps} />
-                    </MessageInputProvider>
+                    <MessageComposerProvider value={messageComposerContext}>
+                      <MessageInputProvider value={inputMessageInputContext}>
+                        <View style={{ height: '100%' }}>{children}</View>
+                        <AttachmentPicker ref={bottomSheetRef} {...attachmentPickerProps} />
+                      </MessageInputProvider>
+                    </MessageComposerProvider>
                   </AttachmentPickerProvider>
                 </ThreadProvider>
               </MessagesProvider>

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

@@ -6,7 +6,6 @@ export const useCreateChannelContext = ({
   channel,
   channelUnreadState,
   disabled,
-  editing,
   EmptyStateIndicator,
   enableMessageGroupingByUser,
   enforceUniqueReaction,
@@ -46,14 +45,12 @@ export const useCreateChannelContext = ({
   const readUsersLength = readUsers.length;
   const readUsersLastReads = readUsers.map(({ last_read }) => last_read.toISOString()).join();
   const stringifiedChannelUnreadState = JSON.stringify(channelUnreadState);
-  const editingDep = editing ? editing.id : '';
 
   const channelContext: ChannelContextValue = useMemo(
     () => ({
       channel,
       channelUnreadState,
       disabled,
-      editing,
       EmptyStateIndicator,
       enableMessageGroupingByUser,
       enforceUniqueReaction,
@@ -89,7 +86,6 @@ export const useCreateChannelContext = ({
     [
       channelId,
       disabled,
-      editingDep,
       error,
       isChannelActive,
       highlightedMessageId,

package/src/components/Message/Message.tsx

@@ -9,6 +9,7 @@ import { useMessageActions } from './hooks/useMessageActions';
 import { useProcessReactions } from './hooks/useProcessReactions';
 import { messageActions as defaultMessageActions } from './utils/messageActions';
 
+import { useMessageComposer } from '../../contexts';
 import {
   ChannelContextValue,
   useChannelContext,
@@ -31,6 +32,7 @@ import {
   useTranslationContext,
 } from '../../contexts/translationContext/TranslationContext';
 
+import { useStableCallback } from '../../hooks';
 import { isVideoPlayerAvailable, NativeHandlers } from '../../native';
 import { FileTypes } from '../../types/types';
 import {
@@ -140,7 +142,10 @@ export type MessagePropsWithContext = Pick<
       'groupStyles' | 'handleReaction' | 'message' | 'isMessageAIGenerated' | 'readBy'
     >
   > &
-  Pick<MessageContextValue, 'groupStyles' | 'message' | 'isMessageAIGenerated' | 'readBy'> &
+  Pick<
+    MessageContextValue,
+    'groupStyles' | 'message' | 'isMessageAIGenerated' | 'readBy' | 'setQuotedMessage'
+  > &
   Pick<
     MessagesContextValue,
     | 'sendReaction'
@@ -264,6 +269,7 @@ const MessageWithContext = (props: MessagePropsWithContext) => {
     threadList = false,
     updateMessage,
     readBy,
+    setQuotedMessage,
   } = props;
   const isMessageAIGenerated = messagesContext.isMessageAIGenerated;
   const isAIGenerated = useMemo(
@@ -499,6 +505,7 @@ const MessageWithContext = (props: MessagePropsWithContext) => {
     retrySendMessage,
     sendReaction,
     setEditingState,
+    setQuotedMessage,
     supportedReactions,
   });
 
@@ -543,6 +550,7 @@ const MessageWithContext = (props: MessagePropsWithContext) => {
     selectReaction,
     sendReaction,
     setEditingState,
+    setQuotedMessage,
     supportedReactions,
     t,
     updateMessage,
@@ -691,6 +699,7 @@ const MessageWithContext = (props: MessagePropsWithContext) => {
     reactions,
     readBy,
     setIsEditedMessageOpen,
+    setQuotedMessage,
     showAvatar,
     showMessageOverlay,
     showMessageStatus: typeof showMessageStatus === 'boolean' ? showMessageStatus : isMyMessage,
@@ -938,6 +947,10 @@ export const Message = (props: MessageProps) => {
   const { openThread } = useThreadContext();
   const { t } = useTranslationContext();
   const readBy = useMemo(() => getReadState(message, read), [message, read]);
+  const messageComposer = useMessageComposer();
+  const setQuotedMessage = useStableCallback((message: LocalMessage | null) =>
+    messageComposer.setQuotedMessage(message),
+  );
 
   return (
     <MemoizedMessage
@@ -951,6 +964,7 @@ export const Message = (props: MessageProps) => {
         messagesContext,
         openThread,
         readBy,
+        setQuotedMessage,
         t,
       }}
       {...props}

package/src/components/Message/MessageSimple/MessageSimple.tsx

@@ -18,7 +18,6 @@ import {
   MessageContextValue,
   useMessageContext,
 } from '../../../contexts/messageContext/MessageContext';
-import { useMessageComposer } from '../../../contexts/messageInputContext/hooks/useMessageComposer';
 import {
   MessagesContextValue,
   useMessagesContext,
@@ -70,6 +69,7 @@ export type MessageSimplePropsWithContext = Pick<
   | 'onlyEmojis'
   | 'otherAttachments'
   | 'showMessageStatus'
+  | 'setQuotedMessage'
 > &
   Pick<
     MessagesContextValue,
@@ -130,6 +130,7 @@ const MessageSimpleWithContext = (props: MessageSimplePropsWithContext) => {
     ReactionListTop,
     showMessageStatus,
     shouldRenderSwipeableWrapper,
+    setQuotedMessage,
   } = props;
 
   const {
@@ -161,7 +162,6 @@ const MessageSimpleWithContext = (props: MessageSimplePropsWithContext) => {
     isVeryLastMessage,
     messageGroupedSingleOrBottom,
   } = useMessageData({});
-  const messageComposer = useMessageComposer();
 
   const lastMessageInMessageListStyles = [styles.lastMessageContainer, lastMessageContainer];
   const messageGroupedSingleOrBottomStyles = {
@@ -215,8 +215,8 @@ const MessageSimpleWithContext = (props: MessageSimplePropsWithContext) => {
   );
 
   const onSwipeToReply = useCallback(() => {
-    messageComposer.setQuotedMessage(message);
-  }, [messageComposer, message]);
+    setQuotedMessage(message);
+  }, [setQuotedMessage, message]);
 
   const THRESHOLD = 25;
 
@@ -608,6 +608,7 @@ export const MessageSimple = (props: MessageSimpleProps) => {
     otherAttachments,
     showMessageStatus,
     isMessageAIGenerated,
+    setQuotedMessage,
   } = useMessageContext();
   const {
     enableMessageGroupingByUser,
@@ -662,6 +663,7 @@ export const MessageSimple = (props: MessageSimpleProps) => {
         ReactionListBottom,
         reactionListPosition,
         ReactionListTop,
+        setQuotedMessage,
         shouldRenderSwipeableWrapper,
         showMessageStatus,
       }}

package/src/components/Message/hooks/useCreateMessageContext.ts

@@ -41,6 +41,7 @@ export const useCreateMessageContext = ({
   showMessageStatus,
   threadList,
   videos,
+  setQuotedMessage,
 }: MessageContextValue) => {
   const groupStylesLength = groupStyles.length;
   const reactionsValue = reactions.map(({ count, own, type }) => `${own}${type}${count}`).join();
@@ -84,6 +85,7 @@ export const useCreateMessageContext = ({
       reactions,
       readBy,
       setIsEditedMessageOpen,
+      setQuotedMessage,
       showAvatar,
       showMessageOverlay,
       showMessageStatus,

package/src/components/Message/hooks/useMessageActionHandlers.ts

@@ -3,7 +3,6 @@ import { Alert } from 'react-native';
 import type { ChannelContextValue } from '../../../contexts/channelContext/ChannelContext';
 import type { ChatContextValue } from '../../../contexts/chatContext/ChatContext';
 import type { MessageContextValue } from '../../../contexts/messageContext/MessageContext';
-import { useMessageComposer } from '../../../contexts/messageInputContext/hooks/useMessageComposer';
 import type { MessagesContextValue } from '../../../contexts/messagesContext/MessagesContext';
 
 import { useTranslationContext } from '../../../contexts/translationContext/TranslationContext';
@@ -18,6 +17,7 @@ export const useMessageActionHandlers = ({
   retrySendMessage,
   sendReaction,
   setEditingState,
+  setQuotedMessage,
 }: Pick<
   MessagesContextValue,
   | 'sendReaction'
@@ -29,13 +29,12 @@ export const useMessageActionHandlers = ({
 > &
   Pick<ChannelContextValue, 'channel' | 'enforceUniqueReaction'> &
   Pick<ChatContextValue, 'client'> &
-  Pick<MessageContextValue, 'message'>) => {
+  Pick<MessageContextValue, 'message' | 'setQuotedMessage'>) => {
   const { t } = useTranslationContext();
   const handleResendMessage = () => retrySendMessage(message);
-  const messageComposer = useMessageComposer();
 
   const handleQuotedReplyMessage = () => {
-    messageComposer.setQuotedMessage(message);
+    setQuotedMessage(message);
   };
 
   const isMuted = (client.mutedUsers || []).some(

package/src/components/Message/hooks/useMessageActions.tsx

@@ -58,7 +58,7 @@ export type MessageActionsHookProps = Pick<
   Pick<ChannelContextValue, 'channel' | 'enforceUniqueReaction'> &
   Pick<ChatContextValue, 'client'> &
   Pick<ThreadContextValue, 'openThread'> &
-  Pick<MessageContextValue, 'dismissOverlay' | 'message'> &
+  Pick<MessageContextValue, 'dismissOverlay' | 'message' | 'setQuotedMessage'> &
   Pick<TranslationContextValue, 't'> & {
     onThreadSelect?: (message: LocalMessage) => void;
   };
@@ -91,6 +91,7 @@ export const useMessageActions = ({
   setEditingState,
   supportedReactions,
   t,
+  setQuotedMessage,
 }: MessageActionsHookProps) => {
   const {
     theme: {
@@ -119,6 +120,7 @@ export const useMessageActions = ({
     retrySendMessage,
     sendReaction,
     setEditingState,
+    setQuotedMessage,
     supportedReactions,
   });