@smartnet360/svelte-components 0.0.124 → 0.0.125

package/dist/apps/antenna-tools/components/AntennaSettingsModal.svelte

@@ -1,11 +1,8 @@
 <svelte:options runes={true} />
 
 <script lang="ts">
-  import JsonImporter from './JsonImporter.svelte';
   import MSIConverter from './MSIConverter.svelte';
-  import DbNotification from './DbNotification.svelte';
   import DatabaseViewer from './DatabaseViewer.svelte';
-  import { exportAntennas, clearAllAntennas } from '../utils/db-utils';
   import type { BandDefinition } from '../types';
 
   interface Props {
@@ -18,42 +15,12 @@
 
   let { show, onClose, onDataRefresh, customBands }: Props = $props();
 
-  let activeTab = $state<'view' | 'import' | 'msi' | 'export' | 'manage'>('view');
-  let showClearConfirm = $state(false);
+  let activeTab = $state<'view' | 'manage'>('view');
 
   // Handle data refresh after import operations
   function handleDataRefresh() {
     onDataRefresh?.();
   }
-
-  // Export data as JSON
-  async function handleExport() {
-    try {
-      await exportAntennas();
-    } catch (error) {
-      console.error('Export failed:', error);
-    }
-  }
-
-  // Clear all data with confirmation
-  async function handleClearData() {
-    if (!showClearConfirm) {
-      showClearConfirm = true;
-      return;
-    }
-
-    try {
-      await clearAllAntennas();
-      showClearConfirm = false;
-      handleDataRefresh();
-    } catch (error) {
-      console.error('Clear data failed:', error);
-    }
-  }
-
-  function cancelClear() {
-    showClearConfirm = false;
-  }
 </script>
 
 <!-- Modal -->
@@ -91,33 +58,12 @@
               >
                 <i class="bi bi-table me-2"></i>View Data
               </button>
-              <button 
-                class="nav-link {activeTab === 'import' ? 'active' : ''}"
-                type="button"
-                onclick={() => activeTab = 'import'}
-              >
-                <i class="bi bi-upload me-2"></i>Import JSON
-              </button>
-              <button 
-                class="nav-link {activeTab === 'msi' ? 'active' : ''}"
-                type="button"
-                onclick={() => activeTab = 'msi'}
-              >
-                <i class="bi bi-file-earmark-text me-2"></i>Import MSI
-              </button>
-              <button 
-                class="nav-link {activeTab === 'export' ? 'active' : ''}"
-                type="button"
-                onclick={() => activeTab = 'export'}
-              >
-                <i class="bi bi-download me-2"></i>Export Data
-              </button>
               <button 
                 class="nav-link {activeTab === 'manage' ? 'active' : ''}"
                 type="button"
                 onclick={() => activeTab = 'manage'}
               >
-                <i class="bi bi-trash me-2"></i>Manage Data
+                <i class="bi bi-database-gear me-2"></i>Manage Database
               </button>
             </div>
           </div>
@@ -132,118 +78,10 @@
               </div>
             {/if}
 
-            <!-- Import JSON Tab -->
-            {#if activeTab === 'import'}
-              <div class="tab-pane fade show active">
-                <div class="row">
-                  <div class="col-12">
-                    <h5 class="mb-3">Import Antenna Data from JSON</h5>
-                    <JsonImporter onDataRefresh={handleDataRefresh} />
-                  </div>
-                </div>
-              </div>
-            {/if}
-
-            <!-- Import MSI Tab -->
-            {#if activeTab === 'msi'}
-              <div class="tab-pane fade show active">
-                <div class="row">
-                  <div class="col-12">
-                    <h5 class="mb-3">Import MSI Pattern Files</h5>
-                    <MSIConverter onDataRefresh={handleDataRefresh} {customBands} />
-                  </div>
-                </div>
-              </div>
-            {/if}
-
-            <!-- Export Data Tab -->
-            {#if activeTab === 'export'}
-              <div class="tab-pane fade show active">
-                <div class="row">
-                  <div class="col-12">
-                    <h5 class="mb-3">Export Antenna Data</h5>
-                    
-                    <div class="card border-success">
-                      <div class="card-body text-center">
-                        <i class="bi bi-download text-success" style="font-size: 3rem;"></i>
-                        <h6 class="mt-3 mb-3">Download Data Backup</h6>
-                        <p class="text-muted mb-4">
-                          Export all antenna patterns and metadata as a JSON file.
-                        </p>
-                        <button 
-                          type="button" 
-                          class="btn btn-success btn-lg"
-                          onclick={handleExport}
-                        >
-                          <i class="bi bi-download me-2"></i>
-                          Export JSON File
-                        </button>
-                      </div>
-                    </div>
-                  </div>
-                </div>
-              </div>
-            {/if}
-
-            <!-- Manage Data Tab -->
+            <!-- Manage Database Tab -->
             {#if activeTab === 'manage'}
               <div class="tab-pane fade show active">
-                <div class="row">
-                  <div class="col-12">
-                    <h5 class="mb-3">Manage Database</h5>
-
-                    <!-- Database Status -->
-                    <div class="card border-info mb-4">
-                      <div class="card-body">
-                        <h6 class="card-title">
-                          <i class="bi bi-info-circle me-2"></i>Database Status
-                        </h6>
-                        <DbNotification />
-                      </div>
-                    </div>
-
-                    <!-- Clear Data Section -->
-                    <div class="card border-danger">
-                      <div class="card-body">
-                        <p class="text-muted mb-3">
-                          Permanently delete all antenna data from the database.
-                        </p>
-                        
-                        {#if !showClearConfirm}
-                          <button 
-                            type="button" 
-                            class="btn btn-outline-danger"
-                            onclick={handleClearData}
-                          >
-                            <i class="bi bi-trash me-2"></i>
-                            Clear All Data
-                          </button>
-                        {:else}
-                          <div class="alert alert-danger" role="alert">
-                            <strong>Are you sure?</strong> This will permanently delete all antenna data.
-                          </div>
-                          <div class="d-flex gap-2">
-                            <button 
-                              type="button" 
-                              class="btn btn-danger"
-                              onclick={handleClearData}
-                            >
-                              <i class="bi bi-trash me-2"></i>
-                              Yes, Delete All Data
-                            </button>
-                            <button 
-                              type="button" 
-                              class="btn btn-secondary"
-                              onclick={cancelClear}
-                            >
-                              Cancel
-                            </button>
-                          </div>
-                        {/if}
-                      </div>
-                    </div>
-                  </div>
-                </div>
+                <MSIConverter onDataRefresh={handleDataRefresh} {customBands} />
               </div>
             {/if}
 
@@ -296,12 +134,4 @@
     border-bottom-color: #0d6efd;
     background: none;
   }
-  
-  .card {
-    transition: box-shadow 0.15s ease-in-out;
-  }
-  
-  .card:hover {
-    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
-  }
 </style>

package/dist/apps/antenna-tools/components/DatabaseViewer.svelte

@@ -134,8 +134,8 @@
             />
           </div>
           <div class="col-md-5">
-            <label class="form-label">Filter by Band</label>
-            <div class="btn-group w-100 flex-wrap" role="group">
+            <span class="form-label d-block">Filter by Band</span>
+            <div class="btn-group w-100 flex-wrap" role="group" aria-label="Filter by frequency band">
               <button 
                 type="button" 
                 class="btn btn-sm {selectedBand === null ? 'btn-primary' : 'btn-outline-primary'}"

package/dist/apps/antenna-tools/components/MSIConverter.svelte

@@ -1,9 +1,21 @@
 <svelte:options runes={true} />
 
 <script lang="ts">
+  import { untrack } from 'svelte';
+  import { SvelteSet } from 'svelte/reactivity';
   import { parseFolderWithErrors, type ParseProgress, type ParseError } from '../utils/msi-parser';
-  import { saveAntennasWithPurge, type ImportResult } from '../utils/db-utils';
-  import { STANDARD_BANDS } from '../band-config';
+  import { 
+    saveAntennasWithPurge, 
+    addAntennas, 
+    clearAllAntennas, 
+    clearAntennasByBands, 
+    getAntennasCountByBand,
+    exportAntennas,
+    loadAntennas,
+    type ImportResult 
+  } from '../utils/db-utils';
+  import { purgeAntennas, calculatePurgeStats } from '../band-config';
+  import { STANDARD_BANDS } from '../types';
   import type { RawAntenna, Antenna, BandDefinition } from '../types';
   
   interface Props {
@@ -26,8 +38,25 @@
   let parseErrors = $state<ParseError[]>([]);
   let showErrorDetails = $state(false);
   
+  // Database management state
+  let bandCounts = $state<Map<number, number>>(new Map());
+  let selectedBandsForPurge = new SvelteSet<number>();
+  let showPurgeByBand = $state(false);
+  
   let recursiveScan = $state(true);
   
+  // Load band counts on mount
+  async function refreshBandCounts() {
+    bandCounts = await getAntennasCountByBand();
+  }
+  
+  // Refresh band counts when component mounts (run once)
+  $effect(() => {
+    untrack(() => {
+      refreshBandCounts();
+    });
+  });
+
   async function selectFolder() {
     try {
       // Check if File System Access API is supported
@@ -96,14 +125,50 @@
       isLoading = true;
       message = 'Purging frequencies and saving to database...';
       
-      // Save with automatic purge (using custom bands if provided)
+      // Purge first
+      const purgedAntennas = purgeAntennas(rawAntennas, customBands);
+      const purgeStats = calculatePurgeStats(rawAntennas.length, purgedAntennas);
+      
+      // Add to database (merge mode - won't clear existing)
+      const { added, updated } = await addAntennas(purgedAntennas);
+      
+      importResult = {
+        success: true,
+        purgeStats
+      };
+      
+      message = `Imported ${purgeStats.totalAfter} antennas (${added} new, ${updated} updated). ${purgeStats.reductionPercent}% reduction from ${purgeStats.totalBefore} raw files.`;
+      
+      // Refresh band counts and notify parent
+      await refreshBandCounts();
+      onDataRefresh?.();
+      
+    } catch (e) {
+      error = e instanceof Error ? e.message : 'Failed to save antennas to database';
+    } finally {
+      isLoading = false;
+    }
+  }
+
+  async function replaceDatabase() {
+    if (rawAntennas.length === 0) {
+      error = 'No antenna data to save.';
+      return;
+    }
+    
+    try {
+      isLoading = true;
+      message = 'Replacing database with new data...';
+      
+      // Save with purge (clears existing first)
       importResult = await saveAntennasWithPurge(rawAntennas, customBands);
       
       if (importResult.success) {
         const stats = importResult.purgeStats;
-        message = `Successfully imported ${stats.totalAfter} antennas (${stats.reductionPercent}% reduction from ${stats.totalBefore} raw files).`;
+        message = `Replaced database with ${stats.totalAfter} antennas (${stats.reductionPercent}% reduction from ${stats.totalBefore} raw files).`;
         
-        // Notify parent of data refresh
+        // Refresh band counts and notify parent
+        await refreshBandCounts();
         onDataRefresh?.();
       } else {
         error = importResult.error || 'Failed to save antennas to database';
@@ -136,16 +201,125 @@
     
     message = 'JSON file downloaded (raw data, not purged).';
   }
+
+  async function handleExportDatabase() {
+    try {
+      isLoading = true;
+      message = 'Exporting database...';
+      await exportAntennas();
+      message = 'Database exported successfully.';
+    } catch (e) {
+      error = e instanceof Error ? e.message : 'Failed to export database';
+    } finally {
+      isLoading = false;
+    }
+  }
+
+  async function handleImportJson(event: Event) {
+    const input = event.target as HTMLInputElement;
+    const file = input.files?.[0];
+    if (!file) return;
+    
+    try {
+      isLoading = true;
+      message = 'Importing JSON file...';
+      
+      const text = await file.text();
+      const data = JSON.parse(text) as Antenna[];
+      
+      // Add to database (merge mode)
+      const { added, updated } = await addAntennas(data);
+      
+      message = `Imported ${data.length} antennas (${added} new, ${updated} updated).`;
+      
+      // Refresh band counts and notify parent
+      await refreshBandCounts();
+      onDataRefresh?.();
+      
+      // Clear file input
+      input.value = '';
+    } catch (e) {
+      error = e instanceof Error ? e.message : 'Failed to import JSON file';
+    } finally {
+      isLoading = false;
+    }
+  }
+
+  async function handlePurgeAll() {
+    if (!confirm('Are you sure you want to delete ALL antennas from the database?')) return;
+    
+    try {
+      isLoading = true;
+      message = 'Clearing database...';
+      await clearAllAntennas();
+      message = 'Database cleared successfully.';
+      importResult = null;
+      rawAntennas = [];
+      
+      // Refresh band counts and notify parent
+      await refreshBandCounts();
+      onDataRefresh?.();
+    } catch (e) {
+      error = e instanceof Error ? e.message : 'Failed to clear database';
+    } finally {
+      isLoading = false;
+    }
+  }
+
+  async function handlePurgeByBands() {
+    if (selectedBandsForPurge.size === 0) {
+      error = 'Please select at least one band to purge.';
+      return;
+    }
+    
+    const bandsArray = Array.from(selectedBandsForPurge);
+    if (!confirm(`Are you sure you want to delete all antennas in bands: ${bandsArray.join(', ')} MHz?`)) return;
+    
+    try {
+      isLoading = true;
+      message = `Purging bands: ${bandsArray.join(', ')} MHz...`;
+      const deleted = await clearAntennasByBands(bandsArray);
+      message = `Deleted ${deleted} antennas from bands: ${bandsArray.join(', ')} MHz.`;
+      selectedBandsForPurge.clear();
+      showPurgeByBand = false;
+      
+      // Refresh band counts and notify parent
+      await refreshBandCounts();
+      onDataRefresh?.();
+    } catch (e) {
+      error = e instanceof Error ? e.message : 'Failed to purge bands';
+    } finally {
+      isLoading = false;
+    }
+  }
+
+  function toggleBandSelection(band: number) {
+    if (selectedBandsForPurge.has(band)) {
+      selectedBandsForPurge.delete(band);
+    } else {
+      selectedBandsForPurge.add(band);
+    }
+  }
+
+  // Calculate total antennas in database
+  let totalInDatabase = $derived(Array.from(bandCounts.values()).reduce((a, b) => a + b, 0));
 </script>
 
 <div class="card border-0 shadow-sm">
   <div class="card-body">
     <header class="d-flex flex-column flex-lg-row align-items-lg-center justify-content-between gap-3 mb-4">
       <div>
-        <h1 class="h3 mb-2">Convert MSI / PNT to JSON</h1>
-        <p class="text-muted mb-0">Scan a folder of antenna definitions. Files will be purged to keep only configured bands.</p>
+        <h1 class="h3 mb-2">Antenna Database Management</h1>
+        <p class="text-muted mb-0">Import MSI/PNT files, export data, and manage frequency bands.</p>
+      </div>
+      <div class="d-flex align-items-center gap-2">
+        {#if totalInDatabase > 0}
+          <span class="badge text-bg-primary fs-6">{totalInDatabase} antennas</span>
+        {:else}
+          <span class="badge text-bg-secondary">Empty database</span>
+        {/if}
+        <span class="badge text-bg-success">Local processing</span>
       </div>
-      <span class="badge text-bg-success">Local processing</span>
     </header>
 
     <!-- Bands Info -->
@@ -160,49 +334,134 @@
     </div>
 
     <div class="d-flex flex-column gap-4">
-      <div class="text-center">
-        <button class="btn btn-primary btn-lg px-4" onclick={selectFolder} disabled={isLoading}>
-          {#if isLoading}
-            <span class="spinner-border spinner-border-sm me-2" role="status" aria-hidden="true"></span>
-            Processing…
-          {:else}
-            <i class="bi bi-folder-plus me-2"></i>
-            Choose folder with MSI / PNT files
-          {/if}
-        </button>
-      </div>
-
-      <div class="d-flex justify-content-center">
-        <div class="form-check form-switch">
-          <input class="form-check-input" type="checkbox" bind:checked={recursiveScan} id="recursiveScan" />
-          <label class="form-check-label" for="recursiveScan">
-            <i class="bi bi-arrow-down-circle me-1"></i>
-            Include sub-folders during scan
-          </label>
+      <!-- Import Section -->
+      <div class="card border">
+        <div class="card-header bg-light">
+          <i class="bi bi-folder-plus me-2"></i>Import from MSI/PNT Folder
         </div>
-      </div>
-
-      {#if rawAntennas.length > 0}
-        <div class="row g-3">
-          <div class="col-md-6">
-            <button class="btn btn-success w-100" onclick={saveToDatabase} disabled={isLoading}>
-              {#if isLoading}
+        <div class="card-body">
+          <div class="text-center mb-3">
+            <button class="btn btn-primary btn-lg px-4" onclick={selectFolder} disabled={isLoading}>
+              {#if isLoading && parseProgress}
                 <span class="spinner-border spinner-border-sm me-2" role="status" aria-hidden="true"></span>
-                Saving…
+                Processing…
               {:else}
-                <i class="bi bi-database-add me-2"></i>
-                Import to database (with purge)
+                <i class="bi bi-folder-plus me-2"></i>
+                Choose folder with MSI / PNT files
               {/if}
             </button>
           </div>
-          <div class="col-md-6">
-            <button class="btn btn-outline-secondary w-100" onclick={downloadJson}>
-              <i class="bi bi-download me-2"></i>
-              Download raw JSON
-            </button>
+
+          <div class="d-flex justify-content-center">
+            <div class="form-check form-switch">
+              <input class="form-check-input" type="checkbox" bind:checked={recursiveScan} id="recursiveScan" />
+              <label class="form-check-label" for="recursiveScan">
+                <i class="bi bi-arrow-down-circle me-1"></i>
+                Include sub-folders during scan
+              </label>
+            </div>
           </div>
+
+          {#if rawAntennas.length > 0}
+            <hr>
+            <div class="row g-3">
+              <div class="col-md-4">
+                <button class="btn btn-success w-100" onclick={saveToDatabase} disabled={isLoading}>
+                  <i class="bi bi-database-add me-2"></i>
+                  Add to database
+                </button>
+                <small class="text-muted d-block text-center mt-1">Merge with existing</small>
+              </div>
+              <div class="col-md-4">
+                <button class="btn btn-warning w-100" onclick={replaceDatabase} disabled={isLoading}>
+                  <i class="bi bi-arrow-repeat me-2"></i>
+                  Replace database
+                </button>
+                <small class="text-muted d-block text-center mt-1">Clear first, then add</small>
+              </div>
+              <div class="col-md-4">
+                <button class="btn btn-outline-secondary w-100" onclick={downloadJson}>
+                  <i class="bi bi-download me-2"></i>
+                  Download raw JSON
+                </button>
+                <small class="text-muted d-block text-center mt-1">Before purge</small>
+              </div>
+            </div>
+          {/if}
         </div>
-      {/if}
+      </div>
+
+      <!-- Database Management Section -->
+      <div class="card border">
+        <div class="card-header bg-light d-flex justify-content-between align-items-center">
+          <span><i class="bi bi-database me-2"></i>Database Management</span>
+        </div>
+        <div class="card-body">
+          <div class="row g-3 mb-3">
+            <div class="col-md-4">
+              <button class="btn btn-outline-primary w-100" onclick={handleExportDatabase} disabled={isLoading || totalInDatabase === 0}>
+                <i class="bi bi-box-arrow-up me-2"></i>
+                Export to JSON
+              </button>
+            </div>
+            <div class="col-md-4">
+              <label class="btn btn-outline-primary w-100 mb-0" style="cursor: pointer;">
+                <i class="bi bi-box-arrow-in-down me-2"></i>
+                Import from JSON
+                <input type="file" accept=".json" onchange={handleImportJson} class="d-none" disabled={isLoading} />
+              </label>
+            </div>
+            <div class="col-md-4">
+              <button class="btn btn-outline-danger w-100" onclick={handlePurgeAll} disabled={isLoading || totalInDatabase === 0}>
+                <i class="bi bi-trash me-2"></i>
+                Purge All
+              </button>
+            </div>
+          </div>
+
+          <!-- Band-specific purge -->
+          {#if bandCounts.size > 0}
+            <div class="border rounded p-3 bg-light">
+              <div class="d-flex justify-content-between align-items-center mb-2">
+                <strong><i class="bi bi-layers me-2"></i>Antennas by Band</strong>
+                <button 
+                  class="btn btn-sm {showPurgeByBand ? 'btn-secondary' : 'btn-outline-secondary'}" 
+                  onclick={() => showPurgeByBand = !showPurgeByBand}
+                >
+                  {showPurgeByBand ? 'Cancel' : 'Purge by Band'}
+                </button>
+              </div>
+              
+              <div class="d-flex flex-wrap gap-2">
+                {#each Array.from(bandCounts.entries()).sort((a, b) => a[0] - b[0]) as [band, count]}
+                  {#if showPurgeByBand}
+                    <button 
+                      class="btn btn-sm {selectedBandsForPurge.has(band) ? 'btn-danger' : 'btn-outline-secondary'}"
+                      onclick={() => toggleBandSelection(band)}
+                    >
+                      {band} MHz ({count})
+                      {#if selectedBandsForPurge.has(band)}
+                        <i class="bi bi-x-circle ms-1"></i>
+                      {/if}
+                    </button>
+                  {:else}
+                    <span class="badge text-bg-secondary">{band} MHz: {count}</span>
+                  {/if}
+                {/each}
+              </div>
+              
+              {#if showPurgeByBand && selectedBandsForPurge.size > 0}
+                <div class="mt-3">
+                  <button class="btn btn-danger" onclick={handlePurgeByBands} disabled={isLoading}>
+                    <i class="bi bi-trash me-2"></i>
+                    Delete {selectedBandsForPurge.size} band(s)
+                  </button>
+                </div>
+              {/if}
+            </div>
+          {/if}
+        </div>
+      </div>
 
       <!-- Progress indicator during parsing -->
       {#if isLoading && parseProgress}

package/dist/apps/antenna-tools/db.js

@@ -11,6 +11,10 @@ class AntennaToolsDatabase extends Dexie {
         this.version(1).stores({
             antennas: '++id, name, frequency, originalFrequency, tilt'
         });
+        // Version 2: Add compound index for duplicate detection
+        this.version(2).stores({
+            antennas: '++id, name, frequency, originalFrequency, tilt, [name+frequency+tilt]'
+        });
     }
     /**
      * Check if database has any antenna data

package/dist/apps/antenna-tools/utils/db-utils.d.ts

@@ -45,6 +45,25 @@ export declare function exportAntennas(): Promise<void>;
  * Clear all antenna data from database
  */
 export declare function clearAllAntennas(): Promise<void>;
+/**
+ * Clear antennas by specific frequency bands
+ * @param bands - Array of band frequencies to delete (e.g., [700, 800, 1800])
+ * @returns Number of antennas deleted
+ */
+export declare function clearAntennasByBands(bands: number[]): Promise<number>;
+/**
+ * Get count of antennas per frequency band
+ * @returns Map of band frequency to count
+ */
+export declare function getAntennasCountByBand(): Promise<Map<number, number>>;
+/**
+ * Add antennas to database (merge mode - no clearing)
+ * Duplicates (same name + frequency + tilt) are overwritten
+ */
+export declare function addAntennas(newAntennas: Antenna[]): Promise<{
+    added: number;
+    updated: number;
+}>;
 /**
  * Check if data has been imported before
  */