fix(errors): address Copilot review on WriteHTTPError JSON envelope (#112)

Copilot flagged three callers that would render the new
{"success":false,"message":...} envelope opaquely:

  1. services.templ service-control: did `await response.text()` and
     toasted the raw blob.
  2. certificates.templ downloadCertificate: same.
  3. security.templ blockIP / unblockIP: same.

Also flagged the 2xx-non-JSON fallback I added in logs.templ and
services.templ as too permissive — silently rendering a non-JSON 2xx
response would hide an auth-redirect HTML page or proxy error.

Fixes:

  * security.templ now defines an `extractErrorMessage(response)`
    helper that parses the JSON envelope when content-type advertises
    JSON, falling back to text otherwise. blockIP / unblockIP route
    through it.
  * services.templ service-control inlines the same JSON-first
    pattern.
  * certificates.templ downloadCertificate inlines the same pattern.
  * logs.templ + services.templ success-path: a 2xx with a non-JSON
    body now throws a "non-JSON response" error instead of being
    silently rendered as log lines / empty service list.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

Author: sarg3nt

gearbox/internal/framework/templates/pages/certificates.templ

@@ -470,8 +470,23 @@ templ Certificates(user *models.User, servers []models.BoxConfig, perms *models.
 				const response = await fetch(`/api/${serverID}/certificates/${encodeURIComponent(domain)}/download`);
 
 				if (!response.ok) {
-					const text = await response.text();
-					throw new Error(text || `HTTP ${response.status}`);
+					// errors.WriteHTTPError now returns a JSON envelope; older
+					// http.Error paths still return text/plain. Try JSON first
+					// so the toast surfaces the structured .message field
+					// rather than the raw '{"success":false,...}' blob.
+					const ct = response.headers.get('content-type') || '';
+					let msg;
+					if (ct.includes('application/json')) {
+						try {
+							const body = await response.json();
+							msg = (body && (body.message || body.error)) || JSON.stringify(body);
+						} catch (_) {
+							msg = await response.text();
+						}
+					} else {
+						msg = await response.text();
+					}
+					throw new Error(msg || `HTTP ${response.status}`);
 				}
 
 				// Get filename from Content-Disposition header or use default

gearbox/internal/framework/templates/pages/logs.templ

@@ -494,6 +494,9 @@ templ Logs(user *models.User, servers []models.BoxConfig) {
 					// error (see errors.WriteHTTPError) — try to parse it and
 					// surface .message on error instead of letting JSON.parse
 					// failures bubble up as confusing "Unexpected token" toasts.
+					// A 2xx response with a non-JSON body is a protocol error
+					// (e.g. an auth-redirect HTML page leaking through) and
+					// must surface as such, not be rendered as log lines.
 					const contentType = response.headers.get('content-type') || '';
 					const isJSON = contentType.includes('application/json');
 					if (!response.ok) {
@@ -508,7 +511,10 @@ templ Logs(user *models.User, servers []models.BoxConfig) {
 						}
 						throw new Error(msg);
 					}
-					return isJSON ? response.json() : { logs: await response.text() };
+					if (!isJSON) {
+						throw new Error(`Unexpected non-JSON response from logs API (content-type=${contentType})`);
+					}
+					return response.json();
 				})
 				.then(data => {
 					rawLogContent = data.logs || 'No logs available';

gearbox/internal/framework/templates/pages/security.templ

@@ -200,6 +200,24 @@ templ SecurityPage(user *models.User, servers []models.BoxConfig, perms *models.
 		let blockedIPsData = [];
 		const canAction = { if perms != nil && perms.HasPermission(models.ComponentSecurity, models.PermissionAction) { "true" } else { "false" } } === 'true';
 
+		// extractErrorMessage normalizes the body of a non-2xx fetch response
+		// into a user-facing string. errors.WriteHTTPError now returns a JSON
+		// envelope `{success:false, message:...}`; older `http.Error` paths
+		// still return text/plain. Try JSON first so the toast surfaces
+		// .message instead of the raw envelope, then fall back to text.
+		async function extractErrorMessage(response) {
+			const ct = response.headers.get('content-type') || '';
+			if (ct.includes('application/json')) {
+				try {
+					const body = await response.json();
+					return (body && (body.message || body.error)) || JSON.stringify(body);
+				} catch (_) {
+					return await response.text();
+				}
+			}
+			return await response.text();
+		}
+
 		document.addEventListener('DOMContentLoaded', function() {
 			const serverInput = document.getElementById('default-server-id');
 			if (serverInput) {
@@ -363,8 +381,7 @@ templ SecurityPage(user *models.User, servers []models.BoxConfig, perms *models.
 				});
 
 				if (!response.ok) {
-					const error = await response.text();
-					throw new Error(error);
+					throw new Error(await extractErrorMessage(response));
 				}
 
 				// Clear form and refresh
@@ -391,8 +408,7 @@ templ SecurityPage(user *models.User, servers []models.BoxConfig, perms *models.
 				});
 
 				if (!response.ok) {
-					const error = await response.text();
-					throw new Error(error);
+					throw new Error(await extractErrorMessage(response));
 				}
 
 				await loadBlockedIPs();

gearbox/internal/framework/templates/pages/services.templ

@@ -217,7 +217,10 @@ templ Services(user *models.User, servers []models.BoxConfig) {
 					// Backend returns a JSON envelope for both success and
 					// error (see errors.WriteHTTPError); surface .message on
 					// error so the UI doesn't show raw 'Unexpected token' from
-					// JSON.parse on plain-text bodies.
+					// JSON.parse on plain-text bodies. A 2xx response with a
+					// non-JSON body (e.g. an auth-redirect HTML page leaking
+					// through) is a protocol error and must surface as such,
+					// not be silently swallowed as an empty list.
 					const contentType = response.headers.get('content-type') || '';
 					const isJSON = contentType.includes('application/json');
 					if (!response.ok) {
@@ -232,7 +235,10 @@ templ Services(user *models.User, servers []models.BoxConfig) {
 						}
 						throw new Error(msg);
 					}
-					return isJSON ? response.json() : { services: [] };
+					if (!isJSON) {
+						throw new Error('Unexpected non-JSON response from services API (content-type=' + contentType + ')');
+					}
+					return response.json();
 				})
 				.then(function(data) {
 					if (data.error) {
@@ -520,8 +526,23 @@ templ Services(user *models.User, servers []models.BoxConfig) {
 				});
 
 				if (!response.ok) {
-					const text = await response.text();
-					throw new Error(text || 'Failed to ' + action + ' service');
+					// errors.WriteHTTPError now returns a JSON envelope; older
+					// http.Error paths still return text/plain. Try JSON first
+					// so the toast surfaces the structured .message field
+					// rather than the raw '{"success":false,...}' blob.
+					const ct = response.headers.get('content-type') || '';
+					let msg;
+					if (ct.includes('application/json')) {
+						try {
+							const body = await response.json();
+							msg = (body && (body.message || body.error)) || JSON.stringify(body);
+						} catch (_) {
+							msg = await response.text();
+						}
+					} else {
+						msg = await response.text();
+					}
+					throw new Error(msg || 'Failed to ' + action + ' service');
 				}
 
 				const data = await response.json();