6124e7d20c
This PR implements Internationalized Routing using formatjs / react-intl. ## Changelog - Updated formatjs to latest version - Remove deprecated babel-react-intl-plugin in favor of babel-formatjs-plugin - Remove server in favour of Internationalized Routing - Added linter with formatjs rules - Refactored JSX - Added missing types - Auto run formtjs script via before hooks - Adjusted readme docs - Added message descriptions - Removed default configs fixes #27870 ## Bug - [x] Related issues linked using `fixes #number` - [ ] Integration tests added - [ ] Errors have helpful link attached, see `contributing.md` ## Feature - [ ] Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR. - [ ] Related issues linked using `fixes #number` - [ ] Integration tests added - [ ] Documentation added - [ ] Telemetry added. In case of a feature if it's used or not. - [ ] Errors have helpful link attached, see `contributing.md` ## Documentation / Examples - [x] Make sure the linting passes
30 lines
751 B
TypeScript
30 lines
751 B
TypeScript
import { FormattedRelativeTime, useIntl } from 'react-intl'
|
|
import Layout from '../components/Layout'
|
|
import loadIntlMessages from '../helper/loadIntlMessages'
|
|
import { InferGetStaticPropsType } from 'next'
|
|
|
|
export async function getStaticProps(ctx) {
|
|
return {
|
|
props: {
|
|
intlMessages: await loadIntlMessages(ctx),
|
|
},
|
|
}
|
|
}
|
|
|
|
type AboutPageProps = InferGetStaticPropsType<typeof getStaticProps>
|
|
|
|
export default function AboutPage(props: AboutPageProps) {
|
|
const intl = useIntl()
|
|
return (
|
|
<Layout
|
|
title={intl.formatMessage({
|
|
defaultMessage: 'About',
|
|
description: 'Nav: About item',
|
|
})}
|
|
>
|
|
<p>
|
|
<FormattedRelativeTime numeric="auto" value={1} unit="hour" />
|
|
</p>
|
|
</Layout>
|
|
)
|
|
}
|