Automatic task lock on feature map & minor mapper frontend improvemen…

…ts (#2047) * fix(dialog-entities-actions): update task to locked if feature map trigger * fix(+page): show task index instead of id on log * fix(+page): setInterval to update task event every minute
hotosm · Jan 1, 2025 · a3bf516 · a3bf516
1 parent 6d7aa55
commit a3bf516
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 4 deletions.
diff --git a/src/mapper/src/lib/components/dialog-entities-actions.svelte b/src/mapper/src/lib/components/dialog-entities-actions.svelte
@@ -1,7 +1,9 @@
 <script lang="ts">
-	import type { ProjectData } from '$lib/types';
+	import { TaskStatusEnum, type ProjectData } from '$lib/types';
 	import { getEntitiesStatusStore } from '$store/entities.svelte.ts';
 	import { getAlertStore } from '$store/common.svelte.ts';
+	import { getTaskStore } from '$store/tasks.svelte.ts';
+	import { mapTask } from '$lib/db/events';
 
 	type Props = {
 		isTaskActionModalOpen: boolean;
@@ -14,6 +16,7 @@
 
 	const entitiesStore = getEntitiesStatusStore();
 	const alertStore = getAlertStore();
+	const taskStore = getTaskStore();
 
 	const selectedEntityOsmId = $derived(entitiesStore.selectedEntity);
 	const selectedEntity = $derived(
@@ -38,6 +41,10 @@
 					status: 1,
 					label: `Task ${selectedEntity?.task_id} Feature ${selectedEntity?.osmid}`,
 				});
+
+				if (taskStore.selectedTaskId && taskStore.selectedTaskState === TaskStatusEnum['UNLOCKED_TO_MAP']) {
+					mapTask(projectData?.id, taskStore.selectedTaskId);
+				}
 			}
 			// Load entity in ODK Collect by intent
 			document.location.href = `odkcollect://form/${xformId}?feature=${entityUuid}`;

diff --git a/src/mapper/src/routes/[projectId]/+page.svelte b/src/mapper/src/routes/[projectId]/+page.svelte
@@ -35,9 +35,9 @@
 	let maplibreMap: maplibregl.Map | undefined = $state(undefined);
 	let tabGroup: SlTabGroup;
 	let openedActionModal: 'entity-modal' | 'task-modal' | null = $state(null);
-	let isTaskActionModalOpen: boolean = $state(false);
 	let infoDialogRef: SlDialog | null = $state(null);
 	let isDrawEnabled: boolean = $state(false);
+	let latestEventTime: string = $state('');
 
 	const taskStore = getTaskStore();
 	const entitiesStore = getEntitiesStatusStore();
@@ -63,6 +63,21 @@
 		taskStore.setTaskIdIndexMap(taskIdIndexMap);
 	});
 
+	// update the latest time time every minute
+	$effect(() => {
+		const updateLatestTime = () => {
+			if (taskStore.latestEvent?.created_at) {
+				latestEventTime = convertDateToTimeAgo(taskStore.latestEvent.created_at);
+			}
+		};
+
+		updateLatestTime();
+
+		const interval = setInterval(updateLatestTime, 60000);
+
+		return () => clearInterval(interval); // Cleanup interval on unmount
+	});
+
 	function zoomToTask(taskId: number) {
 		const taskObj = data.project.tasks.find((task: ProjectTask) => task.id === taskId);
 
@@ -122,8 +137,8 @@
 		id="notification-banner"
 		class="absolute z-10 top-15 sm:top-18.8 right-0 font-sans flex bg-white text-black bg-opacity-70 text-sm sm:text-base px-1 rounded-bl-md"
 	>
-		<b class="">{convertDateToTimeAgo(taskStore.latestEvent.created_at)}</b>&nbsp;| {taskStore.latestEvent.event}
-		on task {taskStore.latestEvent.task_id} by {taskStore.latestEvent.username || 'anon'}
+		<b class="">{latestEventTime}</b>&nbsp;| {taskStore.latestEvent.event}
+		on task {taskStore.taskIdIndexMap[taskStore.latestEvent.task_id]} by {taskStore.latestEvent.username || 'anon'}
 	</div>
 {/if}