Group Chat messages list show infinite spinner

Sendbird Chat UIKit React Native
1

Hi,
trying to use Chat UIkit for react native and it keeps showing a spinner in the message screen (see image)

image
image938×1818 70.7 KB 

"@sendbird/uikit-react-native": "^2.1.0",
"@sendbird/chat": "^4.2.0",

here is my code:

const Chat = () => {
  const { sdk } = useSendbirdChat();
  const { channel, loading } = useGroupChannel(sdk, mid);
  if (!channel || loading) return null;
  return (
    <SendbirdUIKitContainer
      appId={ENV.NX_REACT_APP_CHAT_APP_ID}
      platformServices={{
        file: FileService,
        notification: NotificationService,
        clipboard: ClipboardService,
        media: MediaService,
      }}>
      <GroupChannelFragment
        channel={channel}
        onChannelDeleted={() => {}}
        onPressHeaderLeft={SafeNavigation.goBack}
        onPressHeaderRight={SafeNavigation.goBack}
      />
    </SendbirdUIKitContainer>
  );
};

const Auth = () => {
  const { connect } = useConnection();
  const [user, setUser] = useState<any>();
  const initSendBird = async () => {
    try {
      const _user = await connect(uid, {
        accessToken,
      });
      setUser(_user);
    } catch (error) {
      console.log({ error });
    }
  };
  useEffect(() => {
    initSendBird();
  }, []);
  if (!user) {
    return null;
  }
  return <Chat />;
};

export const ChatScreen = () => {
  return (
    <SendbirdUIKitContainer
      appId={appId}
      chatOptions={{
        localCacheStorage: AsyncStorage,
        enableAutoPushTokenRegistration: true,
        enableChannelListTypingIndicator: true,
        enableChannelListMessageReceiptStatus: true,
      }}
      platformServices={{
        file: FileService,
        notification: NotificationService,
        clipboard: ClipboardService,
        media: MediaService,
      }}>
      <Auth />
    </SendbirdUIKitContainer>
  );
};

any suggestions?

2

FYI we use:
"react-native": "0.70.1",