Merge branch 'iipbs/as/dev'

apps/as/src/pages/esntl-atch-file-mng/ui/esntl-atch-file-form-dialog.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { useEffect, useId, useState } from "react";
+import { useEffect, useId, useRef, useState } from "react";
 import { useForm } from "react-hook-form";
 
 import { Paperclip, X } from "lucide-react";
@@ -61,6 +61,7 @@ function EsntlAtchFileFormDialog({
   onSubmit,
 }: EsntlAtchFileFormDialogProps) {
   const formId = useId();
+  const atchFileGroupIdRef = useRef("");
   const [uploadedFiles, setUploadedFiles] = useState<UploadedTemplateFile[]>([]);
 
   const { register, handleSubmit, reset, setValue, watch } = useForm<EsntlAtchFileFormValues>({
@@ -75,13 +76,16 @@ function EsntlAtchFileFormDialog({
 
   const docSeComCd = watch("docSeComCd");
   const esntlAtchYn = watch("esntlAtchYn");
-  const atchFileGroupId = watch("atchFileGroupId");
 
   const { uploadFileAsync, isUploading, uploads } = useTus({
     onSuccess: (atflCd, atflId, _file, fileKey) => {
       if (!atflCd || !atflId) return;
 
-      setValue("atchFileGroupId", atflCd, { shouldDirty: true });
+      if (!atchFileGroupIdRef.current) {
+        atchFileGroupIdRef.current = atflCd;
+        setValue("atchFileGroupId", atflCd, { shouldDirty: true });
+      }
+
       setUploadedFiles((prev) =>
         prev.map((item) => (item.fileKey === fileKey ? { ...item, atflCd, atflId } : item)),
       );
@@ -107,6 +111,7 @@ function EsntlAtchFileFormDialog({
         }));
 
       setUploadedFiles(initialFiles);
+      atchFileGroupIdRef.current = initial.atchFileGroupId ?? "";
       reset({
         docSeComCd: initial.docSeComCd ?? "",
         esntlAtchFileNm: initial.esntlAtchFileNm ?? "",
@@ -118,6 +123,7 @@ function EsntlAtchFileFormDialog({
     }
 
     setUploadedFiles([]);
+    atchFileGroupIdRef.current = "";
     reset({
       docSeComCd: "",
       esntlAtchFileNm: "",
@@ -132,15 +138,20 @@ function EsntlAtchFileFormDialog({
 
     for (const file of Array.from(files)) {
       const fileKey = createUploadKey(file);
-      const existingAtflCd = atchFileGroupId || uploadedFiles.find((item) => item.atflCd)?.atflCd;
+      const existingAtflCd = atchFileGroupIdRef.current;
 
       setUploadedFiles((prev) => [...prev, { fileName: file.name, fileKey }]);
 
       try {
-        await uploadFileAsync(file, {
+        const atflCd = await uploadFileAsync(file, {
           fileKey,
           metadata: existingAtflCd ? { atflCd: existingAtflCd } : undefined,
         });
+
+        if (!existingAtflCd) {
+          atchFileGroupIdRef.current = atflCd;
+          setValue("atchFileGroupId", atflCd, { shouldDirty: true });
+        }
       } catch {
         // onError callback handles cleanup
       }
@@ -164,7 +175,8 @@ function EsntlAtchFileFormDialog({
     const nextFiles = uploadedFiles.filter((_, index) => index !== fileIndex);
     setUploadedFiles(nextFiles);
 
-    const nextGroupId = nextFiles.find((item) => item.atflCd)?.atflCd ?? "";
+    const nextGroupId = nextFiles[0]?.atflCd ?? "";
+    atchFileGroupIdRef.current = nextGroupId;
     setValue("atchFileGroupId", nextGroupId, { shouldDirty: true });
   }