Skip to content

Commit 2225971

Browse files
isekovanicisekovanic
committed
Merge branch 'develop' into feat/reactive-channel-list-poc
# Conflicts: # package/src/components/ChannelList/ChannelList.tsx
2 parents b856437 + 059a420 commit 2225971

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

49 files changed

+2330
-521
lines changed

‎examples/ExpoMessaging/package.json‎

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -14,23 +14,23 @@
1414
"@react-native-community/netinfo": "11.4.1",
1515
"@react-navigation/elements": "^1.3.30",
1616
"expo": "~52.0.20",
17-
"expo-av": "~15.0.1",
18-
"expo-clipboard": "~7.0.0",
19-
"expo-constants": "~17.0.3",
20-
"expo-document-picker": "~13.0.1",
21-
"expo-file-system": "~18.0.6",
22-
"expo-haptics": "~14.0.0",
23-
"expo-image-manipulator": "~13.0.5",
24-
"expo-image-picker": "^16.0.3",
25-
"expo-linking": "~7.0.3",
26-
"expo-media-library": "~17.0.4",
27-
"expo-router": "~4.0.15",
28-
"expo-sharing": "~13.0.0",
29-
"expo-splash-screen": "~0.29.18",
30-
"expo-status-bar": "~2.0.0",
17+
"expo-av": "~15.0.2",
18+
"expo-clipboard": "~7.0.1",
19+
"expo-constants": "~17.0.5",
20+
"expo-document-picker": "~13.0.2",
21+
"expo-file-system": "~18.0.7",
22+
"expo-haptics": "~14.0.1",
23+
"expo-image-manipulator": "~13.0.6",
24+
"expo-image-picker": "~16.0.4",
25+
"expo-linking": "~7.0.5",
26+
"expo-media-library": "~17.0.5",
27+
"expo-router": "~4.0.17",
28+
"expo-sharing": "~13.0.1",
29+
"expo-splash-screen": "~0.29.21",
30+
"expo-status-bar": "~2.0.1",
3131
"react": "18.3.1",
3232
"react-dom": "18.3.1",
33-
"react-native": "0.76.5",
33+
"react-native": "0.76.6",
3434
"react-native-gesture-handler": "~2.20.2",
3535
"react-native-reanimated": "~3.16.1",
3636
"react-native-safe-area-context": "4.12.0",

‎examples/ExpoMessaging/yarn.lock‎

Lines changed: 342 additions & 102 deletions
Large diffs are not rendered by default.

‎examples/SampleApp/CHANGELOG.md‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,17 @@
11
# Change Log
22

3+
## [2.2.0](https://github.com/GetStream/stream-chat-react-native/compare/[email protected]@v2.2.0) (2025-01-27)
4+
5+
6+
### Features
7+
8+
* enable swipe to reply for message bubble ([#2892](https://github.com/GetStream/stream-chat-react-native/issues/2892)) ([9c37c25](https://github.com/GetStream/stream-chat-react-native/commit/9c37c253f602892fb6b58c90ce2d92764620e174))
9+
10+
11+
### Bug Fixes
12+
13+
* add latest version >11.2.6 compatibility for op-sqlite ([#2899](https://github.com/GetStream/stream-chat-react-native/issues/2899)) ([d69b2f6](https://github.com/GetStream/stream-chat-react-native/commit/d69b2f674ccc05302e275794bd2599289938f1ca))
14+
315
## [2.1.0](https://github.com/GetStream/stream-chat-react-native/compare/[email protected]@v2.1.0) (2024-12-24)
416

517

‎examples/SampleApp/ios/Podfile.lock‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2164,7 +2164,7 @@ PODS:
21642164
- libwebp (~> 1.0)
21652165
- SDWebImage/Core (~> 5.10)
21662166
- SocketRocket (0.7.1)
2167-
- stream-chat-react-native (6.1.1):
2167+
- stream-chat-react-native (6.2.0):
21682168
- DoubleConversion
21692169
- glog
21702170
- hermes-engine
@@ -2576,7 +2576,7 @@ SPEC CHECKSUMS:
25762576
SDWebImage: a7f831e1a65eb5e285e3fb046a23fcfbf08e696d
25772577
SDWebImageWebPCoder: 908b83b6adda48effe7667cd2b7f78c897e5111d
25782578
SocketRocket: d4aabe649be1e368d1318fdf28a022d714d65748
2579-
stream-chat-react-native: 2291263a264596cca245917c556064949dd6b9df
2579+
stream-chat-react-native: 29f9b77cefb31c8c3d96081ea660604826bc3fb1
25802580
Yoga: 7548e4449365bf0ef60db4aefe58abff37fcabec
25812581

25822582
PODFILE CHECKSUM: 4f662370295f8f9cee909f1a4c59a614999a209d

‎examples/SampleApp/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "sampleapp",
3-
"version": "2.1.0",
3+
"version": "2.2.0",
44
"private": true,
55
"repository": {
66
"type": "git",

‎examples/SampleApp/src/ChatUsers.ts‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,8 @@ import { UserResponse } from 'stream-chat';
22
import { StreamChatGenerics } from './types';
33

44
export const USER_TOKENS: Record<string, string> = {
5+
luke_skywalker:
6+
'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyX2lkIjoibHVrZV9za3l3YWxrZXIifQ.kFSLHRB5X62t0Zlc7nwczWUfsQMwfkpylC6jCUZ6Mc0',
57
e2etest1:
68
'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyX2lkIjoiZTJldGVzdDEifQ.XlQOw8nl7fFzHoBkEiTcYGkNo5r7EBYA40LABGOk4hc',
79
e2etest2:
@@ -28,6 +30,9 @@ export const USER_TOKENS: Record<string, string> = {
2830
'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyX2lkIjoicm9kb2xwaGUifQ.tLl-I8ADBhTKB-x5FB9jK4-am0dELLXgydM6VN9rTL8',
2931
};
3032
export const USERS: Record<string, UserResponse<StreamChatGenerics>> = {
33+
luke_skywalker: {
34+
id: 'luke_skywalker',
35+
},
3136
neil: {
3237
id: 'neil',
3338
image: 'https://ca.slack-edge.com/T02RM6X6B-U01173D1D5J-0dead6eea6ea-512',

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

Lines changed: 70 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,8 @@ import {
3333
import { useAppOverlayContext } from '../context/AppOverlayContext';
3434
import { useBottomSheetOverlayContext } from '../context/BottomSheetOverlayContext';
3535
import { useChannelInfoOverlayContext } from '../context/ChannelInfoOverlayContext';
36+
import { Archieve } from '../icons/Archieve';
37+
import { Pin } from '../icons/Pin';
3638

3739
dayjs.extend(relativeTime);
3840

@@ -111,7 +113,7 @@ export const ChannelInfoOverlay = (props: ChannelInfoOverlayProps) => {
111113
const halfScreenHeight = vh(50);
112114
const width = vw(100) - 60;
113115

114-
const { channel, clientId, navigation } = data || {};
116+
const { channel, clientId, membership, navigation } = data || {};
115117

116118
const {
117119
theme: {
@@ -361,6 +363,73 @@ export const ChannelInfoOverlay = (props: ChannelInfoOverlayProps) => {
361363
<Text style={[styles.rowText, { color: black }]}>View info</Text>
362364
</View>
363365
</TapGestureHandler>
366+
<TapGestureHandler
367+
onHandlerStateChange={async ({ nativeEvent: { state } }) => {
368+
if (state === State.END) {
369+
try {
370+
if (membership?.pinned_at) {
371+
await channel.unpin();
372+
} else {
373+
await channel.pin();
374+
}
375+
} catch (error) {
376+
console.log('Error pinning/unpinning channel', error);
377+
}
378+
379+
setOverlay('none');
380+
}
381+
}}
382+
>
383+
<View
384+
style={[
385+
styles.row,
386+
{
387+
borderTopColor: border,
388+
},
389+
]}
390+
>
391+
<View style={styles.rowInner}>
392+
<Pin height={24} width={24} />
393+
</View>
394+
<Text style={[styles.rowText, { color: black }]}>
395+
{membership?.pinned_at ? 'Unpin' : 'Pin'}
396+
</Text>
397+
</View>
398+
</TapGestureHandler>
399+
<TapGestureHandler
400+
onHandlerStateChange={async ({ nativeEvent: { state } }) => {
401+
if (state === State.END) {
402+
try {
403+
if (membership?.archived_at) {
404+
await channel.unarchive();
405+
} else {
406+
await channel.archive();
407+
}
408+
} catch (error) {
409+
console.log('Error archiving/unarchiving channel', error);
410+
}
411+
412+
setOverlay('none');
413+
}
414+
}}
415+
>
416+
<View
417+
style={[
418+
styles.row,
419+
{
420+
borderTopColor: border,
421+
},
422+
]}
423+
>
424+
<View style={styles.rowInner}>
425+
<Archieve height={24} width={24} />
426+
</View>
427+
<Text style={[styles.rowText, { color: black }]}>
428+
{membership?.archived_at ? 'Unarchieve' : 'Archieve'}
429+
</Text>
430+
</View>
431+
</TapGestureHandler>
432+
364433
{otherMembers.length > 1 && (
365434
<TapGestureHandler
366435
onHandlerStateChange={({ nativeEvent: { state } }) => {

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

Lines changed: 40 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,12 +2,16 @@ import React from 'react';
22
import { StyleSheet, View } from 'react-native';
33
import { useNavigation } from '@react-navigation/native';
44
import { RectButton } from 'react-native-gesture-handler';
5-
import Swipeable from 'react-native-gesture-handler/Swipeable';
5+
import Swipeable from 'react-native-gesture-handler/ReanimatedSwipeable';
66
import {
77
ChannelPreviewMessenger,
88
ChannelPreviewMessengerProps,
9+
ChannelPreviewStatus,
10+
ChannelPreviewStatusProps,
911
Delete,
1012
MenuPointHorizontal,
13+
Pin,
14+
useChannelMembershipState,
1115
useChatContext,
1216
useTheme,
1317
} from 'stream-chat-react-native';
@@ -19,6 +23,7 @@ import { useChannelInfoOverlayContext } from '../context/ChannelInfoOverlayConte
1923
import type { StackNavigationProp } from '@react-navigation/stack';
2024

2125
import type { StackNavigatorParamList, StreamChatGenerics } from '../types';
26+
import { ChannelState } from 'stream-chat';
2227

2328
const styles = StyleSheet.create({
2429
leftSwipeableButton: {
@@ -35,13 +40,37 @@ const styles = StyleSheet.create({
3540
alignItems: 'center',
3641
flexDirection: 'row',
3742
},
43+
statusContainer: {
44+
display: 'flex',
45+
flexDirection: 'row',
46+
},
47+
pinIconContainer: {
48+
marginLeft: 8,
49+
},
3850
});
3951

4052
type ChannelListScreenNavigationProp = StackNavigationProp<
4153
StackNavigatorParamList,
4254
'ChannelListScreen'
4355
>;
4456

57+
const CustomChannelPreviewStatus = (
58+
props: ChannelPreviewStatusProps & { membership: ChannelState['membership'] },
59+
) => {
60+
const { membership } = props;
61+
62+
return (
63+
<View style={styles.statusContainer}>
64+
<ChannelPreviewStatus {...props} />
65+
{membership.pinned_at && (
66+
<View style={styles.pinIconContainer}>
67+
<Pin size={24} />
68+
</View>
69+
)}
70+
</View>
71+
);
72+
};
73+
4574
export const ChannelPreview: React.FC<ChannelPreviewMessengerProps<StreamChatGenerics>> = (
4675
props,
4776
) => {
@@ -57,6 +86,8 @@ export const ChannelPreview: React.FC<ChannelPreviewMessengerProps<StreamChatGen
5786

5887
const navigation = useNavigation<ChannelListScreenNavigationProp>();
5988

89+
const membership = useChannelMembershipState(channel);
90+
6091
const {
6192
theme: {
6293
colors: { accent_red, white_smoke },
@@ -75,7 +106,7 @@ export const ChannelPreview: React.FC<ChannelPreviewMessengerProps<StreamChatGen
75106
<View style={[styles.swipeableContainer, { backgroundColor: white_smoke }]}>
76107
<RectButton
77108
onPress={() => {
78-
setData({ channel, clientId: client.userID, navigation });
109+
setData({ channel, clientId: client.userID, membership, navigation });
79110
setOverlay('channelInfo');
80111
}}
81112
style={[styles.leftSwipeableButton]}
@@ -104,7 +135,13 @@ export const ChannelPreview: React.FC<ChannelPreviewMessengerProps<StreamChatGen
104135
</View>
105136
)}
106137
>
107-
<ChannelPreviewMessenger {...props} />
138+
<ChannelPreviewMessenger
139+
{...props}
140+
// eslint-disable-next-line react/no-unstable-nested-components
141+
PreviewStatus={(statusProps) => (
142+
<CustomChannelPreviewStatus {...statusProps} membership={membership} />
143+
)}
144+
/>
108145
</Swipeable>
109146
);
110147
};

‎examples/SampleApp/src/components/MessageSearch/MessageSearchList.tsx‎

Lines changed: 10 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,14 @@
11
import React from 'react';
22
import { FlatList, StyleSheet, Text, TouchableOpacity, View } from 'react-native';
3-
import { useNavigation } from '@react-navigation/native';
3+
import { NavigationProp, useNavigation } from '@react-navigation/native';
44
import dayjs from 'dayjs';
55
import calendar from 'dayjs/plugin/calendar';
66
import { Avatar, Spinner, useTheme, useViewport } from 'stream-chat-react-native';
7-
8-
import { MESSAGE_SEARCH_LIMIT } from '../../hooks/usePaginatedSearchedMessages';
7+
import { DEFAULT_PAGINATION_LIMIT } from '../../utils/constants';
98

109
import type { MessageResponse } from 'stream-chat';
1110

12-
import type { StreamChatGenerics } from '../../types';
11+
import type { StackNavigatorParamList, StreamChatGenerics } from '../../types';
1312

1413
dayjs.extend(calendar);
1514

@@ -46,6 +45,7 @@ const styles = StyleSheet.create({
4645
paddingLeft: 8,
4746
},
4847
title: { fontSize: 14, fontWeight: '700' },
48+
titleContainer: {},
4949
});
5050

5151
export type MessageSearchListProps = {
@@ -74,7 +74,8 @@ export const MessageSearchList: React.FC<MessageSearchListProps> = React.forward
7474
},
7575
} = useTheme();
7676
const { vw } = useViewport();
77-
const navigation = useNavigation();
77+
const navigation =
78+
useNavigation<NavigationProp<StackNavigatorParamList, 'ChannelListScreen'>>();
7879

7980
if (!messages && !refreshing) {
8081
return null;
@@ -92,8 +93,10 @@ export const MessageSearchList: React.FC<MessageSearchListProps> = React.forward
9293
>
9394
<Text style={{ color: grey }}>
9495
{`${
95-
messages.length >= MESSAGE_SEARCH_LIMIT ? MESSAGE_SEARCH_LIMIT : messages.length
96-
}${messages.length >= MESSAGE_SEARCH_LIMIT ? '+ ' : ' '} result${
96+
messages.length >= DEFAULT_PAGINATION_LIMIT
97+
? DEFAULT_PAGINATION_LIMIT
98+
: messages.length
99+
}${messages.length >= DEFAULT_PAGINATION_LIMIT ? '+ ' : ' '} result${
97100
messages.length === 1 ? '' : 's'
98101
}`}
99102
</Text>
@@ -129,8 +132,6 @@ export const MessageSearchList: React.FC<MessageSearchListProps> = React.forward
129132
testID='channel-preview-button'
130133
>
131134
<Avatar
132-
channelId={item.channel?.id}
133-
id={item.user?.id}
134135
image={item.user?.image}
135136
name={item.user?.name}
136137
online={item?.user?.online}

‎examples/SampleApp/src/context/ChannelInfoOverlayContext.tsx‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import React, { useContext, useState } from 'react';
22

3+
import { ChannelState } from 'stream-chat';
34
import type { StackNavigationProp } from '@react-navigation/stack';
45
import type { ChannelContextValue } from 'stream-chat-react-native';
56

@@ -14,6 +15,7 @@ export type ChannelInfoOverlayData = Partial<
1415
Pick<ChannelContextValue<StreamChatGenerics>, 'channel'>
1516
> & {
1617
clientId?: string;
18+
membership?: ChannelState<StreamChatGenerics>['membership'];
1719
navigation?: ChannelListScreenNavigationProp;
1820
};
1921

0 commit comments

Comments
 (0)