feat: add dynamic og from defaultMeta

SuperSuperDev · Oct 10, 2021 · de1607b · de1607b
1 parent 782756b
commit de1607b
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 0 deletions.
diff --git a/src/components/Seo.tsx b/src/components/Seo.tsx
@@ -1,6 +1,8 @@
 import Head from 'next/head';
 import { useRouter } from 'next/router';
 
+import { openGraph } from '@/lib/helper';
+
 const defaultMeta = {
   title: 'Next.js + Tailwind CSS + TypeScript Starter',
   site_name: 'Next.js + Tailwind CSS + TypeScript Starter',
@@ -11,6 +13,7 @@ const defaultMeta = {
   type: 'website',
   robots: 'follow, index',
 };
+defaultMeta.image = openGraph(defaultMeta.title, defaultMeta.description);
 
 type SeoProps = {
   date?: string;

diff --git a/src/lib/helper.ts b/src/lib/helper.ts
@@ -1,3 +1,9 @@
 export function classNames(...classes: string[]): string {
   return classes.filter(Boolean).join(' ');
 }
+
+export function openGraph(title: string, description: string): string {
+  const ogTitle = encodeURIComponent(title.trim());
+  const ogDesc = encodeURIComponent(description.trim());
+  return `https://thcl.dev/og?title=${ogTitle}&description=${ogDesc}`;
+}