Remove pglite, rely on svelte store + electric sync

compose.yaml

@@ -211,7 +211,6 @@ services:
       additional_contexts:
         - code=src/mapper
       dockerfile: Dockerfile.ui.debug
-      target: init-db
     volumes:
       - ./src/mapper/messages:/app/messages
       - ./src/mapper/project.inlang:/app/project.inlang

src/Dockerfile.ui.debug

@@ -16,10 +16,3 @@ ENV PATH="$PNPM_HOME:$PATH"
 RUN corepack enable && corepack install
 RUN pnpm install
 CMD ["pnpm", "run", "dev"]
-
-
-# Initialising PGLite db and creating tar dump (used during tests)
-FROM build AS init-db
-COPY --from=code ./src/lib/db/init.js ./src/lib/db/init.js
-RUN pnpm run init-db
-RUN cp pgdata.tar.gz /migrations/init/

src/Dockerfile.ui.prod

@@ -25,11 +25,6 @@ COPY mapper/package.json mapper/pnpm-lock.yaml ./
 RUN corepack enable && corepack install
 RUN pnpm install
 COPY mapper/ .
-# # Code no longer used for bootstrapping db from tar
-# # Build the bootstrap db
-# RUN pnpm run init-db
-# # Copy to required location for build
-# RUN cp pgdata.tar.gz /migrations/init/
 RUN pnpm run build
 
 

src/mapper/package.json

@@ -16,8 +16,7 @@
 		"format": "prettier --plugin prettier-plugin-svelte --write .",
 		"test:integration": "playwright test",
 		"test:unit": "vitest",
-		"cleanup": "pnpm dlx knip",
-		"init-db": "node src/lib/db/init.js"
+		"cleanup": "pnpm dlx knip"
 	},
 	"devDependencies": {
 		"@inlang/paraglide-js": "^2.0.13",
@@ -49,8 +48,6 @@
 	},
 	"dependencies": {
 		"@electric-sql/client": "1.0.5",
-		"@electric-sql/pglite": "^0.3.4",
-		"@electric-sql/pglite-sync": "^0.3.7",
 		"@hotosm/ui": "0.2.0-b5",
 		"@maplibre/maplibre-gl-directions": "^0.7.1",
 		"@shoelace-style/shoelace": "2.17.1",

src/mapper/src/lib/api/fetch.ts

@@ -1,7 +1,3 @@
-import type { PGlite } from '@electric-sql/pglite';
-import type { DbApiSubmissionType } from '$lib/types.ts';
-import { DbApiSubmission } from '$lib/db/api-submissions.ts';
-
 const API_URL = import.meta.env.VITE_API_URL;
 
 const DEFAULT_CACHE_NAME = 'c488ea01-8c52-4a18-a93e-934bc77f1eb8';
@@ -66,61 +62,4 @@ async function fetchFormMediBlobUrls(projectId: number): Promise<{ [filename: st
 	return formMediaBlobs;
 }
 
-function decodeBase64File(base64: string, name: string, type: string): File {
-	const byteString = atob(base64.split(',')[1]);
-	const arrayBuffer = new Uint8Array(byteString.length);
-	for (let i = 0; i < byteString.length; i++) {
-		arrayBuffer[i] = byteString.charCodeAt(i);
-	}
-	const blob = new Blob([arrayBuffer], { type });
-	return new File([blob], name, { type });
-}
-
-async function getSubmissionFetchOptions(row: DbApiSubmissionType): Promise<RequestInit> {
-	if (row.content_type === 'application/json') {
-		return {
-			method: row.method,
-			body: JSON.stringify(row.payload),
-			headers: {
-				'Content-Type': 'application/json',
-			},
-			credentials: 'include',
-		};
-	}
-
-	if (row.content_type === 'multipart/form-data') {
-		const form = new FormData();
-		form.append('submission_xml', row.payload.form.submission_xml);
-
-		for (const f of row.payload.form.submission_files) {
-			const file = decodeBase64File(f.base64, f.name, f.type);
-			form.append('submission_files', file);
-		}
-
-		return {
-			method: row.method,
-			body: form,
-			credentials: 'include',
-		};
-	}
-
-	throw new Error(`Unsupported content_type: ${row.content_type}`);
-}
-
-async function trySendingSubmission(db: PGlite, row: DbApiSubmissionType): Promise<boolean> {
-	try {
-		const options = await getSubmissionFetchOptions(row);
-		const res = await fetch(row.url, options);
-
-		if (!res.ok) throw new Error(`HTTP ${res.status}`);
-
-		await DbApiSubmission.update(db, row.id, 'RECEIVED');
-		return true;
-	} catch (err) {
-		console.error('Offline send failed:', err);
-		await DbApiSubmission.update(db, row.id, 'FAILED', String(err));
-		return false;
-	}
-}
-
-export { fetchCachedBlobUrl, fetchBlobUrl, fetchFormMediBlobUrls, trySendingSubmission };
+export { fetchCachedBlobUrl, fetchBlobUrl, fetchFormMediBlobUrls };

src/mapper/src/lib/components/dialog-entities-actions.svelte

@@ -1,6 +1,5 @@
 <script lang="ts">
 	import '$styles/dialog-entities-actions.css';
-	import type { PGlite } from '@electric-sql/pglite';
 	import { distance } from '@turf/distance';
 	import type { Coord } from '@turf/helpers';
 	import type { SlDialog } from '@shoelace-style/shoelace';
@@ -36,7 +35,6 @@
 	const taskStore = getTaskStore();
 	const loginStore = getLoginStore();
 
-	let db: PGlite | undefined = $derived(commonStore.db);
 	let dialogRef: SlDialog | null = $state(null);
 	let confirmationDialogRef: SlDialog | null = $state(null);
 	let toggleDistanceWarningDialog = $state(false);
@@ -59,7 +57,7 @@
 
 	const updateEntityTaskStatus = () => {
 		if (selectedEntity?.status === 'READY') {
-			entitiesStore.updateEntityStatus(db, projectData.id, {
+			entitiesStore.updateEntityStatus(projectData.id, {
 				entity_id: selectedEntity?.entity_id,
 				status: 1,
 				// NOTE here we don't translate the field as English values are always saved as the Entity label
@@ -161,7 +159,7 @@
 			(feature: Record<string, any>) => feature.properties?.entity_id === entityId,
 		)?.properties;
 		if (created_by && created_by === loginStore.getAuthDetails?.sub) {
-			await entitiesStore.deleteNewEntity(db, projectData.id, entity_id);
+			await entitiesStore.deleteNewEntity(projectData.id, entity_id);
 			showDeleteEntityPopup = false;
 		} else {
 			alertStore.setAlert({

src/mapper/src/lib/components/forms/wrapper.svelte

@@ -1,7 +1,6 @@
 <script lang="ts">
 	import '$styles/forms.css';
 	import type { Action } from 'svelte/action';
-	import type { PGlite } from '@electric-sql/pglite';
 	import type { SlDrawer } from '@shoelace-style/shoelace';
 
 	import { getCommonStore } from '$store/common.svelte.ts';
@@ -28,8 +27,6 @@
 	const commonStore = getCommonStore();
 	const loginStore = getLoginStore();
 	const entitiesStore = getEntitiesStatusStore();
-	let db: PGlite | undefined = $derived(commonStore.db);
-
 	const selectedEntity = $derived(entitiesStore.selectedEntity);
 
 	let {
@@ -122,7 +119,7 @@
 			submissionIds = `${selectedEntity.submission_ids},${submissionIds}`;
 		}
 
-		entitiesStore.updateEntityStatus(db, projectId, {
+		entitiesStore.updateEntityStatus(projectId, {
 			entity_id: selectedEntity?.entity_id,
 			status: entityStatus,
 			// NOTE here we don't translate the field as English values are always saved as the Entity label
@@ -144,7 +141,7 @@
 			uploading = true;
 
 			// Submit the XML + any submission media
-			await entitiesStore.createNewSubmission(db, projectId, submissionXml, attachments);
+			await entitiesStore.createNewSubmission(projectId, submissionXml, attachments);
 
 			uploading = false;
 			updateEntityStatusBasedOnSubmissionXml(submissionXml);

src/mapper/src/lib/components/map/flatgeobuf-layer.svelte

@@ -46,7 +46,6 @@
 	// Deserialise flatgeobuf to GeoJSON, reactive to bbox/extent changes
 	async function updateGeoJSONData() {
 		const featcol: FeatureCollection | null = await flatgeobufToGeoJson(url, extent, metadataFunc, extractGeomCols);
-
 		// If there is no data, set to an empty FeatureCollection to avoid
 		// re-adding layer if the bbox extent is updated
 		if (!featcol) {