From 1655be854ab9ffb995ded6eef49f42f32a302cc1 Mon Sep 17 00:00:00 2001 From: Gjore Milevski Date: Mon, 6 May 2024 13:12:49 +0200 Subject: [PATCH 1/3] Make geometries non-movable in the Exploration feature --- .../map/controls/aoi/custom-aoi-control.tsx | 4 ++-- .../common/map/controls/aoi/index.tsx | 21 ++++++++++++++++++- package.json | 1 + yarn.lock | 5 +++++ 4 files changed, 28 insertions(+), 3 deletions(-) diff --git a/app/scripts/components/common/map/controls/aoi/custom-aoi-control.tsx b/app/scripts/components/common/map/controls/aoi/custom-aoi-control.tsx index 65aae102d..7c9fffdb5 100644 --- a/app/scripts/components/common/map/controls/aoi/custom-aoi-control.tsx +++ b/app/scripts/components/common/map/controls/aoi/custom-aoi-control.tsx @@ -145,7 +145,7 @@ function CustomAoI({ zoom: getZoomFromBbox(bounds) }); const addedAoisId = mbDraw.add(fc); - mbDraw.changeMode('simple_select', { + mbDraw.changeMode('simple_static', { featureIds: addedAoisId }); setFileUplaodedIds(addedAoisId); @@ -168,7 +168,7 @@ function CustomAoI({ }); const pids = mbDraw.add(fc); setPresetIds(pids); - mbDraw.changeMode('simple_select', { + mbDraw.changeMode('simple_static', { featureIds: pids }); diff --git a/app/scripts/components/common/map/controls/aoi/index.tsx b/app/scripts/components/common/map/controls/aoi/index.tsx index 6578800aa..b498f4cb8 100644 --- a/app/scripts/components/common/map/controls/aoi/index.tsx +++ b/app/scripts/components/common/map/controls/aoi/index.tsx @@ -1,4 +1,5 @@ import MapboxDraw from '@mapbox/mapbox-gl-draw'; +import StaticMode from '@mapbox/mapbox-gl-draw-static-mode'; import { useTheme } from 'styled-components'; import { useAtomValue } from 'jotai'; import { useRef } from 'react'; @@ -9,11 +10,23 @@ import { computeDrawStyles } from './style'; type DrawControlProps = MapboxDraw.DrawOptions; +// Overriding the dragMove and dragFeature methods of the +// 'simple_select' and the 'direct_select' modes to avoid +// accidentally dragging the selected or hand-drawn AOIs +const customSimpleSelect = { + ...MapboxDraw.modes.simple_select, + dragMove() {} +}; + +const customDirectSelect = { + ...MapboxDraw.modes.direct_select, + dragFeature() {}, +}; + export default function DrawControl(props: DrawControlProps) { const theme = useTheme(); const control = useRef(); const aoisFeatures = useAtomValue(aoisFeaturesAtom); - const { onUpdate, onDelete, onSelectionChange, onDrawModeChange } = useAois(); useControl( @@ -21,6 +34,12 @@ export default function DrawControl(props: DrawControlProps) { control.current = new MapboxDraw({ displayControlsDefault: false, styles: computeDrawStyles(theme), + modes: { + ...MapboxDraw.modes, + simple_static: StaticMode, + simple_select: customSimpleSelect, + direct_select: customDirectSelect + }, ...props }); return control.current; diff --git a/package.json b/package.json index 7e8a11d7f..d6a25cadd 100644 --- a/package.json +++ b/package.json @@ -113,6 +113,7 @@ "@emotion/react": "^11.11.3", "@floating-ui/react": "^0.25.1", "@mapbox/mapbox-gl-draw": "^1.3.0", + "@mapbox/mapbox-gl-draw-static-mode": "^1.0.1", "@mapbox/mapbox-gl-geocoder": "^5.0.1", "@parcel/transformer-raw": "~2.7.0", "@reactour/tour": "^3.6.1", diff --git a/yarn.lock b/yarn.lock index c09c18bf8..3375f12ca 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2144,6 +2144,11 @@ resolved "http://verdaccio.ds.io:4873/@mapbox%2fjsonlint-lines-primitives/-/jsonlint-lines-primitives-2.0.2.tgz#ce56e539f83552b58d10d672ea4d6fc9adc7b234" integrity sha1-zlblOfg1UrWNENZy6k1vya3HsjQ= +"@mapbox/mapbox-gl-draw-static-mode@^1.0.1": + version "1.0.1" + resolved "http://verdaccio.ds.io:4873/@mapbox%2fmapbox-gl-draw-static-mode/-/mapbox-gl-draw-static-mode-1.0.1.tgz#da873099b60acaf91790b961ce84b2c762815041" + integrity sha512-r/y50dlRJ8ctK5YdhAzimiKIu/R2b0GkGoExw7zWn17CDTn2ftGqsljJOlfLXf5rH15Wv75t1EN9KsM6OkdhWQ== + "@mapbox/mapbox-gl-draw@^1.3.0": version "1.3.0" resolved "http://verdaccio.ds.io:4873/@mapbox%2fmapbox-gl-draw/-/mapbox-gl-draw-1.3.0.tgz#7a30fb99488cb47a32c25e99c3c62413b04bbaed" From bb7e2056a3ef943e72b275c6abbe9f897bb2efb2 Mon Sep 17 00:00:00 2001 From: Gjore Milevski Date: Mon, 6 May 2024 13:45:37 +0200 Subject: [PATCH 2/3] Uploaded features should be editable --- .../components/common/map/controls/aoi/custom-aoi-control.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/scripts/components/common/map/controls/aoi/custom-aoi-control.tsx b/app/scripts/components/common/map/controls/aoi/custom-aoi-control.tsx index 7c9fffdb5..452cfd9b9 100644 --- a/app/scripts/components/common/map/controls/aoi/custom-aoi-control.tsx +++ b/app/scripts/components/common/map/controls/aoi/custom-aoi-control.tsx @@ -145,7 +145,7 @@ function CustomAoI({ zoom: getZoomFromBbox(bounds) }); const addedAoisId = mbDraw.add(fc); - mbDraw.changeMode('simple_static', { + mbDraw.changeMode('simple_select', { featureIds: addedAoisId }); setFileUplaodedIds(addedAoisId); From 1d61f2051f825180e23954a93b41e88877c0089c Mon Sep 17 00:00:00 2001 From: Gjore Milevski Date: Mon, 6 May 2024 13:51:47 +0200 Subject: [PATCH 3/3] Make the TS lint happy --- app/scripts/components/common/map/controls/aoi/index.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/app/scripts/components/common/map/controls/aoi/index.tsx b/app/scripts/components/common/map/controls/aoi/index.tsx index b498f4cb8..ddf7debf0 100644 --- a/app/scripts/components/common/map/controls/aoi/index.tsx +++ b/app/scripts/components/common/map/controls/aoi/index.tsx @@ -15,12 +15,12 @@ type DrawControlProps = MapboxDraw.DrawOptions; // accidentally dragging the selected or hand-drawn AOIs const customSimpleSelect = { ...MapboxDraw.modes.simple_select, - dragMove() {} + dragMove() { return; } }; const customDirectSelect = { ...MapboxDraw.modes.direct_select, - dragFeature() {}, + dragFeature() { return; }, }; export default function DrawControl(props: DrawControlProps) {