diff --git a/apps/explorer/src/app/components/empty-list/empty-list.tsx b/apps/explorer/src/app/components/empty-list/empty-list.tsx index 89fa5d320..6fd2df7dd 100644 --- a/apps/explorer/src/app/components/empty-list/empty-list.tsx +++ b/apps/explorer/src/app/components/empty-list/empty-list.tsx @@ -8,7 +8,10 @@ export type EmptyListProps = { */ const EmptyList = ({ heading, label }: EmptyListProps) => { return ( -
+
diff --git a/apps/explorer/src/app/routes/assets/index.spec.tsx b/apps/explorer/src/app/routes/assets/index.spec.tsx new file mode 100644 index 000000000..a7bbe8ca8 --- /dev/null +++ b/apps/explorer/src/app/routes/assets/index.spec.tsx @@ -0,0 +1,44 @@ +import { MockedProvider } from '@apollo/client/testing'; +import { render } from '@testing-library/react'; +import { MemoryRouter } from 'react-router-dom'; +import Assets from './index'; +import type { MockedResponse } from '@apollo/client/testing'; +import { ExplorerAssetDocument } from '../../components/links/asset-link/__generated__/Asset'; + +function renderComponent(mock: MockedResponse[]) { + return ( + + + + + + ); +} + +describe('Assets index', () => { + it('Renders loader when loading', async () => { + const mock = { + request: { + query: ExplorerAssetDocument, + }, + result: { + data: {}, + }, + }; + const res = render(renderComponent([mock])); + expect(await res.findByTestId('loader')).toBeInTheDocument(); + }); + + it('Renders EmptyList when loading completes and there are no results', async () => { + const mock = { + request: { + query: ExplorerAssetDocument, + }, + result: { + data: {}, + }, + }; + const res = render(renderComponent([mock])); + expect(await res.findByTestId('emptylist')).toBeInTheDocument(); + }); +});