rsnext/examples/with-react-intl/pages/_app.js
Darsh Patel a3ffa2e65f
switch to function component with-react-intl example (#14217)
The example was using class-based component for custom _app, switched to functional component approach.


**Sidenote:** The existing code didn't gave an error when navigated to a new page using the navbar
![Screenshot 2020-06-16 at 2 47 52 PM](https://user-images.githubusercontent.com/11258286/84760988-6cbebd80-afe6-11ea-9b7f-98aca7404895.png)
2020-06-16 11:27:20 +00:00

36 lines
787 B
JavaScript

import { createIntl, createIntlCache, RawIntlProvider } from 'react-intl'
// This is optional but highly recommended
// since it prevents memory leak
const cache = createIntlCache()
function MyApp({ Component, pageProps, locale, messages }) {
const intl = createIntl(
{
locale,
messages,
},
cache
)
return (
<RawIntlProvider value={intl}>
<Component {...pageProps} />
</RawIntlProvider>
)
}
MyApp.getInitialProps = async ({ Component, ctx }) => {
let pageProps = {}
const { req } = ctx
const locale = req?.locale ?? ''
const messages = req?.messages ?? {}
if (Component.getInitialProps) {
Object.assign(pageProps, await Component.getInitialProps(ctx))
}
return { pageProps, locale, messages }
}
export default MyApp