import AdminCard from "./AdminCard";
import AdminForm from "./AdminForm";
import AdminButton from "./AdminButton";
import AdminLoadingState from "./AdminLoadingState";
import AdminErrorState from "./AdminErrorState";

interface AdminSettingsFormProps {
  title: string;
  description?: string;
  children: React.ReactNode;
  onSubmit: (e: React.FormEvent) => void | Promise<void>;
  isLoading?: boolean;
  isSaving?: boolean;
  error?: Error | null;
  onRetry?: () => void;
  submitLabel?: string;
  className?: string;
}

export default function AdminSettingsForm({
  title,
  description,
  children,
  onSubmit,
  isLoading = false,
  isSaving = false,
  error = null,
  onRetry,
  submitLabel = "Save Changes",
  className = "",
}: AdminSettingsFormProps) {
  if (isLoading) {
    return (
      <AdminCard>
        <AdminLoadingState message={`Loading ${title.toLowerCase()}...`} />
      </AdminCard>
    );
  }

  if (error) {
    return (
      <AdminCard>
        <AdminErrorState
          title={`Failed to load ${title.toLowerCase()}`}
          message={error.message || "An error occurred"}
          onRetry={onRetry}
        />
      </AdminCard>
    );
  }

  return (
    <AdminCard className={className}>
      <AdminForm onSubmit={onSubmit}>
        {description && <p className="mb-4 text-sm text-slate-400">{description}</p>}
        {children}
        <div className="-mx-6 -mb-6 mt-8 flex justify-end border-t border-slate-800 px-6 py-4">
          <AdminButton type="submit" variant="primary" isLoading={isSaving}>
            {submitLabel}
          </AdminButton>
        </div>
      </AdminForm>
    </AdminCard>
  );
}
