datepicker 날짜가 하루 전 날로 들어가는 오류 수정

packages/common/business_components/src/ui/date_picker/index.tsx

@@ -32,10 +32,27 @@ export function DatePicker({
 }: DatePickerProps) {
   const [open, setOpen] = useState(false);
 
+  // const handleSelect = (date: Date | undefined) => {
+  //   console.log("날짜", date)
+  //   if (!readOnly) {
+  //     // readOnly가 아닐 때만 변경 허용
+  //     field.onChange(date); // React Hook Form 업데이트
+  //     setOpen(false);
+  //   }
+  // };
+
+  //저장시 9시간 전으로 돌아가는 문제
   const handleSelect = (date: Date | undefined) => {
     if (!readOnly) {
-      // readOnly가 아닐 때만 변경 허용
-      field.onChange(date); // React Hook Form 업데이트
+      if (date) {
+        const utcMidnight = new Date(
+          //utc 삽입
+          Date.UTC(date.getFullYear(), date.getMonth(), date.getDate())
+        );
+        field.onChange(utcMidnight);
+      } else {
+        field.onChange(undefined);
+      }
       setOpen(false);
     }
   };
@@ -53,17 +70,17 @@ export function DatePicker({
             className={
               !selectClass
                 ? cn(
-                    "w-[240px] pl-3 text-left font-normal",
-                    !field?.value && "text-muted-foreground",
+                  "w-[240px] pl-3 text-left font-normal",
+                  !field?.value && "text-muted-foreground",
 
-                    //감리 지적사항으로 삭제 예정 리드온리는 리드온리 로만 보일수 있도록 수정
-                    // disabled={readOnly} // readOnly일 때 버튼 비활성화
-                    //readOnly && "opacity-60 cursor-not-allowed"  감리 지적사항으로
-                  )
+                  //감리 지적사항으로 삭제 예정 리드온리는 리드온리 로만 보일수 있도록 수정
+                  // disabled={readOnly} // readOnly일 때 버튼 비활성화
+                  //readOnly && "opacity-60 cursor-not-allowed"  감리 지적사항으로
+                )
                 : cn(
-                    selectClass,
-                    // , readOnly && "opacity-60 cursor-not-allowed"
-                  )
+                  selectClass,
+                  // , readOnly && "opacity-60 cursor-not-allowed"
+                )
             }
           >
             {field?.value ? (
@@ -87,10 +104,10 @@ export function DatePicker({
           className="w-full"
 
           //-- 데이트 피커가 드롭박스 형태로 년월을 선택할수 있도록 하는 Props 로 활성화 되면 드롭박스로 선택
-          
-        //   captionLayout="dropdown-buttons"
-        //   fromYear={2000}
-        //   toYear={new Date().getFullYear()}  
+
+          //   captionLayout="dropdown-buttons"
+          //   fromYear={2000}
+          //   toYear={new Date().getFullYear()}  
           toDate={new Date()} // 금일까지만 표시됨 (금일 이후는 안보임)
           showOutsideDays={false} // 금월 까지만 표출되도록 
           mode="single"