From 3d2a81f73401feb75db3038b5c7c65e92d2586a0 Mon Sep 17 00:00:00 2001 From: EGOIST Date: Mon, 9 May 2022 00:00:13 +0800 Subject: [PATCH] add meta tags --- src/components/common/SEOHead.tsx | 25 +++++++++++++++++++++++++ src/components/site/SiteHome.tsx | 3 ++- src/components/site/SiteLayout.tsx | 12 ++++++++---- src/components/site/SitePage.tsx | 1 + src/pages/_site/[site]/index.tsx | 9 ++++++--- 5 files changed, 42 insertions(+), 8 deletions(-) create mode 100644 src/components/common/SEOHead.tsx diff --git a/src/components/common/SEOHead.tsx b/src/components/common/SEOHead.tsx new file mode 100644 index 00000000..de74ea31 --- /dev/null +++ b/src/components/common/SEOHead.tsx @@ -0,0 +1,25 @@ +import Head from "next/head" + +export const SEOHead: React.FC<{ + title: string + description?: string | null + image?: string | null +}> = ({ title, description, image }) => { + return ( + + {title} + + + + + + + {image && ( + <> + + + + )} + + ) +} diff --git a/src/components/site/SiteHome.tsx b/src/components/site/SiteHome.tsx index 33657de9..0bae7e3d 100644 --- a/src/components/site/SiteHome.tsx +++ b/src/components/site/SiteHome.tsx @@ -3,8 +3,9 @@ import { formatDate } from "~/lib/date" import { Paginated, type PostOnSiteHome } from "~/lib/types" export const SiteHome: React.FC<{ - posts: Paginated + posts?: Paginated }> = ({ posts }) => { + if (!posts) return null return (
{posts.nodes.map((post) => { diff --git a/src/components/site/SiteLayout.tsx b/src/components/site/SiteLayout.tsx index 4ff7347c..0d8bca47 100644 --- a/src/components/site/SiteLayout.tsx +++ b/src/components/site/SiteLayout.tsx @@ -11,7 +11,7 @@ import { UniLink } from "../ui/UniLink" import { IS_PROD } from "~/lib/constants" import { OUR_DOMAIN } from "~/lib/env" import { useRouter } from "next/router" -import Head from "next/head" +import { SEOHead } from "../common/SEOHead" type MenuLink = { text: string @@ -162,11 +162,15 @@ export const SiteLayout: React.FC = ({ }, ].filter(truthy) + const docTitle = title ? `${title} - ${site.name}` : site.name + return ( <> - - {title ? `${title} - ${site.name}` : site.name} - +
+ )