chore: define dashboard metadata in layout

Author: ixartz

src/app/[locale]/(auth)/dashboard/layout.tsx

@@ -1,13 +1,29 @@
 import { SignOutButton } from '@clerk/nextjs';
+import type { Metadata } from 'next';
 import { getTranslations, setRequestLocale } from 'next-intl/server';
 import { LocaleSwitcher } from '@/components/LocaleSwitcher';
 import { Link } from '@/libs/I18nNavigation';
 import { BaseTemplate } from '@/templates/BaseTemplate';
 
-export default async function DashboardLayout(props: {
+type DashboardLayoutProps = {
   children: React.ReactNode;
   params: Promise<{ locale: string }>;
-}) {
+};
+
+export async function generateMetadata(props: DashboardLayoutProps): Promise<Metadata> {
+  const { locale } = await props.params;
+  const t = await getTranslations({
+    locale,
+    namespace: 'DashboardLayout',
+  });
+
+  return {
+    title: t('meta_title'),
+    description: t('meta_description'),
+  };
+}
+
+export default async function DashboardLayout(props: DashboardLayoutProps) {
   const { locale } = await props.params;
   setRequestLocale(locale);
   const t = await getTranslations({

src/app/[locale]/(auth)/dashboard/page.tsx

@@ -1,24 +1,7 @@
-import type { Metadata } from 'next';
-import { getTranslations, setRequestLocale } from 'next-intl/server';
+import { setRequestLocale } from 'next-intl/server';
 import { Hello } from '@/components/Hello';
 
-type DashboardPageProps = {
-  params: Promise<{ locale: string }>;
-};
-
-export async function generateMetadata(props: DashboardPageProps): Promise<Metadata> {
-  const { locale } = await props.params;
-  const t = await getTranslations({
-    locale,
-    namespace: 'Dashboard',
-  });
-
-  return {
-    title: t('meta_title'),
-  };
-}
-
-export default async function DashboardPage(props: DashboardPageProps) {
+export default async function DashboardPage(props: { params: Promise<{ locale: string }> }) {
   const { locale } = await props.params;
   setRequestLocale(locale);
 

src/app/[locale]/(auth)/dashboard/user-profile/[[...user-profile]]/page.tsx

@@ -1,25 +1,8 @@
 import { UserProfile } from '@clerk/nextjs';
-import type { Metadata } from 'next';
-import { getTranslations, setRequestLocale } from 'next-intl/server';
+import { setRequestLocale } from 'next-intl/server';
 import { getI18nPath } from '@/utils/Helpers';
 
-type UserProfilePageProps = {
-  params: Promise<{ locale: string }>;
-};
-
-export async function generateMetadata(props: UserProfilePageProps): Promise<Metadata> {
-  const { locale } = await props.params;
-  const t = await getTranslations({
-    locale,
-    namespace: 'UserProfile',
-  });
-
-  return {
-    title: t('meta_title'),
-  };
-}
-
-export default async function UserProfilePage(props: UserProfilePageProps) {
+export default async function UserProfilePage(props: { params: Promise<{ locale: string }> }) {
   const { locale } = await props.params;
   setRequestLocale(locale);
 

src/locales/en.json

@@ -61,15 +61,13 @@
     "meta_description": "Effortlessly create an account through our intuitive sign-up process."
   },
   "Dashboard": {
-    "meta_title": "Dashboard",
     "hello_message": "Hello {email}!",
     "alternative_message": "Need advanced features? Multi-tenancy & Teams, Roles & Permissions, Shadcn UI, End-to-End Typesafety with oRPC, Stripe Payment, Light / Dark mode. Try <url></url>.",
     "max_message": "Or, need a Self-hosted auth stack (Better Auth)? Try <url></url>."
   },
-  "UserProfile": {
-    "meta_title": "User Profile"
-  },
   "DashboardLayout": {
+    "meta_title": "Dashboard",
+    "meta_description": "Manage your account from the dashboard.",
     "dashboard_link": "Dashboard",
     "user_profile_link": "Manage your account",
     "sign_out": "Sign out"

src/locales/fr.json

@@ -61,15 +61,13 @@
     "meta_description": "Créez un compte facilement grâce à notre processus d'inscription intuitif."
   },
   "Dashboard": {
-    "meta_title": "Tableau de bord",
     "hello_message": "Bonjour {email}!",
     "alternative_message": "Besoin de fonctionnalités avancées ? Multi-tenant et équipes, rôles et permissions, Shadcn UI, typage de bout en bout avec oRPC, paiement Stripe, mode clair / sombre. Essayez <url></url>.",
     "max_message": "Ou, besoin d'une stack d'auth auto-hébergée (Better Auth) ? Essayez <url></url>."
   },
-  "UserProfile": {
-    "meta_title": "Profil de l'utilisateur"
-  },
   "DashboardLayout": {
+    "meta_title": "Tableau de bord",
+    "meta_description": "Gérez votre compte depuis le tableau de bord.",
     "dashboard_link": "Tableau de bord",
     "user_profile_link": "Gérer votre compte",
     "sign_out": "Se déconnecter"

src/utils/Helpers.test.ts

@@ -3,19 +3,19 @@ import { routing } from '@/libs/I18nRouting';
 import { getI18nPath } from './Helpers';
 
 describe('Helpers', () => {
-  describe('getI18nPath function', () => {
-    it('should not change the path for default language', () => {
+  describe('I18n path helper', () => {
+    it('keeps path unchanged when locale is default', () => {
       const url = '/random-url';
       const locale = routing.defaultLocale;
 
       expect(getI18nPath(url, locale)).toBe(url);
     });
 
-    it('should prepend the locale to the path for non-default language', () => {
+    it('prefixes path with locale when locale is not default', () => {
       const url = '/random-url';
       const locale = 'fr';
 
-      expect(getI18nPath(url, locale)).toMatch(/^\/fr/u);
+      expect(getI18nPath(url, locale)).toBe(`/fr${url}`);
     });
   });
 });