Implement basic saved point editor

src/routes/predict/+page.svelte

@@ -3,15 +3,14 @@
     import ControlPanel from "$lib/components/ControlPanel.svelte";
     import Navbar from "$lib/components/Navbar.svelte";
     import PanelContainer from "$lib/components/PanelContainer.svelte";
-    import TelemetryPanel from '$lib/components/TelemetryPanel.svelte';
     import ScenarioPanel from "$lib/components/ScenarioPanel.svelte";
     import TabComponent from "$lib/components/TabComponent.svelte";
+    import PointListModal from "$lib/components/PointListModal.svelte";
     import { onMount } from "svelte";
     import { PredictionStore } from "$lib/stores";
-    import { Modal, Icon } from "@sveltestrap/sveltestrap";
-    import Toast, { addToast, removeToast } from "$lib/components/Toast.svelte";
+    import { addToast, removeToast } from "$lib/components/Toast.svelte";
     import ToastContainer from '$lib/components/Toast.svelte';
-    import L from "leaflet";
+    import L, { point } from "leaflet";
 
     let map: Map | null = null;
     let panelContainer: PanelContainer | null = null;
@@ -19,6 +18,8 @@
     let selectionToastId: string | null = null;
     let activeTab: 'control' | 'scenario' | 'settings' | 'about' = 'scenario';
 
+    let pointListModal: PointListModal | null = null;
+
     onMount(() => {
         PredictionStore.subscribe((data) => {
             if (data) {
@@ -65,6 +66,16 @@
             selectionToastId = null;
         }
     }
+
+    function handleClickPointListModal() {
+        if (map) {
+            map.stopSelection();
+            console.log("Selection mode disabled");
+        }
+        pointListModal?.openModal();
+    }
+
+
 </script>
 
 <main>
@@ -73,7 +84,7 @@
         <PanelContainer bind:this={panelContainer} >
             <TabComponent
                 tabs={[
-                    { id: 'scenario', icon: 'activity', label: 'Сценарий' },
+                    { id: 'scenario', icon: 'file-earmark-play', label: 'Сценарий' },
                     { id: 'control', icon: 'sliders', label: 'Условия' },
                     { id: 'settings', icon: 'gear', label: 'Настройки' },
                     { id: 'about', icon: 'info-circle', label: 'О проекте' }
@@ -83,7 +94,7 @@
             
             <div>
                 {#if activeTab === 'control'}
-                    <ControlPanel {handleClickSelectOnMap} bind:this={controlPanel} />
+                    <ControlPanel {handleClickSelectOnMap} {handleClickPointListModal} bind:this={controlPanel} />
                 {:else if activeTab === 'scenario'}
                     <ScenarioPanel />
                 {:else if activeTab === 'settings'}
@@ -94,5 +105,6 @@
             </div>
         </PanelContainer>
         <ToastContainer />
+        <PointListModal bind:this={pointListModal} />
     </Map>
 </main>