Skip to content

Commit 1ae2f7d

Browse files
authored
feat: add optional support of delete message for me (#3246)
* feat: add optional support of delete message for me * feat: add optional support of delete message for me * fix: update stream-chat package * fix: add action to sample app only * fix: add action to sample app only * fix: how delete for me action is handled on the SDK * chore: update stream-chat version
1 parent 7b7ad2e commit 1ae2f7d

File tree

28 files changed

+135
-20
lines changed

28 files changed

+135
-20
lines changed

examples/ExpoMessaging/app/index.tsx

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { Alert, Image, Pressable, StyleSheet, View } from 'react-native';
2-
import { ChannelList } from 'stream-chat-expo';
2+
import { ChannelList, SqliteClient } from 'stream-chat-expo';
33
import { useCallback, useContext, useMemo } from 'react';
44
import { Stack, useRouter } from 'expo-router';
55
import { ChannelSort } from 'stream-chat';
@@ -19,7 +19,13 @@ const LogoutButton = () => {
1919
const onLogoutHandler = useCallback(() => {
2020
Alert.alert('Logout', 'Are you sure you want to logout?', [
2121
{ text: 'Cancel', style: 'cancel' },
22-
{ text: 'Logout', onPress: logOut },
22+
{
23+
text: 'Logout',
24+
onPress: () => {
25+
SqliteClient.resetDB();
26+
logOut();
27+
},
28+
},
2329
]);
2430
}, [logOut]);
2531

examples/ExpoMessaging/components/ChatWrapper.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,7 @@ export const ChatWrapper = ({ children }: PropsWithChildren<{}>) => {
4646

4747
return (
4848
<OverlayProvider i18nInstance={streami18n} value={{ style: theme }}>
49-
<Chat client={chatClient} i18nInstance={streami18n}>
49+
<Chat client={chatClient} i18nInstance={streami18n} enableOfflineSupport>
5050
{children}
5151
</Chat>
5252
</OverlayProvider>

examples/SampleApp/src/utils/messageActions.tsx

Lines changed: 23 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import { Alert } from 'react-native';
22
import { StreamChat } from 'stream-chat';
33
import {
44
Colors,
5+
Delete,
56
messageActions,
67
MessageActionsParams,
78
Time,
@@ -20,7 +21,7 @@ export function channelMessageActions({
2021
t: TranslationContextValue['t'];
2122
colors?: typeof Colors;
2223
}) {
23-
const { dismissOverlay } = params;
24+
const { dismissOverlay, deleteForMeMessage } = params;
2425
const actions = messageActions(params);
2526

2627
// We cannot use the useMessageReminder hook here because it is a hook.
@@ -88,6 +89,27 @@ export function channelMessageActions({
8889
title: reminder ? 'Remove Reminder' : 'Remind Me',
8990
icon: <Bell height={24} width={24} />,
9091
});
92+
actions.push({
93+
action: async () => {
94+
Alert.alert('Delete for me', 'Are you sure you want to delete this message for me?', [
95+
{
96+
text: 'Cancel',
97+
style: 'cancel',
98+
},
99+
{
100+
text: 'Delete',
101+
onPress: async () => {
102+
await deleteForMeMessage?.action();
103+
dismissOverlay();
104+
},
105+
style: 'destructive',
106+
},
107+
]);
108+
},
109+
actionType: 'deleteForMe',
110+
icon: <Delete fill={colors?.accent_red} size={24} />,
111+
title: t('Delete for me'),
112+
});
91113

92114
return actions;
93115
}

examples/TypeScriptMessaging/yarn.lock

Lines changed: 14 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2734,6 +2734,15 @@ available-typed-arrays@^1.0.7:
27342734
dependencies:
27352735
possible-typed-array-names "^1.0.0"
27362736

2737+
axios@^1.12.2:
2738+
version "1.12.2"
2739+
resolved "https://registry.yarnpkg.com/axios/-/axios-1.12.2.tgz#6c307390136cf7a2278d09cec63b136dfc6e6da7"
2740+
integrity sha512-vMJzPewAlRyOgxV2dU0Cuz2O8zzzx9VYtbJOaBgXFeLc4IV/Eg50n4LowmehOOR61S8ZMpc2K5Sa7g6A4jfkUw==
2741+
dependencies:
2742+
follow-redirects "^1.15.6"
2743+
form-data "^4.0.4"
2744+
proxy-from-env "^1.1.0"
2745+
27372746
axios@^1.6.0:
27382747
version "1.7.9"
27392748
resolved "https://registry.yarnpkg.com/axios/-/axios-1.7.9.tgz#d7d071380c132a24accda1b2cfc1535b79ec650a"
@@ -7319,14 +7328,14 @@ [email protected]:
73197328
version "0.0.0"
73207329
uid ""
73217330

7322-
stream-chat@^9.17.0:
7323-
version "9.17.0"
7324-
resolved "https://registry.yarnpkg.com/stream-chat/-/stream-chat-9.17.0.tgz#540cf1ea03b08a394d6140696aae8528e9ba9ce2"
7325-
integrity sha512-ys6K73wIVWs5+qsfPJ9wumEUtgbMXYVbH1dhmAZ1oYtQ01dY/avsvt25PYDakVjKeyrnT+y8T/xEzfeF/WDJsg==
7331+
stream-chat@^9.23.0:
7332+
version "9.23.0"
7333+
resolved "https://registry.yarnpkg.com/stream-chat/-/stream-chat-9.23.0.tgz#e7e5cf729861597e7198907c1cab22a57d68a2fc"
7334+
integrity sha512-UW112HYsLnYb4RMIXBtAouNQCCe0weVzNivjezsw+JKK1b/TX0JLBi+wK25mBUEO+coOGKfXiye6IB3gao8ipw==
73267335
dependencies:
73277336
"@types/jsonwebtoken" "^9.0.8"
73287337
"@types/ws" "^8.5.14"
7329-
axios "^1.6.0"
7338+
axios "^1.12.2"
73307339
base64-js "^1.5.1"
73317340
form-data "^4.0.4"
73327341
isomorphic-ws "^5.0.0"

package/src/components/Channel/Channel.tsx

Lines changed: 14 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ import {
99
Channel as ChannelClass,
1010
ChannelState,
1111
Channel as ChannelType,
12+
DeleteMessageOptions,
1213
EventHandler,
1314
LocalMessage,
1415
localMessageToNewMessagePayload,
@@ -324,6 +325,7 @@ export type ChannelPropsWithContext = Pick<ChannelContextValue, 'channel'> &
324325
| 'handleBan'
325326
| 'handleCopy'
326327
| 'handleDelete'
328+
| 'handleDeleteForMe'
327329
| 'handleEdit'
328330
| 'handleFlag'
329331
| 'handleMarkUnread'
@@ -582,6 +584,7 @@ const ChannelWithContext = (props: PropsWithChildren<ChannelPropsWithContext>) =
582584
handleBan,
583585
handleCopy,
584586
handleDelete,
587+
handleDeleteForMe,
585588
handleEdit,
586589
handleFlag,
587590
handleMarkUnread,
@@ -1515,7 +1518,15 @@ const ChannelWithContext = (props: PropsWithChildren<ChannelPropsWithContext>) =
15151518
});
15161519

15171520
const deleteMessage: MessagesContextValue['deleteMessage'] = useStableCallback(
1518-
async (message, hardDelete = false) => {
1521+
async (message, optionsOrHardDelete = false) => {
1522+
let options: DeleteMessageOptions = {};
1523+
if (typeof optionsOrHardDelete === 'boolean') {
1524+
options = optionsOrHardDelete ? { hardDelete: true } : {};
1525+
} else if (optionsOrHardDelete?.deleteForMe) {
1526+
options = { deleteForMe: true };
1527+
} else if (optionsOrHardDelete?.hardDelete) {
1528+
options = { hardDelete: true };
1529+
}
15191530
if (!channel.id) {
15201531
throw new Error('Channel has not been initialized yet');
15211532
}
@@ -1534,7 +1545,7 @@ const ChannelWithContext = (props: PropsWithChildren<ChannelPropsWithContext>) =
15341545

15351546
threadInstance?.upsertReplyLocally({ message: updatedMessage });
15361547

1537-
const data = await client.deleteMessage(message.id, hardDelete);
1548+
const data = await client.deleteMessage(message.id, options);
15381549

15391550
if (data?.message) {
15401551
updateMessage({ ...data.message });
@@ -1845,6 +1856,7 @@ const ChannelWithContext = (props: PropsWithChildren<ChannelPropsWithContext>) =
18451856
handleBan,
18461857
handleCopy,
18471858
handleDelete,
1859+
handleDeleteForMe,
18481860
handleEdit,
18491861
handleFlag,
18501862
handleMarkUnread,

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

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,7 @@ export const useCreateMessagesContext = ({
3333
handleBan,
3434
handleCopy,
3535
handleDelete,
36+
handleDeleteForMe,
3637
handleEdit,
3738
handleFlag,
3839
handleMarkUnread,
@@ -150,6 +151,7 @@ export const useCreateMessagesContext = ({
150151
handleBan,
151152
handleCopy,
152153
handleDelete,
154+
handleDeleteForMe,
153155
handleEdit,
154156
handleFlag,
155157
handleMarkUnread,

package/src/components/Message/Message.tsx

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -121,6 +121,7 @@ export type MessagePressableHandlerPayload = PressableHandlerPayload & {
121121
export type MessageActionHandlers = {
122122
copyMessage: () => void;
123123
deleteMessage: () => void;
124+
deleteForMeMessage: () => void;
124125
editMessage: () => void;
125126
flagMessage: () => void;
126127
markUnread: () => Promise<void>;
@@ -155,6 +156,7 @@ export type MessagePropsWithContext = Pick<
155156
| 'handleBan'
156157
| 'handleCopy'
157158
| 'handleDelete'
159+
| 'handleDeleteForMe'
158160
| 'handleEdit'
159161
| 'handleFlag'
160162
| 'handleMarkUnread'
@@ -229,6 +231,7 @@ const MessageWithContext = (props: MessagePropsWithContext) => {
229231
handleBan,
230232
handleCopy,
231233
handleDelete,
234+
handleDeleteForMe,
232235
handleEdit,
233236
handleFlag,
234237
handleMarkUnread,
@@ -487,6 +490,7 @@ const MessageWithContext = (props: MessagePropsWithContext) => {
487490
const {
488491
handleCopyMessage,
489492
handleDeleteMessage,
493+
handleDeleteForMeMessage,
490494
handleEditMessage,
491495
handleFlagMessage,
492496
handleMarkUnreadMessage,
@@ -514,6 +518,7 @@ const MessageWithContext = (props: MessagePropsWithContext) => {
514518
banUser,
515519
copyMessage,
516520
deleteMessage,
521+
deleteForMeMessage,
517522
editMessage,
518523
flagMessage,
519524
handleReaction,
@@ -534,6 +539,7 @@ const MessageWithContext = (props: MessagePropsWithContext) => {
534539
handleBan,
535540
handleCopy,
536541
handleDelete,
542+
handleDeleteForMe,
537543
handleEdit,
538544
handleFlag,
539545
handleMarkUnread,
@@ -565,6 +571,7 @@ const MessageWithContext = (props: MessagePropsWithContext) => {
565571
: messageActionsProp({
566572
banUser,
567573
copyMessage,
574+
deleteForMeMessage,
568575
deleteMessage,
569576
dismissOverlay,
570577
editMessage,
@@ -582,10 +589,12 @@ const MessageWithContext = (props: MessagePropsWithContext) => {
582589
showMessageReactions,
583590
threadReply,
584591
unpinMessage,
592+
updateMessage,
585593
});
586594

587595
const actionHandlers: MessageActionHandlers = {
588596
copyMessage: handleCopyMessage,
597+
deleteForMeMessage: handleDeleteForMeMessage,
589598
deleteMessage: handleDeleteMessage,
590599
editMessage: handleEditMessage,
591600
flagMessage: handleFlagMessage,

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

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -66,6 +66,14 @@ export const useMessageActionHandlers = ({
6666
);
6767
};
6868

69+
const handleDeleteForMeMessage = async () => {
70+
if (!message.id) {
71+
return;
72+
}
73+
74+
await deleteMessage(message, { deleteForMe: true });
75+
};
76+
6977
const handleToggleMuteUser = async () => {
7078
if (!message.user?.id) {
7179
return;
@@ -182,6 +190,7 @@ export const useMessageActionHandlers = ({
182190

183191
return {
184192
handleCopyMessage,
193+
handleDeleteForMeMessage,
185194
handleDeleteMessage,
186195
handleEditMessage,
187196
handleFlagMessage,

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

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,7 @@ export type MessageActionsHookProps = Pick<
3939
| 'handleBan'
4040
| 'handleCopy'
4141
| 'handleDelete'
42+
| 'handleDeleteForMe'
4243
| 'handleEdit'
4344
| 'handleFlag'
4445
| 'handleQuotedReply'
@@ -73,6 +74,7 @@ export const useMessageActions = ({
7374
handleBan,
7475
handleCopy,
7576
handleDelete,
77+
handleDeleteForMe,
7678
handleEdit,
7779
handleFlag,
7880
handleMarkUnread,
@@ -101,6 +103,7 @@ export const useMessageActions = ({
101103
const {
102104
handleCopyMessage,
103105
handleDeleteMessage,
106+
handleDeleteForMeMessage,
104107
handleEditMessage,
105108
handleFlagMessage,
106109
handleMarkUnreadMessage,
@@ -182,6 +185,19 @@ export const useMessageActions = ({
182185
titleStyle: { color: accent_red },
183186
};
184187

188+
const deleteForMeMessage: MessageActionType = {
189+
action: () => {
190+
dismissOverlay();
191+
if (handleDeleteForMe) {
192+
handleDeleteForMe(message);
193+
}
194+
handleDeleteForMeMessage();
195+
},
196+
actionType: 'deleteForMeMessage',
197+
icon: <Delete fill={accent_red} size={24} />,
198+
title: t('Delete for me'),
199+
};
200+
185201
const editMessage: MessageActionType = {
186202
action: () => {
187203
dismissOverlay();
@@ -319,6 +335,7 @@ export const useMessageActions = ({
319335
return {
320336
banUser,
321337
copyMessage,
338+
deleteForMeMessage,
322339
deleteMessage,
323340
editMessage,
324341
flagMessage,

package/src/components/Message/utils/messageActions.ts

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import type { MessageContextValue } from '../../../contexts/messageContext/MessageContext';
2+
import type { MessagesContextValue } from '../../../contexts/messagesContext/MessagesContext';
23
import type { OwnCapabilitiesContextValue } from '../../../contexts/ownCapabilitiesContext/OwnCapabilitiesContext';
34
import { isClipboardAvailable } from '../../../native';
45

@@ -25,7 +26,10 @@ export type MessageActionsParams = {
2526
showMessageReactions: boolean;
2627
threadReply: MessageActionType;
2728
unpinMessage: MessageActionType;
28-
} & Pick<MessageContextValue, 'message' | 'isMyMessage'>;
29+
// Optional Actions
30+
deleteForMeMessage?: MessageActionType;
31+
} & Pick<MessageContextValue, 'message' | 'isMyMessage'> &
32+
Pick<MessagesContextValue, 'updateMessage'>;
2933

3034
export type MessageActionsProp = (param: MessageActionsParams) => MessageActionType[];
3135

0 commit comments

Comments
 (0)