From 0f38aee374029213a47ef7c29bd164093fe63c85 Mon Sep 17 00:00:00 2001 From: Armand Philippot Date: Wed, 15 Nov 2023 12:24:42 +0100 Subject: refactor(hooks): remove useSettings hook It does not make sense to re-export an existing object through a hook. On some pages both the hook and the object was imported... It is better to use the CONFIG (previously settings) object directly and by doing it we avoid potential errors because of conditional hooks. --- src/utils/config.ts | 19 ++++---- src/utils/helpers/rss.ts | 22 ++++----- src/utils/helpers/schema-org.ts | 38 ++++++++-------- src/utils/helpers/server/i18n.ts | 6 +-- src/utils/hooks/index.ts | 1 - src/utils/hooks/use-breadcrumb.ts | 11 +++-- src/utils/hooks/use-settings.tsx | 95 --------------------------------------- 7 files changed, 47 insertions(+), 145 deletions(-) delete mode 100644 src/utils/hooks/use-settings.tsx (limited to 'src/utils') diff --git a/src/utils/config.ts b/src/utils/config.ts index 61a46b4..edd9b2f 100644 --- a/src/utils/config.ts +++ b/src/utils/config.ts @@ -1,10 +1,12 @@ const isStaging = process.env.NEXT_PUBLIC_APP_ENV === 'staging'; -export const settings = { +export const CONFIG = { ackee: { - filename: process.env.NEXT_PUBLIC_ACKEE_FILENAME || 'tracker.js', - siteId: process.env.NEXT_PUBLIC_ACKEE_SITE_ID || '', - url: `https://${process.env.NEXT_PUBLIC_ACKEE_DOMAIN}` || '', + filename: process.env.NEXT_PUBLIC_ACKEE_FILENAME ?? 'tracker.js', + siteId: process.env.NEXT_PUBLIC_ACKEE_SITE_ID ?? '', + url: process.env.NEXT_PUBLIC_ACKEE_DOMAIN + ? `https://${process.env.NEXT_PUBLIC_ACKEE_DOMAIN}` + : '', }, api: { url: isStaging @@ -12,15 +14,12 @@ export const settings = { : process.env.NEXT_PUBLIC_GRAPHQL_API, }, name: 'Armand Philippot', - baseline: { - en: 'Front-end developer', - fr: 'Intégrateur web', - }, + baseline: 'Intégrateur web', copyright: { startYear: '2012', endYear: new Date().getFullYear().toString(), }, - email: process.env.APP_AUTHOR_EMAIL || '', + email: process.env.APP_AUTHOR_EMAIL ?? '', locales: { defaultLocale: 'fr', defaultCountry: 'FR', @@ -31,5 +30,5 @@ export const settings = { url: (isStaging ? process.env.NEXT_PUBLIC_STAGING_APP_URL - : process.env.NEXT_PUBLIC_APP_URL) || '', + : process.env.NEXT_PUBLIC_APP_URL) ?? '', }; diff --git a/src/utils/helpers/rss.ts b/src/utils/helpers/rss.ts index 0381c68..6de60cc 100644 --- a/src/utils/helpers/rss.ts +++ b/src/utils/helpers/rss.ts @@ -5,7 +5,7 @@ import { getTotalArticles, } from '../../services/graphql'; import type { Article } from '../../types'; -import { settings } from '../config'; +import { CONFIG } from '../config'; import { ROUTES } from '../constants'; /** @@ -32,25 +32,25 @@ const getAllArticles = async (): Promise => { */ export const generateFeed = async (): Promise => { const author = { - name: settings.name, + name: CONFIG.name, email: process.env.APP_AUTHOR_EMAIL, - link: settings.url, + link: CONFIG.url, }; - const copyright = `${settings.name} CC BY SA ${settings.copyright.startYear} - ${settings.copyright.endYear}`; - const title = `${settings.name} | ${settings.baseline.fr}`; + const copyright = `${CONFIG.name} CC BY SA ${CONFIG.copyright.startYear} - ${CONFIG.copyright.endYear}`; + const title = `${CONFIG.name} | ${CONFIG.baseline}`; const feed = new Feed({ author, copyright, description: process.env.APP_FEED_DESCRIPTION, feedLinks: { - json: `${settings.url}${ROUTES.RSS}/json`, - atom: `${settings.url}${ROUTES.RSS}/atom`, + json: `${CONFIG.url}${ROUTES.RSS}/json`, + atom: `${CONFIG.url}${ROUTES.RSS}/atom`, }, generator: 'Feed & NextJS', - id: settings.url, - language: settings.locales.defaultLocale, - link: settings.url, + id: CONFIG.url, + language: CONFIG.locales.defaultLocale, + link: CONFIG.url, title, }); @@ -62,7 +62,7 @@ export const generateFeed = async (): Promise => { date: new Date(article.meta.dates.publication), description: article.intro, id: `${article.id}`, - link: `${settings.url}${ROUTES.ARTICLE}/${article.slug}`, + link: `${CONFIG.url}${ROUTES.ARTICLE}/${article.slug}`, title: article.title, }); }); diff --git a/src/utils/helpers/schema-org.ts b/src/utils/helpers/schema-org.ts index 12bad28..2edc11b 100644 --- a/src/utils/helpers/schema-org.ts +++ b/src/utils/helpers/schema-org.ts @@ -8,7 +8,7 @@ import type { WebPage, } from 'schema-dts'; import type { Dates } from '../../types'; -import { settings } from '../config'; +import { CONFIG } from '../config'; import { ROUTES } from '../constants'; export type GetBlogSchemaProps = { @@ -38,22 +38,22 @@ export const getBlogSchema = ({ slug, }: GetBlogSchemaProps): Blog => { return { - '@id': `${settings.url}/#blog`, + '@id': `${CONFIG.url}/#blog`, '@type': 'Blog', - author: { '@id': `${settings.url}/#branding` }, - creator: { '@id': `${settings.url}/#branding` }, - editor: { '@id': `${settings.url}/#branding` }, - blogPost: isSinglePage ? { '@id': `${settings.url}/#article` } : undefined, + author: { '@id': `${CONFIG.url}/#branding` }, + creator: { '@id': `${CONFIG.url}/#branding` }, + editor: { '@id': `${CONFIG.url}/#branding` }, + blogPost: isSinglePage ? { '@id': `${CONFIG.url}/#article` } : undefined, inLanguage: locale, isPartOf: isSinglePage ? { - '@id': `${settings.url}${slug}`, + '@id': `${CONFIG.url}${slug}`, } : undefined, license: 'https://creativecommons.org/licenses/by-sa/4.0/deed.fr', mainEntityOfPage: isSinglePage ? undefined - : { '@id': `${settings.url}${slug}` }, + : { '@id': `${CONFIG.url}${slug}` }, }; }; @@ -137,19 +137,19 @@ export const getSinglePageSchema = ({ }; return { - '@id': `${settings.url}/#${id}`, + '@id': `${CONFIG.url}/#${id}`, '@type': singlePageSchemaType[kind], name: title, description, articleBody: content, - author: { '@id': `${settings.url}/#branding` }, + author: { '@id': `${CONFIG.url}/#branding` }, commentCount: commentsCount, copyrightYear: publicationDate.getFullYear(), - creator: { '@id': `${settings.url}/#branding` }, + creator: { '@id': `${CONFIG.url}/#branding` }, dateCreated: publicationDate.toISOString(), dateModified: updateDate?.toISOString(), datePublished: publicationDate.toISOString(), - editor: { '@id': `${settings.url}/#branding` }, + editor: { '@id': `${CONFIG.url}/#branding` }, headline: title, image: cover, inLanguage: locale, @@ -158,10 +158,10 @@ export const getSinglePageSchema = ({ isPartOf: kind === 'post' ? { - '@id': `${settings.url}${ROUTES.BLOG}`, + '@id': `${CONFIG.url}${ROUTES.BLOG}`, } : undefined, - mainEntityOfPage: { '@id': `${settings.url}${slug}` }, + mainEntityOfPage: { '@id': `${CONFIG.url}${slug}` }, } as SinglePageSchemaReturn[T]; }; @@ -202,17 +202,17 @@ export const getWebPageSchema = ({ updateDate, }: GetWebPageSchemaProps): WebPage => { return { - '@id': `${settings.url}${slug}`, + '@id': `${CONFIG.url}${slug}`, '@type': 'WebPage', - breadcrumb: { '@id': `${settings.url}/#breadcrumb` }, + breadcrumb: { '@id': `${CONFIG.url}/#breadcrumb` }, lastReviewed: updateDate, name: title, description, inLanguage: locale, - reviewedBy: { '@id': `${settings.url}/#branding` }, - url: `${settings.url}${slug}`, + reviewedBy: { '@id': `${CONFIG.url}/#branding` }, + url: `${CONFIG.url}${slug}`, isPartOf: { - '@id': `${settings.url}`, + '@id': `${CONFIG.url}`, }, }; }; diff --git a/src/utils/helpers/server/i18n.ts b/src/utils/helpers/server/i18n.ts index dbbc4e5..8abd92e 100644 --- a/src/utils/helpers/server/i18n.ts +++ b/src/utils/helpers/server/i18n.ts @@ -1,10 +1,10 @@ import { readFile } from 'fs/promises'; import path from 'path'; -import { settings } from '../../config'; +import { CONFIG } from '../../config'; -export type Messages = { [key: string]: string }; +export type Messages = Record; -export const defaultLocale = settings.locales.defaultLocale; +export const { defaultLocale } = CONFIG.locales; /** * Load the translation for the provided locale. diff --git a/src/utils/hooks/index.ts b/src/utils/hooks/index.ts index 68fb7ce..ad412c8 100644 --- a/src/utils/hooks/index.ts +++ b/src/utils/hooks/index.ts @@ -24,7 +24,6 @@ export * from './use-route-change'; export * from './use-scroll-lock'; export * from './use-scroll-position'; export * from './use-scrollbar-width'; -export * from './use-settings'; export * from './use-state-change'; export * from './use-system-color-scheme'; export * from './use-theme'; diff --git a/src/utils/hooks/use-breadcrumb.ts b/src/utils/hooks/use-breadcrumb.ts index 57c27bd..1cd18d9 100644 --- a/src/utils/hooks/use-breadcrumb.ts +++ b/src/utils/hooks/use-breadcrumb.ts @@ -2,9 +2,9 @@ import { useIntl } from 'react-intl'; import type { BreadcrumbList } from 'schema-dts'; import type { BreadcrumbsItem } from '../../components'; +import { CONFIG } from '../config'; import { ROUTES } from '../constants'; import { slugify } from '../helpers'; -import { useSettings } from './use-settings'; const isArticle = (url: string) => url.startsWith(`${ROUTES.ARTICLE}/`); @@ -61,7 +61,6 @@ export const useBreadcrumb = ({ url, }: useBreadcrumbProps): useBreadcrumbReturn => { const intl = useIntl(); - const { website } = useSettings(); const labels = { home: intl.formatMessage({ defaultMessage: 'Home', @@ -88,7 +87,7 @@ export const useBreadcrumb = ({ '@type': 'ListItem', position: 1, name: labels.home, - item: website.url, + item: CONFIG.url, }, ]; @@ -100,7 +99,7 @@ export const useBreadcrumb = ({ '@type': 'ListItem', position: 2, name: labels.blog, - item: `${website.url}${ROUTES.BLOG}`, + item: `${CONFIG.url}${ROUTES.BLOG}`, }); } @@ -110,7 +109,7 @@ export const useBreadcrumb = ({ '@type': 'ListItem', position: 2, name: labels.projects, - item: `${website.url}${ROUTES.PROJECTS}`, + item: `${CONFIG.url}${ROUTES.PROJECTS}`, }); } @@ -119,7 +118,7 @@ export const useBreadcrumb = ({ '@type': 'ListItem', position: schema.length + 1, name: title, - item: `${website.url}${url}`, + item: `${CONFIG.url}${url}`, }); return { items, schema }; diff --git a/src/utils/hooks/use-settings.tsx b/src/utils/hooks/use-settings.tsx deleted file mode 100644 index 968930d..0000000 --- a/src/utils/hooks/use-settings.tsx +++ /dev/null @@ -1,95 +0,0 @@ -import { useRouter } from 'next/router'; -import { settings } from '../config'; - -export type BlogSettings = { - /** - * The number of posts per page. - */ - postsPerPage: number; -}; - -export type CopyrightSettings = { - /** - * The copyright end year. - */ - end: string; - /** - * The copyright start year. - */ - start: string; -}; - -export type LocaleSettings = { - /** - * The default locale. - */ - default: string; - /** - * The supported locales. - */ - supported: string[]; -}; - -export type WebsiteSettings = { - /** - * The website name. - */ - name: string; - /** - * The website baseline. - */ - baseline: string; - /** - * The website copyright dates. - */ - copyright: CopyrightSettings; - /** - * The website admin email. - */ - email: string; - /** - * The website locales. - */ - locales: LocaleSettings; - /** - * The website url. - */ - url: string; -}; - -export type UseSettingsReturn = { - blog: BlogSettings; - website: WebsiteSettings; -}; - -/** - * Retrieve the website and blog settings. - * - * @returns {UseSettingsReturn} - An object describing settings. - */ -export const useSettings = (): UseSettingsReturn => { - const { baseline, copyright, email, locales, name, postsPerPage, url } = - settings; - const router = useRouter(); - const locale = router.locale ?? locales.defaultLocale; - - return { - blog: { - postsPerPage, - }, - website: { - baseline: locale.startsWith('en') ? baseline.en : baseline.fr, - copyright: { - end: copyright.endYear, - start: copyright.startYear, - }, - email, - locales: { - default: locales.defaultLocale, - supported: locales.supported, - }, - name, - url, - }, - }; -}; -- cgit v1.2.3