Split from https://github.com/twentyhq/twenty/pull/4518 - Setup `@ui/*` as an internal alias to reference `twenty-ui/src`. - Configures twenty-front to understand the `@ui/*` alias on development mode, so twenty-ui can be hot reloaded. - When building on production mode, twenty-front needs twenty-ui to be built beforehand (which is automatic with the `dependsOn` option). - Configures twenty-front to understand the `@ui/*` alias when launching tests, so there is no need to re-build twenty-ui for tests. --------- Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>
39 lines
1.2 KiB
TypeScript
39 lines
1.2 KiB
TypeScript
import { FallbackProps } from 'react-error-boundary';
|
||
import { IconRefresh } from 'twenty-ui';
|
||
|
||
import { Button } from '@/ui/input/button/components/Button';
|
||
import AnimatedPlaceholder from '@/ui/layout/animated-placeholder/components/AnimatedPlaceholder';
|
||
import {
|
||
AnimatedPlaceholderEmptyContainer,
|
||
AnimatedPlaceholderEmptySubTitle,
|
||
AnimatedPlaceholderEmptyTextContainer,
|
||
AnimatedPlaceholderEmptyTitle,
|
||
} from '@/ui/layout/animated-placeholder/components/EmptyPlaceholderStyled';
|
||
|
||
type GenericErrorFallbackProps = FallbackProps;
|
||
|
||
export const GenericErrorFallback = ({
|
||
error,
|
||
resetErrorBoundary,
|
||
}: GenericErrorFallbackProps) => {
|
||
return (
|
||
<AnimatedPlaceholderEmptyContainer>
|
||
<AnimatedPlaceholder type="errorIndex" />
|
||
<AnimatedPlaceholderEmptyTextContainer>
|
||
<AnimatedPlaceholderEmptyTitle>
|
||
Server’s on a coffee break
|
||
</AnimatedPlaceholderEmptyTitle>
|
||
<AnimatedPlaceholderEmptySubTitle>
|
||
{error.message}
|
||
</AnimatedPlaceholderEmptySubTitle>
|
||
</AnimatedPlaceholderEmptyTextContainer>
|
||
<Button
|
||
Icon={IconRefresh}
|
||
title="Reload"
|
||
variant={'secondary'}
|
||
onClick={() => resetErrorBoundary()}
|
||
/>
|
||
</AnimatedPlaceholderEmptyContainer>
|
||
);
|
||
};
|