feat: level mode menu

app/design/ui/HtmlUi.tsx

@@ -34,6 +34,7 @@ import SiteModeContextMenu from "./menu/site/SiteModeContextMenu"
 import BuildingModeContextMenu from "./menu/building/BuildingModeContextMenu"
 import MetricsWidget from "./metrics/MetricsWidget"
 import { useHouses } from "../../db/user"
+import LevelModeContextMenu from "./menu/level/LevelModeContextMenu"
 
 type Props = {
   controlsEnabled: boolean
@@ -83,7 +84,7 @@ const HtmlUi = (props: Props) => {
       case SiteCtxModeEnum.Enum.BUILDING:
         return () => <BuildingModeContextMenu {...{ x, y, scopeElement }} />
       default:
-        return () => null
+        return () => <LevelModeContextMenu {...{ x, y, scopeElement }} />
       // case SiteCtxModeEnum.Enum.LEVEL:
       //   return <LevelModeContextMenu {...{x, y,  scopeElement}}/>
     }

app/design/ui/menu/building/BuildingModeContextMenu.tsx

@@ -11,8 +11,8 @@ import ContextMenu from "../common/ContextMenu"
 import ContextMenuButton from "../common/ContextMenuButton"
 import { ModeContextMenuProps } from "../common/props"
 import ChangeLevelType from "./ChangeLevelType"
-import ChangeMaterial from "./ChangeMaterial"
-import ChangeWindows from "./ChangeWindows"
+import ChangeWindows from "../common/ChangeWindows"
+import ChangeMaterial from "../common/ChangeMaterial"
 
 const BuildingModeContextMenu = ({
   x,
@@ -60,13 +60,11 @@ const BuildingModeContextMenu = ({
         onComplete={props.onClose}
       /> */}
 
-      <Suspense fallback={null}>
-        <ChangeMaterial
-          houseTransformsGroup={houseTransformsGroup}
-          scopeElement={scopeElement}
-          close={close}
-        />
-      </Suspense>
+      <ChangeMaterial
+        houseTransformsGroup={houseTransformsGroup}
+        scopeElement={scopeElement}
+        close={close}
+      />
 
       <ChangeWindows
         houseTransformsGroup={houseTransformsGroup}

app/design/ui/menu/building/ChangeMaterial.tsx → app/design/ui/menu/common/ChangeMaterial.tsx

@@ -1,7 +1,7 @@
 import { WatsonHealthSubVolume } from "@carbon/icons-react"
 import { invalidate } from "@react-three/fiber"
 import { flow, pipe } from "fp-ts/lib/function"
-import { useRef } from "react"
+import { Fragment, Suspense, useRef } from "react"
 import { suspend } from "suspend-react"
 import { MeshStandardMaterial } from "three"
 import { Material } from "../../../../../server/data/materials"
@@ -35,7 +35,7 @@ type MaterialOpt = {
   threeMaterial: MeshStandardMaterial
 }
 
-const ChangeMaterial = (props: Props) => {
+const ChangeMaterialOptions = (props: Props) => {
   const {
     houseTransformsGroup,
     scopeElement: { ifcTag },
@@ -96,10 +96,7 @@ const ChangeMaterial = (props: Props) => {
   const closing = useRef(false)
 
   return (
-    <ContextMenuNested
-      icon={<WatsonHealthSubVolume size={20} />}
-      label={`Change material`}
-    >
+    <Fragment>
       <ContextMenuHeading>{element?.name}</ContextMenuHeading>
       <Radio
         options={options.map((x) => ({
@@ -141,8 +138,21 @@ const ChangeMaterial = (props: Props) => {
           invalidate()
         }}
       />
-    </ContextMenuNested>
+    </Fragment>
   )
 }
 
+const ChangeMaterial = (props: Props) => {
+  return (
+    <ContextMenuNested
+      long
+      label={`Change material`}
+      icon={<WatsonHealthSubVolume size={20} />}
+    >
+      <Suspense fallback={null}>
+        <ChangeMaterialOptions {...props} />
+      </Suspense>
+    </ContextMenuNested>
+  )
+}
 export default ChangeMaterial

app/design/ui/menu/building/ChangeWindows.tsx → app/design/ui/menu/common/ChangeWindows.tsx

@@ -8,10 +8,7 @@ import systemsDB from "../../../../db/systems"
 import { Opening } from "../../../../ui/icons"
 import Radio from "../../../../ui/Radio"
 import { A, O, Ord, S, someOrError, T } from "../../../../utils/functions"
-import {
-  setInvisibleNoRaycast,
-  setVisibleAndRaycast,
-} from "../../../../utils/three"
+import { setInvisibleNoRaycast } from "../../../../utils/three"
 import { getWindowTypeAlternatives } from "../../../../workers/layouts/modules"
 import { getSide } from "../../../state/camera"
 import { ScopeElement } from "../../../state/scope"
@@ -27,7 +24,7 @@ import {
   ModuleGroup,
   ModuleGroupUse,
 } from "../../../ui-3d/fresh/scene/userData"
-import ContextMenuNested from "../common/ContextMenuNested"
+import ContextMenuNested from "./ContextMenuNested"
 
 type WindowTypeOption = {
   label: string
@@ -210,8 +207,6 @@ const ChangeWindowsOptions = (props: Props) => {
 }
 
 const ChangeWindows = (props: Props) => {
-  const { houseTransformsGroup, scopeElement, close } = props
-
   return (
     <ContextMenuNested
       long

app/design/ui/menu/level/LevelModeContextMenu.tsx

@@ -0,0 +1,57 @@
+import { invalidate } from "@react-three/fiber"
+import { pipe } from "fp-ts/lib/function"
+import { Suspense } from "react"
+import { Pencil } from "../../../../ui/icons"
+import { someOrError } from "../../../../utils/functions"
+import { closeMenu } from "../../../state/menu"
+import { downMode } from "../../../state/siteCtx"
+import { findFirstGuardUp } from "../../../ui-3d/fresh/helpers/sceneQueries"
+import { isHouseTransformsGroup } from "../../../ui-3d/fresh/scene/userData"
+import ContextMenu from "../common/ContextMenu"
+import ContextMenuButton from "../common/ContextMenuButton"
+import { ModeContextMenuProps } from "../common/props"
+import ChangeMaterial from "../common/ChangeMaterial"
+import ChangeWindows from "../common/ChangeWindows"
+
+const LevelModeContextMenu = ({ x, y, scopeElement }: ModeContextMenuProps) => {
+  const close = () => {
+    closeMenu()
+    invalidate()
+  }
+
+  const houseTransformsGroup = pipe(
+    scopeElement.object,
+    findFirstGuardUp(isHouseTransformsGroup),
+    someOrError(
+      `no HouseTransformsGroup found upwards of: ${JSON.stringify(
+        scopeElement,
+        null,
+        2
+      )}`
+    )
+  )
+
+  return (
+    <ContextMenu
+      {...{
+        pageX: x,
+        pageY: y,
+        onClose: close,
+      }}
+    >
+      <ChangeMaterial
+        houseTransformsGroup={houseTransformsGroup}
+        scopeElement={scopeElement}
+        close={close}
+      />
+
+      <ChangeWindows
+        houseTransformsGroup={houseTransformsGroup}
+        scopeElement={scopeElement}
+        close={close}
+      />
+    </ContextMenu>
+  )
+}
+
+export default LevelModeContextMenu