Add canonical

src/components/atoms/Head.tsx

@@ -1,11 +1,15 @@
 import NextHead from 'next/head'
+import { useRouter } from 'next/router'
+import { baseUrl } from '../../lib/consts'
 
 interface HeadProps {
   title: string
   description?: string
+  canonicalHref?: string
 }
 
-const Head = ({ title, description }: HeadProps) => {
+const Head = ({ title, description, canonicalHref }: HeadProps) => {
+  const { locale } = useRouter()
   return (
     <NextHead>
       <title>{title}</title>
@@ -19,6 +23,14 @@ const Head = ({ title, description }: HeadProps) => {
       />
       <meta property='og:title' content={title} key='title' />
       <meta property='og:description' content={description} key='description' />
+      {canonicalHref && (
+        <link
+          rel='canonical'
+          href={`${baseUrl}${
+            locale === 'en-US' ? '' : '/ko-KR'
+          }${canonicalHref}`}
+        />
+      )}
     </NextHead>
   )
 }

src/components/pages/SingleStigmataPage.tsx

@@ -43,6 +43,7 @@ const SingleStigmataPage = ({
         )} / HP : ${stigmataData.hp} / ATK : ${stigmataData.atk} / DEF : ${
           stigmataData.def
         } / CRT : ${stigmataData.crt}`}
+        canonicalHref={`/honkai3rd/stigmata/${stigmataData.id}`}
       />
       <Box p={3}>
         <Breadcrumb

src/components/pages/StigmataSetPage.tsx

@@ -31,6 +31,7 @@ const StigmataSetPage = ({
         description={`${t('common.honkai-3rd')} ${t(
           'stigmata-show.stigmata-set'
         )} / ${'⭐'.repeat(stigmataSet.rarity)} / ${stigmataSet.altName}`}
+        canonicalHref={`/honkai3rd/stigmata/${stigmataSet.id}-set`}
       />
 
       <Box p={3}>