"use client";

import { useParams } from "next/navigation";
import { useEffect, useState } from "react";
import ComponentCard from "@/src/components/admin/common/ComponentCard";
import PageProtection from "@/src/components/admin/common/PageProtection";
import AddSuccessStoryForm from "../add-success-story";

export default function EditSuccessStoryPage() {
  const params = useParams();
  const [itemId, setItemId] = useState<number | undefined>(undefined);

  useEffect(() => {
    if (params?.id) {
      setItemId(Number(params.id));
    }
  }, [params?.id]);

  return (
    <div className="space-y-6">
      <PageProtection pageSlug="success-story.add-success-story">
        <ComponentCard
          title="Success Story Management | Edit Success Story"
          desc="Create, edit, and manage success stories."
        >
          <AddSuccessStoryForm id={itemId} />
        </ComponentCard>
      </PageProtection>
    </div>
  );
}