feat: migrate to new metadata component

flowergardn · Dec 9, 2023 · 084c1de · 084c1de
1 parent f45e505
commit 084c1de
Show file tree

Hide file tree

Showing 7 changed files with 16 additions and 47 deletions.
diff --git a/src/components/Meta.tsx b/src/components/Meta.tsx
@@ -1,7 +1,7 @@
 import Head from "next/head";
 
 let defaults = {
-  title: "bday.quest",
+  title: "bday.quest (beta)",
   description: "Create virtual birthday cards",
   color: "#eb5d71",
 };

diff --git a/src/pages/c/[id]/index.tsx b/src/pages/c/[id]/index.tsx
@@ -1,10 +1,10 @@
 import type { GetStaticProps, NextPage } from "next";
-import Head from "next/head";
 import Navbar from "~/components/Navbar";
 import { generateSSGHelper } from "~/server/api/helpers/ssgHelper";
 import { api } from "~/utils/api";
 import Signatures from "~/components/Signatures";
 import Link from "next/link";
+import Meta from "~/components/Meta";
 
 const CardPage: NextPage<{ id: string }> = ({ id }) => {
   const {
@@ -54,12 +54,10 @@ const CardPage: NextPage<{ id: string }> = ({ id }) => {
 
   return (
     <>
-      <Head>
-        <title>Sign this card | bday.quest (beta)</title>
-        <meta name="description" content={data.description} />
-        <link rel="icon" href="/favicon.ico" />
-      </Head>
-
+      <Meta
+        title="Sign this card | bday.quest (beta)"
+        description={data.description}
+      />
       <Navbar />
       <div className="hero flex min-h-screen flex-col items-center bg-base-100">
         <div className="card mb-12 mt-20 w-full max-w-sm shrink-0  p-6 shadow-2xl">

diff --git a/src/pages/c/[id]/sign.tsx b/src/pages/c/[id]/sign.tsx
@@ -1,11 +1,11 @@
 import type { GetStaticProps, NextPage } from "next";
-import Head from "next/head";
 import Navbar from "~/components/Navbar";
 import { generateSSGHelper } from "~/server/api/helpers/ssgHelper";
 import { api } from "~/utils/api";
 import { useForm } from "react-hook-form";
 import type { SubmitHandler } from "react-hook-form";
 import { useUser } from "@clerk/nextjs";
+import Meta from "~/components/Meta";
 
 type FormValues = {
   message: string;
@@ -111,11 +111,7 @@ const CardPage: NextPage<{ id: string }> = ({ id }) => {
 
   return (
     <>
-      <Head>
-        <title>bday.quest</title>
-        <meta name="description" content={data.description} />
-        <link rel="icon" href="/favicon.ico" />
-      </Head>
+      <Meta />
 
       <Navbar />
       <div className="hero flex min-h-screen flex-col items-center bg-base-100">

diff --git a/src/pages/create.tsx b/src/pages/create.tsx
@@ -1,9 +1,9 @@
-import Head from "next/head";
 import { useForm } from "react-hook-form";
 import { api } from "~/utils/api";
 import dayjs from "dayjs";
 import Navbar from "~/components/Navbar";
 import { Textbox } from "~/components/EditCard";
+import Meta from "~/components/Meta";
 
 export default function CreateCard() {
   type CardDataValues = {
@@ -21,14 +21,7 @@ export default function CreateCard() {
 
   return (
     <>
-      <Head>
-        <title>bday.quest | Create</title>
-        <meta
-          name="description"
-          content="Create custom birthday cards for your friends."
-        />
-        <link rel="icon" href="/favicon.ico" />
-      </Head>
+      <Meta title="Create a card | bday.quest (beta)" />
 
       <Navbar />
       <div className="hero min-h-screen bg-base-200">

diff --git a/src/pages/index.tsx b/src/pages/index.tsx
@@ -1,6 +1,6 @@
 import { SignInButton, useAuth } from "@clerk/nextjs";
-import Head from "next/head";
 import Link from "next/link";
+import Meta from "~/components/Meta";
 import Navbar from "~/components/Navbar";
 
 export default function Home() {
@@ -30,14 +30,7 @@ export default function Home() {
 
   return (
     <>
-      <Head>
-        <title>bday.quest</title>
-        <meta
-          name="description"
-          content="Create custom birthday cards for your friends."
-        />
-        <link rel="icon" href="/favicon.ico" />
-      </Head>
+      <Meta title="bday.quest (beta)" />
 
       <Navbar />
       <div className="hero min-h-screen bg-base-200">

diff --git a/src/pages/manage/[id].tsx b/src/pages/manage/[id].tsx
@@ -1,10 +1,10 @@
 import type { GetStaticProps, NextPage } from "next";
-import Head from "next/head";
 import type { SubmitHandler } from "react-hook-form";
 import { useForm } from "react-hook-form";
 import toast from "react-hot-toast";
 import { Textbox } from "~/components/EditCard";
 import type { CardDataValues } from "~/components/EditCard";
+import Meta from "~/components/Meta";
 import Navbar from "~/components/Navbar";
 import Signatures from "~/components/Signatures";
 import { generateSSGHelper } from "~/server/api/helpers/ssgHelper";
@@ -72,11 +72,7 @@ const ManageCard: NextPage<{ id: string }> = ({ id }) => {
 
   return (
     <>
-      <Head>
-        <title>bday.quest</title>
-        <meta name="description" content={data.description} />
-        <link rel="icon" href="/favicon.ico" />
-      </Head>
+      <Meta />
 
       <Navbar />
       <div className="hero flex min-h-screen items-center justify-center  bg-base-200">

diff --git a/src/pages/manage/index.tsx b/src/pages/manage/index.tsx
@@ -1,5 +1,4 @@
 import type { Cards } from "@prisma/client";
-import Head from "next/head";
 import { Cake, Calendar, Eye, Pen, Trash } from "~/components/Icons";
 import Navbar from "~/components/Navbar";
 import Link from "next/link";
@@ -8,6 +7,7 @@ import toast from "react-hot-toast";
 
 import dayjs from "dayjs";
 import relativeTime from "dayjs/plugin/relativeTime";
+import Meta from "~/components/Meta";
 dayjs.extend(relativeTime);
 
 export default function ManageCards() {
@@ -116,14 +116,7 @@ export default function ManageCards() {
 
   return (
     <>
-      <Head>
-        <title>bday.quest | Manage</title>
-        <meta
-          name="description"
-          content="Create custom birthday cards for your friends."
-        />
-        <link rel="icon" href="/favicon.ico" />
-      </Head>
+      <Meta title="Manage | bday.quest (beta)" />
 
       <Navbar />
       <div className="hero flex min-h-screen flex-col items-center bg-base-100">