"use client"; import { Skeleton } from "@/components/ui/skeleton"; import React, { useEffect, useState } from "react"; import ReactMarkdown from "react-markdown"; import Head from "next/head"; const Page = ({ params }: { params: { slug: string } }) => { const { slug } = params; const [page, setPage] = useState<{ title: string; content: string } | null>( null ); const [loading, setLoading] = useState(true); const [notFound, setNotFound] = useState(false); useEffect(() => { const fetchPage = async () => { try { const response = await fetch(`/api/mdx/pages/${slug}`); if (response.ok) { const data = await response.json(); setPage(data); return (document.title = `${data.title} Change Log | SVRJS`); } else { if (response.status === 404) { setNotFound(true); return (document.title = "404 Not Found"); } } } catch (error) { console.error("Failed to load page", error); setNotFound(true); } finally { setLoading(false); } }; fetchPage(); }, [slug]); if (loading) { return (
); } if (notFound) { return (

404 Page not Found

Please return back to Home

); } if (!page) { return null; } return ( <>

{page.title} Change Log

{page.content}
); }; export default Page;