"use client";
import Loader from "@/components/admin/custom ui/Loader";
import SlidersForm from "@/components/admin/sliders/slidersForm";
import ToastMessage from "@/components/common/ToastMessage";
import axios from "axios";
import { useEffect, useState, useCallback } from "react";

const SlidersDetails = ({
  params,
}: {
  params: { id: string };
}) => {
  const [slider, setSlider] = useState<sliderType | null>(null);

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

    if (response.status === 200 || response.status === 201) {

        console.log(response.data.slider)
      setSlider(response.data.slider as sliderType);
      
    } else {
      ToastMessage("Failed to fetch category details", "error");
    }
  }, [params.id]);

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

  return !slider ? <Loader /> : <SlidersForm initialData={slider} />;
};

export default SlidersDetails;