Skip to content

Next Release #2962

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
khushal87 merged 5 commits into from
Feb 19, 2025
Merged

Next Release #2962

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
c68bc2d
fix: poll vote fallback to id if name not present (#2958)
khushal87 Feb 19, 2025
b117342
perf: do not rerender Channel on poll events (#2959)
isekovanic Feb 19, 2025
51893bb
fix: state break on channel prop update (#2957)
isekovanic Feb 19, 2025
eb86009
fix: use channel.cid instead of id (#2960)
isekovanic Feb 19, 2025
10b4a9d
fix: message content inner container style overflow issue (#2961)
khushal87 Feb 19, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
42 changes: 26 additions & 16 deletions package/src/components/Channel/Channel.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import React, { PropsWithChildren, useCallback, useEffect, useRef, useState } from 'react';
import React, { PropsWithChildren, useCallback, useEffect, useMemo, useRef, useState } from 'react';
import { KeyboardAvoidingViewProps, StyleSheet, Text, View } from 'react-native';

import debounce from 'lodash/debounce';
Expand Down Expand Up @@ -749,24 +749,34 @@ const ChannelWithContext = <
? newMessageStateUpdateThrottleInterval
: stateUpdateThrottleInterval;

const copyChannelState = useRef(
throttle(
() => {
if (channel) {
copyStateFromChannel(channel);
copyMessagesStateFromChannel(channel);
}
},
copyChannelStateThrottlingTime,
throttleOptions,
),
).current;
const copyChannelState = useMemo(
() =>
throttle(
() => {
if (channel) {
copyStateFromChannel(channel);
copyMessagesStateFromChannel(channel);
}
},
copyChannelStateThrottlingTime,
throttleOptions,
),
[channel, copyChannelStateThrottlingTime, copyMessagesStateFromChannel, copyStateFromChannel],
);

const handleEvent: EventHandler<StreamChatGenerics> = (event) => {
if (shouldSyncChannel) {
// Ignore user.watching.start and user.watching.stop events
const ignorableEvents = ['user.watching.start', 'user.watching.stop'];
if (ignorableEvents.includes(event.type)) return;
/**
* Ignore user.watching.start and user.watching.stop as we should not copy the entire state when
* they occur. Also ignore all poll related events since they're being handled in their own
* reactive state and have no business having an effect on the Channel component.
*/
if (
event.type.startsWith('poll.') ||
event.type === 'user.watching.start' ||
event.type === 'user.watching.stop'
)
return;

// If the event is typing.start or typing.stop, set the typing state
const isTypingEvent = event.type === 'typing.start' || event.type === 'typing.stop';
Expand Down
4 changes: 3 additions & 1 deletion package/src/components/Message/MessageSimple/MessageContent.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,7 @@ const styles = StyleSheet.create({
borderTopLeftRadius: 16,
borderTopRightRadius: 16,
borderWidth: 1,
overflow: 'hidden',
},
leftAlignContent: {
justifyContent: 'flex-start',
Expand Down Expand Up @@ -154,6 +155,7 @@ const MessageContentWithContext = <
borderRadiusS,
borderTopLeftRadius,
borderTopRightRadius,
...container
},
containerInner,
replyBorder,
Expand Down Expand Up @@ -251,7 +253,7 @@ const MessageContentWithContext = <
});
}
}}
style={({ pressed }) => ({ opacity: pressed ? 0.5 : 1 })}
style={({ pressed }) => [{ opacity: pressed ? 0.5 : 1 }, container]}
{...additionalPressableProps}
>
<View onLayout={onLayout} style={wrapper}>
Expand Down
11 changes: 6 additions & 5 deletions package/src/components/MessageList/MessageList.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -579,7 +579,7 @@ const MessageListWithContext = <
}
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [rawMessageList, threadList]);
}, [channel, rawMessageList, threadList]);

const goToMessage = async (messageId: string) => {
const indexOfParentInMessageList = processedMessageList.findIndex(
Expand Down Expand Up @@ -1097,12 +1097,13 @@ const MessageListWithContext = <
keyboardShouldPersistTaps='handled'
keyExtractor={keyExtractor}
ListFooterComponent={ListFooterComponent}
ListHeaderComponent={ListHeaderComponent}
/**
if autoscrollToTopThreshold is 10, we scroll to recent if before new list update it was already at the bottom (10 offset or below)
minIndexForVisible = 1 means that beyond item at index 1 will not change position on list updates
minIndexForVisible is not used when autoscrollToTopThreshold = 10
If autoscrollToTopThreshold is 10, we scroll to recent only if before the update, the list was already at the
bottom (10 offset or below).
minIndexForVisible = 1 means that beyond the item at index 1 we will not change the position on list updates,
however it is not used when autoscrollToTopThreshold = 10.
*/
ListHeaderComponent={ListHeaderComponent}
maintainVisibleContentPosition={{
autoscrollToTopThreshold: autoscrollToRecent ? 10 : undefined,
minIndexForVisible: 1,
Expand Down
3 changes: 1 addition & 2 deletions package/src/components/MessageList/hooks/useShouldScrollToRecentOnNewOwnMessage.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -38,8 +38,7 @@ export function useShouldScrollToRecentOnNewOwnMessage<
}
}
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [rawMessageList]);
}, [currentUserId, rawMessageList]);

return isMyOwnNewMessageRef;
}
2 changes: 1 addition & 1 deletion package/src/components/Poll/components/PollResults/PollVote.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,7 @@ export const PollVote = ({ vote }: { vote: PollVoteClass }) => {
<Avatar image={vote.user.image as string} key={vote.id} size={20} />
) : null}
<Text style={[styles.voteUserName, { color: black }, userName]}>
{isAnonymous ? t<string>('Anonymous') : vote.user?.name}
{isAnonymous ? t<string>('Anonymous') : vote.user?.name ?? vote.user?.id}
</Text>
</View>
<Text style={[styles.voteDate, { color: text_low_emphasis }, dateText]}>{dateString}</Text>
Expand Down
40 changes: 28 additions & 12 deletions package/src/components/Thread/__tests__/__snapshots__/Thread.test.js.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -573,9 +573,12 @@ exports[`Thread should match thread snapshot 1`] = `
onResponderTerminationRequest={[Function]}
onStartShouldSetResponder={[Function]}
style={
{
"opacity": 1,
}
[
{
"opacity": 1,
},
{},
]
}
>
<View
Expand All @@ -589,6 +592,7 @@ exports[`Thread should match thread snapshot 1`] = `
"borderTopLeftRadius": 16,
"borderTopRightRadius": 16,
"borderWidth": 1,
"overflow": "hidden",
},
{
"backgroundColor": "#E9EAED",
Expand Down Expand Up @@ -1079,9 +1083,12 @@ exports[`Thread should match thread snapshot 1`] = `
onResponderTerminationRequest={[Function]}
onStartShouldSetResponder={[Function]}
style={
{
"opacity": 1,
}
[
{
"opacity": 1,
},
{},
]
}
>
<View
Expand All @@ -1095,6 +1102,7 @@ exports[`Thread should match thread snapshot 1`] = `
"borderTopLeftRadius": 16,
"borderTopRightRadius": 16,
"borderWidth": 1,
"overflow": "hidden",
},
{
"backgroundColor": "#E9EAED",
Expand Down Expand Up @@ -1623,9 +1631,12 @@ exports[`Thread should match thread snapshot 1`] = `
onResponderTerminationRequest={[Function]}
onStartShouldSetResponder={[Function]}
style={
{
"opacity": 1,
}
[
{
"opacity": 1,
},
{},
]
}
>
<View
Expand All @@ -1639,6 +1650,7 @@ exports[`Thread should match thread snapshot 1`] = `
"borderTopLeftRadius": 16,
"borderTopRightRadius": 16,
"borderWidth": 1,
"overflow": "hidden",
},
{
"backgroundColor": "#E9EAED",
Expand Down Expand Up @@ -2122,9 +2134,12 @@ exports[`Thread should match thread snapshot 1`] = `
onResponderTerminationRequest={[Function]}
onStartShouldSetResponder={[Function]}
style={
{
"opacity": 1,
}
[
{
"opacity": 1,
},
{},
]
}
>
<View
Expand All @@ -2138,6 +2153,7 @@ exports[`Thread should match thread snapshot 1`] = `
"borderTopLeftRadius": 16,
"borderTopRightRadius": 16,
"borderWidth": 1,
"overflow": "hidden",
},
{
"backgroundColor": "#E9EAED",
Expand Down
Loading