perf: seo config

apps/fronted/src/app/(public)/[locale]/layout.tsx

@@ -1,3 +1,4 @@
+import { ReactNode } from "react";
 import { Metadata } from "next";
 import { notFound } from "next/navigation";
 import { NextIntlClientProvider } from "next-intl";
@@ -6,7 +7,6 @@ import {
   getTranslations,
   setRequestLocale,
 } from "next-intl/server";
-import { ReactNode } from "react";
 import Document from "@/components/Document";
 import { locales } from "@/i18n/config";
 import { Providers } from "@/app/providers";
@@ -24,10 +24,31 @@ export async function generateMetadata({
   params: { locale },
 }: Props): Promise<Metadata> {
   const t = await getTranslations({ locale, namespace: "common" });
+  const baseUrl = "https://magic-resume.com";
 
   return {
     title: t("title"),
     description: t("description"),
+    alternates: {
+      canonical: `${baseUrl}/${locale}`,
+      languages: {
+        "en-US": `${baseUrl}/en`,
+        "zh-CN": `${baseUrl}/zh`,
+      },
+    },
+    openGraph: {
+      title: t("title"),
+      description: t("description"),
+      locale: locale,
+      alternateLocale: locale === "en" ? ["zh-CN"] : ["en-US"],
+    },
+    other: {
+      Link: [
+        `<${baseUrl}/en>; rel="alternate"; hreflang="en-US"`,
+        `<${baseUrl}/zh>; rel="alternate"; hreflang="zh-CN"`,
+        `<${baseUrl}/${locale}>; rel="canonical"`,
+      ].join(", "),
+    },
   };
 }
 
@@ -35,16 +56,12 @@ export default async function LocaleLayout({
   children,
   params: { locale },
 }: Props) {
-  // Enable static rendering
   setRequestLocale(locale);
 
-  // Ensure that the incoming locale is valid
   if (!locales.includes(locale as any)) {
     notFound();
   }
 
-  // Providing all messages to the client
-  // side is the easiest way to get started
   const messages = await getMessages();
 
   return (