Skip to content

Commit b978fe5

Browse files
isekovanicisekovanic
authored
Next Release (#3598)
## 🎯 Goal <!-- Describe why we are making this change --> ## 🛠 Implementation details <!-- Provide a description of the implementation --> ## 🎨 UI Changes <!-- Add relevant screenshots --> <details> <summary>iOS</summary> <table> <thead> <tr> <td>Before</td> <td>After</td> </tr> </thead> <tbody> <tr> <td> <!--<img src="" /> --> </td> <td> <!--<img src="" /> --> </td> </tr> </tbody> </table> </details> <details> <summary>Android</summary> <table> <thead> <tr> <td>Before</td> <td>After</td> </tr> </thead> <tbody> <tr> <td> <!--<img src="" /> --> </td> <td> <!--<img src="" /> --> </td> </tr> </tbody> </table> </details> ## 🧪 Testing <!-- Explain how this change can be tested (or why it can't be tested) --> ## ☑️ Checklist - [ ] I have signed the [Stream CLA](https://docs.google.com/forms/d/e/1FAIpQLScFKsKkAJI7mhCr7K9rEIOpqIDThrWxuvxnwUq2XkHyG154vQ/viewform) (required) - [ ] PR targets the `develop` branch - [ ] Documentation is updated - [ ] New code is tested in main example apps, including all possible scenarios - [ ] SampleApp iOS and Android - [ ] Expo iOS and Android
2 parents 669655e + 2181e55 commit b978fe5

35 files changed

Lines changed: 746 additions & 113 deletions

‎examples/ExpoMessaging/app/index.tsx‎

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -3,13 +3,12 @@ import { Alert, Image, Pressable, StyleSheet, View } from 'react-native';
33
import { ChannelList, SqliteClient } from 'stream-chat-expo';
44
import { useCallback, useContext, useMemo } from 'react';
55
import { Stack, useRouter } from 'expo-router';
6-
import { ChannelSort } from 'stream-chat';
76
import { AppContext } from '../context/AppContext';
87
import { useUserContext } from '@/context/UserContext';
98
import { getInitialsOfName } from '@/utils/getInitialsOfName';
109

11-
const sort: ChannelSort = { last_updated: -1 };
12-
const options = {
10+
const baseOptions = {
11+
predefined_filter: 'basic_channel_list_filter',
1312
state: true,
1413
watch: true,
1514
};
@@ -46,12 +45,15 @@ const LogoutButton = () => {
4645

4746
export default function ChannelListScreen() {
4847
const { user } = useUserContext();
49-
const filters = useMemo(
48+
const userId = user?.id || '';
49+
const options = useMemo(
5050
() => ({
51-
members: { $in: [user?.id as string] },
52-
type: 'messaging',
51+
...baseOptions,
52+
filter_values: {
53+
user_id: userId,
54+
},
5355
}),
54-
[user?.id],
56+
[userId],
5557
);
5658
const router = useRouter();
5759
const { setChannel } = useContext(AppContext);
@@ -63,13 +65,11 @@ export default function ChannelListScreen() {
6365
/>
6466

6567
<ChannelList
66-
filters={filters}
6768
onSelect={(channel) => {
6869
setChannel(channel);
6970
router.push(`/channel/${channel.cid}`);
7071
}}
7172
options={options}
72-
sort={sort}
7373
/>
7474
</View>
7575
);

‎examples/SampleApp/ios/Podfile.lock‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3367,7 +3367,7 @@ PODS:
33673367
- ReactCommon/turbomodule/core
33683368
- SocketRocket
33693369
- Yoga
3370-
- Teleport (1.1.2):
3370+
- Teleport (1.1.5):
33713371
- boost
33723372
- DoubleConversion
33733373
- fast_float
@@ -3394,9 +3394,9 @@ PODS:
33943394
- ReactCommon/turbomodule/bridging
33953395
- ReactCommon/turbomodule/core
33963396
- SocketRocket
3397-
- Teleport/common (= 1.1.2)
3397+
- Teleport/common (= 1.1.5)
33983398
- Yoga
3399-
- Teleport/common (1.1.2):
3399+
- Teleport/common (1.1.5):
34003400
- boost
34013401
- DoubleConversion
34023402
- fast_float
@@ -3884,7 +3884,7 @@ SPEC CHECKSUMS:
38843884
SDWebImageWebPCoder: 0e06e365080397465cc73a7a9b472d8a3bd0f377
38853885
SocketRocket: d4aabe649be1e368d1318fdf28a022d714d65748
38863886
stream-chat-react-native: d15df89b47c1a08bc7db90c316d34b8ac4e13900
3887-
Teleport: ed828b19e62ca8b9ec101d991bf0594b1c1c8812
3887+
Teleport: 11e953f37a889cb6a1b24c16182f84b95f77e002
38883888
Yoga: ff16d80456ce825ffc9400eeccc645a0dfcccdf5
38893889

38903890
PODFILE CHECKSUM: 84efea5f3e8c9c79671ee6e525f700f244c17388

‎examples/SampleApp/package.json‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -49,7 +49,7 @@
4949
"@react-navigation/drawer": "7.4.1",
5050
"@react-navigation/native": "^7.1.19",
5151
"@react-navigation/native-stack": "^7.6.2",
52-
"@shopify/flash-list": "^2.1.0",
52+
"@shopify/flash-list": "^2.3.1",
5353
"emoji-mart": "^5.6.0",
5454
"lodash.mergewith": "^4.6.2",
5555
"react": "19.1.4",
@@ -66,7 +66,7 @@
6666
"react-native-screens": "^4.24.0",
6767
"react-native-share": "^12.0.11",
6868
"react-native-svg": "^15.15.4",
69-
"react-native-teleport": "^1.1.2",
69+
"react-native-teleport": "^1.1.5",
7070
"react-native-video": "^6.16.1",
7171
"react-native-worklets": "^0.8.1",
7272
"stream-chat-react-native": "link:../../package/native-package",

‎examples/SampleApp/src/components/BottomTabs.tsx‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,6 @@ const styles = StyleSheet.create({
2727
paddingVertical: 8,
2828
},
2929
tabListContainer: {
30-
borderTopColor: 'rgba(0, 0, 0, 0.0677)',
3130
borderTopWidth: 1,
3231
flexDirection: 'row',
3332
},
@@ -128,16 +127,18 @@ const Tab = (props: TabProps) => {
128127

129128
export const BottomTabs: React.FC<BottomTabBarProps> = (props) => {
130129
const { navigation, state } = props;
131-
useTheme();
132-
const { white } = useLegacyColors();
130+
const {
131+
theme: { semantics },
132+
} = useTheme();
133133
const { bottom } = useSafeAreaInsets();
134134

135135
return (
136136
<View
137137
style={[
138138
styles.tabListContainer,
139139
{
140-
backgroundColor: white,
140+
backgroundColor: semantics.backgroundCoreElevation1,
141+
borderTopColor: semantics.borderCoreSubtle,
141142
paddingBottom: bottom,
142143
},
143144
]}

‎examples/SampleApp/src/components/NewDirectMessagingSendButton.tsx‎

Lines changed: 22 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -4,11 +4,11 @@ import { TouchableOpacity } from 'react-native-gesture-handler';
44
import { useNavigation } from '@react-navigation/core';
55

66
import {
7-
MessageInputContextValue,
87
Search,
98
SendRight,
109
useChannelContext,
11-
useMessageInputContext,
10+
useMessageComposer,
11+
useStateStore,
1212
useTheme,
1313
} from 'stream-chat-react-native';
1414

@@ -19,11 +19,16 @@ import { useAppContext } from '../context/AppContext';
1919
import { SendUp } from '../icons/SendUp';
2020
import { useLegacyColors } from '../theme/useLegacyColors';
2121

22-
type NewDirectMessagingSendButtonPropsWithContext = Pick<
23-
MessageInputContextValue,
24-
'giphyActive' | 'sendMessage'
25-
> & {
22+
import type { TextComposerState } from 'stream-chat';
23+
24+
const textComposerStateSelector = (state: TextComposerState) => ({
25+
command: state.command,
26+
});
27+
28+
type NewDirectMessagingSendButtonPropsWithContext = {
2629
/** Disables the button */ disabled: boolean;
30+
giphyActive: boolean;
31+
sendMessage: () => Promise<void>;
2732
};
2833

2934
const SendButtonWithContext = (props: NewDirectMessagingSendButtonPropsWithContext) => {
@@ -97,8 +102,9 @@ export const NewDirectMessagingSendButton = (props: SendButtonProps) => {
97102
const navigation = useNavigation<NewDirectMessagingScreenNavigationProp>();
98103
const { channel } = useChannelContext();
99104
const { selectedUserIds, reset } = useUserSearchContext();
100-
101-
const { giphyActive, text } = useMessageInputContext();
105+
const messageComposer = useMessageComposer();
106+
const { command } = useStateStore(messageComposer.textComposer.state, textComposerStateSelector);
107+
const giphyActive = command?.name === 'giphy';
102108

103109
const sendMessage = async () => {
104110
if (!channel) {
@@ -107,14 +113,21 @@ export const NewDirectMessagingSendButton = (props: SendButtonProps) => {
107113
if (!chatClient || !chatClient.user) {
108114
return;
109115
}
116+
117+
const composition = await messageComposer.compose();
118+
if (!composition?.message) {
119+
return;
120+
}
121+
110122
const members = [chatClient.user.id, ...selectedUserIds];
111123
channel.initialized = false;
112124
const newChannel = chatClient.channel('messaging', {
113125
members,
114126
});
115127
try {
116128
await newChannel.watch();
117-
await newChannel.sendMessage({ text });
129+
await newChannel.sendMessage(composition.message, composition.sendOptions);
130+
messageComposer.clear();
118131
navigation.replace('ChannelScreen', {
119132
channelId: newChannel.id,
120133
});

‎examples/SampleApp/src/screens/ChannelListScreen.tsx‎

Lines changed: 8 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,6 @@ import { MessageSearchList } from '../components/MessageSearch/MessageSearchList
1717
import { useAppContext } from '../context/AppContext';
1818
import { usePaginatedSearchedMessages } from '../hooks/usePaginatedSearchedMessages';
1919

20-
import type { ChannelSort } from 'stream-chat';
2120
import { useStreamChatContext } from '../context/StreamChatContext';
2221
import { Search } from '../icons/Search';
2322
import { ChannelInfo } from '../icons/ChannelInfo.tsx';
@@ -60,18 +59,12 @@ const styles = StyleSheet.create({
6059
},
6160
});
6261

63-
const baseFilters = {
64-
archived: false,
65-
type: 'messaging',
66-
};
67-
68-
const sort: ChannelSort = [{ pinned_at: -1 }, { last_message_at: -1 }, { updated_at: -1 }];
69-
70-
const options = {
62+
const baseOptions = {
7163
presence: true,
7264
state: true,
7365
watch: true,
7466
message_limit: 25,
67+
predefined_filter: 'basic_channel_list_filter',
7568
};
7669

7770
export const ChannelListScreen: React.FC = () => {
@@ -91,15 +84,12 @@ export const ChannelListScreen: React.FC = () => {
9184
usePaginatedSearchedMessages(searchQuery);
9285

9386
const chatClientUserId = chatClient?.user?.id || '';
94-
const filters = useMemo(
95-
() => ({
96-
...baseFilters,
97-
members: {
98-
$in: [chatClientUserId],
99-
},
100-
}),
101-
[chatClientUserId],
102-
);
87+
const options = useMemo(() => ({
88+
...baseOptions,
89+
filter_values: {
90+
user_id: chatClientUserId,
91+
}
92+
}), [chatClientUserId])
10393

10494
useScrollToTop(scrollRef as RefObject<FlatList<Channel>>);
10595

@@ -248,13 +238,11 @@ export const ChannelListScreen: React.FC = () => {
248238
<View style={[styles.channelListContainer, { opacity: searchQuery ? 0 : 1 }]}>
249239
<ChannelList
250240
additionalFlatListProps={additionalFlatListProps}
251-
filters={filters}
252241
maxUnreadCount={99}
253242
onSelect={onSelect}
254243
options={options}
255244
setFlatListRef={setScrollRef}
256245
getChannelActionItems={getChannelActionItems}
257-
sort={sort}
258246
/>
259247
</View>
260248
</View>

‎examples/SampleApp/src/screens/NewDirectMessagingScreen.tsx‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,9 +7,11 @@ import {
77
MessageComposer,
88
MessageList,
99
UserAdd,
10+
WithComponents,
1011
useTheme,
1112
} from 'stream-chat-react-native';
1213

14+
import { NewDirectMessagingSendButton } from '../components/NewDirectMessagingSendButton';
1315
import { User } from '../icons/User';
1416
import { RoundButton } from '../components/RoundButton';
1517
import { ScreenHeader } from '../components/ScreenHeader';
@@ -359,7 +361,9 @@ export const NewDirectMessagingScreen: React.FC<NewDirectMessagingScreenProps> =
359361
{results && results.length >= 0 && !focusOnSearchInput && focusOnMessageInput && (
360362
<MessageList />
361363
)}
362-
<MessageComposer />
364+
<WithComponents overrides={{ SendButton: NewDirectMessagingSendButton }}>
365+
<MessageComposer />
366+
</WithComponents>
363367
</Channel>
364368
</SafeAreaView>
365369
);

‎examples/SampleApp/yarn.lock‎

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -2712,10 +2712,10 @@
27122712
read-yaml-file "^2.1.0"
27132713
strip-json-comments "^3.1.1"
27142714

2715-
"@shopify/flash-list@^2.1.0":
2716-
version "2.1.0"
2717-
resolved "https://registry.yarnpkg.com/@shopify/flash-list/-/flash-list-2.1.0.tgz#b1eefcf9fbd01ca04a5f24a6003cda3b46a59f64"
2718-
integrity sha512-/EIQlptG456yM5o9qNmNsmaZEFEOGvG3WGyb6GUAxSLlcKUGlPUkPI2NLW5wQSDEY4xSRa5zocUI+9xwmsM4Kg==
2715+
"@shopify/flash-list@^2.3.1":
2716+
version "2.3.1"
2717+
resolved "https://registry.yarnpkg.com/@shopify/flash-list/-/flash-list-2.3.1.tgz#d4f90b1471a741a97c07d9aadbfaf200e92c86f7"
2718+
integrity sha512-7oktg2NQR7KAODjFoDaWe8/OBzyYbdTE3zQTrUBMxjIbxHTHN7UXRX1hX3DHk8KvtkgQdRfZOV8Gjj2l4fGrXw==
27192719

27202720
"@sideway/address@^4.1.5":
27212721
version "4.1.5"
@@ -7695,10 +7695,10 @@ react-native-svg@^15.15.4:
76957695
css-tree "^1.1.3"
76967696
warn-once "0.1.1"
76977697

7698-
react-native-teleport@^1.1.2:
7699-
version "1.1.2"
7700-
resolved "https://registry.yarnpkg.com/react-native-teleport/-/react-native-teleport-1.1.2.tgz#23deea2a34f6b1bb378e0305d44deeb93d51d490"
7701-
integrity sha512-64dcEkxlVKzxIts2FAVhzI2tDExcD23T13c2yDC/E+1dA1vP9UlDwPYUEkHvnoTOFtMDGrKLH03RJahIWfQC1g==
7698+
react-native-teleport@^1.1.5:
7699+
version "1.1.5"
7700+
resolved "https://registry.yarnpkg.com/react-native-teleport/-/react-native-teleport-1.1.5.tgz#53709238828ef346948531593f81950e57461396"
7701+
integrity sha512-nK7gI9Ak8RVOgE08YLL/AhY1ZjnccVpqNymyfYW+qQdGxpRCys6ndjQpc4YWiQLLWRG2hs47YS5wnXURPcWWEA==
77027702

77037703
react-native-url-polyfill@^2.0.0:
77047704
version "2.0.0"
@@ -8291,10 +8291,10 @@ stream-chat-react-native-core@8.1.0:
82918291
version "0.0.0"
82928292
uid ""
82938293

8294-
stream-chat@^9.43.2:
8295-
version "9.43.2"
8296-
resolved "https://registry.yarnpkg.com/stream-chat/-/stream-chat-9.43.2.tgz#2b53af3a4ce00c90f531cb44f01b6e09a91bfe13"
8297-
integrity sha512-+o1f8RfqqeBq7ShH74TyZDei4+8UWagKFz2xYhmANHCNl2bNPuLIAaDbV7sK3Liw9eg/26Kml/gUgGoSLUwZVA==
8294+
stream-chat@^9.44.2:
8295+
version "9.44.2"
8296+
resolved "https://registry.yarnpkg.com/stream-chat/-/stream-chat-9.44.2.tgz#97d23ae4ac356b352bb0f20a31a29dc63d3ea6f5"
8297+
integrity sha512-TXALWeHyWnSn1KlGYEF0sltEHB26vFd26l5m1qlE9Q1XHo9RPPSyLb5mfXqTEY8b2FAv57Ei3hrT8nSXVWacDQ==
82988298
dependencies:
82998299
"@types/jsonwebtoken" "^9.0.8"
83008300
"@types/ws" "^8.5.14"

‎package/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -83,7 +83,7 @@
8383
"path": "0.12.7",
8484
"react-native-markdown-package": "1.8.2",
8585
"react-native-url-polyfill": "^2.0.0",
86-
"stream-chat": "^9.43.2",
86+
"stream-chat": "^9.44.2",
8787
"use-sync-external-store": "^1.5.0"
8888
},
8989
"peerDependencies": {

‎package/src/components/Attachment/Attachment.tsx‎

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -219,9 +219,14 @@ const useAudioAttachmentStyles = () => {
219219
const {
220220
theme: { semantics },
221221
} = useTheme();
222-
const { isMyMessage, messageHasOnlySingleAttachment } = useMessageContext();
223-
224-
const showBackgroundTransparent = messageHasOnlySingleAttachment;
222+
const { isMyMessage, message, messageHasOnlySingleAttachment } = useMessageContext();
223+
224+
const messageHasSingleAttachment = message.attachments?.length === 1;
225+
const messageHasCaption = !!message.text?.trim();
226+
const messageIsQuotedReply = !!(message.quoted_message || message.quoted_message_id);
227+
const showBackgroundTransparent =
228+
messageHasOnlySingleAttachment ||
229+
(messageIsQuotedReply && messageHasSingleAttachment && !messageHasCaption);
225230

226231
return useMemo(() => {
227232
return StyleSheet.create({

0 commit comments

Comments
 (0)