60 lines
1.3 KiB
TypeScript
60 lines
1.3 KiB
TypeScript
/**
|
|
* External dependencies
|
|
*/
|
|
import ErrorPlaceholder, {
|
|
ErrorObject,
|
|
} from '@woocommerce/editor-components/error-placeholder';
|
|
import type { Block } from '@wordpress/blocks';
|
|
import { ComponentType } from 'react';
|
|
|
|
/**
|
|
* Internal dependencies
|
|
*/
|
|
import { BLOCK_NAMES } from './constants';
|
|
import { getClassPrefixFromName } from './utils';
|
|
|
|
interface APIErrorRequiredProps {
|
|
error: ErrorObject;
|
|
isLoading: boolean;
|
|
name: string;
|
|
}
|
|
|
|
interface APIErrorProductProps extends APIErrorRequiredProps {
|
|
getCategory: never;
|
|
getProduct(): void;
|
|
}
|
|
|
|
interface APIErrorCategoryProps extends APIErrorRequiredProps {
|
|
getCategory(): void;
|
|
getProduct: never;
|
|
}
|
|
|
|
type APIErrorProps< T extends Block > =
|
|
| ( T & APIErrorProductProps )
|
|
| ( T & APIErrorCategoryProps );
|
|
|
|
export const withApiError = < T extends Block >(
|
|
Component: ComponentType< T >
|
|
) => ( props: APIErrorProps< T > ) => {
|
|
const { error, isLoading, name } = props;
|
|
|
|
const className = getClassPrefixFromName( name );
|
|
const onRetry =
|
|
name === BLOCK_NAMES.featuredCategory
|
|
? props.getCategory
|
|
: props.getProduct;
|
|
|
|
if ( error ) {
|
|
return (
|
|
<ErrorPlaceholder
|
|
className={ `${ className }-error` }
|
|
error={ error }
|
|
isLoading={ isLoading }
|
|
onRetry={ onRetry }
|
|
/>
|
|
);
|
|
}
|
|
|
|
return <Component { ...props } />;
|
|
};
|