From 1ee10ca209ae575ccbf8b9bed9da0ecae4dee41d Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Sun, 1 Jun 2025 15:18:15 +0300
Subject: [PATCH] fix(geomap): missing start/end icons + add customization

---
 apps/client/src/widgets/type_widgets/geo_map.ts | 13 +++++++++----
 1 file changed, 9 insertions(+), 4 deletions(-)

diff --git a/apps/client/src/widgets/type_widgets/geo_map.ts b/apps/client/src/widgets/type_widgets/geo_map.ts
index bd4d3af57..bdedcc52e 100644
--- a/apps/client/src/widgets/type_widgets/geo_map.ts
+++ b/apps/client/src/widgets/type_widgets/geo_map.ts
@@ -232,7 +232,12 @@ export default class GeoMapTypeWidget extends TypeWidget {
             stringResponse = xmlResponse;
         }
 
-        const track = new this.L.GPX(stringResponse, {});
+        const track = new this.L.GPX(stringResponse, {
+            markers: {
+                startIcon: this.#buildIcon(note.getIcon(), note.getColorClass(), note.title),
+                endIcon: this.#buildIcon("bxs-flag-checkered")
+            }
+        });
         track.addTo(this.geoMapWidget.map);
         this.currentTrackData[note.noteId] = track;
     }
@@ -280,13 +285,13 @@ export default class GeoMapTypeWidget extends TypeWidget {
         this.currentMarkerData[note.noteId] = marker;
     }
 
-    #buildIcon(bxIconClass: string, colorClass: string, title: string) {
+    #buildIcon(bxIconClass: string, colorClass?: string, title?: string) {
         return this.L.divIcon({
             html: /*html*/`\
                 <img class="icon" src="${markerIcon}" />
                 <img class="icon-shadow" src="${markerIconShadow}" />
-                <span class="bx ${bxIconClass} ${colorClass}"></span>
-                <span class="title-label">${title}</span>`,
+                <span class="bx ${bxIconClass} ${colorClass ?? ""}"></span>
+                <span class="title-label">${title ?? ""}</span>`,
             iconSize: [25, 41],
             iconAnchor: [12, 41]
         });