From f5d1783972af02f29dc98647fc4f204e7bafa95a Mon Sep 17 00:00:00 2001
From: "hyojun.choi" <chlgkwk123@nate.com>
Date: Tue, 27 Aug 2024 14:02:06 +0900
Subject: [PATCH] =?UTF-8?q?=EA=B7=B8=EB=A6=AC=EB=93=9C=20=EC=B4=88?=
 =?UTF-8?q?=EA=B8=B0=ED=99=94=20=EA=B8=B0=EB=8A=A5=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Roof2.jsx | 35 ++++++++++++++++++++++++++---------
 1 file changed, 26 insertions(+), 9 deletions(-)

diff --git a/src/components/Roof2.jsx b/src/components/Roof2.jsx
index 217d0521..6c8c4155 100644
--- a/src/components/Roof2.jsx
+++ b/src/components/Roof2.jsx
@@ -13,6 +13,7 @@ import {
   compassState,
   currentObjectState,
   fontSizeState,
+  guideLineState,
   roofMaterialState,
   roofState,
   sortedPolygonArray,
@@ -30,6 +31,7 @@ import SettingsModal from './SettingsModal'
 import { useAxios } from '@/hooks/useAxios'
 import QPolygonContextMenu from '@/components/common/context-menu/QPolygonContextMenu'
 import QLineContextMenu from '@/components/common/context-menu/QLineContextMenu'
+import { isObjectNotEmpty } from '@/util/common-utils'
 
 export default function Roof2(props) {
   const { name, userId, email, isLoggedIn } = props
@@ -72,6 +74,8 @@ export default function Roof2(props) {
   const [scale, setScale] = useState(1)
   const currentObject = useRecoilValue(currentObjectState)
 
+  const [guideLine, setGuideLine] = useRecoilState(guideLineState)
+
   //canvas 썸네일
   const [thumbnails, setThumbnails] = useState([])
   const thumbnailProps = {
@@ -575,15 +579,28 @@ export default function Roof2(props) {
       {canvas && (
         <>
           <div className=" my-8 w-full text:pretty">
-            <Button
-              className="m-1 p-2"
-              onClick={() => {
-                setContent(<SettingsModal canvasProps={canvas} />)
-                setOpen(true)
-              }}
-            >
-              그리드 설정
-            </Button>
+            {!isObjectNotEmpty(guideLine) ? (
+              <Button
+                className="m-1 p-2"
+                onClick={() => {
+                  setContent(<SettingsModal canvasProps={canvas} />)
+                  setOpen(true)
+                }}
+              >
+                그리드 설정
+              </Button>
+            ) : (
+              <Button
+                className="m-1 p-2"
+                onClick={() => {
+                  const guideLines = canvas?._objects.filter((obj) => obj.name === 'guideLine' || obj.name === 'guideDot')
+                  guideLines?.forEach((item) => canvas?.remove(item))
+                  setGuideLine({})
+                }}
+              >
+                그리드 초기화
+              </Button>
+            )}
             <Button className="m-1 p-2" color={`${mode === Mode.DEFAULT ? 'primary' : 'default'}`} onClick={() => setMode(Mode.DEFAULT)}>
               모드 DEFAULT
             </Button>