import React from 'react' import Head from '../shared/lib/head' import type { NextPageContext } from '../shared/lib/utils' const statusCodes: { [code: number]: string } = { 400: 'Bad Request', 404: 'This page could not be found', 405: 'Method Not Allowed', 500: 'Internal Server Error', } export type ErrorProps = { statusCode: number title?: string withDarkMode?: boolean } function _getInitialProps({ res, err, }: NextPageContext): Promise | ErrorProps { const statusCode = res && res.statusCode ? res.statusCode : err ? err.statusCode! : 404 return { statusCode } } const styles: { [k: string]: React.CSSProperties } = { error: { fontFamily: '-apple-system, BlinkMacSystemFont, Roboto, "Segoe UI", "Fira Sans", Avenir, "Helvetica Neue", "Lucida Grande", sans-serif', height: '100vh', textAlign: 'center', display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center', }, desc: { display: 'inline-block', textAlign: 'left', lineHeight: '49px', height: '49px', verticalAlign: 'middle', }, h1: { display: 'inline-block', margin: 0, marginRight: '20px', padding: '0 23px 0 0', fontSize: '24px', fontWeight: 500, verticalAlign: 'top', lineHeight: '49px', }, h2: { fontSize: '14px', fontWeight: 'normal', lineHeight: '49px', margin: 0, padding: 0, }, } /** * `Error` component used for handling errors. */ export default class Error

extends React.Component

{ static displayName = 'ErrorPage' static getInitialProps = _getInitialProps static origGetInitialProps = _getInitialProps render() { const { statusCode, withDarkMode = true } = this.props const title = this.props.title || statusCodes[statusCode] || 'An unexpected error has occurred' return (

{statusCode ? `${statusCode}: ${title}` : 'Application error: a client-side exception has occurred'}