폴리곤 context 추가

src/components/common/context-menu/QPolygonContextMenu.jsx

@@ -7,12 +7,12 @@ export default function QPolygonContextMenu(props) {
 
   //   const children = useRecoilValue(modalContent)
   const [contextMenu, setContextMenu] = useState({ visible: false, x: 0, y: 0 })
-  const optionName = canvasProps.getActiveObject().initOptions.name
 
+  const polygon = canvasProps.getActiveObject() //액티브된 객체를 가져옴
   let contextType = ''
 
-  if (optionName.indexOf('guide') > -1) {
+  if (polygon.initOptions.name.indexOf('guide') > -1) {
-    contextType = 'surface'
+    contextType = 'surface' //면형상
   }
 
   useEffect(() => {
@@ -20,6 +20,9 @@ export default function QPolygonContextMenu(props) {
 
     const handleContextMenu = (e) => {
       e.preventDefault() //기존 contextmenu 막고
+
+      // Fabric.js 상의 객체에 직접 이벤트를 트리거할 수는 없으므로,
+      // 캔버스 요소에 이벤트를 디스패치하여 처리
       setContextMenu({ visible: true, x: e.pageX, y: e.pageY })
       canvasProps.upperCanvasEl.removeEventListener('contextmenu', handleContextMenu) //한번 노출 후 이벤트 삭제
     }
@@ -72,9 +75,6 @@ export default function QPolygonContextMenu(props) {
             </li>
             {contextType === 'surface' ? (
               <>
-                <li style={{ padding: '8px 12px', cursor: 'pointer' }} onClick={() => handleMenuClick(4)}>
-                  모듈,회로구성
-                </li>
                 <li style={{ padding: '8px 12px', cursor: 'pointer' }} onClick={() => handleMenuClick(4)}>
                   모듈 채우기
                 </li>