diff --git a/src/components/Channel/Channel.tsx b/src/components/Channel/Channel.tsx index e962dfd2e..4e9d8db41 100644 --- a/src/components/Channel/Channel.tsx +++ b/src/components/Channel/Channel.tsx @@ -192,7 +192,7 @@ const UnMemoizedChannel = (props: PropsWithChildren) => { ); } - if (channelsQueryState.error && LoadingErrorIndicator) { + if (channelsQueryState.error && !channel && LoadingErrorIndicator) { return ( @@ -200,7 +200,7 @@ const UnMemoizedChannel = (props: PropsWithChildren) => { ); } - if (channelsQueryState.error) { + if (channelsQueryState.error && !channel) { return ; } diff --git a/src/components/Channel/__tests__/Channel.test.tsx b/src/components/Channel/__tests__/Channel.test.tsx index ce720891d..1b80ef1d2 100644 --- a/src/components/Channel/__tests__/Channel.test.tsx +++ b/src/components/Channel/__tests__/Channel.test.tsx @@ -380,7 +380,7 @@ describe('Channel', () => { await waitFor(() => expect(asFragment()).toMatchSnapshot()); }); - it('should render empty channel container if channels query failed', async () => { + it('should render empty channel container if channels query failed and no channel is available', async () => { const childrenContent = 'Channel children'; const { asFragment } = render( { await waitFor(() => expect(asFragment()).toMatchSnapshot()); }); + it('should render channel content if channels query failed but channel is available', async () => { + const childrenContent = 'Channel children'; + await channel.watch(); + render( + ({ + channelsQueryState: { + error: new Error('pagination failed'), + queryInProgress: null, + setError: vi.fn(), + setQueryInProgress: vi.fn(), + }, + client: chatClient, + searchController: new SearchController(), + })} + > + {childrenContent} + , + ); + await waitFor(() => expect(screen.getByText(childrenContent)).toBeInTheDocument()); + }); + + it('should render channel content if channels query failed and channel is available even if LoadingErrorIndicator is provided', async () => { + const errMsg = 'Channels query failed'; + const childrenContent = 'Channel children'; + await channel.watch(); + render( + ({ + channelsQueryState: { + error: new Error(errMsg), + queryInProgress: null, + setError: vi.fn(), + setQueryInProgress: vi.fn(), + }, + client: chatClient, + searchController: new SearchController(), + })} + > +
{error.message}
, + }} + > + {childrenContent} +
+
, + ); + await waitFor(() => expect(screen.getByText(childrenContent)).toBeInTheDocument()); + expect(screen.queryByText(errMsg)).not.toBeInTheDocument(); + }); + it('should render provided loading indicator if channels query is in progress', async () => { const childrenContent = 'Channel children'; const loadingText = 'Loading channels'; diff --git a/src/components/Channel/__tests__/__snapshots__/Channel.test.tsx.snap b/src/components/Channel/__tests__/__snapshots__/Channel.test.tsx.snap index 7ddac5a25..8a9debd0b 100644 --- a/src/components/Channel/__tests__/__snapshots__/Channel.test.tsx.snap +++ b/src/components/Channel/__tests__/__snapshots__/Channel.test.tsx.snap @@ -50,7 +50,7 @@ exports[`Channel > should render empty channel container if channel does not hav `; -exports[`Channel > should render empty channel container if channels query failed 1`] = ` +exports[`Channel > should render empty channel container if channels query failed and no channel is available 1`] = `