web-humas-fe/app/static/[slug]/page.tsx

57 lines
1.6 KiB
TypeScript

"use client";
import { HumasLayout } from "@/components/layout/humas-layout";
import { getCustomStaticDetailBySlug } from "@/services/static-page-service";
import { Card, CircularProgress } from "@heroui/react";
import { useParams } from "next/navigation";
import { useEffect, useState } from "react";
export default function StaticPage() {
const params = useParams();
const slug = params.slug;
const [customData, setCustomData] = useState<any>();
useEffect(() => {
setCustomData(undefined);
initFetch();
}, [slug]);
const initFetch = async () => {
const res = await getCustomStaticDetailBySlug(slug ? String(slug) : "");
const data = res?.data?.data;
setCustomData(data);
};
const [hasMounted, setHasMounted] = useState(false);
useEffect(() => {
setHasMounted(true);
}, []);
if (!hasMounted) return null;
return (
<HumasLayout>
{customData ? (
<>
<div className="flex justify-center items-center">
<div className="pt-4 hidden md:block">
<img src="/al.png" alt="" className="" />
</div>
<div className="font-bold text-lg md:text-2xl text-[#DD8306]">
{customData?.title}
</div>
<div className="hidden md:block absolute pb-10 pl-[310px]">
<img src="spark.png" alt="" />
</div>
</div>
<div className="rounded-md p-2 md:px-10 ">
<div dangerouslySetInnerHTML={{ __html: customData?.htmlBody }} />
</div>
</>
) : (
<div className="w-full justify-center flex">NO DATA</div>
)}
</HumasLayout>
);
}