Skip to content

Commit e9ebac4

Browse files
committed
fix: quoted message state using the message composer
1 parent 3b7957c commit e9ebac4

File tree

15 files changed

+76
-164
lines changed

15 files changed

+76
-164
lines changed

package/src/components/Channel/Channel.tsx

Lines changed: 1 addition & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -256,12 +256,7 @@ export type ChannelPropsWithContext = Pick<ChannelContextValue, 'channel'> &
256256
>
257257
> &
258258
Pick<ChatContextValue, 'client' | 'enableOfflineSupport'> &
259-
Partial<
260-
Omit<
261-
InputMessageInputContextValue,
262-
'quotedMessage' | 'editing' | 'clearEditingState' | 'clearQuotedMessageState' | 'sendMessage'
263-
>
264-
> &
259+
Partial<Omit<InputMessageInputContextValue, 'editing' | 'clearEditingState' | 'sendMessage'>> &
265260
Pick<TranslationContextValue, 't'> &
266261
Partial<
267262
Pick<PaginatedMessageListContextValue, 'messages' | 'loadingMore' | 'loadingMoreRecent'>
@@ -677,8 +672,6 @@ const ChannelWithContext = (props: PropsWithChildren<ChannelPropsWithContext>) =
677672
const [editing, setEditing] = useState<LocalMessage | undefined>(undefined);
678673
const [error, setError] = useState<Error | boolean>(false);
679674
const [lastRead, setLastRead] = useState<Date | undefined>();
680-
681-
const [quotedMessage, setQuotedMessage] = useState<LocalMessage | undefined>(undefined);
682675
const [thread, setThread] = useState<LocalMessage | null>(threadProps || null);
683676
const [threadHasMore, setThreadHasMore] = useState(true);
684677
const [threadLoadingMore, setThreadLoadingMore] = useState(false);
@@ -1468,23 +1461,13 @@ const ChannelWithContext = (props: PropsWithChildren<ChannelPropsWithContext>) =
14681461
);
14691462

14701463
const setEditingState: MessagesContextValue['setEditingState'] = useStableCallback((message) => {
1471-
clearQuotedMessageState();
14721464
setEditing(message);
14731465
});
14741466

1475-
const setQuotedMessageState: MessagesContextValue['setQuotedMessageState'] = useStableCallback(
1476-
(messageOrBoolean) => {
1477-
setQuotedMessage(messageOrBoolean);
1478-
},
1479-
);
1480-
14811467
const clearEditingState: InputMessageInputContextValue['clearEditingState'] = useStableCallback(
14821468
() => setEditing(undefined),
14831469
);
14841470

1485-
const clearQuotedMessageState: InputMessageInputContextValue['clearQuotedMessageState'] =
1486-
useStableCallback(() => setQuotedMessage(undefined));
1487-
14881471
/**
14891472
* Removes the message from local state
14901473
*/
@@ -1785,7 +1768,6 @@ const ChannelWithContext = (props: PropsWithChildren<ChannelPropsWithContext>) =
17851768
autoCompleteSuggestionsLimit,
17861769
channelId,
17871770
clearEditingState,
1788-
clearQuotedMessageState,
17891771
CommandInput,
17901772
CommandsButton,
17911773
compressImageQuality,
@@ -1815,13 +1797,11 @@ const ChannelWithContext = (props: PropsWithChildren<ChannelPropsWithContext>) =
18151797
numberOfLines,
18161798
onChangeText,
18171799
openPollCreationDialog,
1818-
quotedMessage,
18191800
SendButton,
18201801
sendImageAsync,
18211802
sendMessage,
18221803
SendMessageDisallowedIndicator,
18231804
setInputRef,
1824-
setQuotedMessageState,
18251805
ShowThreadMessageInChannelButton,
18261806
StartAudioRecordingButton,
18271807
StopMessageStreamingButton,
@@ -1852,7 +1832,6 @@ const ChannelWithContext = (props: PropsWithChildren<ChannelPropsWithContext>) =
18521832
CardFooter,
18531833
CardHeader,
18541834
channelId,
1855-
clearQuotedMessageState,
18561835
DateHeader,
18571836
deletedMessagesVisibilityType,
18581837
deleteMessage,
@@ -1939,7 +1918,6 @@ const ChannelWithContext = (props: PropsWithChildren<ChannelPropsWithContext>) =
19391918
selectReaction,
19401919
sendReaction,
19411920
setEditingState,
1942-
setQuotedMessageState,
19431921
shouldShowUnreadUnderlay,
19441922
StreamingMessageView,
19451923
supportedReactions,

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

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -46,6 +46,7 @@ export const useCreateChannelContext = ({
4646
const readUsersLength = readUsers.length;
4747
const readUsersLastReads = readUsers.map(({ last_read }) => last_read.toISOString()).join();
4848
const stringifiedChannelUnreadState = JSON.stringify(channelUnreadState);
49+
const editingDep = editing ? editing.id : '';
4950

5051
const channelContext: ChannelContextValue = useMemo(
5152
() => ({
@@ -88,7 +89,7 @@ export const useCreateChannelContext = ({
8889
[
8990
channelId,
9091
disabled,
91-
editing,
92+
editingDep,
9293
error,
9394
isChannelActive,
9495
highlightedMessageId,

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

Lines changed: 0 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,6 @@ export const useCreateInputMessageInputContext = ({
2222
autoCompleteSuggestionsLimit,
2323
channelId,
2424
clearEditingState,
25-
clearQuotedMessageState,
2625
CommandInput,
2726
CommandsButton,
2827
compressImageQuality,
@@ -52,13 +51,11 @@ export const useCreateInputMessageInputContext = ({
5251
numberOfLines,
5352
onChangeText,
5453
openPollCreationDialog,
55-
quotedMessage,
5654
SendButton,
5755
sendImageAsync,
5856
sendMessage,
5957
SendMessageDisallowedIndicator,
6058
setInputRef,
61-
setQuotedMessageState,
6259
showPollCreationDialog,
6360
ShowThreadMessageInChannelButton,
6461
StartAudioRecordingButton,
@@ -71,7 +68,6 @@ export const useCreateInputMessageInputContext = ({
7168
channelId?: string;
7269
}) => {
7370
const editingDep = editing ? editing.id : '';
74-
const quotedMessageId = quotedMessage ? quotedMessage.id : '';
7571

7672
const inputMessageInputContext: InputMessageInputContextValue = useMemo(
7773
() => ({
@@ -93,7 +89,6 @@ export const useCreateInputMessageInputContext = ({
9389
AutoCompleteSuggestionList,
9490
autoCompleteSuggestionsLimit,
9591
clearEditingState,
96-
clearQuotedMessageState,
9792
CommandInput,
9893
CommandsButton,
9994
compressImageQuality,
@@ -123,13 +118,11 @@ export const useCreateInputMessageInputContext = ({
123118
numberOfLines,
124119
onChangeText,
125120
openPollCreationDialog,
126-
quotedMessage,
127121
SendButton,
128122
sendImageAsync,
129123
sendMessage,
130124
SendMessageDisallowedIndicator,
131125
setInputRef,
132-
setQuotedMessageState,
133126
showPollCreationDialog,
134127
ShowThreadMessageInChannelButton,
135128
StartAudioRecordingButton,
@@ -143,7 +136,6 @@ export const useCreateInputMessageInputContext = ({
143136
editingDep,
144137
initialValue,
145138
maxMessageLength,
146-
quotedMessageId,
147139
CreatePollContent,
148140
showPollCreationDialog,
149141
],

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

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,6 @@ export const useCreateMessagesContext = ({
1212
CardFooter,
1313
CardHeader,
1414
channelId,
15-
clearQuotedMessageState,
1615
DateHeader,
1716
deletedMessagesVisibilityType,
1817
deleteMessage,
@@ -98,7 +97,6 @@ export const useCreateMessagesContext = ({
9897
selectReaction,
9998
sendReaction,
10099
setEditingState,
101-
setQuotedMessageState,
102100
shouldShowUnreadUnderlay,
103101
StreamingMessageView,
104102
supportedReactions,
@@ -130,7 +128,6 @@ export const useCreateMessagesContext = ({
130128
CardCover,
131129
CardFooter,
132130
CardHeader,
133-
clearQuotedMessageState,
134131
DateHeader,
135132
deletedMessagesVisibilityType,
136133
deleteMessage,
@@ -216,7 +213,6 @@ export const useCreateMessagesContext = ({
216213
selectReaction,
217214
sendReaction,
218215
setEditingState,
219-
setQuotedMessageState,
220216
shouldShowUnreadUnderlay,
221217
StreamingMessageView,
222218
supportedReactions,

package/src/components/Message/Message.tsx

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -170,7 +170,6 @@ export type MessagePropsWithContext = Pick<
170170
| 'retrySendMessage'
171171
| 'selectReaction'
172172
| 'setEditingState'
173-
| 'setQuotedMessageState'
174173
| 'supportedReactions'
175174
| 'updateMessage'
176175
| 'PollContent'
@@ -253,7 +252,6 @@ const MessageWithContext = (props: MessagePropsWithContext) => {
253252
selectReaction,
254253
sendReaction,
255254
setEditingState,
256-
setQuotedMessageState,
257255
showAvatar,
258256
showMessageStatus,
259257
showUnreadUnderlay,
@@ -499,7 +497,6 @@ const MessageWithContext = (props: MessagePropsWithContext) => {
499497
retrySendMessage,
500498
sendReaction,
501499
setEditingState,
502-
setQuotedMessageState,
503500
supportedReactions,
504501
});
505502

@@ -544,7 +541,6 @@ const MessageWithContext = (props: MessagePropsWithContext) => {
544541
selectReaction,
545542
sendReaction,
546543
setEditingState,
547-
setQuotedMessageState,
548544
supportedReactions,
549545
t,
550546
updateMessage,

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

Lines changed: 4 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ import {
1818
MessageContextValue,
1919
useMessageContext,
2020
} from '../../../contexts/messageContext/MessageContext';
21+
import { useMessageComposer } from '../../../contexts/messageInputContext/hooks/useMessageComposer';
2122
import {
2223
MessagesContextValue,
2324
useMessagesContext,
@@ -72,7 +73,6 @@ export type MessageSimplePropsWithContext = Pick<
7273
> &
7374
Pick<
7475
MessagesContextValue,
75-
| 'clearQuotedMessageState'
7676
| 'enableMessageGroupingByUser'
7777
| 'enableSwipeToReply'
7878
| 'myMessageTheme'
@@ -89,15 +89,13 @@ export type MessageSimplePropsWithContext = Pick<
8989
| 'ReactionListBottom'
9090
| 'reactionListPosition'
9191
| 'ReactionListTop'
92-
| 'setQuotedMessageState'
9392
>;
9493

9594
const MessageSimpleWithContext = (props: MessageSimplePropsWithContext) => {
9695
const [messageContentWidth, setMessageContentWidth] = useState(0);
9796
const { width } = Dimensions.get('screen');
9897
const {
9998
alignment,
100-
clearQuotedMessageState,
10199
enableMessageGroupingByUser,
102100
enableSwipeToReply,
103101
groupStyles,
@@ -121,7 +119,6 @@ const MessageSimpleWithContext = (props: MessageSimplePropsWithContext) => {
121119
ReactionListBottom,
122120
reactionListPosition,
123121
ReactionListTop,
124-
setQuotedMessageState,
125122
showMessageStatus,
126123
} = props;
127124

@@ -154,6 +151,7 @@ const MessageSimpleWithContext = (props: MessageSimplePropsWithContext) => {
154151
isVeryLastMessage,
155152
messageGroupedSingleOrBottom,
156153
} = useMessageData({});
154+
const messageComposer = useMessageComposer();
157155

158156
const lastMessageInMessageListStyles = [styles.lastMessageContainer, lastMessageContainer];
159157
const messageGroupedSingleOrBottomStyles = {
@@ -205,9 +203,8 @@ const MessageSimpleWithContext = (props: MessageSimplePropsWithContext) => {
205203
const [isBeingSwiped, setIsBeingSwiped] = useState<boolean>(false);
206204

207205
const onSwipeToReply = useCallback(() => {
208-
clearQuotedMessageState();
209-
setQuotedMessageState(message);
210-
}, [clearQuotedMessageState, message, setQuotedMessageState]);
206+
messageComposer.setQuotedMessage(message);
207+
}, [messageComposer, message]);
211208

212209
const THRESHOLD = 25;
213210

@@ -594,7 +591,6 @@ export const MessageSimple = (props: MessageSimpleProps) => {
594591
showMessageStatus,
595592
} = useMessageContext();
596593
const {
597-
clearQuotedMessageState,
598594
enableMessageGroupingByUser,
599595
enableSwipeToReply,
600596
MessageAvatar,
@@ -611,15 +607,13 @@ export const MessageSimple = (props: MessageSimpleProps) => {
611607
ReactionListBottom,
612608
reactionListPosition,
613609
ReactionListTop,
614-
setQuotedMessageState,
615610
} = useMessagesContext();
616611

617612
return (
618613
<MemoizedMessageSimple
619614
{...{
620615
alignment,
621616
channel,
622-
clearQuotedMessageState,
623617
enableMessageGroupingByUser,
624618
enableSwipeToReply,
625619
groupStyles,
@@ -644,7 +638,6 @@ export const MessageSimple = (props: MessageSimpleProps) => {
644638
ReactionListBottom,
645639
reactionListPosition,
646640
ReactionListTop,
647-
setQuotedMessageState,
648641
showMessageStatus,
649642
}}
650643
{...props}

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

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import { Alert } from 'react-native';
33
import type { ChannelContextValue } from '../../../contexts/channelContext/ChannelContext';
44
import type { ChatContextValue } from '../../../contexts/chatContext/ChatContext';
55
import type { MessageContextValue } from '../../../contexts/messageContext/MessageContext';
6+
import { useMessageComposer } from '../../../contexts/messageInputContext/hooks/useMessageComposer';
67
import type { MessagesContextValue } from '../../../contexts/messagesContext/MessagesContext';
78

89
import { useTranslationContext } from '../../../contexts/translationContext/TranslationContext';
@@ -17,25 +18,24 @@ export const useMessageActionHandlers = ({
1718
retrySendMessage,
1819
sendReaction,
1920
setEditingState,
20-
setQuotedMessageState,
2121
}: Pick<
2222
MessagesContextValue,
2323
| 'sendReaction'
2424
| 'deleteMessage'
2525
| 'deleteReaction'
2626
| 'retrySendMessage'
2727
| 'setEditingState'
28-
| 'setQuotedMessageState'
2928
| 'supportedReactions'
3029
> &
3130
Pick<ChannelContextValue, 'channel' | 'enforceUniqueReaction'> &
3231
Pick<ChatContextValue, 'client'> &
3332
Pick<MessageContextValue, 'message'>) => {
3433
const { t } = useTranslationContext();
3534
const handleResendMessage = () => retrySendMessage(message);
35+
const messageComposer = useMessageComposer();
3636

3737
const handleQuotedReplyMessage = () => {
38-
setQuotedMessageState(message);
38+
messageComposer.setQuotedMessage(message);
3939
};
4040

4141
const isMuted = (client.mutedUsers || []).some(
@@ -106,6 +106,7 @@ export const useMessageActionHandlers = ({
106106

107107
const handleEditMessage = () => {
108108
setEditingState(message);
109+
messageComposer.setQuotedMessage(null);
109110
};
110111

111112
const handleFlagMessage = () => {

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

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -51,7 +51,6 @@ export type MessageActionsHookProps = Pick<
5151
| 'deleteReaction'
5252
| 'retrySendMessage'
5353
| 'setEditingState'
54-
| 'setQuotedMessageState'
5554
| 'selectReaction'
5655
| 'supportedReactions'
5756
| 'updateMessage'
@@ -90,7 +89,6 @@ export const useMessageActions = ({
9089
selectReaction,
9190
sendReaction,
9291
setEditingState,
93-
setQuotedMessageState,
9492
supportedReactions,
9593
t,
9694
}: MessageActionsHookProps) => {
@@ -121,7 +119,6 @@ export const useMessageActions = ({
121119
retrySendMessage,
122120
sendReaction,
123121
setEditingState,
124-
setQuotedMessageState,
125122
supportedReactions,
126123
});
127124

0 commit comments

Comments
 (0)