import { Heading, Text } from 'components/common';

export const ErrorScreen = ({
  message = 'Error!',
  children,
}: {
  message?: string;
  children?: React.ReactNode;
}) => {
  return (
    <div className="h100 flex flexColumn alignCenter justifyCenter">
      <div>
        <Heading size="xl" align="center" className="marginY4">
          {message}
        </Heading>
        {children && <Text align="center">{children}</Text>}
      </div>
    </div>
  );
};