'use client';

import { startTransition, type FormEvent } from 'react';

/**
 * `<form action={formAction}>` 대신 쓰는 제출 핸들러.
 *
 * **React는 폼 액션이 끝나면 성공·실패를 가리지 않고 폼을 리셋한다.** 그래서 검증 오류가 하나만
 * 나도 사용자가 채운 값이 전부 날아가고, 특히 `type="file"` 입력은 프로그램으로 되채울 수 없어
 * 다음 제출에서는 "이미지를 등록해 주세요"만 반복된다(꾸미기 아이템 등록에서 실제로 그랬다).
 *
 * 액션을 `action` 프롭에 맡기지 않고 transition 안에서 직접 부르면 그 리셋이 일어나지 않는다.
 * 확인: 같은 액션을 두 방식으로 제출했을 때 `action={...}` 쪽만 입력값이 빈 문자열이 됐다.
 *
 * 성공 후 폼을 비워야 하는 화면은 각자 팝업을 닫으므로(다음에 열 때 새 폼이다) 리셋이 필요 없다.
 */
export function submitFormAction(
  event: FormEvent<HTMLFormElement>,
  formAction: (formData: FormData) => void
): void {
  event.preventDefault();
  const formData = new FormData(event.currentTarget);
  startTransition(() => formAction(formData));
}