From ef4c533ebacc2cdc97e518f30e9a9350004fcdfb Mon Sep 17 00:00:00 2001
From: dujinkim <dujin.kim@dtsolution.co.kr>
Date: Mon, 28 Apr 2025 02:13:30 +0000
Subject: ~20250428 작업사항
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/form-data/update-form-sheet.tsx | 140 ++++++++++++++++++++---------
 1 file changed, 96 insertions(+), 44 deletions(-)

(limited to 'components/form-data/update-form-sheet.tsx')

diff --git a/components/form-data/update-form-sheet.tsx b/components/form-data/update-form-sheet.tsx
index c52b6833..27f426c1 100644
--- a/components/form-data/update-form-sheet.tsx
+++ b/components/form-data/update-form-sheet.tsx
@@ -4,8 +4,9 @@ import * as React from "react";
 import { z } from "zod";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { useForm } from "react-hook-form";
-import { Loader } from "lucide-react";
+import { Check, ChevronsUpDown, Loader } from "lucide-react";
 import { toast } from "sonner";
+import { useRouter } from "next/navigation"; // Add this import
 
 import {
   Sheet,
@@ -27,15 +28,22 @@ import {
   FormMessage,
 } from "@/components/ui/form";
 import {
-  Select,
-  SelectTrigger,
-  SelectContent,
-  SelectItem,
-  SelectValue,
-} from "@/components/ui/select";
+  Popover,
+  PopoverTrigger,
+  PopoverContent,
+} from "@/components/ui/popover"
+import {
+  Command,
+  CommandInput,
+  CommandList,
+  CommandGroup,
+  CommandItem,
+  CommandEmpty,
+} from "@/components/ui/command"
 
 import { DataTableColumnJSON } from "./form-data-table-columns";
 import { updateFormDataInDB } from "@/lib/forms/services";
+import { cn } from "@/lib/utils";
 
 interface UpdateTagSheetProps
   extends React.ComponentPropsWithoutRef<typeof Sheet> {
@@ -60,6 +68,7 @@ export function UpdateTagSheet({
   ...props
 }: UpdateTagSheetProps) {
   const [isPending, startTransition] = React.useTransition();
+  const router = useRouter(); // Add router hook
 
   // 1) zod 스키마
   const dynamicSchema = React.useMemo(() => {
@@ -104,27 +113,41 @@ export function UpdateTagSheet({
 
   async function onSubmit(values: Record<string, any>) {
     startTransition(async () => {
-      const { success, message } = await updateFormDataInDB(
-        formCode,
-        contractItemId,
-        values
-      );
-      if (!success) {
-        toast.error(message);
-        return;
-      }
-      toast.success("Updated successfully!");
+      try {
+        const { success, message } = await updateFormDataInDB(
+          formCode,
+          contractItemId,
+          values
+        );
+
+        if (!success) {
+          toast.error(message);
+          return;
+        }
+
+        // Success handling
+        toast.success("Updated successfully!");
+
+        // Create a merged object of original rowData and new values
+        const updatedData = {
+          ...rowData,
+          ...values,
+          TAG_NO: rowData?.TAG_NO,
+        };
 
-      // (A) 수정된 값(폼 데이터)을 부모 콜백에 전달
-      onUpdateSuccess?.({
-        // rowData(원본)와 values를 합쳐서 최종 "수정된 row"를 만든다.
-        // tagNumber는 기존 그대로
-        ...rowData,
-        ...values,
-        tagNumber: rowData?.tagNumber,
-      });
+        // Call the success callback
+        onUpdateSuccess?.(updatedData);
 
-      onOpenChange(false);
+        // Refresh the entire route to get fresh data
+        router.refresh();
+
+        // Close the sheet
+        onOpenChange(false);
+
+      } catch (error) {
+        console.error("Error updating form data:", error);
+        toast.error("An unexpected error occurred while updating");
+      }
     });
   }
 
@@ -147,7 +170,7 @@ export function UpdateTagSheet({
               <div className="flex flex-col gap-4 pt-2">
                 {columns.map((col) => {
                   const isTagNumberField =
-                    col.key === "tagNumber" || col.key === "tagDescription";
+                    col.key === "TAG_NO" || col.key === "TAG_DESC";
                   return (
                     <FormField
                       key={col.key}
@@ -178,22 +201,51 @@ export function UpdateTagSheet({
                             return (
                               <FormItem>
                                 <FormLabel>{col.label}</FormLabel>
-                                <Select
-                                  disabled={isTagNumberField}
-                                  value={field.value ?? ""}
-                                  onValueChange={(val) => field.onChange(val)}
-                                >
-                                  <SelectTrigger>
-                                    <SelectValue placeholder="Select an option" />
-                                  </SelectTrigger>
-                                  <SelectContent>
-                                    {col.options?.map((opt) => (
-                                      <SelectItem key={opt} value={opt}>
-                                        {opt}
-                                      </SelectItem>
-                                    ))}
-                                  </SelectContent>
-                                </Select>
+                                <Popover>
+                                  <PopoverTrigger asChild>
+                                    <Button
+                                      variant="outline"
+                                      role="combobox"
+                                      disabled={isTagNumberField}
+                                      className={cn(
+                                        "w-full justify-between",
+                                        !field.value && "text-muted-foreground"
+                                      )}
+                                    >
+                                      {field.value
+                                        ? col.options?.find((opt) => opt === field.value)
+                                        : "Select an option"}
+                                      <ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
+                                    </Button>
+                                  </PopoverTrigger>
+                                  <PopoverContent className="w-full p-0">
+                                    <Command>
+                                      <CommandInput placeholder="Search options..." />
+                                      <CommandEmpty>No option found.</CommandEmpty>
+                                      <CommandList>
+                                        <CommandGroup>
+                                          {col.options?.map((opt) => (
+                                            <CommandItem
+                                              key={opt}
+                                              value={opt}
+                                              onSelect={() => {
+                                                field.onChange(opt);
+                                              }}
+                                            >
+                                              <Check
+                                                className={cn(
+                                                  "mr-2 h-4 w-4",
+                                                  field.value === opt ? "opacity-100" : "opacity-0"
+                                                )}
+                                              />
+                                              {opt}
+                                            </CommandItem>
+                                          ))}
+                                        </CommandGroup>
+                                      </CommandList>
+                                    </Command>
+                                  </PopoverContent>
+                                </Popover>
                                 <FormMessage />
                               </FormItem>
                             );
@@ -253,4 +305,4 @@ export function UpdateTagSheet({
       </SheetContent>
     </Sheet>
   );
-}
+}
\ No newline at end of file
-- 
cgit v1.2.3