diff options
| author | Armand Philippot <git@armandphilippot.com> | 2022-01-29 19:03:59 +0100 |
|---|---|---|
| committer | Armand Philippot <git@armandphilippot.com> | 2022-01-29 19:03:59 +0100 |
| commit | 8fb5e4ef3ae925ebc6622711fb5c8c6147642cbc (patch) | |
| tree | 9e99137a7b64ea7993a8311a7162336a551be8b2 /src/pages/projets.tsx | |
| parent | 2bae7c43764df5678fe2fc2e68be11ae95d85a41 (diff) | |
| parent | e4d5b8151802517b2943756fc0d09ffa95e2c4e2 (diff) | |
feat(i18n): replace linguijs with formatjs
Diffstat (limited to 'src/pages/projets.tsx')
| -rw-r--r-- | src/pages/projets.tsx | 34 |
1 files changed, 25 insertions, 9 deletions
diff --git a/src/pages/projets.tsx b/src/pages/projets.tsx index 4359721..da4523c 100644 --- a/src/pages/projets.tsx +++ b/src/pages/projets.tsx @@ -1,19 +1,20 @@ import { getLayout } from '@components/Layouts/Layout'; import PostHeader from '@components/PostHeader/PostHeader'; import ProjectsList from '@components/ProjectsList/ProjectsList'; -import { seo } from '@config/seo'; import { config } from '@config/website'; import PageContent, { meta } from '@content/pages/projects.mdx'; import styles from '@styles/pages/Projects.module.scss'; import { Project } from '@ts/types/app'; -import { defaultLocale, loadTranslation } from '@utils/helpers/i18n'; +import { loadTranslation } from '@utils/helpers/i18n'; import { getSortedProjects } from '@utils/helpers/projects'; import { GetStaticProps, GetStaticPropsContext } from 'next'; import Head from 'next/head'; import { useRouter } from 'next/router'; +import { useIntl } from 'react-intl'; import { Article, Graph, WebPage } from 'schema-dts'; const Projects = ({ projects }: { projects: Project[] }) => { + const intl = useIntl(); const dates = { publication: meta.publishedOn, update: meta.updatedOn, @@ -22,13 +23,28 @@ const Projects = ({ projects }: { projects: Project[] }) => { const updateDate = new Date(dates.update); const router = useRouter(); const pageUrl = `${config.url}${router.asPath}`; + const pageTitle = intl.formatMessage( + { + defaultMessage: 'Projects: open-source makings - {websiteName}', + description: 'ProjectsPage: SEO - Page title', + }, + { websiteName: config.name } + ); + const pageDescription = intl.formatMessage( + { + defaultMessage: + 'Discover {websiteName} projects. Mostly related to web development and open source.', + description: 'ProjectsPage: SEO - Meta description', + }, + { websiteName: config.name } + ); const webpageSchema: WebPage = { '@id': `${pageUrl}`, '@type': 'WebPage', breadcrumb: { '@id': `${config.url}/#breadcrumb` }, - name: seo.legalNotice.title, - description: seo.legalNotice.description, + name: pageTitle, + description: pageDescription, inLanguage: config.locales.defaultLocale, license: 'https://creativecommons.org/licenses/by-sa/4.0/deed.fr', reviewedBy: { '@id': `${config.url}/#branding` }, @@ -42,7 +58,7 @@ const Projects = ({ projects }: { projects: Project[] }) => { '@id': `${config.url}/#projects`, '@type': 'Article', name: meta.title, - description: seo.projects.description, + description: pageDescription, author: { '@id': `${config.url}/#branding` }, copyrightYear: publicationDate.getFullYear(), creator: { '@id': `${config.url}/#branding` }, @@ -63,12 +79,12 @@ const Projects = ({ projects }: { projects: Project[] }) => { return ( <> <Head> - <title>{seo.projects.title}</title> - <meta name="description" content={seo.projects.description} /> + <title>{pageTitle}</title> + <meta name="description" content={pageDescription} /> <meta property="og:url" content={`${pageUrl}`} /> <meta property="og:type" content="article" /> <meta property="og:title" content={meta.title} /> - <meta property="og:description" content={seo.projects.description} /> + <meta property="og:description" content={pageDescription} /> <script type="application/ld+json" dangerouslySetInnerHTML={{ __html: JSON.stringify(schemaJsonLd) }} @@ -92,7 +108,7 @@ export const getStaticProps: GetStaticProps = async ( const breadcrumbTitle = meta.title; const { locale } = context; const projects: Project[] = await getSortedProjects(); - const translation = await loadTranslation(locale || defaultLocale); + const translation = await loadTranslation(locale); return { props: { |