fix(ui): cookie-authed users' writes silently stranded behind bearer gates

THE CLASS: the /api JWT middleware's TokenLookup is
"cookie:token,header:Authorization:Bearer" — the token cookie always
rides same-origin fetches, so a signed-in user never needs the
localStorage bearer. But a dozen call sites gated their fetch on
`localStorage.getItem("token")` and early-returned when absent. The
global 401 interceptor CLEARS that localStorage entry on any session
rotation/blip — after which every gated write silently did nothing:
theme changes reverted on reload (the reported "can no longer change
themes", on top of the interpolation bug d5dbaa48 fixed), chain-order
selects, collection deletion, Add-to-collection submits, filter
save/load/delete, conflict actions, linking actions, stats charts,
tag suggestions, device management, admin scanner actions — all dead
for perfectly authenticated cookie users.

Fix: storage.ts exports authHeaders() (bearer when present, cookie
carries otherwise) and every gate/header site now uses it — theme.ts,
collections.ts (htmx auth, doRemoveBook/doBulkRemove, setChainOrder),
bookPicker submit, filter_builder suggestions + match count,
collection-rules apply hook, bookshelf save/load/delete filter,
conflicts x4, linking x3, admin scanner actions + polls (requireToken
removed — its "Session expired" toast fired for cookie users too),
dashboard preferences/sections, custom-section-builder, header
scanner poll, stats x3, tag suggestions, profile delete-account
(which also wrongly redirected cookie users to /login), and
device-management x4. Reads keep their graceful-empty behavior; the
bearers still ride along when present.

Pinned: the knob-matrix theme spec now REMOVES localStorage.token and
asserts the theme PUT still fires (cookie-only) and the class flips —
the exact strand that started this.

Found by noticing the panel browser's Nord click switched the class
but produced no PUT: the persistence half was gated on a token the
401 interceptor had cleared.

web/src/device-management.ts

@@ -1,6 +1,6 @@
 import { Alpine } from "./alpine";
 import { showToast } from "./toast";
-import { getToken } from "./storage";
+import { authHeaders, getToken } from "./storage";
 
 function getDeviceIcon(typeName: string): string {
   const deviceIcons: Record<string, string> = {
@@ -27,8 +27,7 @@ function hideAddDeviceModal(): void {
 async function handleAddDevice(event: Event): Promise<void> {
   event.preventDefault();
 
-  const token = getToken();
-  if (!token) return;
+  // cookie auth carries the call; a null bearer must not strand it
 
   const deviceNameInput = document.getElementById("device-name") as HTMLInputElement;
   const deviceTypeInput = document.getElementById("device-type") as HTMLSelectElement;
@@ -47,7 +46,6 @@ async function handleAddDevice(event: Event): Promise<void> {
       method: "POST",
       headers: {
         "Content-Type": "application/json",
-        Authorization: `Bearer ${token}`,
       },
       body: JSON.stringify(data),
     });
@@ -78,13 +76,12 @@ function showDeviceSettings(deviceId: string): void {
 
   deviceIdInput.value = deviceId;
 
-  const token = getToken();
-  if (!token) return;
+  // cookie auth carries the call; a null bearer must not strand it
 
   let deviceType: any;
 
   fetch(`/api/devices/${deviceId}`, {
-    headers: { Authorization: `Bearer ${token}` },
+    headers: authHeaders(),
   })
     .then((res) => res.json())
     .then((device) => {
@@ -97,7 +94,7 @@ function showDeviceSettings(deviceId: string): void {
 
       deviceType = device.device_type;
       return fetch("/api/collections", {
-        headers: { Authorization: `Bearer ${token}` },
+        headers: authHeaders(),
       });
     })
     .then((res) => res.json())
@@ -153,7 +150,7 @@ async function loadShelfMappings(deviceId: string): Promise<void> {
 
   try {
     const response = await fetch(`/api/devices/${deviceId}/collections`, {
-      headers: { Authorization: `Bearer ${token}` },
+      headers: authHeaders(),
     });
     const result = await response.json();
 
@@ -233,7 +230,7 @@ async function loadCollections(): Promise<void> {
 
   try {
     const response = await fetch("/api/collections", {
-      headers: { Authorization: `Bearer ${token}` },
+      headers: authHeaders(),
     });
     const result = await response.json();
 
@@ -312,7 +309,6 @@ async function handleSaveMapping(event: Event): Promise<void> {
       method: method,
       headers: {
         "Content-Type": "application/json",
-        Authorization: `Bearer ${token}`,
       },
       body: JSON.stringify(data),
     });
@@ -342,7 +338,7 @@ async function deleteMapping(mappingId: string): Promise<void> {
   try {
     const response = await fetch(`/api/devices/${deviceId}/collections/${mappingId}`, {
       method: "DELETE",
-      headers: { Authorization: `Bearer ${token}` },
+      headers: authHeaders(),
     });
 
     if (response.ok) {
@@ -412,14 +408,13 @@ async function handleSaveDeviceSettings(event: Event): Promise<void> {
       method: "PUT",
       headers: {
         "Content-Type": "application/json",
-        Authorization: `Bearer ${token}`,
       },
       body: JSON.stringify(deviceData),
     });
 
     const collectionsRes = await fetch("/api/collections", {
       method: "GET",
-      headers: { Authorization: `Bearer ${token}` },
+      headers: authHeaders(),
     });
     const collections = await collectionsRes.json();
 
@@ -431,8 +426,7 @@ async function handleSaveDeviceSettings(event: Event): Promise<void> {
         method: "PUT",
         headers: {
           "Content-Type": "application/json",
-          Authorization: `Bearer ${token}`,
-        },
+          },
         body: JSON.stringify({
           ...collection,
           view_settings: currentSettings,
@@ -473,7 +467,7 @@ async function handleRevokeDevice(): Promise<void> {
   try {
     const response = await fetch(`/api/devices/${deviceId}`, {
       method: "DELETE",
-      headers: { Authorization: `Bearer ${token}` },
+      headers: authHeaders(),
     });
 
     if (response.ok) {
@@ -490,13 +484,12 @@ async function handleRevokeDevice(): Promise<void> {
 }
 
 async function approveDevice(registrationId: string): Promise<void> {
-  const token = getToken();
-  if (!token) return;
+  // cookie auth carries the call; a null bearer must not strand it
 
   try {
     const response = await fetch(`/api/devices/approve/${registrationId}`, {
       method: "GET",
-      headers: { Authorization: `Bearer ${token}` },
+      headers: authHeaders(),
     });
 
     if (response.ok) {
@@ -512,13 +505,12 @@ async function approveDevice(registrationId: string): Promise<void> {
 }
 
 async function rejectDevice(registrationId: string): Promise<void> {
-  const token = getToken();
-  if (!token) return;
+  // cookie auth carries the call; a null bearer must not strand it
 
   try {
     const response = await fetch(`/api/devices/reject/${registrationId}`, {
       method: "POST",
-      headers: { Authorization: `Bearer ${token}` },
+      headers: authHeaders(),
     });
 
     if (response.ok) {