fix: service edit, CSRF token stability, and license restore (v1.1.1)

- Fix service edit double-write bug (was creating duplicate entries)
- Add editable display name field to service edit modal
- Backend update endpoint now accepts name, logo, and recalculates url
- Fix CSRF token regeneration breaking all POST requests (nonce was
  being regenerated on every request, invalidating cached tokens)
- CSRF nonce now persists across requests, rotated only on TOTP login
- Frontend secureFetch auto-retries on CSRF failure with fresh token
- Restore lifetime license activation on DNS2

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

dashcaddy-api/.license-counter

@@ -1 +1 @@
-1
+2

dashcaddy-api/csrf-protection.js

@@ -49,31 +49,56 @@ function parseCookie(cookieHeader) {
 }
 
 /**
- * Middleware to set CSRF cookie on all requests.
- * Always generates a fresh nonce server-side (never trusts client-supplied values).
- * The cookie holds the nonce; JavaScript must read it and send the HMAC signature
- * in the x-csrf-token header. The /api/csrf-token endpoint provides the signature.
+ * Middleware to set CSRF cookie on requests.
+ * Preserves existing nonce to avoid invalidating tokens the client has cached.
+ * New nonce is generated only on first visit (no cookie) or after TOTP login
+ * (which calls renewCSRFToken). If TOTP is disabled, the nonce is set once
+ * and never changes.
  */
 function csrfCookieMiddleware(req, res, next) {
-  // Always generate a fresh server-side nonce
-  const csrfNonce = generateToken();
+  const cookies = parseCookie(req.headers.cookie);
+  const existingNonce = cookies[CSRF_COOKIE_NAME];
+
+  // Reuse existing nonce; only generate fresh if no cookie exists yet
+  const csrfNonce = existingNonce || generateToken();
 
   // Store nonce + signature on request so endpoints can access them
   req.csrfToken = signToken(csrfNonce);
   req.csrfNonce = csrfNonce;
 
-  // Set cookie with the nonce (SameSite=Strict for additional protection)
+  // Only set cookie if it's new (avoids unnecessary Set-Cookie headers)
+  if (!existingNonce) {
     res.cookie(CSRF_COOKIE_NAME, csrfNonce, {
       httpOnly: false, // Must be readable by JavaScript for signing
-    secure: req.secure || req.protocol === 'https', // Only secure in HTTPS
+      secure: req.secure || req.protocol === 'https',
       sameSite: 'strict',
       path: '/',
-    maxAge: 24 * 60 * 60 * 1000 // 24 hours
+      maxAge: 365 * 24 * 60 * 60 * 1000 // 1 year (effectively permanent)
     });
+  }
 
   next();
 }
 
+/**
+ * Generate a fresh CSRF nonce and set it on the response.
+ * Called after TOTP login to rotate the token for the new session.
+ * @param {Object} res - Express response object
+ * @param {boolean} secure - Whether to set Secure flag on cookie
+ * @returns {string} The new CSRF signed token
+ */
+function renewCSRFToken(res, secure) {
+  const csrfNonce = generateToken();
+  res.cookie(CSRF_COOKIE_NAME, csrfNonce, {
+    httpOnly: false,
+    secure: !!secure,
+    sameSite: 'strict',
+    path: '/',
+    maxAge: 365 * 24 * 60 * 60 * 1000
+  });
+  return signToken(csrfNonce);
+}
+
 /**
  * Middleware to validate CSRF token on state-changing requests
  * Validates that the token in the cookie matches the token in the header
@@ -174,5 +199,6 @@ module.exports = {
   signToken,
   parseCookie,
   csrfCookieMiddleware,
-  csrfValidationMiddleware
+  csrfValidationMiddleware,
+  renewCSRFToken
 };

dashcaddy-api/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dashcaddy-api",
-  "version": "1.1.0",
+  "version": "1.1.1",
   "description": "DashCaddy API server - Dashboard backend for Docker, Caddy & DNS management",
   "main": "server.js",
   "scripts": {

dashcaddy-api/routes/auth/totp.js

@@ -1,4 +1,5 @@
 const express = require('express');
+const { renewCSRFToken } = require('../../csrf-protection');
 
 module.exports = function(ctx) {
   const router = express.Router();
@@ -104,8 +105,12 @@ module.exports = function(ctx) {
     ctx.log.info('auth', 'TOTP verified, creating session', { ip: ctx.session.getClientIP(req), duration: ctx.totpConfig.sessionDuration });
     ctx.session.create(req, ctx.totpConfig.sessionDuration);
     ctx.session.setCookie(res, ctx.totpConfig.sessionDuration);
+
+    // Rotate CSRF token for the new session
+    const newCsrfToken = renewCSRFToken(res, req.secure || req.protocol === 'https');
+
     ctx.log.debug('auth', 'Session created', { sessions: ctx.session.ipSessions.size });
-    res.json({ success: true, message: 'Authenticated successfully', sessionDuration: ctx.totpConfig.sessionDuration });
+    res.json({ success: true, message: 'Authenticated successfully', sessionDuration: ctx.totpConfig.sessionDuration, csrfToken: newCsrfToken });
   }, 'totp-verify'));
 
   // Check session validity (used by Caddy forward_auth)

dashcaddy-api/routes/services.js

@@ -371,9 +371,9 @@ module.exports = function(ctx) {
     res.json({ success: true, message: `Service "${id}" removed from dashboard` });
   }, 'services-delete'));
 
-  // Update service configuration (subdomain, port, IP, tailscale)
+  // Update service configuration (subdomain, port, IP, tailscale, name, logo)
   router.post('/services/update', ctx.asyncHandler(async (req, res) => {
-    const { oldSubdomain, newSubdomain, port, ip, tailscaleOnly } = req.body;
+    const { oldSubdomain, newSubdomain, port, ip, tailscaleOnly, name, logo } = req.body;
 
     if (!oldSubdomain || !newSubdomain) {
       return ctx.errorResponse(res, 400, 'oldSubdomain and newSubdomain are required');
@@ -440,13 +440,20 @@ module.exports = function(ctx) {
       await ctx.servicesStateManager.update(services => {
         const serviceIndex = services.findIndex(s => s.id === oldSubdomain);
         if (serviceIndex !== -1) {
+          const existing = services[serviceIndex];
+          const finalPort = port || existing.port;
+          const finalIp = ip || existing.ip;
+
           services[serviceIndex] = {
-            ...services[serviceIndex],
+            ...existing,
             id: newSubdomain,
-            port: port || services[serviceIndex].port,
-            ip: ip || services[serviceIndex].ip,
-            tailscaleOnly: tailscaleOnly || false
+            port: finalPort,
+            ip: finalIp,
+            tailscaleOnly: tailscaleOnly || false,
+            url: ctx.buildServiceUrl(newSubdomain)
           };
+          if (name) services[serviceIndex].name = name;
+          if (logo) services[serviceIndex].logo = logo;
           results.services = 'updated';
         } else {
           results.services = 'not found';

status/js/core/service-crud.js

@@ -10,7 +10,7 @@
     const modal = document.getElementById('service-edit-modal');
 
     document.getElementById('service-edit-title').textContent = `Edit ${service.name}`;
-    document.getElementById('edit-service-name-display').textContent = service.name;
+    document.getElementById('edit-service-name').value = service.name;
     document.getElementById('edit-service-url-display').textContent = service.url || buildServiceUrl(service.id);
     document.getElementById('edit-service-logo-preview').src = service.logo || `/assets/${service.id}.png`;
     document.getElementById('edit-subdomain').value = service.id;
@@ -31,6 +31,7 @@
     if (!currentEditService) return;
 
     const newSubdomain = document.getElementById('edit-subdomain').value.trim().toLowerCase();
+    const newName = document.getElementById('edit-service-name').value.trim();
     const newPort = document.getElementById('edit-port').value.trim();
     const newIp = document.getElementById('edit-ip').value.trim() || 'localhost';
     const tailscaleOnly = document.getElementById('edit-tailscale-only').checked;
@@ -45,10 +46,11 @@
     const changes = [];
 
     if (newSubdomain !== oldSubdomain) changes.push('subdomain');
+    if (newName && newName !== currentEditService.name) changes.push('name');
     if (newPort && newPort !== String(currentEditService.port)) changes.push('port');
     if (newIp !== currentEditService.ip) changes.push('ip');
     if (tailscaleOnly !== (currentEditService.tailscaleOnly || false)) changes.push('tailscale');
-    if (newLogo !== currentEditService.logo) changes.push('logo');
+    if (newLogo && newLogo !== currentEditService.logo) changes.push('logo');
 
     if (changes.length === 0) {
       closeServiceEditModal();
@@ -60,16 +62,17 @@
     saveBtn.disabled = true;
 
     try {
-      if (changes.includes('subdomain') || changes.includes('port') || changes.includes('ip') || changes.includes('tailscale')) {
       const response = await secureFetch('/api/v1/services/update', {
         method: 'POST',
         headers: { 'Content-Type': 'application/json' },
         body: JSON.stringify({
           oldSubdomain,
           newSubdomain,
+          name: newName || currentEditService.name,
           port: newPort || currentEditService.port,
           ip: newIp,
-            tailscaleOnly
+          tailscaleOnly,
+          logo: newLogo || undefined
         })
       });
 
@@ -77,14 +80,14 @@
       if (!result.success) {
         throw new Error(result.error || 'Failed to update service');
       }
-      }
 
-      // Update local APPS array
+      // Update local APPS array to match
       const appIndex = window.APPS.findIndex(a => a.id === oldSubdomain);
       if (appIndex !== -1) {
         window.APPS[appIndex] = {
           ...window.APPS[appIndex],
           id: newSubdomain,
+          name: newName || window.APPS[appIndex].name,
           port: newPort || window.APPS[appIndex].port,
           ip: newIp,
           tailscaleOnly,
@@ -92,27 +95,6 @@
         };
       }
 
-      // Update services via API
-      await secureFetch('/api/v1/services', {
-        method: 'POST',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({
-          id: newSubdomain,
-          name: currentEditService.name,
-          port: newPort || currentEditService.port,
-          ip: newIp,
-          logo: newLogo || currentEditService.logo,
-          tailscaleOnly,
-          containerId: currentEditService.containerId,
-          appTemplate: currentEditService.appTemplate
-        })
-      });
-
-      // If subdomain changed, remove old entry
-      if (newSubdomain !== oldSubdomain) {
-        await secureFetch(`/api/v1/services/${oldSubdomain}`, { method: 'DELETE' });
-      }
-
       closeServiceEditModal();
       window.buildGrid();
       window.refreshAll();

status/js/core/service-modals.js

@@ -12,12 +12,19 @@
         <!-- Service Info -->
         <div style="display: flex; align-items: center; gap: 12px; padding: 12px; background: var(--card-bg); border-radius: 8px;">
           <img id="edit-service-logo-preview" src="" alt="" style="width: 48px; height: 48px; border-radius: 8px; object-fit: contain; background: var(--bg);" />
-          <div>
-            <div id="edit-service-name-display" style="font-weight: 600; font-size: 1.1rem;"></div>
+          <div style="flex: 1;">
             <div id="edit-service-url-display" class="text-muted-sm"></div>
           </div>
         </div>
 
+        <!-- Display Name -->
+        <div>
+          <label for="edit-service-name" class="form-label-accent-sm">
+            Display Name
+          </label>
+          <input type="text" id="edit-service-name" class="form-input-md" placeholder="Service name shown on dashboard" />
+        </div>
+
         <!-- Subdomain -->
         <div>
           <label for="edit-subdomain" class="form-label-accent-sm">

status/js/globals.js

@@ -166,16 +166,18 @@ async function getCSRFToken() {
 }
 
 /**
- * Secure fetch wrapper that automatically adds CSRF token to state-changing requests
+ * Secure fetch wrapper that automatically adds CSRF token to state-changing requests.
+ * If the server returns a CSRF error (403 with DC-100/DC-101), automatically
+ * refreshes the token and retries once.
  * @param {string} url - URL to fetch
  * @param {Object} options - Fetch options
  * @returns {Promise<Response>} Fetch response
  */
 async function secureFetch(url, options = {}) {
   const method = (options.method || 'GET').toUpperCase();
+  const needsCsrf = !['GET', 'HEAD', 'OPTIONS'].includes(method);
 
-  // Add CSRF token for state-changing methods
-  if (!['GET', 'HEAD', 'OPTIONS'].includes(method)) {
+  if (needsCsrf) {
     try {
       const token = await getCSRFToken();
       options.headers = {
@@ -192,8 +194,27 @@ async function secureFetch(url, options = {}) {
     options = { ...options, signal: AbortSignal.timeout(15000) };
   }
 
+  const response = await fetch(url, options);
+
+  // Auto-retry once on CSRF failure (token may have been rotated by TOTP re-auth)
+  if (needsCsrf && response.status === 403) {
+    try {
+      const body = await response.clone().json();
+      if (body.error && (body.error.includes('DC-100') || body.error.includes('DC-101'))) {
+        csrfToken = null; // Clear cached token
+        const freshToken = await getCSRFToken();
+        options.headers = { ...options.headers, 'X-CSRF-Token': freshToken };
+        // New signal for retry (old one may have been consumed)
+        options.signal = AbortSignal.timeout(15000);
         return fetch(url, options);
       }
+    } catch (_) {
+      // If clone/json fails, return original response
+    }
+  }
+
+  return response;
+}
 
 // ===== API CALL HELPERS =====
 

status/js/totp-auth.js

@@ -75,6 +75,10 @@
 
       if (data.success) {
         errorEl.textContent = '';
+        // Update cached CSRF token from TOTP response (server rotates it on login)
+        if (data.csrfToken) {
+          csrfToken = data.csrfToken;
+        }
         hideTotpOverlay();
         // Check if redirected here from another service
         const redirect = safeSessionGet('totp_redirect');