From 3152c0f6aceb008b1e3f55ae99523ae57d932586 Mon Sep 17 00:00:00 2001
From: secondl1ght <secondl1ght@protonmail.com>
Date: Sun, 21 Jan 2024 19:57:59 -0700
Subject: [PATCH] fix deleted elements in activity feeds

---
 src/lib/utils.ts                         | 11 +++++++++
 src/routes/activity/+page.svelte         | 30 +++++++++++-------------
 src/routes/community/[area]/+page.svelte | 20 +++++++---------
 src/routes/tagger/[id]/+page.svelte      | 22 ++++++++---------
 4 files changed, 44 insertions(+), 39 deletions(-)

diff --git a/src/lib/utils.ts b/src/lib/utils.ts
index e6b6fc93..be485bf3 100644
--- a/src/lib/utils.ts
+++ b/src/lib/utils.ts
@@ -69,3 +69,14 @@ export const updateChartThemes = (
 		});
 	}
 };
+
+export const formatElementID = (id: string) => {
+	const elementIdSplit = id.split(':');
+	const elementIdFormatted =
+		elementIdSplit[0].charAt(0).toUpperCase() +
+		elementIdSplit[0].slice(1, elementIdSplit[0].length) +
+		' ' +
+		elementIdSplit[1];
+
+	return elementIdFormatted;
+};
diff --git a/src/routes/activity/+page.svelte b/src/routes/activity/+page.svelte
index 50bb81a3..9288668a 100644
--- a/src/routes/activity/+page.svelte
+++ b/src/routes/activity/+page.svelte
@@ -18,7 +18,7 @@
 		users
 	} from '$lib/store';
 	import type { ActivityEvent, Element, Event, User } from '$lib/types';
-	import { detectTheme, errToast } from '$lib/utils';
+	import { detectTheme, errToast, formatElementID } from '$lib/utils';
 
 	// alert for user errors
 	$: $userError && errToast($userError);
@@ -56,21 +56,19 @@
 			recentEvents.forEach((event) => {
 				let elementMatch = elements.find((element) => element.id === event['element_id']);
 
-				if (elementMatch) {
-					let location =
-						elementMatch['osm_json'].tags && elementMatch['osm_json'].tags.name
-							? elementMatch['osm_json'].tags.name
-							: undefined;
-
-					let tagger = findUser(event);
-
-					supertaggers.push({
-						...event,
-						location: location || 'Unnamed element',
-						merchantId: elementMatch.id,
-						tagger
-					});
-				}
+				let location =
+					elementMatch?.['osm_json'].tags && elementMatch['osm_json'].tags.name
+						? elementMatch['osm_json'].tags.name
+						: undefined;
+
+				let tagger = findUser(event);
+
+				supertaggers.push({
+					...event,
+					location: location || formatElementID(event['element_id']),
+					merchantId: event['element_id'],
+					tagger
+				});
 			});
 
 			supertaggers = supertaggers;
diff --git a/src/routes/community/[area]/+page.svelte b/src/routes/community/[area]/+page.svelte
index c3f5b6ac..0d876d20 100644
--- a/src/routes/community/[area]/+page.svelte
+++ b/src/routes/community/[area]/+page.svelte
@@ -55,7 +55,7 @@
 		type Leaflet,
 		type User
 	} from '$lib/types.js';
-	import { detectTheme, errToast, updateChartThemes } from '$lib/utils';
+	import { detectTheme, errToast, formatElementID, updateChartThemes } from '$lib/utils';
 	// @ts-expect-error
 	import rewind from '@mapbox/geojson-rewind';
 	import Chart from 'chart.js/auto';
@@ -181,18 +181,16 @@
 		communityEvents.forEach((event) => {
 			let elementMatch = filteredElements.find((element) => element.id === event['element_id']);
 
-			if (elementMatch) {
-				let location = elementMatch['osm_json'].tags?.name || undefined;
+			let location = elementMatch?.['osm_json'].tags?.name || undefined;
 
-				let tagger = findUser(event);
+			let tagger = findUser(event);
 
-				eventElements.push({
-					...event,
-					location: location || 'Unnamed element',
-					merchantId: elementMatch.id,
-					tagger
-				});
-			}
+			eventElements.push({
+				...event,
+				location: location || formatElementID(event['element_id']),
+				merchantId: event['element_id'],
+				tagger
+			});
 		});
 
 		eventElements = eventElements;
diff --git a/src/routes/tagger/[id]/+page.svelte b/src/routes/tagger/[id]/+page.svelte
index 3cd8d94d..bea64112 100644
--- a/src/routes/tagger/[id]/+page.svelte
+++ b/src/routes/tagger/[id]/+page.svelte
@@ -42,7 +42,7 @@
 		type Leaflet,
 		type ProfileLeaderboard
 	} from '$lib/types.js';
-	import { detectTheme, errToast } from '$lib/utils';
+	import { detectTheme, errToast, formatElementID } from '$lib/utils';
 	import Chart from 'chart.js/auto';
 	import { format } from 'date-fns';
 	import DOMPurify from 'dompurify';
@@ -278,18 +278,16 @@
 		userEvents.forEach((event) => {
 			let elementMatch = $elements.find((element) => element.id === event['element_id']);
 
-			if (elementMatch) {
-				let location =
-					elementMatch['osm_json'].tags && elementMatch['osm_json'].tags.name
-						? elementMatch['osm_json'].tags.name
-						: undefined;
+			let location =
+				elementMatch?.['osm_json'].tags && elementMatch['osm_json'].tags.name
+					? elementMatch['osm_json'].tags.name
+					: undefined;
 
-				eventElements.push({
-					...event,
-					location: location || 'Unnamed element',
-					merchantId: elementMatch.id
-				});
-			}
+			eventElements.push({
+				...event,
+				location: location || formatElementID(event['element_id']),
+				merchantId: event['element_id']
+			});
 		});
 
 		eventElements = eventElements;