mirror of
https://github.com/toeverything/AFFiNE.git
synced 2026-02-13 12:55:00 +00:00
56 lines
1.2 KiB
TypeScript
56 lines
1.2 KiB
TypeScript
import { Button, displayFlex, styled } from '@affine/component';
|
|
import { useTranslation } from '@affine/i18n';
|
|
import Head from 'next/head';
|
|
import Image from 'next/legacy/image';
|
|
import { useRouter } from 'next/router';
|
|
import React from 'react';
|
|
|
|
export const StyledContainer = styled('div')(() => {
|
|
return {
|
|
...displayFlex('center', 'center'),
|
|
flexDirection: 'column',
|
|
height: '100vh',
|
|
|
|
img: {
|
|
width: '360px',
|
|
height: '270px',
|
|
},
|
|
p: {
|
|
fontSize: '22px',
|
|
fontWeight: 600,
|
|
margin: '24px 0',
|
|
},
|
|
};
|
|
});
|
|
|
|
export const NotfoundPage = () => {
|
|
const { t } = useTranslation();
|
|
const router = useRouter();
|
|
return (
|
|
<StyledContainer data-testid="notFound">
|
|
<Image alt="404" src="/imgs/invite-error.svg" width={360} height={270} />
|
|
|
|
<p>{t('404 - Page Not Found')}</p>
|
|
<Button
|
|
shape="round"
|
|
onClick={() => {
|
|
router.push('/');
|
|
}}
|
|
>
|
|
{t('Back Home')}
|
|
</Button>
|
|
</StyledContainer>
|
|
);
|
|
};
|
|
|
|
export default function Custom404() {
|
|
return (
|
|
<>
|
|
<Head>
|
|
<title>404 - AFFiNE</title>
|
|
</Head>
|
|
<NotfoundPage></NotfoundPage>
|
|
</>
|
|
);
|
|
}
|