I made a react hook to return the client for this library, and in this hook, I'm also connecting the user.

useEffect((): any => {
  async function getSub() {
    const {
      data: { createSupportChatSubscription },
    } = await getSubscription();
    return createSupportChatSubscription.subscription;
  }

  getSub().then(async (res: ISubscription) => {
    const chatClient = StreamChat.getInstance(process.env.REACT_APP_STREAM_ID as string);

    await chatClient.connectUser(
      { id: currentUser.id, name: currentUser.name },
      res.token.token
    );
    setChannelResponse({
      channelId: res.channelId,
      channelType: res.channelType,
    });
    setClient(chatClient);
  });

  return () => client?.disconnectUser();
}, [getSubscription, client, currentUser.id, currentUser.name, userId]);

when using this hook, I tend to get this warning:

Consecutive calls to connectUser is detected, ideally you should only call this function once in your app.

I'm trying to see if the chat client has anything to check if there's a connection so I don't have to constantly call connectUser.