fix:meta data
This commit is contained in:
parent
f5fbf31eb9
commit
55e9b390e4
|
|
@ -1,20 +1,34 @@
|
|||
"use client";
|
||||
import { HumasLayout } from "@/components/layout/humas-layout";
|
||||
import DetailPage from "@/components/main/detail/new-detail";
|
||||
import React, { useEffect, useState } from "react";
|
||||
import { getArticleById } from "@/service/article";
|
||||
import { Metadata } from "next";
|
||||
|
||||
export default function NewsPage() {
|
||||
const [hasMounted, setHasMounted] = useState(false);
|
||||
type Props = {
|
||||
params: { id: string };
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
setHasMounted(true);
|
||||
}, []);
|
||||
export async function generateMetadata({ params }: Props): Promise<Metadata> {
|
||||
const res = await getArticleById(params.id?.split("-")[0]);
|
||||
const article = res?.data?.data;
|
||||
|
||||
// Render
|
||||
if (!hasMounted) return null;
|
||||
return {
|
||||
title: article.title,
|
||||
description: article.description,
|
||||
openGraph: {
|
||||
title: article.title,
|
||||
description: article.description,
|
||||
images: [article.thumbnailUrl],
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
export default async function NewsPage({ params }: Props) {
|
||||
const articleId = params.id?.split("-")[0];
|
||||
const res = await getArticleById(articleId);
|
||||
const article = res?.data?.data;
|
||||
return (
|
||||
<HumasLayout>
|
||||
<DetailPage />
|
||||
<DetailPage datas={article} />
|
||||
</HumasLayout>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -16,7 +16,7 @@ import Head from "next/head";
|
|||
const token = Cookies.get("access_token");
|
||||
const uid = Cookies.get("uie");
|
||||
|
||||
export default function NewsDetailPage() {
|
||||
export default function NewsDetailPage(props: { datas: any }) {
|
||||
const params = useParams();
|
||||
const id: any = params?.id;
|
||||
const pathname = usePathname();
|
||||
|
|
@ -24,7 +24,7 @@ export default function NewsDetailPage() {
|
|||
const [articles, setArticles] = useState<any>([]);
|
||||
|
||||
useEffect(() => {
|
||||
initFetch();
|
||||
// initFetch();
|
||||
getArticles();
|
||||
sendActivity();
|
||||
}, []);
|
||||
|
|
@ -57,7 +57,7 @@ export default function NewsDetailPage() {
|
|||
};
|
||||
return (
|
||||
<>
|
||||
{" "}
|
||||
{/* {" "}
|
||||
<Head>
|
||||
<title>{detailArticle?.title}</title>
|
||||
<meta property="og:title" content={detailArticle?.title} />
|
||||
|
|
@ -72,7 +72,7 @@ export default function NewsDetailPage() {
|
|||
<meta name="twitter:title" content={detailArticle?.title} />
|
||||
<meta name="twitter:description" content={detailArticle?.description} />
|
||||
<meta name="twitter:image" content={detailArticle?.thumbnailUrl} />
|
||||
</Head>
|
||||
</Head> */}
|
||||
<div className="bg-white dark:bg-stone-900">
|
||||
<div className="px-5 lg:px-0 lg:w-[75vw] lg:mx-auto py-8">
|
||||
<div className="flex flex-row gap-4 items-end ">
|
||||
|
|
@ -83,7 +83,7 @@ export default function NewsDetailPage() {
|
|||
<p className=" text-lg">Berita</p>
|
||||
</div>
|
||||
<div className=" lg:flex lg:justify-around gap-4 lg:gap-16 w-full">
|
||||
<DetailNews data={detailArticle} listArticle={articles} />
|
||||
<DetailNews data={props.datas} listArticle={articles} />
|
||||
<div className="w-auto lg:w-[25%] hidden lg:block">
|
||||
<SidebarDetail />
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in New Issue