@smartnet360/svelte-components 0.0.13 → 0.0.15

package/dist/apps/antenna-pattern/components/AntennaControls.svelte

@@ -2,6 +2,7 @@
 
 <script lang="ts">
   import type { Antenna } from '../db';
+  import { sortAntennasWithRecent, addToRecentAntennas } from '../utils/recent-antennas';
 
   interface Props {
     antennas?: Antenna[];
@@ -47,23 +48,37 @@
   $effect(() => {
     // Only update internal state if the prop actually changed
     // Avoid overwriting user selections
-    console.log(`[Antenna ${antennaNumber}] Effect triggered - selectedAntenna prop:`, selectedAntenna?.name || 'null', 'internal:', internalSelectedAntenna?.name || 'null');
     if (selectedAntenna !== internalSelectedAntenna) {
-      console.log(`[Antenna ${antennaNumber}] Effect updating internal state from:`, internalSelectedAntenna?.name || 'null', 'to:', selectedAntenna?.name || 'null');
       internalSelectedAntenna = selectedAntenna;
     }
   });
 
-  // Get available electrical tilts from antennas with the selected name and frequency
+    // Get available electrical tilts from antennas with the selected name and frequency
   let availableElectricalTilts = $state<string[]>(['0']);
   $effect(() => {
+    console.log('🔄 [TILTS] Effect triggered - updating available tilts:', {
+      antenna: internalSelectedAntenna?.name,
+      frequency: selectedFrequency,
+      currentTilts: availableElectricalTilts,
+      timestamp: new Date().toISOString()
+    });
+
+    let newTilts: string[] = ['0'];
+
     if (internalSelectedAntenna) {
       // Find ALL antennas with the same name and frequency to collect all electrical tilts
       let sameName = antennas.filter(a => a.name === internalSelectedAntenna!.name);
+      console.log('🔍 [TILTS] Found antennas with same name:', sameName.length);
       
       // If frequency is selected, filter by it
       if (selectedFrequency) {
+        const beforeFilter = sameName.length;
         sameName = sameName.filter(a => a.frequency === selectedFrequency);
+        console.log('🔍 [TILTS] After frequency filter:', {
+          before: beforeFilter,
+          after: sameName.length,
+          frequency: selectedFrequency
+        });
       }
       
       const allTilts = new Set<string>();
@@ -80,41 +95,36 @@
       });
       
       // Convert to sorted array
-      availableElectricalTilts = Array.from(allTilts).sort((a, b) => parseFloat(a) - parseFloat(b));
+      newTilts = Array.from(allTilts).sort((a, b) => parseFloat(a) - parseFloat(b));
+      
+      console.log('✅ [TILTS] Available tilts calculated:', {
+        from: availableElectricalTilts,
+        to: newTilts,
+        changed: JSON.stringify(availableElectricalTilts) !== JSON.stringify(newTilts)
+      });
     } else {
-      availableElectricalTilts = ['0'];
+      console.log('ℹ️ [TILTS] No antenna selected, using default tilts');
+    }
+
+    // Only update if actually changed to prevent infinite loops
+    if (JSON.stringify(availableElectricalTilts) !== JSON.stringify(newTilts)) {
+      availableElectricalTilts = newTilts;
     }
   });
 
   // Find the specific antenna that matches name, frequency, and electrical tilt
   function findAntennaWithTilt(antennaName: string, tiltIndex: number): Antenna | null {
-    console.log(`[Antenna ${antennaNumber}] findAntennaWithTilt called with:`, antennaName, 'tiltIndex:', tiltIndex);
-    
-    if (!antennaName) {
-      console.log(`[Antenna ${antennaNumber}] No antennaName provided, returning null`);
-      return null;
-    }
+    if (!antennaName) return null;
     
     // Handle case where availableElectricalTilts might not be populated yet
     const targetTilt = availableElectricalTilts[tiltIndex] || '0';
-    console.log(`[Antenna ${antennaNumber}] availableElectricalTilts:`, availableElectricalTilts);
-    console.log(`[Antenna ${antennaNumber}] targetTilt:`, targetTilt);
-    console.log(`[Antenna ${antennaNumber}] selectedFrequency:`, selectedFrequency);
     
     // Find antenna with matching name, frequency, and electrical tilt
-    const result = antennas.find(antenna => {
-      console.log(`[Antenna ${antennaNumber}] Checking antenna:`, antenna.name, 'freq:', antenna.frequency, 'tilt:', antenna.tilt);
-      
-      if (antenna.name !== antennaName) {
-        console.log(`[Antenna ${antennaNumber}] Name mismatch:`, antenna.name, '!==', antennaName);
-        return false;
-      }
+    return antennas.find(antenna => {
+      if (antenna.name !== antennaName) return false;
       
       // If frequency is selected, must match
-      if (selectedFrequency && antenna.frequency !== selectedFrequency) {
-        console.log(`[Antenna ${antennaNumber}] Frequency mismatch:`, antenna.frequency, '!==', selectedFrequency);
-        return false;
-      }
+      if (selectedFrequency && antenna.frequency !== selectedFrequency) return false;
       
       if (antenna.tilt) {
         const tiltString = antenna.tilt.toString();
@@ -122,37 +132,155 @@
           ? tiltString.split(',').map(t => t.trim())
           : [tiltString];
         
-        console.log(`[Antenna ${antennaNumber}] Antenna tilts:`, antennasTilts, 'target:', targetTilt);
-        const tiltMatch = antennasTilts.includes(targetTilt);
-        console.log(`[Antenna ${antennaNumber}] Tilt match:`, tiltMatch);
-        return tiltMatch;
+        return antennasTilts.includes(targetTilt);
       }
       
-      const defaultMatch = targetTilt === '0';
-      console.log(`[Antenna ${antennaNumber}] Default tilt match:`, defaultMatch);
-      return defaultMatch; // Default tilt
+      return targetTilt === '0'; // Default tilt
     }) || null;
-    
-    console.log(`[Antenna ${antennaNumber}] findAntennaWithTilt result:`, result?.name || 'null');
-    return result;
   }
 
   // Handle frequency selection
   function handleFrequencyChange(frequency: number) {
+    console.log('🔄 [FREQ] handleFrequencyChange called:', {
+      requestedFrequency: frequency,
+      currentSelectedFrequency: selectedFrequency,
+      currentAntenna: internalSelectedAntenna?.name,
+      currentTiltIndex: internalElectricalTiltIndex,
+      availableTilts: availableElectricalTilts,
+      timestamp: new Date().toISOString()
+    });
+
+    const previousFrequency = selectedFrequency;
     selectedFrequency = frequency;
     
-    // Reset tilt when frequency changes
-    internalElectricalTiltIndex = 0;
+    console.log('📝 [FREQ] Frequency state updated:', {
+      from: previousFrequency,
+      to: selectedFrequency,
+      changed: previousFrequency !== selectedFrequency
+    });
     
-    // Find the antenna with the new frequency and default tilt
     if (internalSelectedAntenna) {
-      const antennaWithNewFreq = findAntennaWithTilt(internalSelectedAntenna.name, 0);
+      // STEP 1: Calculate available tilts for the new frequency
+      let sameName = antennas.filter(a => a.name === internalSelectedAntenna!.name && a.frequency === frequency);
+      
+      console.log('🔍 [FREQ] Found antennas with same name and new frequency:', {
+        antennaName: internalSelectedAntenna.name,
+        frequency: frequency,
+        count: sameName.length
+      });
+      
+      const allTilts = new Set<string>();
+      sameName.forEach(antenna => {
+        if (antenna.tilt) {
+          const tiltString = antenna.tilt.toString();
+          if (tiltString.includes(',')) {
+            tiltString.split(',').forEach(t => allTilts.add(t.trim()));
+          } else {
+            allTilts.add(tiltString);
+          }
+        }
+      });
+      
+      const newAvailableTilts = Array.from(allTilts).sort((a, b) => parseFloat(a) - parseFloat(b));
+      
+      console.log('🔧 [FREQ] Calculated tilts for new frequency:', {
+        availableTilts: newAvailableTilts,
+        hasZeroTilt: newAvailableTilts.includes('0')
+      });
+      
+      // STEP 2: Determine the best tilt index to use
+      let bestTiltIndex = 0;
+      let bestTiltValue = '0';
+      
+      if (newAvailableTilts.length > 0) {
+        // Prefer '0' tilt if available, otherwise use first available
+        if (newAvailableTilts.includes('0')) {
+          bestTiltIndex = newAvailableTilts.indexOf('0');
+          bestTiltValue = '0';
+        } else {
+          bestTiltIndex = 0;
+          bestTiltValue = newAvailableTilts[0];
+        }
+      }
+      
+      console.log('🎯 [FREQ] Selected best tilt:', {
+        index: bestTiltIndex,
+        value: bestTiltValue,
+        reason: newAvailableTilts.includes('0') ? 'preferred 0 tilt' : 'first available tilt'
+      });
+      
+      // STEP 3: Find antenna with the new frequency and best tilt
+      const antennaWithNewFreq = antennas.find(antenna => {
+        if (antenna.name !== internalSelectedAntenna!.name) return false;
+        if (antenna.frequency !== frequency) return false;
+        
+        // Check if this antenna has the target tilt
+        if (antenna.tilt) {
+          const antennaTiltString = antenna.tilt.toString();
+          const antennaTilts = antennaTiltString.includes(',') 
+            ? antennaTiltString.split(',').map(t => t.trim())
+            : [antennaTiltString];
+          return antennaTilts.includes(bestTiltValue);
+        }
+        return bestTiltValue === '0';
+      });
+      
+      console.log('🎯 [FREQ] Antenna search result:', {
+        found: !!antennaWithNewFreq,
+        searchCriteria: {
+          name: internalSelectedAntenna.name,
+          frequency: frequency,
+          tiltValue: bestTiltValue
+        },
+        antenna: antennaWithNewFreq ? {
+          name: antennaWithNewFreq.name,
+          frequency: antennaWithNewFreq.frequency,
+          tilt: antennaWithNewFreq.tilt
+        } : null
+      });
+
       if (antennaWithNewFreq) {
+        const previousAntenna = internalSelectedAntenna;
+        const previousTiltIndex = internalElectricalTiltIndex;
+        
         internalSelectedAntenna = antennaWithNewFreq;
+        internalElectricalTiltIndex = bestTiltIndex;
+        
+        console.log('✅ [FREQ] Antenna and tilt updated:', {
+          antenna: {
+            from: {
+              name: previousAntenna.name,
+              frequency: previousAntenna.frequency,
+              tilt: previousAntenna.tilt
+            },
+            to: {
+              name: antennaWithNewFreq.name,
+              frequency: antennaWithNewFreq.frequency,
+              tilt: antennaWithNewFreq.tilt
+            }
+          },
+          tiltIndex: {
+            from: previousTiltIndex,
+            to: bestTiltIndex
+          }
+        });
+
+        console.log('📞 [FREQ] Calling onAntennaChange callback');
         onAntennaChange?.(antennaWithNewFreq);
+        
+        console.log('📞 [FREQ] Calling onElectricalTiltChange callback with index', bestTiltIndex);
+        onElectricalTiltChange?.(bestTiltIndex);
+      } else {
+        console.warn('⚠️ [FREQ] No antenna found for frequency, keeping current antenna');
+        // Reset tilt to 0 as fallback
+        internalElectricalTiltIndex = 0;
+        onElectricalTiltChange?.(0);
       }
+    } else {
+      console.log('ℹ️ [FREQ] No current antenna selected');
+      internalElectricalTiltIndex = 0;
+      onElectricalTiltChange?.(0);
     }
-    onElectricalTiltChange?.(0);
   }
 
   // Handle antenna selection
@@ -160,9 +288,6 @@
     const target = event.target as HTMLSelectElement;
     const antennaName = target.value;
     
-    console.log(`[Antenna ${antennaNumber}] handleAntennaChange called with:`, antennaName);
-    console.log(`[Antenna ${antennaNumber}] Before change - internalSelectedAntenna:`, internalSelectedAntenna?.name || 'null');
-    
     // Reset tilt and frequency values when antenna changes
     internalElectricalTiltIndex = 0;
     internalMechanicalTilt = 0;
@@ -170,12 +295,10 @@
     
     // Handle "Select Antenna" case (empty string)
     if (!antennaName) {
-      console.log(`[Antenna ${antennaNumber}] Setting to null (Select Antenna case)`);
       internalSelectedAntenna = null;
       onAntennaChange?.(null);
       onElectricalTiltChange?.(0);
       onMechanicalTiltChange?.(0);
-      console.log(`[Antenna ${antennaNumber}] After null set - internalSelectedAntenna:`, internalSelectedAntenna?.name || 'null');
       return;
     }
     
@@ -191,9 +314,6 @@
       let tiltToUse = tilts.includes('0') ? '0' : tilts[0];
       let tiltIndexToUse = tilts.includes('0') ? tilts.indexOf('0') : 0;
       
-      console.log(`[Antenna ${antennaNumber}] Available tilts for ${antennaName}:`, tilts);
-      console.log(`[Antenna ${antennaNumber}] Using tilt:`, tiltToUse, 'at index:', tiltIndexToUse);
-      
       // Find the specific antenna with the chosen tilt
       const newAntenna = antennas.find(antenna => {
         if (antenna.name !== antennaName) return false;
@@ -207,21 +327,23 @@
         return tiltToUse === '0';
       });
       
-      console.log(`[Antenna ${antennaNumber}] Found antenna with tilt ${tiltToUse}:`, newAntenna?.name || 'null');
       internalSelectedAntenna = newAntenna || null;
       internalElectricalTiltIndex = tiltIndexToUse;
       
     } else {
       // Fallback: use findAntennaWithTilt with index 0
       const newAntenna = findAntennaWithTilt(antennaName, 0);
-      console.log(`[Antenna ${antennaNumber}] Fallback - Found antenna:`, newAntenna?.name || 'null');
       internalSelectedAntenna = newAntenna;
     }
     
     onAntennaChange?.(internalSelectedAntenna);
     onElectricalTiltChange?.(internalElectricalTiltIndex);
     onMechanicalTiltChange?.(0);
-    console.log(`[Antenna ${antennaNumber}] After set - internalSelectedAntenna:`, internalSelectedAntenna?.name || 'null');
+    
+    // Track antenna selection in recent list
+    if (internalSelectedAntenna) {
+      addToRecentAntennas(internalSelectedAntenna);
+    }
   }
 
   // Handle electrical tilt changes
@@ -300,6 +422,9 @@
 
   // Get unique antennas (by name, not by individual DB entries with different tilts)
   let uniqueAntennas = $state<Antenna[]>([]);
+  let recentAntennas = $state<Antenna[]>([]);
+  let otherAntennas = $state<Antenna[]>([]);
+  
   $effect(() => {
     if (antennas.length > 0) {
       // Group antennas by name and take the first one from each group
@@ -309,7 +434,13 @@
           antennaMap.set(antenna.name, antenna);
         }
       });
-      uniqueAntennas = Array.from(antennaMap.values()).sort((a, b) => a.name.localeCompare(b.name));
+      const allUniqueAntennas = Array.from(antennaMap.values()).sort((a, b) => a.name.localeCompare(b.name));
+      
+      // Sort with recent antennas first
+      const { recent, others } = sortAntennasWithRecent(allUniqueAntennas);
+      recentAntennas = recent;
+      otherAntennas = others;
+      uniqueAntennas = [...recent, ...others];
     }
   });
 </script>
@@ -330,12 +461,24 @@
         class="form-select form-select-sm" 
         value={internalSelectedAntenna?.name || ''}
         onchange={handleAntennaChange}
-        onfocus={() => console.log(`[Antenna ${antennaNumber}] Dropdown focused - current value:`, internalSelectedAntenna?.name || 'null')}
       >
         <option value="">-- Select Antenna --</option>
-        {#each uniqueAntennas as antenna}
-          <option value={antenna.name}>{antenna.name}</option>
-        {/each}
+        
+        <!-- Recent Antennas -->
+        {#if recentAntennas.length > 0}
+          <optgroup label="Recent">
+            {#each recentAntennas as antenna}
+              <option value={antenna.name}>▸ {antenna.name}</option>
+            {/each}
+          </optgroup>
+        {/if}
+        
+        <!-- All Other Antennas -->
+        <optgroup label="All Antennas">
+          {#each otherAntennas as antenna}
+            <option value={antenna.name}>{antenna.name}</option>
+          {/each}
+        </optgroup>
       </select>
       {#if internalSelectedAntenna}
         <small class="text-muted mt-1 d-block">
@@ -355,7 +498,16 @@
             <button 
               type="button" 
               class="btn btn-sm {selectedFrequency === freq ? 'btn-primary' : 'btn-outline-secondary'}"
-              onclick={() => handleFrequencyChange(freq)}
+              onclick={(e) => {
+                console.log('🖱️ [FREQ] Button clicked:', {
+                  frequency: freq,
+                  currentSelectedFrequency: selectedFrequency,
+                  isAlreadySelected: selectedFrequency === freq,
+                  clickEvent: e.type,
+                  timestamp: new Date().toISOString()
+                });
+                handleFrequencyChange(freq);
+              }}
             >
               {freq} MHz
             </button>