fix(web): Use nohup for self-updates to survive container death (#41)

* fix(web): Ensure URL updates after HTMX navigation in command palette

Use history.pushState() after HTMX swap completes to ensure
window.location.pathname is correct when rebuilding commands.

* docs: Add rule about unchecked checklists in PR descriptions

CLAUDE.md

@@ -57,6 +57,10 @@ Icons use [Lucide](https://lucide.dev/). Add new icons as macros in `web/templat
 - **NEVER merge anything into main.** Always commit directly or use fast-forward/rebase.
 - Never force push.
 
+## Pull Requests
+
+- Never include unchecked checklists (e.g., `- [ ] ...`) in PR descriptions. Either omit the checklist or use checked items.
+
 ## Releases
 
 Use `gh release create` to create releases. The tag is created automatically.

src/compose_farm/web/static/app.css

@@ -53,3 +53,65 @@
         background-position: 16em center;
     }
 }
+
+/* Command palette FAB - rainbow glow effect */
+@property --cmd-pos { syntax: "<number>"; inherits: true; initial-value: 100; }
+@property --cmd-blur { syntax: "<number>"; inherits: true; initial-value: 10; }
+@property --cmd-scale { syntax: "<number>"; inherits: true; initial-value: 1; }
+@property --cmd-opacity { syntax: "<number>"; inherits: true; initial-value: 0.3; }
+
+#cmd-fab {
+    --g: linear-gradient(to right, #fff, #fff, #0ff, #00f, #8000ff, #e066a3, #f00, #ff0, #bfff80, #fff, #fff);
+    all: unset;
+    position: fixed;
+    bottom: 1.5rem;
+    right: 1.5rem;
+    z-index: 50;
+    cursor: pointer;
+    transform: scale(var(--cmd-scale));
+    transition: --cmd-pos 3s, --cmd-blur 0.3s, --cmd-opacity 0.3s, --cmd-scale 0.2s cubic-bezier(.76,-.25,.51,1.13);
+}
+
+.cmd-fab-inner {
+    display: block;
+    padding: 0.6em 1em;
+    background: #1d232a;
+    border-radius: 8px;
+    font-size: 14px;
+    position: relative;
+}
+
+.cmd-fab-inner > span {
+    background: var(--g) no-repeat calc(var(--cmd-pos) * 1%) 0 / 900%;
+    -webkit-background-clip: text;
+    background-clip: text;
+    -webkit-text-fill-color: transparent;
+    letter-spacing: 0.15ch;
+    font-weight: 600;
+}
+
+.cmd-fab-inner::before, .cmd-fab-inner::after {
+    content: "";
+    position: absolute;
+    border-radius: 8px;
+}
+
+.cmd-fab-inner::before {
+    inset: -1.5px;
+    background: var(--g) no-repeat calc(var(--cmd-pos) * 1%) 0 / 900%;
+    border-radius: 9px;
+    z-index: -1;
+    opacity: var(--cmd-opacity);
+}
+
+.cmd-fab-inner::after {
+    inset: 0;
+    background: #000;
+    transform: translateY(10px);
+    z-index: -2;
+    filter: blur(calc(var(--cmd-blur) * 1px));
+}
+
+#cmd-fab:hover { --cmd-scale: 1.05; --cmd-pos: 0; --cmd-blur: 30; --cmd-opacity: 1; }
+#cmd-fab:hover .cmd-fab-inner::after { background: var(--g); opacity: 0.3; }
+#cmd-fab:active { --cmd-scale: 0.98; --cmd-blur: 15; }

src/compose_farm/web/static/app.js

@@ -437,23 +437,30 @@ function tryReconnectToTask() {
     tryInit(20);
 }
 
+// Play intro animation on command palette button
+function playFabIntro() {
+    const fab = document.getElementById('cmd-fab');
+    if (!fab) return;
+    setTimeout(() => {
+        fab.style.setProperty('--cmd-pos', '0');
+        fab.style.setProperty('--cmd-opacity', '1');
+        fab.style.setProperty('--cmd-blur', '30');
+        setTimeout(() => {
+            fab.style.removeProperty('--cmd-pos');
+            fab.style.removeProperty('--cmd-opacity');
+            fab.style.removeProperty('--cmd-blur');
+        }, 3000);
+    }, 500);
+}
+
 // Initialize on page load
 document.addEventListener('DOMContentLoaded', function() {
     initPage();
     initKeyboardShortcuts();
+    playFabIntro();
 
     // Try to reconnect to any active task
     tryReconnectToTask();
-
-    // Handle ?action= parameter (from command palette navigation)
-    const params = new URLSearchParams(window.location.search);
-    const action = params.get('action');
-    if (action && window.location.pathname === '/') {
-        // Clear the URL parameter
-        history.replaceState({}, '', '/');
-        // Trigger the action
-        htmx.ajax('POST', `/api/${action}`, {swap: 'none'});
-    }
 });
 
 // Re-initialize after HTMX swaps main content
@@ -542,13 +549,21 @@ document.body.addEventListener('htmx:afterRequest', function(evt) {
     let selected = 0;
 
     const post = (url) => () => htmx.ajax('POST', url, {swap: 'none'});
-    const nav = (url) => () => window.location.href = url;
+    const nav = (url) => () => {
+        htmx.ajax('GET', url, {target: '#main-content', select: '#main-content', swap: 'outerHTML'}).then(() => {
+            history.pushState({}, '', url);
+        });
+    };
     // Navigate to dashboard and trigger action (or just POST if already on dashboard)
     const dashboardAction = (endpoint) => () => {
         if (window.location.pathname === '/') {
             htmx.ajax('POST', `/api/${endpoint}`, {swap: 'none'});
         } else {
-            window.location.href = `/?action=${endpoint}`;
+            // Navigate via HTMX, then trigger action after swap
+            htmx.ajax('GET', '/', {target: '#main-content', select: '#main-content', swap: 'outerHTML'}).then(() => {
+                history.pushState({}, '', '/');
+                htmx.ajax('POST', `/api/${endpoint}`, {swap: 'none'});
+            });
         }
     };
     const cmd = (type, name, desc, action, icon = null) => ({ type, name, desc, action, icon });

src/compose_farm/web/streaming.py

@@ -125,31 +125,45 @@ async def _run_cli_via_ssh(
     """Run a cf CLI command via SSH to the host.
 
     Used for self-updates to ensure the command survives container restart.
+    Uses setsid to run command in a new session (completely detached), with
+    output going to a log file. We tail the log to stream output. When SSH
+    dies (container killed), the tail dies but the setsid process continues.
     """
     try:
         # Get the host for the web service
         host = config.get_host(CF_WEB_SERVICE)
 
-        # Build the remote command - prepend common install locations to PATH
-        # since non-interactive SSH doesn't source profile files
         cf_cmd = f"cf {' '.join(args)} --config={config.config_path}"
-        remote_cmd = f"PATH=$HOME/.local/bin:/usr/local/bin:$PATH {cf_cmd}"
+        log_file = "/tmp/cf-self-update.log"  # noqa: S108
 
-        # Show what we're doing (display the cf command, not the bash wrapper)
+        # Build the remote command:
+        # 1. setsid runs command in new session (survives SSH disconnect)
+        # 2. Output goes to log file
+        # 3. tail -f streams the log (dies when SSH dies, but command continues)
+        # 4. wait for tail or timeout after command should be done
+        remote_cmd = (
+            f"rm -f {log_file} && "
+            f"PATH=$HOME/.local/bin:/usr/local/bin:$PATH "
+            f"setsid sh -c '{cf_cmd} > {log_file} 2>&1' & "
+            f"sleep 0.3 && "
+            f"tail -f {log_file} 2>/dev/null"
+        )
+
+        # Show what we're doing
         await stream_to_task(
             task_id,
-            f"{DIM}$ ssh {host.user}@{host.address} {cf_cmd}{RESET}{CRLF}",
+            f"{DIM}$ {cf_cmd}{RESET}{CRLF}",
         )
         await stream_to_task(
             task_id,
-            f"{GREEN}Running via SSH (self-update protection){RESET}{CRLF}",
+            f"{GREEN}Running via SSH (detached with setsid){RESET}{CRLF}",
         )
 
-        # Build SSH command using shared helper (tty=True for progress bars)
-        ssh_args = build_ssh_command(host, remote_cmd, tty=True)
+        # Build SSH command (no TTY needed, output comes from tail)
+        ssh_args = build_ssh_command(host, remote_cmd, tty=False)
 
         # Set up environment with SSH agent
-        env = {**os.environ, "FORCE_COLOR": "1", "TERM": "xterm-256color"}
+        env = {**os.environ}
         ssh_sock = get_ssh_auth_sock()
         if ssh_sock:
             env["SSH_AUTH_SOCK"] = ssh_sock
@@ -161,7 +175,7 @@ async def _run_cli_via_ssh(
             env=env,
         )
 
-        # Stream output
+        # Stream output until SSH dies (container killed) or command completes
         if process.stdout:
             async for line in process.stdout:
                 text = line.decode("utf-8", errors="replace")
@@ -170,7 +184,17 @@ async def _run_cli_via_ssh(
                 await stream_to_task(task_id, text)
 
         exit_code = await process.wait()
-        tasks[task_id]["status"] = "completed" if exit_code == 0 else "failed"
+
+        # Exit code 255 means SSH connection closed (container died during down)
+        # This is expected for self-updates - setsid ensures command continues
+        if exit_code == 255:  # noqa: PLR2004
+            await stream_to_task(
+                task_id,
+                f"{CRLF}{GREEN}Container restarting... refresh the page in a few seconds.{RESET}{CRLF}",
+            )
+            tasks[task_id]["status"] = "completed"
+        else:
+            tasks[task_id]["status"] = "completed" if exit_code == 0 else "failed"
         tasks[task_id]["completed_at"] = time.time()
 
     except Exception as e:

src/compose_farm/web/templates/partials/command_palette.html

@@ -28,8 +28,8 @@
 </dialog>
 
 <!-- Floating button to open command palette -->
-<button id="cmd-fab" class="btn btn-circle glass shadow-lg fixed bottom-6 right-6 z-50 hover:ring hover:ring-base-content/50" title="Command Palette (⌘K)">
-    <span class="flex items-center gap-0.5 text-sm font-semibold">
-        <span class="opacity-70">⌘</span><span>K</span>
-    </span>
+<button id="cmd-fab" class="fixed bottom-6 right-6 z-50" title="Command Palette (⌘K)">
+    <div class="cmd-fab-inner">
+        <span>⌘ + K</span>
+    </div>
 </button>