LaconicNetwork/vega-frontend-monorepo
4
0
Fork 0
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity

fix(trading): update async renderer on error (#2842)

Browse Source
This commit is contained in:
m.ray 2023-02-03 11:52:10 -05:00 committed by GitHub
parent 7f1e47d7fd
commit 44d6d931d5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 60 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
libs/orders/src/lib/components/order-list-manager/order-list-manager.spec.tsx
View File

@ -19,7 +19,8 @@ const generateJsx = () => {
); );
}; };
it('Renders a loading state while awaiting orders', async () => { describe('OrderListManager', () => {
it('should render a loading state while awaiting orders', async () => {
jest.spyOn(useDataProviderHook, 'useDataProvider').mockReturnValue({ jest.spyOn(useDataProviderHook, 'useDataProvider').mockReturnValue({
data: [], data: [],
loading: true, loading: true,
@ -35,10 +36,10 @@ it('Renders a loading state while awaiting orders', async () => {
expect(screen.getByText('Loading...')).toBeInTheDocument(); expect(screen.getByText('Loading...')).toBeInTheDocument();
}); });
it('Renders an error state', async () => { it('should render an error state', async () => {
const errorMsg = 'Oops! An Error'; const errorMsg = 'Oops! An Error';
jest.spyOn(useDataProviderHook, 'useDataProvider').mockReturnValue({ jest.spyOn(useDataProviderHook, 'useDataProvider').mockReturnValue({
data: [], data: null,
loading: false, loading: false,
error: new Error(errorMsg), error: new Error(errorMsg),
flush: jest.fn(), flush: jest.fn(),
@ -54,8 +55,8 @@ it('Renders an error state', async () => {
).toBeInTheDocument(); ).toBeInTheDocument();
}); });
it('Renders the order list if orders provided', async () => { it('should render the order list if orders provided', async () => {
// @ts-ignore Orderlist is read only but we need to override with the forwardref to // @ts-ignore OrderList is read only but we need to override with the forwardRef to
// avoid warnings about padding refs // avoid warnings about padding refs
orderListMock.OrderListTable = forwardRef(() => <div>OrderList</div>); orderListMock.OrderListTable = forwardRef(() => <div>OrderList</div>);
jest.spyOn(useDataProviderHook, 'useDataProvider').mockReturnValue({ jest.spyOn(useDataProviderHook, 'useDataProvider').mockReturnValue({
@ -72,3 +73,4 @@ it('Renders the order list if orders provided', async () => {
}); });
expect(await screen.findByText('OrderList')).toBeInTheDocument(); expect(await screen.findByText('OrderList')).toBeInTheDocument();
}); });
});

4
libs/ui-toolkit/src/components/async-renderer/async-renderer.tsx
View File

@ -1,6 +1,7 @@
import { Splash } from '../splash'; import { Splash } from '../splash';
import type { ReactNode } from 'react'; import type { ReactNode } from 'react';
import { t } from '@vegaprotocol/react-helpers'; import { t } from '@vegaprotocol/react-helpers';
import * as Sentry from '@sentry/react';
interface AsyncRendererProps<T> { interface AsyncRendererProps<T> {
loading: boolean; loading: boolean;
@ -26,6 +27,8 @@ export function AsyncRenderer<T = object>({
render, render,
}: AsyncRendererProps<T>) { }: AsyncRendererProps<T>) {
if (error) { if (error) {
Sentry.captureException(`Error rendering data: ${error.message}`);
if (!data) {
return ( return (
<Splash> <Splash>
{errorMessage {errorMessage
@ -34,6 +37,7 @@ export function AsyncRenderer<T = object>({
</Splash> </Splash>
); );
} }
}
if (loading) { if (loading) {
return <Splash>{loadingMessage ? loadingMessage : t('Loading...')}</Splash>; return <Splash>{loadingMessage ? loadingMessage : t('Loading...')}</Splash>;