Merge pull request #189 from nr2f1/footer-fix

fix: not found and language locale
nr2f1 · Feb 9, 2025 · 8b1f43b · 8b1f43b
2 parents 45ccc88 + c8939cf
commit 8b1f43b
Show file tree

Hide file tree

Showing 3 changed files with 91 additions and 52 deletions.
diff --git a/website/src/app/[lang]/layout.tsx b/website/src/app/[lang]/layout.tsx
@@ -0,0 +1,51 @@
+import Footer from '@components/footer';
+import Header from '@components/header';
+import { AVAILABLE_LOCALES } from '@i18n/locales';
+import type { PagePropsWithLocale } from '@shared/types/page-with-locale-params';
+import { Nunito_Sans } from 'next/font/google';
+
+const nunitoSans = Nunito_Sans({
+  display: 'swap',
+  subsets: ['latin'],
+  variable: '--font-nunito-sans',
+  adjustFontFallback: false,
+  preload: true,
+});
+
+export const metadata = {
+  title: 'NR2F1 Foundation',
+  metadataBase: new URL('https://website-nr2f1.vercel.app'), // TODO: update this once we migrate
+  alternates: {
+    canonical: '/',
+    languages: {
+      en: '/en',
+      de: '/de',
+      es: '/es',
+      fr: '/fr',
+    },
+  },
+};
+
+export async function generateStaticParams() {
+  return AVAILABLE_LOCALES.map((lang) => ({ lang }));
+}
+
+interface RootLayoutProps extends PagePropsWithLocale {
+  children: React.ReactNode;
+}
+
+const RootLayout: React.FC<RootLayoutProps> = async ({ children, params }) => {
+  const { lang } = await params;
+
+  return (
+    <html lang={lang} className={nunitoSans.variable}>
+      <body>
+        <Header lang={lang} />
+        <main>{children}</main>
+        <Footer lang={lang} />
+      </body>
+    </html>
+  );
+};
+
+export default RootLayout;
diff --git a/website/src/app/layout.tsx b/website/src/app/layout.tsx
@@ -1,20 +1,6 @@
 import '@styles/main.scss';
 
 import { ApolloWrapper } from '@app/apollo-wrapper';
-import Footer from '@components/footer';
-import Header from '@components/header';
-import { AVAILABLE_LOCALES } from '@i18n/locales';
-import type { PagePropsWithLocale } from '@shared/types/page-with-locale-params';
-import { getLocale } from '@shared/utils/get-locale';
-import { Nunito_Sans } from 'next/font/google';
-
-const nunitoSans = Nunito_Sans({
-  display: 'swap',
-  subsets: ['latin'],
-  variable: '--font-nunito-sans',
-  adjustFontFallback: false,
-  preload: true,
-});
 
 export const metadata = {
   title: 'NR2F1 Foundation',
@@ -30,32 +16,12 @@ export const metadata = {
   },
 };
 
-export async function generateStaticParams() {
-  return AVAILABLE_LOCALES.map((lang) => ({ lang }));
-}
-
-interface RootLayoutProps extends PagePropsWithLocale {
+interface RootLayoutProps {
   children: React.ReactNode;
 }
 
-const RootLayout: React.FC<RootLayoutProps> = async ({ children, params }) => {
-  let { lang } = await params;
-
-  if (!lang) {
-    lang = await getLocale();
-  }
-
-  return (
-    <html lang={lang} className={nunitoSans.variable}>
-      <body>
-        <ApolloWrapper>
-          <Header lang={lang} />
-          <main>{children}</main>
-          <Footer lang={lang} />
-        </ApolloWrapper>
-      </body>
-    </html>
-  );
+const RootLayout: React.FC<RootLayoutProps> = async ({ children }) => {
+  return <ApolloWrapper>{children}</ApolloWrapper>;
 };
 
 export default RootLayout;
diff --git a/website/src/app/not-found.tsx b/website/src/app/not-found.tsx
@@ -1,5 +1,7 @@
 import styles from './not-found.module.scss';
 
+import Footer from '@components/footer';
+import Header from '@components/header';
 import type { AvailableLocale } from '@i18n/locales';
 import { getLocale } from '@shared/utils/get-locale';
 import Link from 'next/link';
@@ -31,24 +33,44 @@ const translations: Record<AvailableLocale, Record<string, string>> = {
   },
 };
 
+import { Nunito_Sans } from 'next/font/google';
+
+const nunitoSans = Nunito_Sans({
+  display: 'swap',
+  subsets: ['latin'],
+  variable: '--font-nunito-sans',
+  adjustFontFallback: false,
+  preload: true,
+});
+
 export default async function NotFound() {
   const lang = await getLocale();
 
+  // TODO: remove lang selector from header
+
   return (
-    <div className={styles.notfound}>
-      <div className={styles.notfound__content_wrapper}>
-        <article>
-          <h1>{translations[lang].title}</h1>
-
-          <p>
-            <span>404 error</span>: {translations[lang].description}
-          </p>
-
-          <Link href={`/${lang}`} className="button button--on-light">
-            {translations[lang].cta}
-          </Link>
-        </article>
-      </div>
-    </div>
+    <html lang={lang} className={nunitoSans.variable}>
+      <body>
+        <Header lang={lang} />
+        <main>
+          <div className={styles.notfound}>
+            <div className={styles.notfound__content_wrapper}>
+              <article>
+                <h1>{translations[lang].title}</h1>
+
+                <p>
+                  <span>404 error</span>: {translations[lang].description}
+                </p>
+
+                <Link href={`/${lang}`} className="button button--on-light">
+                  {translations[lang].cta}
+                </Link>
+              </article>
+            </div>
+          </div>
+        </main>
+        <Footer lang={lang} />
+      </body>
+    </html>
   );
 }