동면 정렬 로직 추가

src/hooks/useCirCuitTrestle.js

@@ -77,7 +77,8 @@ export function useCircuitTrestle(executeEffect = false) {
   const getRoofSurfaceList = () => {
     const roofSurfaceList = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE)
     roofSurfaceList.sort((a, b) => a.left - b.left || b.top - a.top)
-    return roofSurfaceList
+
+    const result = roofSurfaceList
       .map((obj) => {
         return {
           roofSurfaceId: obj.id,
@@ -97,6 +98,36 @@ export function useCircuitTrestle(executeEffect = false) {
         }
       })
       .filter((surface) => surface.moduleList.length > 0)
+
+    // result 배열에서 roofSurface 값을 기준으로 순서대로 정렬한다.
+
+    return groupSort(result)
+  }
+
+  const groupSort = (arr) => {
+    const result = []
+    const seen = new Set() // (roofSurface + "|" + roofSurfaceIncl)
+
+    let remaining = [...arr]
+
+    while (remaining.length > 0) {
+      const { roofSurface, roofSurfaceIncl } = remaining[0]
+      const key = `${roofSurface}|${roofSurfaceIncl}`
+
+      // 해당 그룹 추출
+      const group = remaining.filter((item) => item.roofSurface === roofSurface && item.roofSurfaceIncl === roofSurfaceIncl)
+
+      // 이미 처리했는지 체크 후 저장
+      if (!seen.has(key)) {
+        result.push(...group)
+        seen.add(key)
+      }
+
+      // remaining에서 제거
+      remaining = remaining.filter((item) => !(item.roofSurface === roofSurface && item.roofSurfaceIncl === roofSurfaceIncl))
+    }
+
+    return result
   }
 
   // 모듈 목록