404 Page not translated

[samfromaway]

Describe the bug

Main Layout components are not translated on the 404 page.
On the 404 page shared components like header and footer are not translated as there is no way to add ...(await serverSideTranslations(locale, ['common'])), as getServerSideProps and getStaticProps are not allowed, and if I want to use getInitialProps I get an error Can't resolve 'fs' in '/node_modules/next-i18next/dist/commonjs'

Occurs in next-i18next version

"react": "17.0.2",
"next-i18next": "^8.4.0",
"next": "10.2.3"
I configured my next.config.js to use webpack 4

Steps to reproduce

Run a next.js app and add a custom 404 page.
In _app add a component like a footer and try to use the t() when on a 404 page.

Expected behavior

It translates

OS (please complete the following information)

All browsers

Additional context

As it seems from #1040 this is not an unusual bug, but I think it's not really an edge-case. The rest of the migration from v6 to v8 worked fine, but because of this reason. I can't use v8.

I don't know if the problem is because next-i18next says that the issue of next.js that they don't use getStatic/getServerSideProps in 404 and 500 pages. Or if the issue is that getInitialProps should work with ...(await serverSideTranslations(locale, ['common'])), and it doesn't. Or if the issue is something different. Maybe this issue could also be resolved by providing ...(await serverSideTranslations(locale, ['common'])), globaly for all pages (like proposed in other issues).

BTW thanks for the otherwise great project.

Any idea why this issue is and how to solve it?

[isaachinman]

This was updated recently – you can use getStaticProps in custom error pages. Good luck!

[samfromaway]

@isaachinman Ah great, it works thanks a lot especially to be that responsive. You made my day!