fastpocket/Frontend/app/(admin)/blogs/[slug]/page.tsx

60 lines
1.5 KiB
TypeScript

import fs from "fs";
import matter from "gray-matter";
import BlogContent from "@/sections/BlogContent";
import Link from "next/link";
import Image from "next/image";
import xButton from "@/images/icon-x.svg";
import getPostMetadata from "@/utils/getPostMetaData";
import { headers } from "next/headers";
import React from "react";
import Icon from "@/components/icon";
import Spacer from "@/components/Utilities/Spacer";
const getPostContent = (slug: string) => {
const folder = "blogs/";
const file = `${folder}${slug}.md`;
const content = fs.readFileSync(file, "utf8");
const matterResult = matter(content);
return matterResult;
};
export async function generateMetadata({
params,
}: {
params: { slug: string };
}) {
const { slug } = params;
const headersList = headers();
const siteURL = headersList.get("host");
const post = getPostContent(slug);
return {
title: `${post.data.title}`,
description: `${post.data.subtitle}`,
alternates: {
canonical: `https://${siteURL}/blogs/${slug}`,
},
};
}
export const generateStaticParams = async () => {
const posts = getPostMetadata();
return posts.map((post) => ({
slug: post.slug,
}));
};
const PostPage = (props: any) => {
const slug = props.params.slug;
const post = getPostContent(slug);
const showModal = props.searchParams?.modal;
return (
<div className="flex flex-col h-full w-full bg-white dark:bg-black px-8 md:max-w-3xl md:mx-auto">
<Spacer className="pt-32" />
<BlogContent post={post} />
</div>
);
};
export default PostPage;