From f2f720d6ffd4586c74fa003388b9c6dad038ee13 Mon Sep 17 00:00:00 2001
From: changkyu choi <okoookoo@naver.com>
Date: Mon, 6 Jan 2025 10:16:42 +0900
Subject: [PATCH] =?UTF-8?q?=EB=B0=B0=EC=B9=98=EB=A9=B4=EC=B4=88=EA=B8=B0?=
 =?UTF-8?q?=EC=84=A4=EC=A0=95=20=EC=88=98=EC=A0=95=20-=20setCurrentRoof=20?=
 =?UTF-8?q?=EC=82=AC=EC=9A=A9=20=EB=B0=8F=20roofMaterials=20=EC=B4=88?=
 =?UTF-8?q?=EA=B8=B0=20=EC=84=A4=EC=A0=95=20=EC=A0=81=EC=9A=A9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../placementShape/PlacementShapeSetting.jsx  | 10 +++-------
 src/hooks/option/useCanvasSetting.js          | 19 ++++++++++++++-----
 2 files changed, 17 insertions(+), 12 deletions(-)

diff --git a/src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx b/src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx
index a439481c..e7287e5b 100644
--- a/src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx
+++ b/src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx
@@ -49,7 +49,6 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
   }, [])
 
   useEffect(() => {
-    if (currentRoof.roofMatlCd.length > 0) {
       setBasicSettings({
         ...basicSetting,
         roofsData: {
@@ -63,7 +62,6 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
           roofLayout: currentRoof.layout,
         },
       })
-    }
   }, [basicSetting.roofSizeSet, basicSetting.roofAngleSet, currentRoof])
 
   // Function to update the roofType and corresponding values
@@ -245,13 +243,11 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
                           options={roofMaterials.map((roof, index) => {
                             return { ...roof, name: globalLocale === 'ko' ? roof.roofMatlNm : roof.roofMatlNmJp }
                           })}
-                          //value={roofMaterials.find((r) => r.roofMatlCd === basicSetting.roofs[0]?.roofMatlCd)}
-                          //title={basicSetting.roofs[0]?.roofMatlNm}
                           value={basicSetting.roofSizeSet == 3 ? null : currentRoof.roofMatlCd}                          
                           onChange={(e) => handleRoofTypeChange(e.roofMatlCd)}
-                          //sourceKey="id"
-                          //targetKey="id"
-                          //showKey="name"
+                          sourceKey="id"
+                          targetKey="id"
+                          showKey="name"
                           disabled={basicSetting.roofSizeSet == 3}
                         />
                         {/* <select
diff --git a/src/hooks/option/useCanvasSetting.js b/src/hooks/option/useCanvasSetting.js
index 482d9b39..b99a32d4 100644
--- a/src/hooks/option/useCanvasSetting.js
+++ b/src/hooks/option/useCanvasSetting.js
@@ -1,4 +1,4 @@
-import { useEffect, useState } from 'react'
+import { useEffect, useState, useRef } from 'react'
 import { useRecoilState, useRecoilValue, useResetRecoilState, useSetRecoilState } from 'recoil'
 import {
   adsorptionPointModeState,
@@ -145,11 +145,20 @@ export function useCanvasSetting() {
     setBasicSettings({ ...basicSetting, selectedRoofMaterial: selectedRoofMaterial })
   }
 
-  useEffect(() => {
-    if (roofMaterials) {
-    fetchBasicSettings()
+  const previousRoofMaterialsRef = useRef(null);
+
+  useEffect(() => { // 지붕재 select 정보 비교 후 변경된 것이 없으면 1회만 실행
+    if (JSON.stringify(previousRoofMaterialsRef.current) !== JSON.stringify(roofMaterials)) {
+
+      // 지붕재 select 정보가 존재해야 배치면초기설정 DB 정보 비교 후 지붕재 정보를 가져올 수 있음
+      if (roofMaterials) {
+        fetchBasicSettings();
+      }
+
+      // 이전 값을 업데이트
+      previousRoofMaterialsRef.current = roofMaterials;
     }
-  }, [roofMaterials])
+  }, [roofMaterials]);
 
   useEffect(() => {
     if (!canvas) {