feat(mapper): allow drawing of new polygon & linestring geoms

src/mapper/src/constants/enums.ts

@@ -8,8 +8,8 @@ export enum projectSetupStep {
 	'complete_setup' = 3,
 }
 
-export type NewGeomTypes = {
-	POINT: 'POINT';
-	POLYGON: 'POLYGON';
-	LINESTRING: 'LINESTRING';
-};
+export enum NewGeomTypes {
+	POINT = 'POINT',
+	POLYGON = 'POLYGON',
+	LINESTRING = 'LINESTRING',
+}

src/mapper/src/lib/components/map/main.svelte

@@ -18,11 +18,12 @@
 		ControlButton,
 	} from 'svelte-maplibre';
 	import maplibre from 'maplibre-gl';
-	import MaplibreTerradrawControl from '@watergis/maplibre-gl-terradraw';
+	import { MaplibreTerradrawControl } from '@watergis/maplibre-gl-terradraw';
 	import { Protocol } from 'pmtiles';
 	import { polygon } from '@turf/helpers';
 	import { buffer } from '@turf/buffer';
 	import { bbox } from '@turf/bbox';
+	import { centroid } from '@turf/centroid';
 	import type { Position, Geometry as GeoJSONGeometry, FeatureCollection } from 'geojson';
 
 	import LocationArcImg from '$assets/images/locationArc.png';
@@ -40,10 +41,10 @@
 	// import { entityFeatcolStore, selectedEntityId } from '$store/entities';
 	import { readFileFromOPFS } from '$lib/fs/opfs.ts';
 	import { loadOfflinePmtiles } from '$lib/utils/basemaps.ts';
-	import { projectSetupStep as projectSetupStepEnum } from '$constants/enums.ts';
+	import { projectSetupStep as projectSetupStepEnum, NewGeomTypes } from '$constants/enums.ts';
 	import { baseLayers, osmStyle, pmtilesStyle } from '$constants/baseLayers.ts';
 	import { getEntitiesStatusStore } from '$store/entities.svelte.ts';
-	import { centroid } from '@turf/centroid';
+
 
 	type bboxType = [number, number, number, number];
 
@@ -54,6 +55,7 @@
 		projectId: number;
 		setMapRef: (map: maplibregl.Map | undefined) => void;
 		draw?: boolean;
+	    drawGeomType: NewGeomTypes | undefined;
 		handleDrawnGeom?: ((geojson: GeoJSONGeometry) => void) | null;
 	}
 
@@ -64,6 +66,7 @@
 		projectId,
 		setMapRef,
 		draw = false,
+		drawGeomType,
 		handleDrawnGeom,
 	}: Props = $props();
 
@@ -118,12 +121,12 @@
 	// 	}
 	// })
 	let displayDrawHelpText: boolean = $state(false);
+	type DrawModeOptions = 'point' | 'linestring' | 'delete-selection' | 'polygon';
+	const currentDrawMode: DrawModeOptions = drawGeomType ? drawGeomType.toLowerCase() as DrawModeOptions : 'point';
 	const drawControl = new MaplibreTerradrawControl({
 		modes: [
-			'point',
-			// 'polygon',
-			// 'linestring',
-			// 'delete',
+			currentDrawMode,
+			// 'delete-selection'
 		],
 		// Note We do not open the toolbar options, allowing the user
 		// to simply click with a pre-defined mode active
@@ -220,7 +223,7 @@
 			const drawInstance = drawControl.getTerraDrawInstance();
 			if (drawInstance && handleDrawnGeom) {
 				drawInstance.start();
-				drawInstance.setMode('point');
+				drawInstance.setMode(currentDrawMode);
 
 				drawInstance.on('finish', (id: string, _context: any) => {
 					// Save the drawn geometry location, then delete all geoms from store

src/mapper/src/lib/odk/javarosa.ts

@@ -39,5 +39,5 @@ export function geojsonGeomToJavarosa(geometry: GeoJSONGeometry) {
 		.join(';');
 
 	// Must append a final ; to finish the geom
-	return javarosaGeometry;
+	return `${javarosaGeometry};`;
 }

src/mapper/src/routes/[projectId]/+page.svelte

@@ -155,6 +155,7 @@
 		projectId={data.projectId}
 		entitiesUrl={data.project.data_extract_url}
 		draw={isDrawEnabled}
+		drawGeomType={data.project.new_geom_type}
 		handleDrawnGeom={(geom) => {
 			isDrawEnabled = false;
 			openOdkCollectNewFeature(data?.project?.odk_form_id, geom);