Update service worker cache revision, enhance AppSwitcher with online status indicator, and improve HTTPS setup script for PWA support

- Updated the cache revision for index.html in the service worker to ensure proper asset management.
- Enhanced AppSwitcher.vue with a new online status button for mobile/tablet views and a dropdown for desktop.
- Improved setup-https-dev.sh to include PWA snippet for nginx configuration, facilitating Android install and ensuring HTTPS is properly set up for PWA functionality.

neode-ui/dev-dist/sw.js

@@ -82,7 +82,7 @@ define(['./workbox-21a80088'], (function (workbox) { 'use strict';
     "revision": "3ca0b8505b4bec776b69afdba2768812"
   }, {
     "url": "index.html",
-    "revision": "0.t09hvan4eu8"
+    "revision": "0.uegfpird2pk"
   }], {});
   workbox.cleanupOutdatedCaches();
   workbox.registerRoute(new workbox.NavigationRoute(workbox.createHandlerBoundToURL("index.html"), {

neode-ui/src/components/AppSwitcher.vue

@@ -1,8 +1,29 @@
 <template>
   <div class="relative" ref="containerRef">
+    <!-- Mobile/tablet: Online button launches CLI directly (no CLI label, no dropdown) -->
     <button
       type="button"
-      class="flex items-center gap-2 px-3 py-2 rounded-lg glass-card text-white/90 hover:bg-white/10 hover:text-white transition-colors min-w-0 border border-white/10"
+      class="lg:hidden flex items-center gap-2 px-3 py-2 rounded-lg glass-card text-white/90 hover:bg-white/10 hover:text-white transition-colors min-w-0 border border-white/10"
+      @click="selectCLI"
+    >
+      <img
+        src="/assets/img/logo-archipelago.svg"
+        alt="Archipelago"
+        class="w-5 h-5 shrink-0 object-contain opacity-90"
+      />
+      <div class="flex items-center gap-1.5 shrink-0">
+        <div class="relative">
+          <div class="w-2 h-2 rounded-full bg-green-400"></div>
+          <div class="absolute inset-0 w-2 h-2 rounded-full bg-green-400 animate-ping opacity-50"></div>
+        </div>
+        <span class="text-xs text-white/80">Online</span>
+      </div>
+    </button>
+
+    <!-- Desktop: Full switcher with dropdown (lg and up) -->
+    <button
+      type="button"
+      class="hidden lg:flex items-center gap-2 px-3 py-2 rounded-lg glass-card text-white/90 hover:bg-white/10 hover:text-white transition-colors min-w-0 border border-white/10"
       @click="showDropdown = !showDropdown"
     >
       <img

scripts/nginx-pwa-snippet.conf

@@ -0,0 +1,17 @@
+# PWA installability - required for Add to Home Screen on Android
+# Include this inside the HTTPS server block for archipelago
+# Manifest must have Content-Type: application/manifest+json
+location = /manifest.webmanifest {
+    add_header Content-Type application/manifest+json;
+    add_header Cache-Control "public, max-age=0, must-revalidate";
+}
+# Service worker - no cache so updates apply
+location ~ ^/(sw\.js|workbox-.*\.js|registerSW\.js)$ {
+    add_header Content-Type application/javascript;
+    add_header Service-Worker-Allowed /;
+    add_header Cache-Control "no-cache, no-store, must-revalidate";
+}
+# index.html - avoid aggressive cache for PWA updates
+location = /index.html {
+    add_header Cache-Control "public, max-age=0, must-revalidate";
+}

scripts/setup-https-dev.sh

@@ -33,15 +33,39 @@ if [ ! -f "$CERT" ] || [ ! -f "$KEY" ]; then
     echo "   Certificate created at $CERT"
 fi
 
+# PWA snippet for manifest + service worker headers (required for Android install)
+NGINX_SNIPPETS="/etc/nginx/snippets"
+PWA_SNIPPET="$NGINX_SNIPPETS/archipelago-pwa.conf"
+mkdir -p "$NGINX_SNIPPETS"
+SCRIPT_DIR="$(cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)"
+if [ -f "$SCRIPT_DIR/nginx-pwa-snippet.conf" ]; then
+    cp "$SCRIPT_DIR/nginx-pwa-snippet.conf" "$PWA_SNIPPET"
+    echo "   PWA nginx snippet installed at $PWA_SNIPPET"
+fi
+
+# Add PWA snippet include to existing HTTPS block if missing
+if grep -q "listen 443 ssl" "$NGINX_CFG" 2>/dev/null && [ -f "$PWA_SNIPPET" ]; then
+    if ! grep -q "archipelago-pwa" "$NGINX_CFG" 2>/dev/null; then
+        echo "   Adding PWA snippet include to HTTPS block..."
+        # Insert include after "index index.html;" within the HTTPS server block (listen 443 to next })
+        sed -i '/listen 443 ssl/,/^}$/{
+            /index index.html;/a\
+    include snippets/archipelago-pwa.conf;
+        }' "$NGINX_CFG" 2>/dev/null || true
+    fi
+fi
+
 # Check if HTTPS is already configured
 if grep -q "listen 443 ssl" "$NGINX_CFG" 2>/dev/null; then
     echo "HTTPS already configured in nginx."
     nginx -t 2>/dev/null && systemctl reload nginx
+    echo ""
+    echo "PWA: Use https://192.168.1.228 (not http) - accept cert once, then Install app."
     exit 0
 fi
 
 # Add HTTPS server block (duplicate of HTTP block with SSL)
-# Insert after the closing brace of the first server block
+# PWA requires HTTPS for install on Android
 HTTPS_BLOCK='
 # HTTPS - required for PWA install (Add to Home Screen) from dev servers
 server {
@@ -55,6 +79,7 @@ server {
     
     root /opt/archipelago/web-ui;
     index index.html;
+    include snippets/archipelago-pwa.conf;
     
     location / {
         try_files $uri $uri/ /index.html;
@@ -95,4 +120,4 @@ echo "Added HTTPS (port 443) to nginx config."
 # Test and reload
 nginx -t && systemctl reload nginx
 echo ""
-echo "HTTPS enabled. Access via https://192.168.1.228 (accept the certificate warning once to install PWA)."
+echo "HTTPS enabled. PWA install: https://192.168.1.228 (accept the certificate warning once, then Install app)."