상세 페이지 header title을 상세 페이지의 title 값으로 설정되도록 수정

constmoon · constmoon · commit 384c8b11ee82 · 2022-09-24T16:41:27.000+09:00
diff --git a/frontend/interfaces/PageProps.ts b/frontend/interfaces/PageProps.ts
@@ -13,6 +13,7 @@ export interface ContentPage extends PageProps {
 }
 
 export interface LocalePage<T> extends PageProps {
+    title?: string
     ko: T
     en: T
 }
diff --git a/frontend/pages/_app.tsx b/frontend/pages/_app.tsx
@@ -7,6 +7,7 @@ import { ThemeProvider } from 'styled-components'
 import '../assets/styles/global.css'
 import Theme from '../assets/styles/theme'
 import { NextSeo } from 'next-seo'
+import Head from 'next/head'
 
 const App = ({
     Component,
@@ -19,14 +20,20 @@ const App = ({
     const { pathname } = router
 
     const pageName = pageProps?.title ?? ''
-    const pageTitle =
-        pageName !== ''
-            ? `${t(`pageTitle:${pageName}`)} : ${t(`label:siteTitle`)}`
-            : `${t(`label:siteTitle`)}`
     const description = `${t(`label:pyconkrTitle`)}: ${t(`label:pyconkrDate`)}`
 
     const hideSponsor = pathname === '/sponsor'
 
+    const getPageTitle = (): string => {
+        if (i18n.exists(`pageTitle:${pageName}`)) {
+            return `${t(`pageTitle:${pageName}`)} : ${t(`label:siteTitle`)}`
+        } else if (pageProps?.title) {
+            return `${pageProps?.title} : ${t(`label:siteTitle`)}`
+        }
+        return `${t(`label:siteTitle`)}`
+    }
+    const pageTitle = getPageTitle()
+
     return (
         <>
             <I18nextProvider i18n={i18n}>
@@ -47,6 +54,9 @@ const App = ({
                             ]
                         }}
                     />
+                    <Head>
+                        <title>{pageTitle}</title>
+                    </Head>
                     <Layout
                         locale={locale}
                         pageName={pageName}
diff --git a/frontend/pages/program/talks/[id].tsx b/frontend/pages/program/talks/[id].tsx
@@ -80,6 +80,7 @@ export const getServerSideProps: GetServerSideProps = async (
         return {
             props: {
                 locale,
+                title: data.title,
                 ko: data,
                 en: data
             }
diff --git a/frontend/pages/sponsor/list/[id].tsx b/frontend/pages/sponsor/list/[id].tsx
@@ -10,6 +10,7 @@ import { useTranslation } from 'react-i18next'
 import { media } from '../../../assets/styles/mixin'
 
 interface SponsorDetailProps extends LocalePage<ISponsorDetail> {
+    title: string
     locale: string
 }
 
@@ -70,6 +71,7 @@ export const getServerSideProps: GetServerSideProps = async (
         return {
             props: {
                 locale,
+                title: data.name,
                 ko: data,
                 en: data
             }

Original file line number	Diff line number	Diff line change
`@@ -13,6 +13,7 @@ export interface ContentPage extends PageProps {`
`13`	`13`	`}`
`14`	`14`
`15`	`15`	`export interface LocalePage<T> extends PageProps {`
	`16`	`+ title?: string`
`16`	`17`	`ko: T`
`17`	`18`	`en: T`
`18`	`19`	`}`
Original file line number	Diff line number	Diff line change
`@@ -80,6 +80,7 @@ export const getServerSideProps: GetServerSideProps = async (`
`80`	`80`	`return {`
`81`	`81`	`props: {`
`82`	`82`	`locale,`
	`83`	`+ title: data.title,`
`83`	`84`	`ko: data,`
`84`	`85`	`en: data`
`85`	`86`	`}`
Original file line number	Diff line number	Diff line change
`@@ -10,6 +10,7 @@ import { useTranslation } from 'react-i18next'`
`10`	`10`	`import { media } from '../../../assets/styles/mixin'`
`11`	`11`
`12`	`12`	`interface SponsorDetailProps extends LocalePage<ISponsorDetail> {`
	`13`	`+ title: string`
`13`	`14`	`locale: string`
`14`	`15`	`}`
`15`	`16`
`@@ -70,6 +71,7 @@ export const getServerSideProps: GetServerSideProps = async (`
`70`	`71`	`return {`
`71`	`72`	`props: {`
`72`	`73`	`locale,`
	`74`	`+ title: data.name,`
`73`	`75`	`ko: data,`
`74`	`76`	`en: data`
`75`	`77`	`}`