refactor(pages): improve Homepage

* move custom homepage components that does not require props to the
MDX file (links should not need to be translated here but where they
are defined)
* move SEO title and meta desc to MDX file
* make Page component the wrapper instead of using a React fragment
* fix MDX module types

4 files changed, 36 insertions, 29 deletions

diff --git a/src/utils/constants.ts b/src/utils/constants.ts
index 26cbeaa..043a530 100644
--- a/src/utils/constants.ts
+++ b/src/utils/constants.ts
@@ -2,7 +2,6 @@ export const PERSONAL_LINKS = {
   GITHUB: 'https://github.com/ArmandPhilippot',
   GITLAB: 'https://gitlab.com/ArmandPhilippot',
   LINKEDIN: 'https://www.linkedin.com/in/armandphilippot',
-  SHAARLI: 'https://shaarli.armandphilippot.com/',
 } as const;
 
 /**
@@ -21,12 +20,7 @@ export const ROUTES = {
   PROJECTS: '/projets',
   RSS: '/feed',
   SEARCH: '/recherche',
-  THEMATICS: {
-    INDEX: '/thematique',
-    FREE: '/thematique/libre',
-    LINUX: '/thematique/linux',
-    WEB_DEV: '/thematique/developpement-web',
-  },
+  THEMATICS: '/thematique',
   TOPICS: '/sujet',
 } as const;
 
diff --git a/src/utils/helpers/schema-org.ts b/src/utils/helpers/schema-org.ts
index 2edc11b..f028f5a 100644
--- a/src/utils/helpers/schema-org.ts
+++ b/src/utils/helpers/schema-org.ts
@@ -10,6 +10,9 @@ import type {
 import type { Dates } from '../../types';
 import { CONFIG } from '../config';
 import { ROUTES } from '../constants';
+import { trimTrailingChars } from './strings';
+
+const host = trimTrailingChars(CONFIG.url, '/');
 
 export type GetBlogSchemaProps = {
   /**
@@ -38,22 +41,20 @@ export const getBlogSchema = ({
   slug,
 }: GetBlogSchemaProps): Blog => {
   return {
-    '@id': `${CONFIG.url}/#blog`,
+    '@id': `${host}/#blog`,
     '@type': 'Blog',
-    author: { '@id': `${CONFIG.url}/#branding` },
-    creator: { '@id': `${CONFIG.url}/#branding` },
-    editor: { '@id': `${CONFIG.url}/#branding` },
-    blogPost: isSinglePage ? { '@id': `${CONFIG.url}/#article` } : undefined,
+    author: { '@id': `${host}/#branding` },
+    creator: { '@id': `${host}/#branding` },
+    editor: { '@id': `${host}/#branding` },
+    blogPost: isSinglePage ? { '@id': `${host}/#article` } : undefined,
     inLanguage: locale,
     isPartOf: isSinglePage
       ? {
-          '@id': `${CONFIG.url}${slug}`,
+          '@id': `${host}${slug}`,
         }
       : undefined,
     license: 'https://creativecommons.org/licenses/by-sa/4.0/deed.fr',
-    mainEntityOfPage: isSinglePage
-      ? undefined
-      : { '@id': `${CONFIG.url}${slug}` },
+    mainEntityOfPage: isSinglePage ? undefined : { '@id': `${host}${slug}` },
   };
 };
 
@@ -137,19 +138,19 @@ export const getSinglePageSchema = <T extends SinglePageSchemaKind>({
   };
 
   return {
-    '@id': `${CONFIG.url}/#${id}`,
+    '@id': `${host}/#${id}`,
     '@type': singlePageSchemaType[kind],
     name: title,
     description,
     articleBody: content,
-    author: { '@id': `${CONFIG.url}/#branding` },
+    author: { '@id': `${host}/#branding` },
     commentCount: commentsCount,
     copyrightYear: publicationDate.getFullYear(),
-    creator: { '@id': `${CONFIG.url}/#branding` },
+    creator: { '@id': `${host}/#branding` },
     dateCreated: publicationDate.toISOString(),
     dateModified: updateDate?.toISOString(),
     datePublished: publicationDate.toISOString(),
-    editor: { '@id': `${CONFIG.url}/#branding` },
+    editor: { '@id': `${host}/#branding` },
     headline: title,
     image: cover,
     inLanguage: locale,
@@ -158,10 +159,10 @@ export const getSinglePageSchema = <T extends SinglePageSchemaKind>({
     isPartOf:
       kind === 'post'
         ? {
-            '@id': `${CONFIG.url}${ROUTES.BLOG}`,
+            '@id': `${host}${ROUTES.BLOG}`,
           }
         : undefined,
-    mainEntityOfPage: { '@id': `${CONFIG.url}${slug}` },
+    mainEntityOfPage: { '@id': `${host}${slug}` },
   } as SinglePageSchemaReturn[T];
 };
 
@@ -202,17 +203,17 @@ export const getWebPageSchema = ({
   updateDate,
 }: GetWebPageSchemaProps): WebPage => {
   return {
-    '@id': `${CONFIG.url}${slug}`,
+    '@id': `${host}${slug}`,
     '@type': 'WebPage',
-    breadcrumb: { '@id': `${CONFIG.url}/#breadcrumb` },
+    breadcrumb: { '@id': `${host}/#breadcrumb` },
     lastReviewed: updateDate,
     name: title,
     description,
     inLanguage: locale,
-    reviewedBy: { '@id': `${CONFIG.url}/#branding` },
-    url: `${CONFIG.url}${slug}`,
+    reviewedBy: { '@id': `${host}/#branding` },
+    url: `${host}${slug}`,
     isPartOf: {
-      '@id': `${CONFIG.url}`,
+      '@id': `${host}`,
     },
   };
 };
diff --git a/src/utils/helpers/strings.ts b/src/utils/helpers/strings.ts
index 8b0f923..b8af61d 100644
--- a/src/utils/helpers/strings.ts
+++ b/src/utils/helpers/strings.ts
@@ -45,3 +45,16 @@ export const getDataAttributeFrom = (str: string) => {
   if (str.startsWith('data-')) return str;
   return `data-${str}`;
 };
+
+/**
+ * Remove the given character if present at the end of the given string.
+ *
+ * @param {string} str - A string to trim.
+ * @param {string} char - The character to remove.
+ * @returns {string} The trimmed string.
+ */
+export const trimTrailingChars = (str: string, char: string): string => {
+  const regExp = new RegExp(`${char}+$`);
+
+  return str.replace(regExp, '');
+};
diff --git a/src/utils/hooks/use-breadcrumb.ts b/src/utils/hooks/use-breadcrumb.ts
index 1cd18d9..8b23ff2 100644
--- a/src/utils/hooks/use-breadcrumb.ts
+++ b/src/utils/hooks/use-breadcrumb.ts
@@ -16,8 +16,7 @@ const isProject = (url: string) => url.startsWith(`${ROUTES.PROJECTS}/`);
 
 const isSearch = (url: string) => url.startsWith(ROUTES.SEARCH);
 
-const isThematic = (url: string) =>
-  url.startsWith(`${ROUTES.THEMATICS.INDEX}/`);
+const isThematic = (url: string) => url.startsWith(`${ROUTES.THEMATICS}/`);
 
 const isTopic = (url: string) => url.startsWith(`${ROUTES.TOPICS}/`);