'use client';
import { useActionState } from 'react';
import type { FormState } from '@/app/(auth)/actions';
export function AuthForm({ action, children, submit, hidden }: { action: (s: FormState, f: FormData) => Promise<FormState>; children: React.ReactNode; submit: string; hidden?: Record<string, string> }) {
  const [state, act, pending] = useActionState(action, undefined);
  return (
    <form action={act} className="space-y-4">
      {hidden && Object.entries(hidden).map(([k, v]) => <input key={k} type="hidden" name={k} value={v} />)}
      {children}
      {state?.error && <div className="border-l-2 border-survey bg-survey/5 px-3 py-2 text-sm text-survey-dark">{state.error}</div>}
      <button disabled={pending} className="btn-ink w-full disabled:opacity-60">{pending ? 'Bekleyin…' : submit}</button>
    </form>
  );
}
