2025-02-03 12:13:56 +07:00
|
|
|
import BlogComments from "@/components/Blogs/BlogComments";
|
|
|
|
import BlogWidget from "@/components/Blogs/BlogWidget";
|
2025-02-03 03:19:32 +07:00
|
|
|
import CommentForm from "@/components/CommentForm";
|
2025-02-03 12:13:56 +07:00
|
|
|
import { fetchBlogDetail } from "@/services/payload/blog";
|
2025-02-03 09:09:21 +07:00
|
|
|
import { RichText } from "@payloadcms/richtext-lexical/react";
|
|
|
|
import { Metadata } from "next";
|
2025-02-03 12:13:56 +07:00
|
|
|
import Image from "next/image";
|
2025-02-03 09:09:21 +07:00
|
|
|
|
2025-02-03 14:17:13 +07:00
|
|
|
export async function generateMetadata({ params }: { params: { slug: string } }): Promise<Metadata> {
|
2025-02-03 12:13:56 +07:00
|
|
|
const blog = await fetchBlogDetail(params.slug);
|
2025-02-03 09:09:21 +07:00
|
|
|
|
|
|
|
if (!blog) {
|
|
|
|
return {
|
|
|
|
title: "Cochise Oncology",
|
|
|
|
description: "Cochise Oncology",
|
|
|
|
openGraph: {
|
|
|
|
title: "Cochise Oncology",
|
|
|
|
description: "Cochise Oncology",
|
|
|
|
images: [""],
|
|
|
|
},
|
|
|
|
};
|
|
|
|
}
|
|
|
|
|
|
|
|
const title = `${blog.data.title} - Cochise Oncology`;
|
|
|
|
|
|
|
|
return {
|
|
|
|
title: title,
|
|
|
|
description: title,
|
|
|
|
openGraph: {
|
|
|
|
title: title,
|
|
|
|
description: title,
|
|
|
|
images: [blog.imgUrl || ""],
|
|
|
|
},
|
|
|
|
};
|
|
|
|
}
|
|
|
|
|
2025-02-03 14:17:13 +07:00
|
|
|
export default async function SingleBlogPage({ params }: { params: Promise<{ slug: string }> }) {
|
2025-02-03 09:09:21 +07:00
|
|
|
const slug = (await params).slug;
|
2025-02-03 12:13:56 +07:00
|
|
|
const data = await fetchBlogDetail(slug);
|
2025-02-03 09:09:21 +07:00
|
|
|
|
|
|
|
if (!data) return <></>;
|
2025-02-03 03:19:32 +07:00
|
|
|
|
|
|
|
return (
|
|
|
|
<>
|
2025-02-03 14:17:13 +07:00
|
|
|
<section className="page-section bg-dark-1 bg-gradient-gray-dark-1 light-content bg-scroll overflow-hidden">
|
2025-02-03 03:19:32 +07:00
|
|
|
{/* <!-- Background Shape --> */}
|
2025-02-03 14:17:13 +07:00
|
|
|
<div className="bg-shape-1 opacity-003">
|
|
|
|
<Image src="/assets/images/demo-fancy/bg-shape-1.svg" width={1443} height={844} alt="" />
|
2025-02-03 03:19:32 +07:00
|
|
|
</div>
|
|
|
|
{/* <!-- End Background Shape --> */}
|
|
|
|
|
|
|
|
<div className="container position-relative pt-sm-40 text-center">
|
|
|
|
<div className="row">
|
|
|
|
<div className="col-md-10 offset-md-1 col-lg-8 offset-lg-2">
|
2025-02-03 14:17:13 +07:00
|
|
|
<h1 className="hs-title-10 mb-10 wow fadeInUp">{data.data.title}</h1>
|
2025-02-03 03:19:32 +07:00
|
|
|
{/* Author, Categories, Comments */}
|
2025-02-03 14:17:13 +07:00
|
|
|
<div className="blog-item-data mb-0 wow fadeIn" data-wow-delay="0.2s">
|
2025-02-03 03:19:32 +07:00
|
|
|
<div className="d-inline-block me-3">
|
|
|
|
<a href="#">
|
|
|
|
<i className="mi-clock size-16" />
|
2025-02-03 14:17:13 +07:00
|
|
|
<span className="visually-hidden">Date:</span> {data.createdAt}
|
2025-02-03 03:19:32 +07:00
|
|
|
</a>
|
|
|
|
</div>
|
|
|
|
<div className="d-inline-block me-3">
|
|
|
|
<i className="mi-folder size-16" />
|
2025-02-03 14:17:13 +07:00
|
|
|
<span className="visually-hidden">Categories:</span> <a href="#">Design</a>, <a href="#">Branding</a>
|
2025-02-03 03:19:32 +07:00
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
{/* End Author, Categories, Comments */}
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</section>
|
2025-02-03 14:17:13 +07:00
|
|
|
|
2025-02-03 03:19:32 +07:00
|
|
|
<>
|
|
|
|
{/* Section */}
|
|
|
|
<section className="page-section">
|
|
|
|
<div className="container relative">
|
|
|
|
<div className="row">
|
|
|
|
{/* Content */}
|
|
|
|
<div className="col-md-10 offset-md-1 col-lg-8 offset-lg-2">
|
|
|
|
{/* Post */}
|
|
|
|
<div className="blog-item mb-80 mb-xs-40">
|
|
|
|
<div className="blog-item-body">
|
|
|
|
<div className="mb-40 mb-xs-30">
|
2025-02-03 14:17:13 +07:00
|
|
|
<Image src={data.imgUrl} alt="Image Description" width={1350} height={759} className="round" />
|
2025-02-03 03:19:32 +07:00
|
|
|
</div>
|
2025-02-03 09:09:21 +07:00
|
|
|
<div>
|
|
|
|
<RichText data={data.data.content} />
|
|
|
|
</div>
|
2025-02-03 03:19:32 +07:00
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
{/* End Post */}
|
|
|
|
</div>
|
|
|
|
{/* End Content */}
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</section>
|
|
|
|
{/* End Section */}
|
|
|
|
{/* Divider */}
|
|
|
|
<hr className="mt-0 mb-0" />
|
|
|
|
{/* End Divider */}
|
|
|
|
{/* Section */}
|
|
|
|
<section className="page-section">
|
|
|
|
<div className="container relative">
|
|
|
|
<div className="row mt-n60">
|
|
|
|
<BlogWidget
|
|
|
|
inputClass="newsletter-field form-control input-md circle mb-10"
|
|
|
|
btnClass="btn btn-mod btn-color btn-medium btn-circle btn-hover-anim form-control"
|
|
|
|
/>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</section>
|
|
|
|
</>
|
|
|
|
</>
|
|
|
|
);
|
|
|
|
}
|