"use client";

import Loader from "@/components/admin/custom ui/Loader";
import FooterSectionForm from "@/components/admin/footerSections/footerSectionsForm";
import ToastMessage from "@/components/common/ToastMessage";
import axios from "axios";
import { useEffect, useState, useCallback } from "react";

const FooterSectionDetails = ({
  params,
}: {
  params: { id: string };
}) => {
  const [footerSection, setFooterSection] = useState<footerSectionType | null>(null);

  const fetchFooterSectionDetails = useCallback(async () => {
    const response = await axios.get(
      `/api/admin/footerSection/${params.id}`
    );

    if (response.status === 200 || response.status === 201) {
      setFooterSection(response.data as footerSectionType);


    } else {
      ToastMessage("Failed to fetch category details", "error");
    }
  }, [params.id]);

  useEffect(() => {
    fetchFooterSectionDetails();
  }, [fetchFooterSectionDetails]);

  return !setFooterSection ? <Loader /> : <FooterSectionForm initialData={footerSection} />;


};

export default FooterSectionDetails;