antontranelis/utopia-ui
1
0
Fork 0
mirror of https://github.com/utopia-os/utopia-ui.git synced 2026-03-01 12:44:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix add item flow

Browse Source
This commit is contained in:
Anton Tranelis 2025-10-12 12:55:00 +02:00
parent 32d856b26f
commit 9db1844a1b
2 changed files with 11 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
lib/src/Components/Map/Subcomponents/AddButton.tsx
View File

@ -10,11 +10,7 @@ import { useLayers } from '#components/Map/hooks/useLayers'
import { useHasUserPermission } from '#components/Map/hooks/usePermissions'
import useWindowDimensions from '#components/Map/hooks/useWindowDimension'
import type {
MouseEvent as ReactMouseEvent,
TouchEvent as ReactTouchEvent,
PointerEvent as ReactPointerEvent,
} from 'react'
import type { MouseEvent as ReactMouseEvent, TouchEvent as ReactTouchEvent } from 'react'
export default function AddButton({
triggerAction,
@ -36,14 +32,15 @@ export default function AddButton({
DomEvent.disableClickPropagation(container)
DomEvent.disableScrollPropagation(container)
const stopPointerPropagation = (event: PointerEvent) => {
const handlePointerDown = (event: PointerEvent) => {
event.stopPropagation()
event.preventDefault()
}
DomEvent.on(container, 'pointerdown pointerup pointermove', stopPointerPropagation)
DomEvent.on(container, 'pointerdown', handlePointerDown)
return () => {
DomEvent.off(container, 'pointerdown pointerup pointermove', stopPointerPropagation)
DomEvent.off(container, 'pointerdown', handlePointerDown)
}
}, [])
@ -62,12 +59,12 @@ export default function AddButton({
}
const stopPropagation = (
event:
| ReactMouseEvent<HTMLElement>
| ReactTouchEvent<HTMLElement>
| ReactPointerEvent<HTMLElement>,
event: ReactMouseEvent<HTMLElement> | ReactTouchEvent<HTMLElement>,
): void => {
event.preventDefault()
const shouldPreventDefault = event.type === 'mousedown' || event.type === 'touchstart'
if (shouldPreventDefault) {
event.preventDefault()
}
event.stopPropagation()
if (
'nativeEvent' in event &&
@ -96,18 +93,9 @@ export default function AddButton({
<button
type='button'
className='tw:z-500 tw:btn tw:btn-circle tw:btn-lg tw:shadow tw:bg-base-100'
onPointerDown={(event) => {
stopPropagation(event)
}}
onPointerUp={(event) => {
stopPropagation(event)
}}
onMouseDown={(event) => {
stopPropagation(event)
}}
onMouseUp={(event) => {
stopPropagation(event)
}}
onClick={(event) => {
stopPropagation(event)
setIsOpen((prev) => !prev)
@ -115,10 +103,6 @@ export default function AddButton({
onTouchStart={(event) => {
stopPropagation(event)
}}
onTouchEnd={(event) => {
stopPropagation(event)
setIsOpen((prev) => !prev)
}}
>
<SVG src={PlusSVG} className='tw:h-5 tw:w-5' />
</button>
@ -144,18 +128,12 @@ export default function AddButton({
onMouseDown={(event) => {
stopPropagation(event)
}}
onMouseUp={(event) => {
stopPropagation(event)
}}
onClick={(event) => {
handleLayerSelect(event, layer)
}}
onTouchStart={(event) => {
stopPropagation(event)
}}
onTouchEnd={(event) => {
handleLayerSelect(event, layer)
}}
>
<img
src={appState.assetsApi.url + layer.markerIcon.image}

2
lib/src/Components/Map/Subcomponents/SelectPositionToast.tsx
View File

@ -89,7 +89,7 @@ export const SelectPositionToast = ({
: undefined
return (
<div className='tw:relative'>
<div>
<div className='tw:flex tw:flex-row tw:items-center'>
<div
className='tw:flex tw:items-center tw:gap-3 tw:p-2 tw:rounded-selector tw:text-white tw:mr-2'