added wall asset visiblity toggle and code optimization

app/src/modules/scene/controls/contextControls/contextControls.tsx

@@ -1,4 +1,4 @@
-import { useEffect, useState } from 'react';
+import { useEffect, useRef, useState } from 'react';
 import { useThree } from '@react-three/fiber';
 import { CameraControls, Html, ScreenSpace } from '@react-three/drei';
 import { useContextActionStore, useRenameModeStore, useSelectedAssets } from '../../../../store/builder/store';
@@ -12,6 +12,8 @@ function ContextControls() {
     const { selectedAssets } = useSelectedAssets();
     const { setContextAction } = useContextActionStore();
     const { setIsRenameMode } = useRenameModeStore();
+    const rightDrag = useRef(false);
+    const isRightMouseDown = useRef(false);
 
     useEffect(() => {
         if (selectedAssets.length === 1) {
@@ -68,8 +70,28 @@ function ContextControls() {
     useEffect(() => {
         const canvasElement = gl.domElement;
 
+        const onPointerDown = (evt: any) => {
+            if (evt.button === 2) {
+                isRightMouseDown.current = true;
+                rightDrag.current = false;
+            }
+        };
+
+        const onPointerMove = () => {
+            if (isRightMouseDown.current) {
+                rightDrag.current = true;
+            }
+        };
+
+        const onPointerUp = (evt: any) => {
+            if (evt.button === 2) {
+                isRightMouseDown.current = false;
+            }
+        };
+
         const handleContextClick = (event: MouseEvent) => {
             event.preventDefault();
+            if (rightDrag.current) return;
             if (selectedAssets.length > 0) {
                 setMenuPosition({ x: event.clientX - gl.domElement.width / 2, y: event.clientY - gl.domElement.height / 2 });
                 setCanRender(true);
@@ -85,6 +107,9 @@ function ContextControls() {
         };
 
         if (selectedAssets.length > 0) {
+            canvasElement.addEventListener('pointerdown', onPointerDown);
+            canvasElement.addEventListener('pointermove', onPointerMove);
+            canvasElement.addEventListener('pointerup', onPointerUp);
             canvasElement.addEventListener('contextmenu', handleContextClick)
         } else {
             setCanRender(false);
@@ -95,6 +120,9 @@ function ContextControls() {
         }
 
         return () => {
+            canvasElement.removeEventListener('pointerdown', onPointerDown);
+            canvasElement.removeEventListener('pointermove', onPointerMove);
+            canvasElement.removeEventListener('pointerup', onPointerUp);
             canvasElement.removeEventListener('contextmenu', handleContextClick);
         };
     }, [gl, selectedAssets]);