Support getInitialProps to translate 500 error page

[dohomi]

Is your feature request related to a problem? Please describe.

Currently it is not possible to use serverSideTranslations in combination with getInitialProps to translate 500 error messages.

Additional context

If I try to use getInitialProps serverSideTranslations I receive following error:

ModuleNotFoundError: Module not found: Error: Can't resolve 'fs' 

// pages/500.js
export default function Error({ err }) {
  return <div>Error happened..</div>
}

export const getInitialProps = async ({ locale, err }) => {
  return {
    err,
    ...(await serverSideTranslations(locale, ['common', 'layout']))
  }
}

[dohomi]

Ok I solved it on a second attempt, in case anyone bumps into it here my _error.tsx page:

import { GetStaticProps, NextPage } from 'next'
import { serverSideTranslations } from 'next-i18next/serverSideTranslations'

const Error: NextPage<{ statusCode?: number }> = ({ statusCode }) => {
  return (
    <>
      <div>
        {statusCode
          ? `An error ${statusCode} occurred on server`
          : 'An error occurred on client'}
      </div>
    </>
  )
}

Error.getInitialProps = async ({ err, res }) => {
  // eslint-disable-next-line no-nested-ternary
  const statusCode = res ? res.statusCode : err ? err.statusCode : 404
  return { statusCode }
}
export const getStaticProps: GetStaticProps = async ({ locale }) => ({
  props: {
    ...(await serverSideTranslations(locale, ['common', 'layout']))
  }
})

export default Error

[mercteil]

Which is weird, because Next.js instantly tells me I am not able to use getInitProps AND getStaticProps within a page component.