[🐛] Unwanted channels are created with different multiple users

[Harsh2110mishra]

Issue

Unwated channels are created with different other users when any user creates a messaging channel with one user. Let's assume if user A sends a message to user B, User A sends message to user C now if user B opens messages screen to read message sent by user A then user C will get multiple channels with User A and User C. Now, user C can also read the conversations of User A and User B as it is included in channels through this bug.

Steps to reproduce

Steps to reproduce the behavior:

1. Send message to any user B.
2. Send message to any user C.
3. Now, User C can read messages between User A and User B.

Expected behavior

Users can read or send messages to only user they wanted to.

Project Related Information

Customization

Click To Expand

```typescript jsx # ChannelList ```

Offline support

• [] I have enabled offline support.
• [] The feature I'm having does not occur when offline support is disabled. (stripe out if not applicable)

Environment

Click To Expand

#### `package.json`: ```json # "stream-chat": "^8.2.1", # "stream-chat-react-native": "^5.24.0" ``` **`react-native info` output:** ``` System: OS: macOS 11.7.8 CPU: (4) x64 Intel(R) Core(TM) i5-5350U CPU @ 1.80GHz Memory: 43.59 MB / 8.00 GB Shell: 5.8 - /bin/zsh Binaries: Node: 14.21.3 - /usr/local/opt/node@14/bin/node Yarn: Not Found npm: 6.14.18 - /usr/local/opt/node@14/bin/npm Watchman: 2023.05.22.00 - /usr/local/bin/watchman Managers: CocoaPods: 1.12.1 - /usr/local/bin/pod SDKs: iOS SDK: Platforms: DriverKit 21.2, iOS 15.2, macOS 12.1, tvOS 15.2, watchOS 8.3 Android SDK: Not Found IDEs: Android Studio: 2022.2 AI-222.4459.24.2221.10121639 Xcode: 13.2.1/13C100 - /usr/bin/xcodebuild Languages: Java: 17.0.7 - /usr/bin/javac npmPackages: @react-native-community/cli: Not Found react: 18.1.0 => 18.1.0 react-native: 0.70.4 => 0.70.4 react-native-macos: Not Found npmGlobalPackages: *react-native*: Not Found info React Native v0.73.4 is now available (your project is running on v0.70.4). ``` - **Platform that you're experiencing the issue on**: - [x] iOS - [x] Android - [ ] **iOS** but have not tested behavior on Android - [ ] **Android** but have not tested behavior on iOS - [x] Both - **`stream-chat-react-native` version you're using that has this issue:** - `^5.24.0` - Device/Emulator info: - [x] I am using a physical device - OS version: `Android 11` - Device/Emulator: `iPhone 13`

Additional context

I have tested this issue with different version of stream-chat-react-native library but still issue persists. I have shared my code for the suggestion if I am doing something wrong.

Code:

export default function Messages({ route, navigation }) {
  let uid = null;

// To get UID so that channel can be created between two users.
  if (route?.params?.uid) {
    uid = route.params.uid;
  }
  const { userData, chat } = useContext(AuthContext);
  const [userInfo] = userData;
  const [, setChatData] = chat;

  const [loading, setLoading] = useState();
  const [channelCreated, setIsChannelCreated] = useState(null);

// Below code is when user start a first conversation with new user
  useEffect(() => {
    try {
      setChatData({ data: null });
      const connectUsersForChat = async () => {
        const chatChannel = clientInstance.channel("messaging", {
          members: [userInfo?.data?._id, uid],
        });
        await chatChannel.watch();
        setIsChannelCreated(chatChannel);
      };
      if (uid) {
        setLoading(true);
        connectUsersForChat();
        setLoading(false);
      }
    } catch (err) {
      componentErrorHandler("messages", "connectUsersForChat", err);
    }
  }, [setChatData, uid, userInfo?.data?._id, userInfo?.data.uid]);

  return (
    <GestureHandlerRootView style={{ flex: 1 }}>
      <OverlayProvider>
        <ChatComponenet client={clientInstance}>
// Once channel created with new user then it will redirect to chat screen
          {channelCreated ? (          
// if already created channel is selected by user then it will take channel info which is already set by below code
            (navigation.navigate("Chat", {
              channel: channelCreated,
              uid,
            }),
            setIsChannelCreated(null))
          ) : (
// If user selects a already created channel
            <ChannelList
              onSelect={(channel) => {
        // THIS IS WHERE ISSUE OCCURS
        // Channel will be set in hook and user will be redirected to chat screen with channel object
                setIsChannelCreated(channel);
              }}
            />
          )}
        </ChatComponenet>
      </OverlayProvider>
    </GestureHandlerRootView>
  );
}

Screenshots

Click To Expand


---

[khushal87]

Hey @Harsh2110mishra, do you have any filters added to the Channel List? If you have filters this behaviour should not ideally occur.

[khushal87]

Hey @Harsh2110mishra, did the above solution work for you?

[Harsh2110mishra]

Hi @khushal87 How can I apply filters in above code? As you can I don't have the access to uid which I used to create a channel for two users when current user open messages.js screen.

I have only access to current user id i.e userInfo?.data?._id.

<ChannelList
/** I don't have the access to uid here*/
              onSelect={(channel) => {
        // THIS IS WHERE ISSUE OCCURS
        // Channel will be set in hook and user will be redirected to chat screen with channel object
                setIsChannelCreated(channel);
              }}
            />

[Harsh2110mishra]

@khushal87 what if I pass only current user id in filter? Does it resolve the above issue?

like this:

  const filter = {
    type: "messaging",
    members: { $in: [`${userInfo?.data?._id}`] },
  };

[khushal87]

Hey @Harsh2110mishra, passing the filter with the appropriate user id shall solve your issue.

Does it resolve the above issue?

Please test it on your end and let us know.

[Harsh2110mishra]

Yes, it's working. @khushal87