feat: add og meta

denchiklut · denchiklut · commit bdce6c93943e · 2024-10-15T20:47:49.000-07:00
diff --git a/src/client/components/@shared/html/index.tsx b/src/client/components/@shared/html/index.tsx
@@ -14,7 +14,6 @@ export const Html: FC<Props> = ({ nonce, children }) => {
 				<meta charSet='utf-8' />
 				<meta name='viewport' content='width=device-width, initial-scale=1' />
 				{IS_PROD && <link nonce={nonce} rel='manifest' href={basePath('manifest.json')} />}
-				<title>SSR app</title>
 			</head>
 
 			<body>{children}</body>
diff --git a/src/client/components/@shared/page/index.tsx b/src/client/components/@shared/page/index.tsx
@@ -0,0 +1,20 @@
+import type { FC, ReactNode } from 'react'
+
+interface Props {
+	title: string
+	url?: string
+	image?: string
+	description?: string
+	children: ReactNode
+}
+export const Page: FC<Props> = ({ children, url, image, title, description }) => (
+	<>
+		<title>{title}</title>
+		<meta property='og:title' content={title} />
+		{description && <meta property='og:description' content={description} />}
+		{url && <meta property='og:url' content={url} />}
+		{image && <meta property='og:image' content={image} />}
+
+		{children}
+	</>
+)
diff --git a/src/client/pages/about/index.tsx b/src/client/pages/about/index.tsx
@@ -1,5 +1,10 @@
 import { About } from 'components/about'
+import { Page } from '@shared/page'
 
 export default () => {
-	return <About />
+	return (
+		<Page title='SSR: About'>
+			<About />
+		</Page>
+	)
 }
diff --git a/src/client/pages/home/index.tsx b/src/client/pages/home/index.tsx
@@ -1,5 +1,10 @@
 import { Home } from 'components/home'
+import { Page } from '@shared/page'
 
 export default () => {
-	return <Home />
+	return (
+		<Page title='SSR: Home'>
+			<Home />
+		</Page>
+	)
 }
diff --git a/src/client/pages/not-found/index.tsx b/src/client/pages/not-found/index.tsx
@@ -1,3 +1,9 @@
+import { Page } from '@shared/page'
+
 export default () => {
-	return <p>Not found</p>
+	return (
+		<Page title='SSR: Not found'>
+			<p>Not found</p>
+		</Page>
+	)
 }
