import PageTitle from '@app/components/Common/PageTitle'; import type { Undefinable } from '@app/utils/typeHelpers'; import { ArrowRightCircleIcon } from '@heroicons/react/24/outline'; import type { NextPage } from 'next'; import Link from 'next/link'; import { defineMessages, useIntl } from 'react-intl'; interface ErrorProps { statusCode?: number; } const messages = defineMessages({ errormessagewithcode: '{statusCode} - {error}', internalservererror: 'Internal Server Error', serviceunavailable: 'Service Unavailable', somethingwentwrong: 'Something Went Wrong', oops: 'Oops', returnHome: 'Return Home', }); const Error: NextPage = ({ statusCode }) => { const intl = useIntl(); const getErrorMessage = (statusCode?: number) => { switch (statusCode) { case 500: return intl.formatMessage(messages.internalservererror); case 503: return intl.formatMessage(messages.serviceunavailable); default: return statusCode ? intl.formatMessage(messages.somethingwentwrong) : intl.formatMessage(messages.oops); } }; return (
{statusCode ? intl.formatMessage(messages.errormessagewithcode, { statusCode, error: getErrorMessage(statusCode), }) : getErrorMessage(statusCode)}
{intl.formatMessage(messages.returnHome)}
); }; Error.getInitialProps = async ({ res, err }): Promise => { // Apologies for how gross ternary is but this is just temporary. Honestly, // blame the nextjs docs let statusCode: Undefinable; if (res) { statusCode = res.statusCode; } else { statusCode = err ? err.statusCode : undefined; } return { statusCode }; }; export default Error;