clean up web a little and upgrade vite

Author: thatjames

internal/web/ui/package-lock.json

@@ -19,9 +19,6 @@
   let componentId = Math.random().toString(36).substr(2, 9);
   let isLargeScreen = $state(false);
 
-  // Use the dropdown states from the store instead of local state
-  // let dropdownStates = $state({}); // Remove this line
-
   const checkScreenSize = () => {
     isLargeScreen = window.innerWidth >= 768;
   };
@@ -58,7 +55,6 @@
     if (activeDropdown && !dropdownStates[activeDropdown]) {
       dropdownStates[activeDropdown] = true;
     }
-    // Don't close other dropdowns when navigating - only open the relevant one
   });
 
   onMount(() => {
@@ -141,7 +137,6 @@
             onclick={option.type !== MenuComponent.Dropdown
               ? (e) => {
                   push(option?.location);
-                  // Close menu on mobile after navigation
                   if (!isLargeScreen) {
                     isMenuOpen.set(false);
                   }
@@ -155,7 +150,6 @@
               ? (e) => {
                   if (e.key === "Enter") {
                     push(option?.location);
-                    // Close menu on mobile after navigation
                     if (!isLargeScreen) {
                       isMenuOpen.set(false);
                     }
@@ -203,7 +197,6 @@
                     : ''}"
                   onclick={() => {
                     push(item.location);
-                    // Close menu on mobile after navigation
                     if (!isLargeScreen) {
                       isMenuOpen.set(false);
                     }
@@ -213,7 +206,6 @@
                   onkeydown={(e) => {
                     if (e.key === "Enter") {
                       push(item.location);
-                      // Close menu on mobile after navigation
                       if (!isLargeScreen) {
                         isMenuOpen.set(false);
                       }

internal/web/ui/src/components/SideMenu.svelte

@@ -13,7 +13,7 @@
   let queryByClientCounter = $state([]);
   let refreshInterval = null;
 
-  const REFRESH_RATE = 30000; // Refresh every 30 seconds
+  const REFRESH_RATE = 30000;
 
   const metricsService = new PrometheusMetricsService();
 
@@ -22,10 +22,8 @@
       loading = true;
       error = null;
 
-      // Fetch histogram for DNS request time
       dnsRequestTime = await metricsService.getHistogram("dns_req_time");
 
-      // Fetch counter vectors
       queryCounters = await metricsService.getCounterVec("dns_query_count");
       cacheHitCounters = await metricsService.getCounterVec(
         "dns_cache_hit_count",
@@ -47,7 +45,6 @@
   onMount(() => {
     fetchDNSMetrics();
 
-    // Set up automatic refresh
     refreshInterval = setInterval(fetchDNSMetrics, REFRESH_RATE);
 
     return () => {
@@ -57,15 +54,13 @@
     };
   });
 
-  // Prepare histogram chart data
   const histogramChartData = $derived.by(() => {
     if (!dnsRequestTime?.buckets) {
       return { series: [], categories: [] };
     }
 
     const buckets = dnsRequestTime.buckets;
 
-    // Calculate incremental counts for each bucket
     const incrementalCounts = [];
     for (let i = 0; i < buckets.length; i++) {
       const current = buckets[i].count;
@@ -84,7 +79,6 @@
     };
   });
 
-  // Aggregate query counters by domain (summing across upstreams and results)
   const queryByDomain = $derived.by(() => {
     if (!queryCounters || queryCounters.length === 0) return [];
 
@@ -99,7 +93,7 @@
     return Array.from(domainMap.entries())
       .map(([domain, count]) => ({ domain, count }))
       .sort((a, b) => b.count - a.count)
-      .slice(0, 10); // Top 10 domains
+      .slice(0, 10);
   });
 
   const countByUpstream = $derived.by(() => {
@@ -128,13 +122,12 @@
         count: counter.value,
       }))
       .sort((a, b) => b.count - a.count)
-      .slice(0, 10); // Top 10 blocked domains
+      .slice(0, 10);
   });
 
   const clientDomains = $derived.by(() => {
     if (!queryByClientCounter || queryByClientCounter.length === 0) return [];
 
-    // Group by IP and sum all queries regardless of result
     const ipMap = new Map();
 
     for (const counter of queryByClientCounter) {
@@ -148,7 +141,6 @@
       .sort((a, b) => b.count - a.count);
   });
 
-  // Prepare top domains chart
   const topDomainsChartData = $derived.by(() => {
     if (!queryByDomain || queryByDomain.length === 0) {
       return { series: [], categories: [] };
@@ -165,7 +157,6 @@
     };
   });
 
-  // Prepare blocked domains chart
   const blockedDomainsChartData = $derived.by(() => {
     if (!blockedDomains || blockedDomains.length === 0) {
       return { series: [], categories: [] };