making pins clickable + adding the corresponding panels/buttons

src/lib/components/MapView.Svelte

@@ -2,6 +2,7 @@
     import { onMount } from 'svelte';
     import { env } from '$env/dynamic/public';
     import { messagesStore } from '$lib/stores/messagesStore.js'; // pass the messages store here 
+    import { mapStore } from '$lib/stores/mapStore.js'; // use this to track interactions with da map 
 
     // export let latitude;
     // export let longitude;
@@ -44,6 +45,11 @@
                 map: mapDiv,
                 title: message.text // firestore field for messages
             });
+
+            marker.addListener('click', () => {
+                mapStore.set({ selectedMessage: message, composing: false}); //it updated the message object
+            });
+
             markers.push(marker); // add the new pin to the array 
         });
     }