From 70efcfeaa0603415dd992cb662d8efb960e6e49a Mon Sep 17 00:00:00 2001 From: Armand Philippot Date: Tue, 26 Sep 2023 15:54:28 +0200 Subject: refactor(routes): replace hardcoded routes with constants It makes it easier to change a route if needed and it avoid typo mistakes. I also refactored a bit the concerned files to be complient with the new ESlint config. However, I should rewrite the pages to reduce the number of statements. --- src/pages/404.tsx | 22 ++++--- src/pages/article/[slug].tsx | 65 +++++++++---------- src/pages/blog/index.tsx | 71 ++++++++++++--------- src/pages/blog/page/[number].tsx | 51 +++++++++------ src/pages/contact.tsx | 102 +++++++++++++++++------------ src/pages/cv.tsx | 133 +++++++++++++++++++------------------- src/pages/index.tsx | 129 ++++++++++++++++++------------------- src/pages/mentions-legales.tsx | 36 +++++++---- src/pages/projets/[slug].tsx | 134 ++++++++++++++++++++------------------- src/pages/projets/index.tsx | 37 +++++++---- src/pages/recherche/index.tsx | 54 ++++++++++------ src/pages/sujet/[slug].tsx | 63 +++++++++--------- src/pages/thematique/[slug].tsx | 46 ++++++++------ 13 files changed, 518 insertions(+), 425 deletions(-) (limited to 'src/pages') diff --git a/src/pages/404.tsx b/src/pages/404.tsx index 67daae1..af95a36 100644 --- a/src/pages/404.tsx +++ b/src/pages/404.tsx @@ -1,6 +1,6 @@ -import { GetStaticProps } from 'next'; +import type { GetStaticProps } from 'next'; import Head from 'next/head'; -import { ReactNode } from 'react'; +import type { ReactNode } from 'react'; import { useIntl } from 'react-intl'; import { getLayout, @@ -15,11 +15,12 @@ import { getTotalThematics, getTotalTopics, } from '../services/graphql'; -import { - type NextPageWithLayout, - type RawThematicPreview, - type RawTopicPreview, +import type { + NextPageWithLayout, + RawThematicPreview, + RawTopicPreview, } from '../types'; +import { ROUTES } from '../utils/constants'; import { getLinksListItems, getPageLinkFromRawData } from '../utils/helpers'; import { loadTranslation, type Messages } from '../utils/helpers/server'; import { useBreadcrumb, useSettings } from '../utils/hooks'; @@ -52,12 +53,12 @@ const Error404Page: NextPageWithLayout = ({ description: 'Error404Page: page body', }, { - link: (chunks: ReactNode) => {chunks}, + link: (chunks: ReactNode) => {chunks}, } ); const { items: breadcrumbItems, schema: breadcrumbSchema } = useBreadcrumb({ title, - url: `/404`, + url: ROUTES.NOT_FOUND, }); const pageTitle = intl.formatMessage( { @@ -88,6 +89,7 @@ const Error404Page: NextPageWithLayout = ({ <> {pageTitle} + {/*eslint-disable-next-line react/jsx-no-literals -- Name allowed */} = ({ breadcrumbSchema={breadcrumbSchema} widgets={[ @@ -106,6 +109,7 @@ const Error404Page: NextPageWithLayout = ({ level={2} />, getPageLinkFromRawData(topic, 'topic')) @@ -123,7 +127,7 @@ const Error404Page: NextPageWithLayout = ({ id: 'XKy7rx', })}

- + ); diff --git a/src/pages/article/[slug].tsx b/src/pages/article/[slug].tsx index f564f35..9ecd8e1 100644 --- a/src/pages/article/[slug].tsx +++ b/src/pages/article/[slug].tsx @@ -1,9 +1,10 @@ -import { GetStaticPaths, GetStaticProps } from 'next'; +/* eslint-disable max-statements */ +import type { ParsedUrlQuery } from 'querystring'; +import type { GetStaticPaths, GetStaticProps } from 'next'; import Head from 'next/head'; import { useRouter } from 'next/router'; import Script from 'next/script'; -import { ParsedUrlQuery } from 'querystring'; -import { HTMLAttributes } from 'react'; +import type { HTMLAttributes } from 'react'; import { useIntl } from 'react-intl'; import { ButtonLink, @@ -21,11 +22,8 @@ import { getArticleBySlug, } from '../../services/graphql'; import styles from '../../styles/pages/article.module.scss'; -import { - type Article, - type NextPageWithLayout, - type SingleComment, -} from '../../types'; +import type { Article, NextPageWithLayout, SingleComment } from '../../types'; +import { ROUTES } from '../../utils/constants'; import { getBlogSchema, getSchemaJson, @@ -66,17 +64,17 @@ const ArticlePage: NextPageWithLayout = ({ fallback: comments, }); const { items: breadcrumbItems, schema: breadcrumbSchema } = useBreadcrumb({ - title: article?.title || '', - url: `/article/${slug}`, + title: article?.title ?? '', + url: `${ROUTES.ARTICLE}/${slug}`, }); - const readingTime = useReadingTime(article?.meta.wordsCount || 0, true); + const readingTime = useReadingTime(article?.meta.wordsCount ?? 0, true); const { website } = useSettings(); const prismPlugins: OptionalPrismPlugin[] = ['command-line', 'line-numbers']; const { attributes, className } = usePrism({ plugins: prismPlugins }); - if (isFallback) return ; + if (isFallback || !article) return ; - const { content, id, intro, meta, title } = article!; + const { content, id, intro, meta, title } = article; const { author, commentsCount, cover, dates, seo, thematics, topics } = meta; const headerMeta: PageLayoutProps['headerMeta'] = { @@ -87,13 +85,13 @@ const ArticlePage: NextPageWithLayout = ({ ? { date: dates.update } : undefined, readingTime, - thematics: - thematics && - thematics.map((thematic) => ( - - {thematic.name} - - )), + thematics: thematics + ? thematics.map((thematic) => ( + + {thematic.name} + + )) + : undefined, }; const footerMetaLabel = intl.formatMessage({ @@ -105,13 +103,11 @@ const ArticlePage: NextPageWithLayout = ({ const footerMeta: PageLayoutProps['footerMeta'] = { custom: topics && { label: footerMetaLabel, - value: topics.map((topic) => { - return ( - - {topic.logo && } {topic.name} - - ); - }), + value: topics.map((topic) => ( + + {topic.logo ? : null} {topic.name} + + )), }, }; @@ -160,7 +156,7 @@ const ArticlePage: NextPageWithLayout = ({ */ const prismClassNameReplacer = (str: string): string => { const wpBlockClassName = 'wp-block-code'; - const languageArray = str.match(/language-[^\s|"]+/); + const languageArray = /language-[^\s|"]+/.exec(str); const languageClassName = languageArray ? `${languageArray[0]}` : ''; if ( @@ -184,15 +180,19 @@ const ArticlePage: NextPageWithLayout = ({ <> {seo.title} + {/*eslint-disable-next-line react/jsx-no-literals -- Name allowed */} - + + {/*eslint-disable-next-line react/jsx-no-literals -- Content allowed */}