Merge branch 'main' into content(nodejs-loaders)

AugustinMauroy · Dec 6, 2024 · b154809 · b154809
2 parents 1636eea + ccd2cce
commit b154809
Show file tree

Hide file tree

Showing 44 changed files with 613 additions and 1,564 deletions.
diff --git a/.github/dependabot.yml b/.github/dependabot.yml
@@ -41,7 +41,6 @@ updates:
         patterns:
           - 'classnames'
           - 'feed'
-          - 'geist'
           - 'rehype-autolink-headings'
           - 'rehype-mdx-code-props'
           - 'rehype-slug'

diff --git a/.storybook/main.ts b/.storybook/main.ts
@@ -1,4 +1,3 @@
-import { resolve } from 'node:path';
 import type { StorybookConfig } from '@storybook/nextjs';
 
 const config: StorybookConfig = {
@@ -28,19 +27,11 @@ const config: StorybookConfig = {
   previewBody:
     '<style>:root { color-scheme: light; } html[data-theme="dark"] { color-scheme: dark; }</style>' +
     // Warning: this should be same as the one in `src/styles/globals.css`
-    '<body class="bg-yellow-50 text-gray-950 dark:bg-gray-950 dark:text-gray-50"></body>',
+    '<body class="bg-yellow-50 text-neutral-950 dark:bg-neutral-950 dark:text-neutral-50">',
   webpack: async config => ({
     ...config,
     // Performance Hints do not make sense on Storybook as it is bloated by design
     performance: { hints: false },
-    // Removes Pesky Critical Dependency Warnings due to `next/font`
-    ignoreWarnings: [e => e.message.includes('Critical dep')],
-    // allows to use `~/` as a shortcut to the `src/` folder
-    resolve: {
-      ...config.resolve,
-      // @ts-ignore
-      alias: { ...config.resolve.alias, '~': resolve(__dirname, '../') },
-    },
   }),
 };
 export default config;
diff --git a/app/[locale]/404/page.module.css b/app/[locale]/404/page.module.css
@@ -15,7 +15,7 @@
     @apply mb-4
       text-center
       text-lg
-      text-gray-600
-      dark:text-gray-400;
+      text-neutral-600
+      dark:text-neutral-400;
   }
 }
diff --git a/app/[locale]/404/page.tsx b/app/[locale]/404/page.tsx
@@ -1,14 +1,14 @@
 import { ArrowRightIcon } from '@heroicons/react/24/outline';
-import { getTranslations, unstable_setRequestLocale } from 'next-intl/server';
+import { getTranslations, setRequestLocale } from 'next-intl/server';
 import ButtonLink from '~/components/Common/Button/Link/index.tsx';
 import styles from './page.module.css';
 import type { FC } from 'react';
 import type { Metadata } from 'next';
 import type { BaseParams } from '~/types/params.ts';
 
-type NotFoundProps = {
-  params: BaseParams;
-};
+type NotFoundProps = BaseParams;
+
+export const dynamic = 'force-static';
 
 export const generateMetadata = async (): Promise<Metadata> => {
   const t = await getTranslations('app.notFound');
@@ -20,7 +20,8 @@ export const generateMetadata = async (): Promise<Metadata> => {
 };
 
 const NotFound: FC<NotFoundProps> = async ({ params }) => {
-  unstable_setRequestLocale(params.locale);
+  const { locale } = await params;
+  setRequestLocale(locale);
   const t = await getTranslations('app.notFound');
 
   return (
@@ -35,6 +36,4 @@ const NotFound: FC<NotFoundProps> = async ({ params }) => {
   );
 };
 
-export const dynamic = 'error';
-
 export default NotFound;
diff --git a/app/[locale]/about/page.tsx b/app/[locale]/about/page.tsx
@@ -8,16 +8,16 @@ import type { Metadata } from 'next';
 import type { AboutFrontmatter } from '~/types/frontmatter.ts';
 import type { BaseParams } from '~/types/params.ts';
 
-type PageProps = {
-  params: BaseParams;
-};
+type PageProps = BaseParams;
+
+export const dynamic = 'force-static';
 
 export const generateMetadata = async ({
   params,
 }: PageProps): Promise<Metadata | null> => {
   const rawSource = await getContent({
     section: 'about',
-    lang: params.locale,
+    lang: (await params).locale,
   });
 
   if (!rawSource) return null;
@@ -36,7 +36,7 @@ export const generateMetadata = async ({
 const Page: FC<PageProps> = async ({ params }) => {
   const rawSource = await getContent({
     section: 'about',
-    lang: params.locale,
+    lang: (await params).locale,
   });
 
   if (!rawSource) notFound();

diff --git a/app/[locale]/blog/[[...page]]/page.tsx b/app/[locale]/blog/[[...page]]/page.tsx
@@ -15,17 +15,19 @@ import type { BaseParams } from '~/types/params.ts';
 const MAX_POSTS_PER_PAGE = 6;
 
 type PageProps = {
-  params: {
+  params: Promise<{
     page?: string[];
-  } & BaseParams;
-};
+  }>;
+} & BaseParams;
 
 type StaticParams = {
   params: {
     locale: string;
   };
 };
 
+export const dynamic = 'force-static';
+
 export const generateMetadata = async (): Promise<Metadata | null> => {
   const t = await getTranslations('app.blog');
 
@@ -47,16 +49,20 @@ export const generateStaticParams = async ({ params }: StaticParams) => {
 };
 
 const Page: FC<PageProps> = async ({ params }) => {
+  const { page, locale } = await params;
   let pageNumbers = null;
-  if (params.page && params.page[0] === 'index') {
+  if (page && page[0] === 'index') {
     pageNumbers = 0;
-  } else if (params.page && Number.isInteger(parseInt(params.page[0], 10))) {
-    pageNumbers = parseInt(params.page[0], 10);
+  } else if (page && Number.isInteger(parseInt(page[0], 10))) {
+    pageNumbers = parseInt(page[0], 10);
   }
 
   if (pageNumbers === null) notFound();
 
-  const posts = await getSlugs({ section: 'blog', lang: params.locale });
+  const posts = await getSlugs({
+    section: 'blog',
+    lang: (await params).locale,
+  });
   const metadata = await Promise.all(
     posts
       .slice(
@@ -66,7 +72,7 @@ const Page: FC<PageProps> = async ({ params }) => {
       .map(slug =>
         getFrontmatter<BlogFrontmatter>({
           section: 'blog',
-          lang: params.locale,
+          lang: locale,
           slug,
         })
       )

diff --git a/app/[locale]/blog/post/[post]/page.tsx b/app/[locale]/blog/post/[post]/page.tsx
@@ -9,10 +9,8 @@ import type { Metadata } from 'next';
 import type { BlogFrontmatter } from '~/types/frontmatter.ts';
 import type { BaseParams } from '~/types/params.ts';
 
-type PageProps = {
-  params: {
-    post: string;
-  } & BaseParams;
+type PageProps = BaseParams & {
+  params: Promise<{ post: string }>;
 };
 
 const slugToParams = (slug: string) => {
@@ -26,8 +24,8 @@ export const generateMetadata = async ({
 }: PageProps): Promise<Metadata | null> => {
   const rawSource = await getContent({
     section: 'blog',
-    lang: params.locale,
-    slug: params.post,
+    lang: (await params).locale,
+    slug: (await params).post,
   });
 
   if (!rawSource) return null;
@@ -57,8 +55,8 @@ export const generateStaticParams = async () => {
 const Page: FC<PageProps> = async ({ params }) => {
   const rawSource = await getContent({
     section: 'blog',
-    slug: params.post,
-    lang: params.locale,
+    slug: (await params).post,
+    lang: (await params).locale,
   });
 
   if (!rawSource) notFound();

diff --git a/app/[locale]/feed/blog/rss.xml/route.ts b/app/[locale]/feed/blog/rss.xml/route.ts
@@ -1,21 +1,19 @@
 import { generateRssFeed } from '~/lib/rss.ts';
-import { availableLocales } from '~/utils/i18n/index.ts';
+import { availableLocales } from '~/lib/i18n/config.ts';
 import type { BaseParams } from '~/types/params.ts';
 
+export const dynamic = 'force-static';
+
 export const generateStaticParams = () => {
   return availableLocales.map(lang => ({
     locale: lang.code,
   }));
 };
 
-type GETProps = {
-  params: BaseParams;
-};
-
-export const GET = async (_: Request, { params }: GETProps) => {
+export const GET = async (_: Request, { params }: BaseParams) => {
   const feed = await generateRssFeed({
     section: 'blog',
-    lang: params.locale,
+    lang: (await params).locale,
   });
 
   return new Response(feed, {

diff --git a/app/[locale]/layout.tsx b/app/[locale]/layout.tsx
@@ -1,25 +1,30 @@
-import { getTranslations, unstable_setRequestLocale } from 'next-intl/server';
+import { getTranslations, setRequestLocale } from 'next-intl/server';
 import classNames from 'classnames';
-import { GeistSans } from 'geist/font/sans';
-import { GeistMono } from 'geist/font/mono';
+import { Geist, Geist_Mono } from 'next/font/google';
 import { LocaleProvider } from '~/providers/localeProvider.tsx';
-import { availableLocales } from '~/utils/i18n/index.ts';
+import { routing } from '~/lib/i18n/routing';
 import type { FC, PropsWithChildren } from 'react';
 import type { Metadata } from 'next';
 import type { BaseParams } from '~/types/params.ts';
 import '~/styles/globals.css';
 
-type RootLayoutProps = PropsWithChildren<{
-  params: BaseParams;
-}>;
+type RootLayoutProps = PropsWithChildren<BaseParams>;
 
-export const generateStaticParams = () => {
-  return availableLocales.map(lang => ({
-    locale: lang.code,
-  }));
-};
+export const dynamic = 'force-static';
+
+const GeistSans = Geist({
+  subsets: ['latin'],
+});
+
+const GeistMono = Geist_Mono({
+  subsets: ['latin'],
+});
+
+// Generate params for all available locales
+// It's allow us to build the website statically for all locales
+export const generateStaticParams = () =>
+  routing.locales.map(locale => ({ locale }));
 
-// @TODO: Generate metadata using i18n
 export const generateMetadata = async (): Promise<Metadata | null> => {
   const t = await getTranslations('app.metadata');
 
@@ -28,13 +33,15 @@ export const generateMetadata = async (): Promise<Metadata | null> => {
     description: t('description'),
   };
 };
-const RootLayout: FC<RootLayoutProps> = ({ children, params }) => {
-  unstable_setRequestLocale(params.locale);
+
+const RootLayout: FC<RootLayoutProps> = async ({ children, params }) => {
+  const { locale } = await params;
+  setRequestLocale(locale);
 
   return (
-    <html lang={params.locale}>
+    <html lang={locale}>
       <body className={classNames(GeistSans.className, GeistMono.className)}>
-        <LocaleProvider locale={params.locale}>{children}</LocaleProvider>
+        <LocaleProvider locale={locale}>{children}</LocaleProvider>
       </body>
     </html>
   );

diff --git a/app/[locale]/projects/page.tsx b/app/[locale]/projects/page.tsx
@@ -8,16 +8,16 @@ import type { Metadata } from 'next';
 import type { ProjectsFrontmatter } from '~/types/frontmatter.ts';
 import type { BaseParams } from '~/types/params.ts';
 
-type PageProps = {
-  params: BaseParams;
-};
+type PageProps = BaseParams;
+
+export const dynamic = 'force-static';
 
 export const generateMetadata = async ({
   params,
 }: PageProps): Promise<Metadata | null> => {
   const rawSource = await getContent({
     section: 'projects',
-    lang: params.locale,
+    lang: (await params).locale,
   });
 
   if (!rawSource) return null;
@@ -36,7 +36,7 @@ export const generateMetadata = async ({
 const Page: FC<PageProps> = async ({ params }) => {
   const rawSource = await getContent({
     section: 'projects',
-    lang: params.locale,
+    lang: (await params).locale,
   });
 
   if (!rawSource) notFound();

diff --git a/app/robots.ts b/app/robots.ts
@@ -1,6 +1,8 @@
 import type { MetadataRoute } from 'next';
 
-function robots(): MetadataRoute.Robots {
+export const dynamic = 'force-static';
+
+export default function robots(): MetadataRoute.Robots {
   return {
     rules: {
       userAgent: '*',
@@ -10,5 +12,3 @@ function robots(): MetadataRoute.Robots {
     sitemap: 'https://augustinmauroy.github.io/sitemap.xml',
   };
 }
-
-export default robots;
diff --git a/app/sitemap.ts b/app/sitemap.ts
@@ -1,7 +1,9 @@
 import { generateSitemap } from '~/lib/sitemap';
-import { availableLocaleCodes } from '~/utils/i18n/index.ts';
+import { availableLocaleCodes } from '~/lib/i18n/config.ts';
 import type { MetadataRoute } from 'next';
 
+export const dynamic = 'force-static';
+
 export default async function sitemap(): Promise<MetadataRoute.Sitemap> {
   const sitemapEntries: MetadataRoute.Sitemap = [];
 

diff --git a/components/Common/Avatar/index.module.css b/components/Common/Avatar/index.module.css
@@ -25,6 +25,6 @@
   bg-white
   text-base
   font-bold
-  dark:bg-black
+  dark:bg-neutral-950
   dark:text-white;
 }
diff --git a/components/Common/Blockquote/index.module.css b/components/Common/Blockquote/index.module.css
@@ -10,7 +10,7 @@
     shadow-neo-brutalism-xl-black
     transition-shadow
     dark:border-white
-    dark:bg-black
+    dark:bg-neutral-950
     dark:shadow-neo-brutalism-xl-white;
 
   & .wrapper {

diff --git a/components/Common/Button/index.module.css b/components/Common/Button/index.module.css
@@ -36,9 +36,9 @@
 
   &:disabled {
     @apply cursor-not-allowed
-      border-gray-400
-      bg-gray-200
-      text-gray-400;
+      border-neutral-400
+      bg-neutral-200
+      text-neutral-400;
   }
 
   svg {

diff --git a/components/Common/Codebox/index.module.css b/components/Common/Codebox/index.module.css
@@ -1,11 +1,12 @@
 .codeBox {
-  @apply my-2
+  @apply mt-2
+    mb-4
     rounded-md
     border-2
     border-black
     bg-white
     dark:border-white
-    dark:bg-gray-800;
+    dark:bg-neutral-800;
 
   .header {
     @apply flex