From 86c8e2a9290da341aefc1258399b9c4020cbea9e Mon Sep 17 00:00:00 2001
From: RizqiSyahrendra <rizqialaudinsyahrendra@gmail.com>
Date: Sat, 8 Mar 2025 17:48:10 +0700
Subject: [PATCH] fix: home page jsonLd and move bg video

---
 src/app/(main)/page.tsx                       | 121 +++++++++++++++++-
 src/components/Blogs/BlogDetail.tsx           |   1 -
 .../page.tsx => components/HomeBgVideo.tsx}   |   6 +-
 src/utils/metadata.ts                         |   3 +-
 4 files changed, 120 insertions(+), 11 deletions(-)
 rename src/{app/(main)/home-bg-video/page.tsx => components/HomeBgVideo.tsx} (78%)

diff --git a/src/app/(main)/page.tsx b/src/app/(main)/page.tsx
index 7158c7d..06fdf80 100644
--- a/src/app/(main)/page.tsx
+++ b/src/app/(main)/page.tsx
@@ -1,14 +1,21 @@
-import Parallax from "./home-bg-video/page";
 import Homepage from "@/components/Homepage";
 import { BeforeFooterBlock } from "@/components/Blocks/BeforeFooter";
 import { Metadata, Viewport } from "next";
 import { getDefaultMetadata } from "@/utils/metadata";
+import HomeBgVideo from "@/components/HomeBgVideo";
+import { headers } from "next/headers";
 
 export async function generateMetadata(): Promise<Metadata> {
   const defaultMetadata = await getDefaultMetadata();
   defaultMetadata.title = `Homepage - ${defaultMetadata.openGraph?.siteName}`;
   defaultMetadata.description =
     "Get compassionate care and excellent medical services from COCHISE ONCOLOGY in Sierra Vista, Arizona. We are the largest full-service cancer treatment center between Albuquerque, New Mexico and Tucson, Arizona.";
+  defaultMetadata.keywords = "Cochise Oncology, Oncology, Healthcare, Medical Services, Cancer Treatment";
+
+  if (!!defaultMetadata?.openGraph) {
+    defaultMetadata.openGraph.images = ["/assets/images/cochise-welcome.png"];
+  }
+
   return defaultMetadata;
 }
 
@@ -17,10 +24,118 @@ export const viewport: Viewport = {
   initialScale: 1,
 };
 
-export default function Home() {
+export default async function Home() {
+  const headersList = await headers();
+  const fullUrl = headersList.get("x-full-url");
+  const siteName = headersList.get("x-site-name");
+
+  const jsonLd = {
+    "@context": "https://schema.org",
+    "@graph": [
+      {
+        "@type": "WebPage",
+        "@id": fullUrl,
+        url: fullUrl,
+        name: `Homepage - ${siteName}`,
+        isPartOf: {
+          "@id": `${fullUrl}#website`,
+        },
+        about: {
+          "@id": `${fullUrl}#organization`,
+        },
+        primaryImageOfPage: {
+          "@id": `${fullUrl}#primaryimage`,
+        },
+        image: {
+          "@id": `${fullUrl}#primaryimage`,
+        },
+        thumbnailUrl: [`${fullUrl}assets/images/cochise-welcome.png`],
+        datePublished: "2024-07-18T16:29:29+00:00",
+        dateModified: "2025-02-24T21:01:50+00:00",
+        description:
+          "Get compassionate care and excellent medical services from COCHISE ONCOLOGY in Sierra Vista, Arizona. We are the largest full-service cancer treatment center between Albuquerque, New Mexico and Tucson, Arizona.",
+        breadcrumb: {
+          "@id": `${fullUrl}#breadcrumb`,
+        },
+        inLanguage: "en-US",
+        potentialAction: [
+          {
+            "@type": "ReadAction",
+            target: [fullUrl],
+          },
+        ],
+      },
+      {
+        "@type": "ImageObject",
+        inLanguage: "en-US",
+        "@id": `${fullUrl}#primaryimage`,
+        url: `${fullUrl}assets/images/cochise-welcome.png`,
+        contentUrl: `${fullUrl}assets/images/cochise-welcome.png`,
+        width: 940,
+        height: 788,
+      },
+      {
+        "@type": "BreadcrumbList",
+        "@id": `${fullUrl}#breadcrumb`,
+        itemListElement: [
+          {
+            "@type": "ListItem",
+            position: 1,
+            name: "Home",
+          },
+        ],
+      },
+      {
+        "@type": "WebSite",
+        "@id": `${fullUrl}#website`,
+        url: fullUrl,
+        name: siteName,
+        description: "",
+        publisher: {
+          "@id": `${fullUrl}#organization`,
+        },
+        potentialAction: [
+          {
+            "@type": "SearchAction",
+            target: {
+              "@type": "EntryPoint",
+              urlTemplate: `${fullUrl}?s={search_term_string}`,
+            },
+            "query-input": {
+              "@type": "PropertyValueSpecification",
+              valueRequired: true,
+              valueName: "search_term_string",
+            },
+          },
+        ],
+        inLanguage: "en-US",
+      },
+      {
+        "@type": "Organization",
+        "@id": `${fullUrl}#organization`,
+        name: "Cochise Oncology",
+        url: fullUrl,
+        logo: {
+          "@type": "ImageObject",
+          inLanguage: "en-US",
+          "@id": `${fullUrl}#/schema/logo/image/`,
+          url: `${fullUrl}assets/images/cochise-welcome.png`,
+          contentUrl: `${fullUrl}assets/images/cochise-welcome.png`,
+          width: 500,
+          height: 195,
+          caption: siteName,
+        },
+        image: {
+          "@id": `${fullUrl}#/schema/logo/image/`,
+        },
+      },
+    ],
+  };
+
   return (
     <>
-      <Parallax />
+      <script type="application/ld+json" dangerouslySetInnerHTML={{ __html: JSON.stringify(jsonLd) }} />
+      <HomeBgVideo />
       <Homepage />
       <BeforeFooterBlock />
     </>
diff --git a/src/components/Blogs/BlogDetail.tsx b/src/components/Blogs/BlogDetail.tsx
index a946ea8..3c9b808 100644
--- a/src/components/Blogs/BlogDetail.tsx
+++ b/src/components/Blogs/BlogDetail.tsx
@@ -27,7 +27,6 @@ export default async function BlogDetail({ slug }: BlogDetailProps) {
   }
 
   let author = {};
-  console.log("data?.data?.createdBy", data?.data?.createdBy);
   if (!!data?.data?.createdBy && typeof data?.data?.createdBy !== "number") {
     author = {
       author: {
diff --git a/src/app/(main)/home-bg-video/page.tsx b/src/components/HomeBgVideo.tsx
similarity index 78%
rename from src/app/(main)/home-bg-video/page.tsx
rename to src/components/HomeBgVideo.tsx
index 4c865b9..570c9b4 100644
--- a/src/app/(main)/home-bg-video/page.tsx
+++ b/src/components/HomeBgVideo.tsx
@@ -1,10 +1,6 @@
-// "use client";
+"use client";
 import Hero from "@/components/Hero";
 
-// const ParallaxContainer = dynamic(() => import("@/components/ParallaxContainer"), {
-//   ssr: false,
-// });
-
 export default function HomeBgVideo() {
   return (
     <>
diff --git a/src/utils/metadata.ts b/src/utils/metadata.ts
index 6f80bc8..73dd04a 100644
--- a/src/utils/metadata.ts
+++ b/src/utils/metadata.ts
@@ -17,13 +17,12 @@ export async function getDefaultMetadata(): Promise<Metadata> {
       "max-snippet": -1,
       "max-video-preview": -1,
     },
-    keywords: "Cochise Oncology, Oncology, Healthcare, Medical Services, Cancer Treatment",
     openGraph: {
       title: siteName,
+      siteName,
       type: "website",
       locale: "en_US",
       url: fullUrl,
-      siteName,
     },
     twitter: {
       card: "summary_large_image",