'use client';

import { useEffect, useState } from 'react';
import { useRouter } from 'next/navigation';
import toast from 'react-hot-toast';
import api from '@/lib/api';
import { Post } from '@/types';
import PostForm from '../_components/PostForm';
import { PageSpinner } from '@/components/ui/Spinner';

export default function EditPostClient({ id }: { id: string }) {
  const router = useRouter();
  const [post, setPost] = useState<Post | null>(null);
  const [isLoading, setIsLoading] = useState(true);
  const [isSaving, setIsSaving] = useState(false);

  useEffect(() => {
    api.getPost(id)
      .then(setPost)
      .catch(() => { toast.error('Post not found'); router.push('/posts'); })
      .finally(() => setIsLoading(false));
  }, [id, router]);

  const handleSave = async (data: Partial<Post>) => {
    setIsSaving(true);
    try {
      const updated = await api.updatePost(id, data);
      setPost(updated);
      toast.success('Post saved');
    } catch (err) {
      toast.error(err instanceof Error ? err.message : 'Failed to save post');
    } finally {
      setIsSaving(false);
    }
  };

  if (isLoading) return <PageSpinner />;
  if (!post) return null;

  return <PostForm initialData={post} onSave={handleSave} isSaving={isSaving} />;
}