diff --git a/src/components/floor-plan/CanvasMenu.jsx b/src/components/floor-plan/CanvasMenu.jsx
index 108ff52d..e9e8ebdc 100644
--- a/src/components/floor-plan/CanvasMenu.jsx
+++ b/src/components/floor-plan/CanvasMenu.jsx
@@ -307,6 +307,7 @@ export default function CanvasMenu(props) {
   const settingsModalOptions = useRecoilState(settingModalFirstOptionsState)
 
   useEffect(() => {
+    console.log(selectedMenu)
     if (selectedMenu === 'placement') {
       onClickPlacementInitialMenu()
     }
@@ -315,8 +316,9 @@ export default function CanvasMenu(props) {
       if (moduleSurfacesArray.length > 0) {
         initRoofs()
         moduleSurfacesArray.forEach((moduleSurface) => {
-          moduleSurface.modules = []
+          canvas.remove(...moduleSurface.modules)
           canvas.remove(moduleSurface)
+          moduleSurface.modules = []
         })
         canvas.renderAll()
       }
@@ -422,7 +424,7 @@ export default function CanvasMenu(props) {
 
   const checkMenuState = (menu) => {
     return (
-      (['2', '3'].includes(canvasSetting?.roofSizeSet) && menu.type === 'surface') ||
+      (['2', '3'].includes(canvasSetting?.roofSizeSet) && menu.type === 'outline') ||
       (selectedMenu === 'module' && ['drawing', 'placement'].includes(menu.type))
     )
   }
@@ -542,7 +544,7 @@ export default function CanvasMenu(props) {
                 key={`canvas-menu-${menu.type}`}
                 className={`canvas-menu-item ${selectedMenu === menu.type ? 'active' : ''}`}
                 onClick={async () => {
-                  if (['2', '3'].includes(canvasSetting?.roofSizeSet) && menu.type === 'surface') return
+                  if (['2', '3'].includes(canvasSetting?.roofSizeSet) && menu.type === 'outline') return
                   if (selectedMenu === 'module' && ['drawing', 'placement'].includes(menu.type)) return
                   await onClickNav(menu)
                 }}
diff --git a/src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx b/src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx
index 2fed8591..bfa86372 100644
--- a/src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx
+++ b/src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx
@@ -456,6 +456,7 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, pla
                           <button
                             className={`${+currentRoof.roofSizeSet !== 3 && currentRoof?.layout === ROOF_MATERIAL_LAYOUT.PARALLEL && 'act'}`}
                             value={ROOF_MATERIAL_LAYOUT.PARALLEL}
+                            disabled={currentRoof?.roofSizeSet === '3'}
                             onClick={() => handleRoofLayoutChange(ROOF_MATERIAL_LAYOUT.PARALLEL)}
                           >
                             {getMessage('modal.roof.alloc.select.parallel')}
@@ -463,6 +464,7 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, pla
                           </button>
                           <button
                             className={`${+currentRoof.roofSizeSet !== 3 && currentRoof.layout === ROOF_MATERIAL_LAYOUT.STAIRS && 'act'}`}
+                            disabled={currentRoof?.roofSizeSet === '3'}
                             value={ROOF_MATERIAL_LAYOUT.STAIRS}
                             onClick={() => handleRoofLayoutChange(ROOF_MATERIAL_LAYOUT.STAIRS)}
                           >