diff --git a/app/src/modules/builder/asset/models/model/model.tsx b/app/src/modules/builder/asset/models/model/model.tsx index ff28363..cb19890 100644 --- a/app/src/modules/builder/asset/models/model/model.tsx +++ b/app/src/modules/builder/asset/models/model/model.tsx @@ -270,8 +270,8 @@ function Model({ asset }: { readonly asset: Asset }) { } }, [activeTool, activeModule, deletableFloorItem]); - const handlePointerOut = useCallback((asset: Asset) => { - if (activeTool === "delete" && deletableFloorItem && deletableFloorItem.uuid === asset.modelUuid) { + const handlePointerOut = useCallback((evt: ThreeEvent, asset: Asset) => { + if (evt.intersections.length === 0 && activeTool === "delete" && deletableFloorItem && deletableFloorItem.uuid === asset.modelUuid) { setDeletableFloorItem(null); } }, [activeTool, deletableFloorItem]); @@ -369,27 +369,27 @@ function Model({ asset }: { readonly asset: Asset }) { visible={asset.isVisible} userData={asset} onDoubleClick={(e) => { + e.stopPropagation(); if (!toggleView) { - e.stopPropagation(); handleDblClick(asset); } }} onClick={(e) => { + e.stopPropagation(); if (!toggleView) { - e.stopPropagation(); handleClick(asset); } }} - onPointerEnter={(e) => { + onPointerOver={(e) => { + e.stopPropagation(); if (!toggleView) { - e.stopPropagation(); handlePointerOver(asset); } }} - onPointerOut={(e) => { + onPointerLeave={(e) => { + e.stopPropagation(); if (!toggleView) { - e.stopPropagation(); - handlePointerOut(asset); + handlePointerOut(e, asset); } }} onContextMenu={(e) => { diff --git a/app/src/modules/builder/wallAsset/Instances/Instances/wallAssetInstance.tsx b/app/src/modules/builder/wallAsset/Instances/Instances/wallAssetInstance.tsx index 8c72dcf..1a674c7 100644 --- a/app/src/modules/builder/wallAsset/Instances/Instances/wallAssetInstance.tsx +++ b/app/src/modules/builder/wallAsset/Instances/Instances/wallAssetInstance.tsx @@ -1,6 +1,6 @@ import * as THREE from 'three'; import { useCallback, useEffect, useMemo, useRef, useState } from 'react'; -import { useThree } from '@react-three/fiber'; +import { ThreeEvent, useThree } from '@react-three/fiber'; import { Base, Geometry, Subtraction } from '@react-three/csg'; import { retrieveGLTF, storeGLTF } from '../../../../../utils/indexDB/idbUtils'; import { GLTF, GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader'; @@ -14,8 +14,8 @@ import { useVersionContext } from '../../../version/versionContext'; import { getUserData } from '../../../../../functions/getUserData'; import closestPointOnLineSegment from '../../../line/helpers/getClosestPointOnLineSegment'; -import { upsertWallAssetApi } from '../../../../../services/factoryBuilder/asset/wallAsset/upsertWallAssetApi'; -import { deleteWallAssetApi } from '../../../../../services/factoryBuilder/asset/wallAsset/deleteWallAssetApi'; +// import { upsertWallAssetApi } from '../../../../../services/factoryBuilder/asset/wallAsset/upsertWallAssetApi'; +// import { deleteWallAssetApi } from '../../../../../services/factoryBuilder/asset/wallAsset/deleteWallAssetApi'; function WallAssetInstance({ wallAsset }: { wallAsset: WallAsset }) { const url_Backend_dwinzo = `http://${process.env.REACT_APP_SERVER_MARKETPLACE_URL}`; @@ -219,8 +219,8 @@ function WallAssetInstance({ wallAsset }: { wallAsset: WallAsset }) { } }, [activeTool, activeModule, deletableWallAsset]); - const handlePointerOut = useCallback((wallAsset: WallAsset) => { - if (activeTool === "delete" && deletableWallAsset && deletableWallAsset.userData.modelUuid === wallAsset.modelUuid) { + const handlePointerOut = useCallback((evt: ThreeEvent, wallAsset: WallAsset) => { + if (evt.intersections.length === 0 && activeTool === "delete" && deletableWallAsset && deletableWallAsset.userData.modelUuid === wallAsset.modelUuid) { setDeletableWallAsset(null); } }, [activeTool, deletableWallAsset]); @@ -281,7 +281,7 @@ function WallAssetInstance({ wallAsset }: { wallAsset: WallAsset }) { setSelectedWallAsset(null); } }} - onPointerEnter={(e) => { + onPointerOver={(e) => { if (!toggleView) { e.stopPropagation(); let currentObject = e.object as THREE.Object3D; @@ -294,10 +294,10 @@ function WallAssetInstance({ wallAsset }: { wallAsset: WallAsset }) { handlePointerOver(wallAsset, currentObject); } }} - onPointerOut={(e) => { + onPointerLeave={(e) => { if (!toggleView) { e.stopPropagation(); - handlePointerOut(wallAsset); + handlePointerOut(e, wallAsset); } }} userData={wallAsset}