From edcd42faa2c4a13e54e34f4b651afef3cd2f2f4b Mon Sep 17 00:00:00 2001
From: Ncbudd <209378361+ncbudd@users.noreply.github.com>
Date: Sat, 7 Nov 2026 01:48:29 -0500
Subject: [PATCH 1/7] perf(lumen): keep recent answers instead of asking
 SeerrNG every time

Lumen asked SeerrNG again for everything on every visit: going back to
Discover repeated all its calls, including one detail lookup per title in
"New on <server>". Besides being slow (SeerrNG's first lookup of a title
can take seconds), every call counts against SeerrNG's per-account rate
limit, so quick browsing could hit 429s.

- apiCache.ts: answers younger than 3 minutes are reused without asking;
  older ones (up to a day) show at once while a new answer loads. Saved
  per account in localStorage so a reopened app starts from what it last
  showed; signing out or switching account drops it.
- Any request or other change (POST/PUT/DELETE, another narrator) marks
  everything stale, so nothing keeps showing a title as not requested.
  Requests, quota, sign-in and public settings are always re-checked.
- useApi, the Discover rows, "New on <server>" (the finished row is saved
  too) and list pages use it. A failed refresh keeps the saved answer up.
- Books, Audiobooks, Movies and Series show placeholder posters while the
  first page loads, so a slow answer doesn't look like an empty page.

Checked in the SeerrNG Android app (emulator, Android 16): Movies and
Back, and a full close and reopen, ask SeerrNG for none of Discover's rows
again; Back still behaves.
---
 lumen/src/api.ts                          |   4 +
 lumen/src/apiCache.ts                     | 105 ++++++++++++++++++++++
 lumen/src/components/cards.tsx            |  20 +++++
 lumen/src/hooks.ts                        |  47 ++++++----
 lumen/src/pages/Books.tsx                 |   7 +-
 lumen/src/pages/Browse.tsx                |   3 +-
 lumen/src/pages/Discover.tsx              |  50 +++++------
 lumen/tests/browser/admin-options.spec.ts |  55 ++++++++++++
 8 files changed, 241 insertions(+), 50 deletions(-)
 create mode 100644 lumen/src/apiCache.ts

diff --git a/lumen/src/api.ts b/lumen/src/api.ts
index d915b878a..6aa5fc2d5 100644
--- a/lumen/src/api.ts
+++ b/lumen/src/api.ts
@@ -1,5 +1,6 @@
 // Thin client for the SeerrNG API. Everything goes through the same origin (the Lumen
 // container or the Vite dev proxy), so SeerrNG's session cookie does the auth.
+import { markAllStale } from './apiCache';
 
 export class ApiError extends Error {
   constructor(
@@ -29,6 +30,8 @@ export async function api<T>(path: string, init: RequestInit = {}): Promise<T> {
     }
     throw new ApiError(res.status, msg);
   }
+  // a request or other change: saved answers may now be out of date
+  if (init.method && init.method !== 'GET') markAllStale();
   return res.status === 204 ? (undefined as T) : res.json();
 }
 
@@ -245,6 +248,7 @@ export async function requestAnotherNarration(
   const body = await res.json().catch(() => ({}));
   if (!res.ok)
     throw new ApiError(res.status, body.error || 'The request failed.');
+  markAllStale();
   return body as {
     ok: true;
     bookId: number;
diff --git a/lumen/src/apiCache.ts b/lumen/src/apiCache.ts
new file mode 100644
index 000000000..dfa8252a2
--- /dev/null
+++ b/lumen/src/apiCache.ts
@@ -0,0 +1,105 @@
+// Answers from SeerrNG, kept so going back to a page or reopening Lumen doesn't ask for
+// everything again. Every call counts against SeerrNG's per-account rate limit, and its
+// first lookup of a title can take seconds.
+//
+// - Fresh (under FRESH_MS): used as is, nothing is asked.
+// - Older (up to KEEP_MS): shown at once while a new answer loads in the background.
+// - Saved per account in localStorage, so a reopened app starts from what it last showed.
+//   Signing out or switching account drops it. Requests and other changes mark everything
+//   stale, so nothing keeps showing a title as not requested.
+import { onSessionReset, sessionUserId } from './sessionState';
+
+export const FRESH_MS = 3 * 60_000;
+const KEEP_MS = 24 * 60 * 60_000;
+const MAX_SAVED = 150;
+// these change as people use the site: always asked again (still shown at once meanwhile)
+const ALWAYS_CHECK = /^\/(request|auth|user\/\d+\/quota|settings\/public)/;
+
+type Entry = { at: number; data: unknown };
+let entries = new Map<string, Entry>();
+let loadedFor: number | null | undefined;
+const storeKey = (id: number) => `lumen-cache:${id}`;
+
+function ensureLoaded() {
+  const id = sessionUserId();
+  if (loadedFor === id) return;
+  loadedFor = id;
+  entries = new Map();
+  if (id == null) return;
+  try {
+    const saved = JSON.parse(localStorage.getItem(storeKey(id)) || '[]');
+    const now = Date.now();
+    if (Array.isArray(saved))
+      for (const item of saved) {
+        if (!Array.isArray(item) || typeof item[0] !== 'string') continue;
+        const e = item[1] as Entry | undefined;
+        if (e && typeof e.at === 'number' && now - e.at < KEEP_MS)
+          entries.set(item[0], e);
+      }
+  } catch {
+    // unreadable or blocked storage: start empty
+  }
+}
+
+let saveTimer: ReturnType<typeof setTimeout> | undefined;
+function save() {
+  const id = sessionUserId();
+  if (id == null || loadedFor !== id) return;
+  clearTimeout(saveTimer);
+  saveTimer = setTimeout(() => {
+    if (sessionUserId() !== id) return;
+    try {
+      const newest = [...entries]
+        .sort((a, b) => b[1].at - a[1].at)
+        .slice(0, MAX_SAVED);
+      localStorage.setItem(storeKey(id), JSON.stringify(newest));
+    } catch {
+      // full or blocked storage: keep it in memory only
+    }
+  }, 400);
+}
+
+export function cached<T>(path: string): T | undefined {
+  ensureLoaded();
+  return entries.get(path)?.data as T | undefined;
+}
+
+export function isFresh(path: string) {
+  ensureLoaded();
+  const e = entries.get(path);
+  return !!e && !ALWAYS_CHECK.test(path) && Date.now() - e.at < FRESH_MS;
+}
+
+export function remember(path: string, data: unknown) {
+  ensureLoaded();
+  entries.set(path, { at: Date.now(), data });
+  save();
+}
+
+export function forget(prefix: string) {
+  ensureLoaded();
+  for (const k of [...entries.keys()])
+    if (k.startsWith(prefix)) entries.delete(k);
+  save();
+}
+
+// after a request or other change: keep showing what's there, but ask again next time
+export function markAllStale() {
+  ensureLoaded();
+  const stale = Date.now() - FRESH_MS - 1;
+  for (const e of entries.values()) e.at = Math.min(e.at, stale);
+  save();
+}
+
+onSessionReset(() => {
+  const previous = loadedFor;
+  if (previous != null && previous !== sessionUserId())
+    try {
+      localStorage.removeItem(storeKey(previous));
+    } catch {
+      // blocked storage: nothing was saved
+    }
+  clearTimeout(saveTimer);
+  entries = new Map();
+  loadedFor = undefined;
+});
diff --git a/lumen/src/components/cards.tsx b/lumen/src/components/cards.tsx
index 228f03e85..39375ecdd 100644
--- a/lumen/src/components/cards.tsx
+++ b/lumen/src/components/cards.tsx
@@ -548,6 +548,26 @@ export const RailSkeleton = ({ n = 8, sq }: { n?: number; sq?: boolean }) => (
   </div>
 );
 
+// placeholder grid while a list's first page loads, so a slow answer doesn't look empty
+export const GridSkeleton = ({
+  n = 12,
+  sq,
+  className = 'grid',
+}: {
+  n?: number;
+  sq?: boolean;
+  className?: string;
+}) => (
+  <div className={className} aria-busy="true" aria-label="Loading">
+    {Array.from({ length: n }, (_, i) => (
+      <div key={i} className={`poster ${sq ? 'sq' : ''}`}>
+        <div className="art skel" />
+        <div className="t skel-line" />
+      </div>
+    ))}
+  </div>
+);
+
 // endless scrolling: loads the next page when this marker comes within a screen of view
 export function MoreOnScroll({
   done,
diff --git a/lumen/src/hooks.ts b/lumen/src/hooks.ts
index a609b2c52..04f9faa76 100644
--- a/lumen/src/hooks.ts
+++ b/lumen/src/hooks.ts
@@ -1,14 +1,13 @@
 import { useCallback, useEffect, useRef, useState } from 'react';
 import { useLocation, useNavigate } from 'react-router-dom';
 import { api, hardcoverWorkId, hcCovers } from './api';
+import { cached, forget, isFresh, remember } from './apiCache';
 import { onSessionReset, sessionGeneration } from './sessionState';
 
-// small response cache so going back to a page doesn't refetch everything
-const cache = new Map<string, unknown>();
-
+// A saved answer shows at once; a fresh one isn't asked for again (see apiCache.ts).
 export function useApi<T>(path: string | null) {
   const [data, setData] = useState<T | null>(
-    path ? ((cache.get(path) as T) ?? null) : null
+    path ? (cached<T>(path) ?? null) : null
   );
   const [error, setError] = useState<string | null>(null);
   const [tick, setTick] = useState(0);
@@ -17,32 +16,41 @@ export function useApi<T>(path: string | null) {
     let live = true;
     const generation = sessionGeneration();
     setError(null);
-    if (cache.has(path)) setData(cache.get(path) as T);
-    else setData(null);
+    const saved = cached<T>(path);
+    setData(saved ?? null);
+    if (saved !== undefined && isFresh(path)) return;
     api<T>(path)
       .then((d) => {
         if (generation !== sessionGeneration()) return;
-        cache.set(path, d);
+        remember(path, d);
         if (live) setData(d);
       })
-      .catch(
-        (e) =>
-          live && setError(e instanceof Error ? e.message : 'Failed to load')
-      );
+      .catch((e) => {
+        // a saved answer stays up if refreshing it fails
+        if (live && saved === undefined)
+          setError(e instanceof Error ? e.message : 'Failed to load');
+      });
     return () => {
       live = false;
     };
   }, [path, tick]);
   const reload = useCallback(() => {
-    if (path) cache.delete(path);
+    if (path) forget(path);
     setTick((t) => t + 1);
   }, [path]);
   return { data, error, reload };
 }
 
-export const dropCache = (prefix: string) => {
-  for (const k of cache.keys()) if (k.startsWith(prefix)) cache.delete(k);
-};
+// one answer, from the saved copy while it's fresh
+export async function cachedApi<T>(path: string): Promise<T> {
+  if (isFresh(path)) return cached<T>(path) as T;
+  const generation = sessionGeneration();
+  const d = await api<T>(path);
+  if (generation === sessionGeneration()) remember(path, d);
+  return d;
+}
+
+export const dropCache = forget;
 
 export interface PublicSettings {
   applicationTitle: string;
@@ -111,9 +119,11 @@ export function usePaged<T>(base: string) {
     setLoading(true);
     try {
       const sep = base.includes('?') ? '&' : '?';
-      const d = await api<{ page: number; totalPages: number; results: T[] }>(
-        `${base}${sep}page=${page + 1}`
-      );
+      const d = await cachedApi<{
+        page: number;
+        totalPages: number;
+        results: T[];
+      }>(`${base}${sep}page=${page + 1}`);
       if (!ownsRequest()) return; // an old filter must not replace the current list
       // popular lists shift between pages, so a title can come back; show it once
       const idOf = (x: T) => String((x as { id?: unknown }).id);
@@ -298,7 +308,6 @@ export const CAN_HOVER =
 
 // In-flight responses from an earlier principal cannot refill the new cache.
 onSessionReset(() => {
-  cache.clear();
   pagedSnap.clear();
   bookStates = null;
   bookStatesAt = 0;
diff --git a/lumen/src/pages/Books.tsx b/lumen/src/pages/Books.tsx
index 7b6069511..de8a2532a 100644
--- a/lumen/src/pages/Books.tsx
+++ b/lumen/src/pages/Books.tsx
@@ -1,6 +1,6 @@
 import { Link, useSearchParams } from 'react-router-dom';
 import { bookMediaForFormat, MediaStatus, type BookResult } from '../api';
-import { BookCard, MoreOnScroll } from '../components/cards';
+import { BookCard, GridSkeleton, MoreOnScroll } from '../components/cards';
 import { Avatar } from '../components/Shell';
 import { useEbookCovers, usePaged } from '../hooks';
 import { Icon } from '../icons';
@@ -103,6 +103,11 @@ export default function Books({ format }: { format: 'ebook' | 'audiobook' }) {
                 : 'No books match this view.'}
             </div>
           )}
+        {list.loading && !items.length && list.page === 0 && (
+          <div style={{ marginTop: 16 }}>
+            <GridSkeleton sq={audio} className={`grid ${audio ? 'sqg' : ''}`} />
+          </div>
+        )}
         <div className={`grid ${audio ? 'sqg' : ''}`} style={{ marginTop: 16 }}>
           {items.map((b) => (
             <BookCard key={b.id} b={b} />
diff --git a/lumen/src/pages/Browse.tsx b/lumen/src/pages/Browse.tsx
index 0b86a7bb5..65dae6c9f 100644
--- a/lumen/src/pages/Browse.tsx
+++ b/lumen/src/pages/Browse.tsx
@@ -1,7 +1,7 @@
 import { useEffect, useState } from 'react';
 import { Link, useSearchParams } from 'react-router-dom';
 import { MediaStatus, type TitleResult } from '../api';
-import { MoreOnScroll, TitleCard } from '../components/cards';
+import { GridSkeleton, MoreOnScroll, TitleCard } from '../components/cards';
 import { useAsksRequestOptions } from '../components/requestSheet';
 import { Avatar } from '../components/Shell';
 import { CAN_HOVER, useApi, usePaged } from '../hooks';
@@ -193,6 +193,7 @@ export default function Browse({ kind }: { kind: 'movie' | 'tv' }) {
           <b>Nothing here</b>Try another genre, or switch to All.
         </div>
       )}
+      {list.loading && !items.length && list.page === 0 && <GridSkeleton />}
       <div className="grid">
         {items.map((x) => (
           <TitleCard key={x.id} it={{ ...x, mediaType: kind }} />
diff --git a/lumen/src/pages/Discover.tsx b/lumen/src/pages/Discover.tsx
index d320e1ec2..a88caa79e 100644
--- a/lumen/src/pages/Discover.tsx
+++ b/lumen/src/pages/Discover.tsx
@@ -1,7 +1,6 @@
 import { useEffect, useState } from 'react';
 import { Link } from 'react-router-dom';
 import {
-  api,
   tmdbImg,
   type BookResult,
   type Genre,
@@ -21,27 +20,14 @@ import {
 } from '../components/cards';
 import { Avatar } from '../components/Shell';
 import { useExtras } from '../extras';
-import { useEbookCovers } from '../hooks';
+import { cached, isFresh, remember } from '../apiCache';
+import { cachedApi, useApi, useEbookCovers } from '../hooks';
+import { sessionGeneration } from '../sessionState';
 import { Icon, type IconName } from '../icons';
 import { usePrefs } from '../settings';
 
-// rows that are switched off (or have no service behind them) don't fetch anything:
-// every call counts against SeerrNG's per-account rate limit
-function useApi<T>(path: string | null) {
-  const [data, setData] = useState<T | null>(null);
-  const [error, setError] = useState(false);
-  useEffect(() => {
-    if (!path) return;
-    let live = true;
-    api<T>(path)
-      .then((d) => live && setData(d))
-      .catch(() => live && setError(true));
-    return () => {
-      live = false;
-    };
-  }, [path]);
-  return { data, error };
-}
+// Rows that are switched off (or have no service behind them) don't fetch anything, and
+// rows use saved answers (useApi): every call counts against SeerrNG's per-account rate limit.
 
 // Recently added media: SeerrNG lists recently added media by id, so look up each title's details
 // SeerrNG only lists recently added media for admins, request managers and people with
@@ -49,15 +35,22 @@ function useApi<T>(path: string | null) {
 const RECENT = 2 | 16 | 67108864; // ADMIN | MANAGE_REQUESTS | RECENT_VIEW
 export const canSeeRecent = (permissions?: number) =>
   ((permissions ?? 0) & RECENT) !== 0;
+type Fresh = (TitleResult & { added?: string })[];
+// the finished row is saved too, so coming back to Discover doesn't look up 14 titles again
+const NEW_ROW = '/lumen/new-on-server';
 function useNewOnPlex(enabled: boolean) {
-  const [items, setItems] = useState<
-    (TitleResult & { added?: string })[] | null
-  >(null);
+  const [items, setItems] = useState<Fresh | null>(
+    () => (enabled && cached<Fresh>(NEW_ROW)) || null
+  );
   useEffect(() => {
     if (!enabled) return;
+    const saved = cached<Fresh>(NEW_ROW);
+    if (saved) setItems(saved);
+    if (saved && isFresh(NEW_ROW)) return;
     let live = true;
+    const generation = sessionGeneration();
     (async () => {
-      const page = await api<{ results: MediaRow[] }>(
+      const page = await cachedApi<{ results: MediaRow[] }>(
         '/media?filter=allavailable&take=30&sort=mediaAdded'
       );
       const rows = page.results
@@ -67,7 +60,7 @@ function useNewOnPlex(enabled: boolean) {
         .slice(0, 14);
       const details = await Promise.all(
         rows.map((m) =>
-          api<TitleResult>(`/${m.mediaType}/${m.tmdbId}`)
+          cachedApi<TitleResult>(`/${m.mediaType}/${m.tmdbId}`)
             .then((d) => ({
               ...d,
               mediaType: m.mediaType as 'movie' | 'tv',
@@ -76,11 +69,10 @@ function useNewOnPlex(enabled: boolean) {
             .catch(() => null)
         )
       );
-      if (live)
-        setItems(
-          details.filter(Boolean) as (TitleResult & { added?: string })[]
-        );
-    })().catch(() => live && setItems([]));
+      const row = details.filter(Boolean) as Fresh;
+      if (generation === sessionGeneration()) remember(NEW_ROW, row);
+      if (live) setItems(row);
+    })().catch(() => live && !saved && setItems([]));
     return () => {
       live = false;
     };
diff --git a/lumen/tests/browser/admin-options.spec.ts b/lumen/tests/browser/admin-options.spec.ts
index ae97fb5b3..afe002bf4 100644
--- a/lumen/tests/browser/admin-options.spec.ts
+++ b/lumen/tests/browser/admin-options.spec.ts
@@ -966,3 +966,58 @@ test('a stale game page cannot overwrite loading or errors after a new search',
     page.getByRole('button', { name: 'Retry', exact: true })
   ).toHaveCount(0);
 });
+
+test('Discover reuses saved rows when reopened, and asks again after a request', async ({
+  page,
+}) => {
+  const { posts } = await fixtures(page, { permissions: 32 });
+  const rowCalls = () =>
+    asked.filter(
+      (u) =>
+        new URL(u).pathname === '/api/v1/discover/movies' && !new URL(u).search
+    ).length;
+  const asked: string[] = [];
+  page.on('request', (r) => asked.push(r.url()));
+  await page.goto('/');
+  await expect(
+    page.getByRole('link', { name: 'Fresh Pick' }).first()
+  ).toBeVisible();
+  expect(rowCalls()).toBe(1);
+  await page.waitForTimeout(700); // saved after a short pause
+  // reopened (new page load): rows show from the saved copy, nothing asked again
+  await page.goto('/');
+  await expect(
+    page.getByRole('link', { name: 'Fresh Pick' }).first()
+  ).toBeVisible();
+  await page.waitForTimeout(500);
+  expect(rowCalls()).toBe(1);
+  // a request marks saved answers stale: the next visit asks again
+  await page.goto('/movies');
+  await quickRequest(page, 'Fresh Pick');
+  await expect
+    .poll(() => posts.filter((p) => p.path === '/request').length)
+    .toBe(1);
+  await page.waitForTimeout(700);
+  await page.goto('/');
+  await expect(
+    page.getByRole('link', { name: 'Fresh Pick' }).first()
+  ).toBeVisible();
+  await expect.poll(rowCalls).toBe(2);
+});
+
+test('signing out drops the saved answers', async ({ page }) => {
+  await fixtures(page);
+  await page.goto('/');
+  await expect(
+    page.getByRole('link', { name: 'Fresh Pick' }).first()
+  ).toBeVisible();
+  await page.waitForTimeout(700);
+  expect(
+    await page.evaluate(() => !!localStorage.getItem('lumen-cache:1'))
+  ).toBe(true);
+  await page.goto('/me');
+  await page.getByRole('button', { name: /Sign out/ }).click();
+  await expect
+    .poll(() => page.evaluate(() => localStorage.getItem('lumen-cache:1')))
+    .toBeNull();
+});

From d1d437cad320dc167f631eb85bd0cc4e3e82b1dc Mon Sep 17 00:00:00 2001
From: Ncbudd <209378361+ncbudd@users.noreply.github.com>
Date: Sat, 7 Nov 2026 13:52:49 -0500
Subject: [PATCH 2/7] feat(lumen): everyone's requests, request as, library
 badge, saved settings

Tester feedback:

- Requests gets an Everyone tab for admins and request managers: every
  waiting request first, then the newest, each with who asked, and
  Approve / Decline on waiting ones. The tab shows how many are waiting.
- The request sheet and the Advanced options get "Request as" for people
  SeerrNG lets choose the requester (Admin, or Manage Users together with
  Manage Requests).
- Title pages show the posters' corner glyph on their poster: the check
  when it's in the library, the clock when requested.
- "Lumen settings for everyone" can be saved from the admin page. A small
  nginx script (njs, already in the image) checks with SeerrNG that the
  person is an admin, then writes lumen-config.json into a mounted
  /lumen-data folder. Without that folder the page keeps the download.
---
 docs/using-seerr/lumen.md                 |  27 ++-
 lumen/Dockerfile                          |   6 +
 lumen/compose.lumen-only.yaml             |   9 +-
 lumen/compose.yaml                        |   9 +-
 lumen/deploy/lumen-config.js              | 110 +++++++++++
 lumen/deploy/nginx.conf.template          |  32 ++++
 lumen/src/api.ts                          |   1 +
 lumen/src/components/detail.tsx           |  54 +++++-
 lumen/src/pages/BookDetail.tsx            |   1 +
 lumen/src/pages/Comics.tsx                |   2 +
 lumen/src/pages/Games.tsx                 |   1 +
 lumen/src/pages/LumenSettings.tsx         |  91 +++++++++-
 lumen/src/pages/MovieDetail.tsx           |   1 +
 lumen/src/pages/Music.tsx                 |   1 +
 lumen/src/pages/Requests.tsx              | 121 ++++++++++--
 lumen/src/pages/Sports.tsx                |   2 +
 lumen/src/pages/TvDetail.tsx              |   9 +-
 lumen/src/settings.tsx                    |   4 +
 lumen/src/styles/app.css                  |  11 ++
 lumen/tests/browser/admin-options.spec.ts | 212 ++++++++++++++++++++++
 20 files changed, 670 insertions(+), 34 deletions(-)
 create mode 100644 lumen/deploy/lumen-config.js

diff --git a/docs/using-seerr/lumen.md b/docs/using-seerr/lumen.md
index 53b7493f4..a460003ec 100644
--- a/docs/using-seerr/lumen.md
+++ b/docs/using-seerr/lumen.md
@@ -339,13 +339,25 @@ and showing books at all. You can set the defaults, and lock any of them, with a
 `lumen-config.json` file. The same file sets the sign-in page, the logo and the
 browser tab icon.
 
-The easiest way to write it: sign in to Lumen as an admin, open **You → Lumen
-settings for everyone**, pick what you want, and press **Download
-lumen-config.json**. The page starts from the file you already have. Lumen is
-plain files with no database, so it can't save settings itself; you put the
-downloaded file in place as below.
+The easiest way: sign in to Lumen as an admin, open **You → Lumen settings for
+everyone**, pick what you want, and press **Save for everyone**. The page starts
+from the settings you already have. For the **Save** button, Lumen needs a folder
+it may write to:
 
-To set it up:
+1. Next to `compose.yaml`, create the folder and give it to Lumen's user (101):
+
+   ```sh
+   mkdir lumen-data && sudo chown 101:101 lumen-data
+   ```
+
+2. In `compose.yaml`, remove the `#` from `volumes:` and the `./lumen-data` line
+   under `lumen`, then run `docker compose up -d`.
+
+Only SeerrNG admins can save; Lumen checks with SeerrNG before writing. Settings
+saved this way win over a `lumen-config.json` mounted as below.
+
+Without that folder, the page offers **Download lumen-config.json** instead, and
+you put the file in place by hand:
 
 1. Save this as `lumen-config.json` next to `compose.yaml`, and change what you like:
 
@@ -389,7 +401,8 @@ To set it up:
    - Put setting names in `locked` to stop users changing them, for example
      `"locked": ["showBooks"]`.
 
-2. In `compose.yaml`, remove the `#` from the two `volumes:` lines under `lumen`.
+2. In `compose.yaml`, remove the `#` from `volumes:` and the `./lumen-config.json`
+   line under `lumen`.
    For your own logo and icon, put the images in a `branding` folder next to
    `compose.yaml` and also uncomment the `./branding` line.
 3. Run `docker compose up -d`.
diff --git a/lumen/Dockerfile b/lumen/Dockerfile
index 4f334972a..738eae7a1 100644
--- a/lumen/Dockerfile
+++ b/lumen/Dockerfile
@@ -22,6 +22,12 @@ COPY deploy/05-lumen-env-aliases.envsh /docker-entrypoint.d/05-lumen-env-aliases
 COPY deploy/15-lumen-trusted-proxies.sh /docker-entrypoint.d/15-lumen-trusted-proxies.sh
 RUN chmod 755 /docker-entrypoint.d/05-lumen-env-aliases.envsh /docker-entrypoint.d/15-lumen-trusted-proxies.sh
 COPY --from=build /app/dist /usr/share/nginx/html
+# "Lumen settings for everyone" are saved by a small nginx script (njs, shipped with this
+# image) into /lumen-data: a folder the installer mounts, writable by user 101 (nginx). It is
+# deliberately not created here, so settings are never saved inside a container that an
+# update would replace. Without it the admin page offers lumen-config.json as a download.
+COPY deploy/lumen-config.js /etc/nginx/lumen/lumen-config.js
+RUN sed -i '1i load_module modules/ngx_http_js_module.so;' /etc/nginx/nginx.conf
 # The entrypoint renders only proxy configuration. Keep the static app read-only
 # while allowing the unprivileged master to write its config, cache and PID.
 RUN sed -i 's@/run/nginx.pid@/tmp/nginx.pid@' /etc/nginx/nginx.conf && \
diff --git a/lumen/compose.lumen-only.yaml b/lumen/compose.lumen-only.yaml
index b59c0e237..1841c8e53 100644
--- a/lumen/compose.lumen-only.yaml
+++ b/lumen/compose.lumen-only.yaml
@@ -35,9 +35,14 @@ services:
       - ALL
     security_opt:
       - no-new-privileges:true
-    # Optional admin defaults for every user (see lumen/public/lumen-config.example.json).
-    # Create the file first, then remove the # from the two lines below.
+    # Optional admin defaults for every user (You > Lumen settings for everyone).
+    # To save them from that page, create a folder Lumen may write to:
+    #   mkdir lumen-data && sudo chown 101:101 lumen-data
+    # then remove the # from "volumes:" and the lumen-data line below.
+    # Or write lumen-config.json yourself (see lumen/public/lumen-config.example.json),
+    # create it first, and uncomment the lumen-config.json line instead.
     # volumes:
+    #   - ./lumen-data:/lumen-data
     #   - ./lumen-config.json:/usr/share/nginx/html/lumen-config.json:ro
     #   - ./branding:/usr/share/nginx/html/branding:ro  # optional logo / tab icon
     restart: unless-stopped
diff --git a/lumen/compose.yaml b/lumen/compose.yaml
index 5c24aa74c..ffce0f9d3 100644
--- a/lumen/compose.yaml
+++ b/lumen/compose.yaml
@@ -50,9 +50,14 @@ services:
       - ALL
     security_opt:
       - no-new-privileges:true
-    # Optional admin defaults for every user (see lumen/public/lumen-config.example.json).
-    # Create the file first, then remove the # from the two lines below.
+    # Optional admin defaults for every user (You > Lumen settings for everyone).
+    # To save them from that page, create a folder Lumen may write to:
+    #   mkdir lumen-data && sudo chown 101:101 lumen-data
+    # then remove the # from "volumes:" and the lumen-data line below.
+    # Or write lumen-config.json yourself (see lumen/public/lumen-config.example.json),
+    # create it first, and uncomment the lumen-config.json line instead.
     # volumes:
+    #   - ./lumen-data:/lumen-data
     #   - ./lumen-config.json:/usr/share/nginx/html/lumen-config.json:ro
     #   - ./branding:/usr/share/nginx/html/branding:ro  # optional logo / tab icon
     restart: unless-stopped
diff --git a/lumen/deploy/lumen-config.js b/lumen/deploy/lumen-config.js
new file mode 100644
index 000000000..7db7abb29
--- /dev/null
+++ b/lumen/deploy/lumen-config.js
@@ -0,0 +1,110 @@
+// Saves "Lumen settings for everyone" from the admin page, so nobody has to download
+// lumen-config.json and copy it onto the server by hand. Runs inside nginx (njs).
+//
+// The file goes in /lumen-data, a folder the installer mounts and lets the container write.
+// Without that folder the admin page keeps offering the download instead.
+//
+// Only a SeerrNG admin may save: the person's own SeerrNG session is checked through
+// /_lumen_session_check (SeerrNG's /auth/me) before anything is written.
+import fs from 'fs';
+
+const DIR = '/lumen-data';
+const FILE = DIR + '/lumen-config.json';
+const ADMIN = 2; // SeerrNG's Admin permission bit
+const MAX_BYTES = 64 * 1024;
+
+// 'ok', 'missing' (no folder mounted) or 'readonly' (mounted, but this container can't write)
+function folder() {
+  try {
+    fs.accessSync(DIR, fs.constants.F_OK);
+  } catch (e) {
+    return 'missing';
+  }
+  try {
+    fs.accessSync(DIR, fs.constants.W_OK);
+    return 'ok';
+  } catch (e) {
+    return 'readonly';
+  }
+}
+
+function send(r, status, body) {
+  r.headersOut['Content-Type'] = 'application/json';
+  r.headersOut['Cache-Control'] = 'no-store';
+  r.return(status, JSON.stringify(body));
+}
+
+// A page on another site can't send JSON here without asking first (CORS preflight), which
+// nothing here answers, so it can't save with an admin's cookie. (No Origin check: reverse
+// proxies often rewrite Host.)
+function sameSite(r) {
+  const type = (r.headersIn['Content-Type'] || '').toLowerCase();
+  return type.split(';')[0].trim() === 'application/json';
+}
+
+async function save(r) {
+  if (r.method === 'GET') {
+    const f = folder();
+    send(r, 200, { canSave: f === 'ok', folder: f });
+    return;
+  }
+  if (r.method !== 'PUT') {
+    send(r, 405, { message: 'Use PUT.' });
+    return;
+  }
+  if (!sameSite(r)) {
+    send(r, 403, { message: 'Send the settings as JSON from Lumen.' });
+    return;
+  }
+  const me = await r.subrequest('/_lumen_session_check', { method: 'GET' });
+  if (me.status !== 200) {
+    send(r, 401, { message: 'Sign in again.' });
+    return;
+  }
+  let user;
+  try {
+    user = JSON.parse(me.responseText);
+  } catch (e) {
+    send(r, 502, { message: 'SeerrNG didn’t say who you are.' });
+    return;
+  }
+  if (!user || ((user.permissions || 0) & ADMIN) === 0) {
+    send(r, 403, { message: 'Only admins can change settings for everyone.' });
+    return;
+  }
+  const text = r.requestText || '';
+  if (!text || text.length > MAX_BYTES) {
+    send(r, 413, { message: 'The settings are empty or too large.' });
+    return;
+  }
+  let cfg;
+  try {
+    cfg = JSON.parse(text);
+  } catch (e) {
+    send(r, 400, { message: 'The settings aren’t valid JSON.' });
+    return;
+  }
+  if (!cfg || typeof cfg !== 'object' || Array.isArray(cfg)) {
+    send(r, 400, { message: 'The settings must be a JSON object.' });
+    return;
+  }
+  if (folder() !== 'ok') {
+    send(r, 409, {
+      message:
+        'Lumen has no writable /lumen-data folder. Download the file instead.',
+    });
+    return;
+  }
+  try {
+    // write a copy first, then swap it in, so a reader never sees half a file
+    const tmp = FILE + '.saving';
+    fs.writeFileSync(tmp, JSON.stringify(cfg, null, 2) + '\n');
+    fs.renameSync(tmp, FILE);
+  } catch (e) {
+    send(r, 500, { message: 'Couldn’t write lumen-config.json: ' + e.message });
+    return;
+  }
+  send(r, 200, { saved: true });
+}
+
+export default { save };
diff --git a/lumen/deploy/nginx.conf.template b/lumen/deploy/nginx.conf.template
index b4d073ae7..5ecc128f4 100644
--- a/lumen/deploy/nginx.conf.template
+++ b/lumen/deploy/nginx.conf.template
@@ -18,6 +18,9 @@ map "$lumen_via_proxy:$http_x_forwarded_proto" $lumen_forwarded_proto {
 
 # The same protections full SeerrNG sends with its pages: no framing (clickjacking), scripts only
 # from this origin. Outside hosts: Google Fonts, Plex sign-in, and cover art from many CDNs.
+# saves "Lumen settings for everyone" from the admin page (see lumen-config.js)
+js_import lumen from /etc/nginx/lumen/lumen-config.js;
+
 map "" $lumen_csp {
   default "default-src 'self'; base-uri 'self'; form-action 'self'; frame-ancestors 'none'; object-src 'none'; script-src 'self'; script-src-attr 'none'; style-src 'self' 'unsafe-inline' https://fonts.googleapis.com; font-src 'self' data: https://fonts.gstatic.com; img-src 'self' data: blob: https:; connect-src 'self' https://plex.tv https://*.plex.tv; manifest-src 'self'; worker-src 'self'; frame-src 'none'";
 }
@@ -58,6 +61,8 @@ server {
     internal;
     proxy_pass ${SEERR_URL}/api/v1/auth/me;
     proxy_method GET;
+    # lumen-config.js reads the answer (who is signed in), not just the status
+    subrequest_output_buffer_size 64k;
     proxy_pass_request_body off;
     proxy_set_header Content-Length "";
     proxy_set_header Cookie $http_cookie;
@@ -80,6 +85,33 @@ server {
     proxy_set_header X-Forwarded-Proto $lumen_forwarded_proto;
   }
 
+  # "Lumen settings for everyone": the admin page saves them here (PUT, SeerrNG admins only)
+  # when /lumen-data is mounted and writable; GET says whether it is
+  location = /lumen/config {
+    client_max_body_size 64k;
+    client_body_buffer_size 64k;
+    js_content lumen.save;
+  }
+  # settings saved from the admin page win over a lumen-config.json mounted into the app
+  location = /lumen-config.json {
+    add_header Cache-Control "no-cache";
+    add_header Content-Security-Policy $lumen_csp;
+    add_header X-Frame-Options DENY;
+    add_header X-Content-Type-Options nosniff;
+    add_header Referrer-Policy same-origin;
+    root /lumen-data;
+    try_files /lumen-config.json @lumen_config_mounted;
+  }
+  location @lumen_config_mounted {
+    add_header Cache-Control "no-cache";
+    add_header Content-Security-Policy $lumen_csp;
+    add_header X-Frame-Options DENY;
+    add_header X-Content-Type-Options nosniff;
+    add_header Referrer-Policy same-origin;
+    root /usr/share/nginx/html;
+    try_files /lumen-config.json =404;
+  }
+
   # "open full SeerrNG" links when lumen-config.json sets no seerrPublicUrl
   location = /seerrng {
     return 302 ${SEERR_FULL_URL}/;
diff --git a/lumen/src/api.ts b/lumen/src/api.ts
index 6aa5fc2d5..22135ebe6 100644
--- a/lumen/src/api.ts
+++ b/lumen/src/api.ts
@@ -130,6 +130,7 @@ export interface RequestOptions {
   serverId?: number;
   profileId?: number;
   rootFolder?: string;
+  userId?: number; // request on someone else's behalf (admins)
 }
 const post = (body: object) =>
   api<{ id: number }>('/request', {
diff --git a/lumen/src/components/detail.tsx b/lumen/src/components/detail.tsx
index 155dc88cb..7731a6e1d 100644
--- a/lumen/src/components/detail.tsx
+++ b/lumen/src/components/detail.tsx
@@ -1,6 +1,7 @@
 import { useEffect, useState, type ReactNode } from 'react';
 import { api, type Person, type RequestOptions } from '../api';
 import { useAuth } from '../auth';
+import { Glyph, type Stat } from './cards';
 import { Icon, type IconName } from '../icons';
 
 const hue = (s: string) =>
@@ -89,6 +90,7 @@ export function DetailTop({
   title,
   by,
   line,
+  status,
 }: {
   backdrop?: string;
   poster?: string;
@@ -96,6 +98,8 @@ export function DetailTop({
   title: string;
   by?: ReactNode;
   line: ReactNode[];
+  // in the library, requested or downloading: the posters' corner glyph, on this poster too
+  status?: Stat;
 }) {
   // the floating back button lives in Shell, so it's there while the page loads or if it fails
   return (
@@ -106,6 +110,7 @@ export function DetailTop({
       <div className="dtop">
         <div className={`dposter ${square ? 'sq' : ''}`}>
           {poster && <img src={poster} alt="" />}
+          <Glyph s={status ?? null} />
         </div>
         <div className="dtitle">
           <h1>{title}</h1>
@@ -156,6 +161,16 @@ interface ServerDetail {
 // who may pick the Radarr/Sonarr server, quality and folder for a request
 export const canChooseRequestOptions = (permissions?: number) =>
   ((permissions ?? 0) & MANAGE) !== 0;
+// who may make a request in someone else's name: SeerrNG wants Manage Users and Manage
+// Requests together (or Admin)
+export const canRequestAs = (permissions?: number) => {
+  const p = permissions ?? 0;
+  return (p & 2) !== 0 || (p & (8 | 16)) === (8 | 16);
+};
+interface RequestUser {
+  id: number;
+  displayName: string;
+}
 
 export function AdvancedOptions({
   kind,
@@ -178,6 +193,15 @@ export function AdvancedOptions({
   const [detail, setDetail] = useState<ServerDetail | null>(null);
   const [err, setErr] = useState('');
   const [o, setO] = useState<RequestOptions>({});
+  const asAllowed = canRequestAs(user?.permissions);
+  const [people, setPeople] = useState<RequestUser[] | null>(null);
+  const [asUser, setAsUser] = useState<number | undefined>();
+  useEffect(() => {
+    if (!open || !asAllowed || people) return;
+    api<{ results: RequestUser[] }>('/user?take=100&skip=0&sort=displayname')
+      .then((d) => setPeople(d.results))
+      .catch(() => setPeople([])); // the picker just stays hidden
+  }, [open, asAllowed, people]);
 
   useEffect(() => {
     if (!open || servers) return;
@@ -221,7 +245,17 @@ export function AdvancedOptions({
       live = false;
     };
   }, [o.serverId, svc]);
-  useEffect(() => onChange(open ? o : {}), [o, open, onChange]);
+  useEffect(
+    () =>
+      onChange(
+        open
+          ? asUser && asUser !== user?.id
+            ? { ...o, userId: asUser }
+            : o
+          : {}
+      ),
+    [o, open, asUser, user?.id, onChange]
+  );
   useEffect(() => {
     onReady?.(
       !!detail &&
@@ -239,6 +273,24 @@ export function AdvancedOptions({
       {!servers && !err && open && <p className="note">Loading servers…</p>}
       {servers && (
         <div className="adv-grid">
+          {asAllowed && !!people?.length && user && (
+            <label className="sel">
+              <span className="lbl">Request as</span>
+              <select
+                value={asUser ?? user.id}
+                onChange={(e) => setAsUser(+e.target.value)}
+              >
+                <option value={user.id}>Me ({user.displayName})</option>
+                {people
+                  .filter((x) => x.id !== user.id)
+                  .map((x) => (
+                    <option key={x.id} value={x.id}>
+                      {x.displayName}
+                    </option>
+                  ))}
+              </select>
+            </label>
+          )}
           <label className="sel">
             <span className="lbl">Server</span>
             <select
diff --git a/lumen/src/pages/BookDetail.tsx b/lumen/src/pages/BookDetail.tsx
index a3317038c..1e24f23b6 100644
--- a/lumen/src/pages/BookDetail.tsx
+++ b/lumen/src/pages/BookDetail.tsx
@@ -356,6 +356,7 @@ export default function BookDetail() {
   return (
     <article className="detail">
       <DetailTop
+        status={s}
         poster={b.posterPath || undefined}
         square={audio}
         title={b.title}
diff --git a/lumen/src/pages/Comics.tsx b/lumen/src/pages/Comics.tsx
index 3152cc349..b288e1936 100644
--- a/lumen/src/pages/Comics.tsx
+++ b/lumen/src/pages/Comics.tsx
@@ -138,6 +138,7 @@ export function ComicDetail() {
     <ExtraGate k="comic">
       <article className="detail">
         <DetailTop
+          status={s}
           poster={c.posterPath}
           title={c.title}
           line={[
@@ -308,6 +309,7 @@ export function MagazineDetail() {
     <ExtraGate k="magazine">
       <article className="detail">
         <DetailTop
+          status={s}
           poster={m.posterPath}
           title={m.title}
           line={[
diff --git a/lumen/src/pages/Games.tsx b/lumen/src/pages/Games.tsx
index baf7c9a46..aaa5b086b 100644
--- a/lumen/src/pages/Games.tsx
+++ b/lumen/src/pages/Games.tsx
@@ -264,6 +264,7 @@ export function GameDetail() {
     <ExtraGate k="game">
       <article className="detail">
         <DetailTop
+          status={s}
           backdrop={g.screenshots?.[0]}
           poster={g.coverUrl}
           title={g.title}
diff --git a/lumen/src/pages/LumenSettings.tsx b/lumen/src/pages/LumenSettings.tsx
index 2cf599f30..494225808 100644
--- a/lumen/src/pages/LumenSettings.tsx
+++ b/lumen/src/pages/LumenSettings.tsx
@@ -14,9 +14,9 @@ import {
   type DiscoverRow,
 } from '../settings';
 
-// Admins choose what everyone gets. Lumen is static files with no database, so the
-// result is a lumen-config.json to download and mount next to the app; every browser
-// reads it on its next load.
+// Admins choose what everyone gets, saved as lumen-config.json; every browser reads it on its
+// next load. Lumen has no database: its nginx saves the file into a mounted /lumen-data folder
+// (deploy/lumen-config.js). Without that folder the file is downloaded and mounted by hand.
 const SWITCHES = [
   ['hoverRequest', 'Quick request on posters'],
   ['wholeSeriesDefault', 'Request whole series by default'],
@@ -28,7 +28,7 @@ type Switch = (typeof SWITCHES)[number][0];
 
 export default function LumenSettings() {
   const { user } = useAuth();
-  const { adminConfig } = usePrefs();
+  const { adminConfig, adminSaved } = usePrefs();
   const toast = useToast();
   const [cfg, setCfgState] = useState<AdminConfig>(() =>
     JSON.parse(JSON.stringify(adminConfig || {}))
@@ -45,6 +45,29 @@ export default function LumenSettings() {
     setCfgState(v);
   };
   const isAdmin = ((user?.permissions ?? 0) & 2) !== 0;
+  // can this server save the file itself? null while asking
+  const [saveState, setSaveState] = useState<{
+    canSave: boolean;
+    folder?: string;
+  } | null>(null);
+  const [saving, setSaving] = useState(false);
+  useEffect(() => {
+    if (!isAdmin) return;
+    let live = true;
+    fetch('/lumen/config', { cache: 'no-store', credentials: 'same-origin' })
+      .then((r) => (r.ok ? r.json() : null))
+      .then(
+        (d) =>
+          live &&
+          setSaveState(
+            d && typeof d.canSave === 'boolean' ? d : { canSave: false }
+          )
+      )
+      .catch(() => live && setSaveState({ canSave: false }));
+    return () => {
+      live = false;
+    };
+  }, [isAdmin]);
 
   const defaults = { ...DEFAULT_PREFS, ...(cfg.defaults || {}) };
   const rows = { ...DEFAULT_PREFS.rows, ...(cfg.defaults?.rows || {}) };
@@ -90,6 +113,26 @@ export default function LumenSettings() {
     a.click();
     setTimeout(() => URL.revokeObjectURL(url), 1000);
   };
+  const save = async () => {
+    setSaving(true);
+    try {
+      const r = await fetch('/lumen/config', {
+        method: 'PUT',
+        credentials: 'same-origin',
+        headers: { 'Content-Type': 'application/json' },
+        body: json,
+      });
+      const d = await r.json().catch(() => null);
+      if (!r.ok) throw new Error(d?.message || `Couldn’t save (${r.status})`);
+      adminSaved(JSON.parse(json));
+      touched.current = false;
+      toast('Saved. Everyone gets it the next time they open Lumen.');
+    } catch (e) {
+      toast(e instanceof Error ? e.message : 'Couldn’t save');
+    } finally {
+      setSaving(false);
+    }
+  };
   const copy = () =>
     navigator.clipboard
       ?.writeText(json)
@@ -161,11 +204,20 @@ export default function LumenSettings() {
           </div>
         </div>
         <p className="sub">
-          Pick what everyone gets, then download <b>lumen-config.json</b> and
-          put it next to Lumen (see “Admin defaults” in the Lumen guide). People
-          see the change the next time they open Lumen. “Always on” and “Always
-          off” can’t be changed on anyone’s You page; the others are just where
-          everyone starts.
+          {saveState?.canSave ? (
+            <>
+              Pick what everyone gets, then select <b>Save for everyone</b>.
+            </>
+          ) : (
+            <>
+              Pick what everyone gets, then download <b>lumen-config.json</b>{' '}
+              and put it next to Lumen (see “Admin defaults” in the Lumen
+              guide).
+            </>
+          )}{' '}
+          People see the change the next time they open Lumen. “Always on” and
+          “Always off” can’t be changed on anyone’s You page; the others are
+          just where everyone starts.
         </p>
       </header>
 
@@ -338,13 +390,32 @@ export default function LumenSettings() {
 
       <Section title="lumen-config.json">
         <div className="cfg-actions">
-          <button className="btn btn-primary" onClick={download}>
+          {saveState?.canSave && (
+            <button
+              className="btn btn-primary"
+              onClick={save}
+              disabled={saving}
+            >
+              {saving ? 'Saving…' : 'Save for everyone'}
+            </button>
+          )}
+          <button
+            className={`btn ${saveState?.canSave ? 'btn-tonal' : 'btn-primary'}`}
+            onClick={download}
+          >
             Download lumen-config.json
           </button>
           <button className="btn btn-tonal" onClick={copy}>
             Copy
           </button>
         </div>
+        {saveState && !saveState.canSave && (
+          <p className="note">
+            {saveState.folder === 'readonly'
+              ? 'Lumen can’t write to its /lumen-data folder, so it can’t save this itself. Make the folder writable by user 101 (see “Admin defaults” in the Lumen guide).'
+              : 'To save from here instead of downloading, give Lumen a /lumen-data folder (see “Admin defaults” in the Lumen guide).'}
+          </p>
+        )}
         <textarea
           className="cfg-json"
           readOnly
diff --git a/lumen/src/pages/MovieDetail.tsx b/lumen/src/pages/MovieDetail.tsx
index d4478ee32..a1d7fa48e 100644
--- a/lumen/src/pages/MovieDetail.tsx
+++ b/lumen/src/pages/MovieDetail.tsx
@@ -137,6 +137,7 @@ export default function MovieDetail() {
   return (
     <article className="detail">
       <DetailTop
+        status={s}
         backdrop={tmdbImg(m.backdropPath, 'w1280')}
         poster={tmdbImg(m.posterPath)}
         title={m.title || ''}
diff --git a/lumen/src/pages/Music.tsx b/lumen/src/pages/Music.tsx
index e613ee965..eb06e7d50 100644
--- a/lumen/src/pages/Music.tsx
+++ b/lumen/src/pages/Music.tsx
@@ -180,6 +180,7 @@ export function AlbumDetail() {
     <ExtraGate k="music">
       <article className="detail">
         <DetailTop
+          status={s}
           backdrop={a.artistBackdrop}
           poster={a.posterPath}
           square
diff --git a/lumen/src/pages/Requests.tsx b/lumen/src/pages/Requests.tsx
index c434fe979..df467f081 100644
--- a/lumen/src/pages/Requests.tsx
+++ b/lumen/src/pages/Requests.tsx
@@ -14,7 +14,7 @@ import {
 } from '../api';
 import { useAuth, useMediaServerName } from '../auth';
 import { shortDate } from '../components/cards';
-import { Pill } from '../components/detail';
+import { canChooseRequestOptions, Pill } from '../components/detail';
 import { Avatar } from '../components/Shell';
 import { useToast } from '../components/toast';
 import {
@@ -473,9 +473,49 @@ export default function Requests() {
     setTick((t) => t + 1);
   });
   const extras = useExtras();
+  // admins and request managers also see everyone's requests, and approve or decline them
+  const manage = canChooseRequestOptions(user?.permissions);
+  const everyone = manage && tab === 'everyone';
+  const [others, setOthers] = useState<Row[] | null>(null);
+  const [waiting, setWaiting] = useState<number | null>(null);
+  const [acting, setActing] = useState<number | null>(null);
 
   useEffect(() => {
-    if (!user) return;
+    if (!manage) return;
+    let live = true;
+    api<{ pending: number }>('/request/count')
+      .then((d) => live && setWaiting(d.pending))
+      .catch(() => live && setWaiting(null));
+    return () => {
+      live = false;
+    };
+  }, [manage, tick]);
+
+  useEffect(() => {
+    if (!everyone) return;
+    let live = true;
+    const list = (filter: string, take: number) =>
+      api<{ results: RequestItem[] }>(
+        `/request?take=${take}&skip=0&filter=${filter}&sort=added`
+      ).then((d) => d.results);
+    // every request still waiting, then the newest of the rest
+    Promise.all([list('pending', 50), list('all', 20)])
+      .then(([pending, recent]) => {
+        const seen = new Set(pending.map((r) => r.id));
+        return describeAll(
+          pending.concat(recent.filter((r) => !seen.has(r.id)))
+        );
+      })
+      .then((x) => live && setOthers(x))
+      .catch(() => live && setOthers([]))
+      .finally(() => live && setRefreshing(false));
+    return () => {
+      live = false;
+    };
+  }, [everyone, tick]);
+
+  useEffect(() => {
+    if (!user || everyone) return;
     let live = true;
     const media = api<{ results: RequestItem[] }>(
       `/request?take=40&skip=0&filter=all&sort=added&requestedBy=${user.id}`
@@ -498,7 +538,7 @@ export default function Requests() {
     return () => {
       live = false;
     };
-  }, [user, tick, extras.games.length]);
+  }, [user, everyone, tick, extras.games.length]);
 
   // keep download percentages moving while anything is downloading
   const busy = (rows || []).some((x) => state(x, serverName).pct != null);
@@ -512,7 +552,26 @@ export default function Requests() {
   const ready = all.filter(
     (x) => state(x, serverName).k === 'ok' && !state(x, serverName).active
   );
-  const list = tab === 'ready' ? ready : tab === 'all' ? all : act;
+  const list = everyone
+    ? others || []
+    : tab === 'ready'
+      ? ready
+      : tab === 'all'
+        ? all
+        : act;
+  const shown = everyone ? others : rows;
+  const decide = async (id: number, how: 'approve' | 'decline') => {
+    setActing(id);
+    try {
+      await api(`/request/${id}/${how}`, { method: 'POST' });
+      toast(how === 'approve' ? 'Request approved' : 'Request declined');
+      setTick((t) => t + 1);
+    } catch (e) {
+      toast(e instanceof Error ? e.message : 'Couldn’t update the request');
+    } finally {
+      setActing(null);
+    }
+  };
   const cancel = async (id: number) => {
     try {
       // game requests (negative ids here) are withdrawn through their own endpoint
@@ -537,7 +596,11 @@ export default function Requests() {
           </div>
           <Avatar className="avatar ph-only-avatar" />
         </div>
-        <p className="sub">Everything you’ve asked for, newest first.</p>
+        <p className="sub">
+          {everyone
+            ? 'Everyone’s requests. Waiting ones first, then the newest.'
+            : 'Everything you’ve asked for, newest first.'}
+        </p>
       </header>
       {/* pull-to-refresh pill: fixed, so it never shifts the page layout */}
       <div
@@ -560,6 +623,7 @@ export default function Requests() {
           ['active', 'Active', act.length],
           ['ready', 'Ready', ready.length],
           ['all', 'All', all.length],
+          ...(manage ? [['everyone', 'Everyone', waiting ?? '']] : []),
         ].map(([v, t, n]) => (
           <button
             key={v as string}
@@ -570,12 +634,25 @@ export default function Requests() {
               })
             }
           >
-            {t} <span className="n">{rows ? n : ''}</span>
+            {t}{' '}
+            <span className="n">
+              {v === 'everyone' ? n || '' : rows ? n : ''}
+            </span>
           </button>
         ))}
       </div>
-      {!rows && <p className="note">Loading your requests…</p>}
-      {rows && !list.length && (
+      {!shown && (
+        <p className="note">
+          {everyone ? 'Loading everyone’s requests…' : 'Loading your requests…'}
+        </p>
+      )}
+      {shown && !list.length && everyone && (
+        <div className="empty">
+          <b>No requests yet</b>
+          Nobody has asked for anything.
+        </div>
+      )}
+      {shown && !list.length && !everyone && (
         <div className="empty">
           <b>{tab === 'ready' ? 'Nothing ready yet' : 'No active requests'}</b>
           Find something on{' '}
@@ -617,6 +694,9 @@ export default function Requests() {
                   <Link to={x.href}>{x.title}</Link>
                 </div>
                 <div className="sub">
+                  {everyone && x.r.requestedBy?.displayName
+                    ? `${x.r.requestedBy.displayName} · `
+                    : ''}
                   {x.sub} · {shortDate(x.r.createdAt.slice(0, 10))}
                 </div>
                 <div className="st">
@@ -626,9 +706,28 @@ export default function Requests() {
                   {st.detail && <span className="d">{st.detail}</span>}
                 </div>
                 <div className="rqa">
-                  {st.k === 'ok' &&
-                  x.r.type !== 'book' &&
-                  plexUrl(x.r.media, x.r.is4k) ? (
+                  {everyone && x.r.status === 1 ? (
+                    <>
+                      <button
+                        className="btn btn-sm btn-ok"
+                        disabled={acting === x.r.id}
+                        onClick={() => decide(x.r.id, 'approve')}
+                      >
+                        <Icon name="check" size="sm" />
+                        Approve
+                      </button>
+                      <button
+                        className="btn btn-sm btn-quiet"
+                        disabled={acting === x.r.id}
+                        onClick={() => decide(x.r.id, 'decline')}
+                      >
+                        <Icon name="x" size="sm" />
+                        Decline
+                      </button>
+                    </>
+                  ) : st.k === 'ok' &&
+                    x.r.type !== 'book' &&
+                    plexUrl(x.r.media, x.r.is4k) ? (
                     <a
                       className="btn btn-sm btn-ok"
                       {...mediaLink(x.r.media, x.r.is4k, x.r.type, serverName)}
diff --git a/lumen/src/pages/Sports.tsx b/lumen/src/pages/Sports.tsx
index 4b43de634..17b0a620c 100644
--- a/lumen/src/pages/Sports.tsx
+++ b/lumen/src/pages/Sports.tsx
@@ -128,6 +128,7 @@ export function LeagueDetail() {
     <ExtraGate k="sports">
       <article className="detail">
         <DetailTop
+          status={s}
           poster={l.posterPath}
           square
           title={l.title}
@@ -243,6 +244,7 @@ export function SceneDetail() {
     <ExtraGate k="adult">
       <article className="detail">
         <DetailTop
+          status={s}
           backdrop={x.posterPath}
           title={x.title}
           line={[x.year, x.studio]}
diff --git a/lumen/src/pages/TvDetail.tsx b/lumen/src/pages/TvDetail.tsx
index 616db0ba8..fd4cb6970 100644
--- a/lumen/src/pages/TvDetail.tsx
+++ b/lumen/src/pages/TvDetail.tsx
@@ -11,7 +11,13 @@ import {
   type TvDetails,
 } from '../api';
 import { useMediaServerName } from '../auth';
-import { Rail, Section, shortDate, TitleCard } from '../components/cards';
+import {
+  Rail,
+  Section,
+  shortDate,
+  statusOf,
+  TitleCard,
+} from '../components/cards';
 import {
   ActionBar,
   AdvancedOptions,
@@ -171,6 +177,7 @@ export default function TvDetail() {
   return (
     <article className="detail">
       <DetailTop
+        status={statusOf(t.mediaInfo, false, serverName)}
         backdrop={tmdbImg(t.backdropPath, 'w1280')}
         poster={tmdbImg(t.posterPath)}
         title={t.name || ''}
diff --git a/lumen/src/settings.tsx b/lumen/src/settings.tsx
index 97a705fba..73091b66f 100644
--- a/lumen/src/settings.tsx
+++ b/lumen/src/settings.tsx
@@ -75,6 +75,8 @@ interface Ctx {
   seerrPublicUrl?: string;
   set: (path: string, value: boolean | string) => void;
   reset: () => void;
+  // the admin page saved a new lumen-config.json: use it now, without a reload
+  adminSaved: (c: AdminConfig) => void;
 }
 const C = createContext<Ctx>({
   prefs: DEFAULT_PREFS,
@@ -82,6 +84,7 @@ const C = createContext<Ctx>({
   locked: new Set(),
   set: () => {},
   reset: () => {},
+  adminSaved: () => {},
 });
 export const usePrefs = () => useContext(C);
 
@@ -218,6 +221,7 @@ export function PrefsProvider({ children }: { children: ReactNode }) {
         seerrPublicUrl: admin.seerrPublicUrl,
         set,
         reset,
+        adminSaved: setAdmin,
       }}
     >
       {children}
diff --git a/lumen/src/styles/app.css b/lumen/src/styles/app.css
index 23e959c51..38195e034 100644
--- a/lumen/src/styles/app.css
+++ b/lumen/src/styles/app.css
@@ -696,6 +696,7 @@ body.is-detail .tabbar {
   align-items: end;
 }
 .dposter {
+  position: relative;
   aspect-ratio: 2/3;
   border-radius: 12px;
   overflow: hidden;
@@ -705,6 +706,16 @@ body.is-detail .tabbar {
 .dposter.sq {
   aspect-ratio: 1;
 }
+.dposter .glyph {
+  top: 8px;
+  right: 8px;
+  width: 30px;
+  height: 30px;
+}
+.dposter .glyph .ico {
+  width: 17px;
+  height: 17px;
+}
 .dposter img {
   width: 100%;
   height: 100%;
diff --git a/lumen/tests/browser/admin-options.spec.ts b/lumen/tests/browser/admin-options.spec.ts
index afe002bf4..a516aac28 100644
--- a/lumen/tests/browser/admin-options.spec.ts
+++ b/lumen/tests/browser/admin-options.spec.ts
@@ -1021,3 +1021,215 @@ test('signing out drops the saved answers', async ({ page }) => {
     .poll(() => page.evaluate(() => localStorage.getItem('lumen-cache:1')))
     .toBeNull();
 });
+
+// ---- tester feedback (Tatsu): requests from everyone, request as, library badge, saving ----
+const details301 = {
+  id: 301,
+  title: 'Only In 4K',
+  genres: [],
+  releaseDate: '2020-01-01',
+  posterPath: '/p301.png',
+  backdropPath: '/b301.png',
+  overview: 'A title for the tests.',
+  mediaInfo: { id: 1, status: 5 },
+};
+const waitingRequest = {
+  id: 77,
+  status: 1,
+  type: 'movie',
+  is4k: false,
+  createdAt: '2026-11-06T10:00:00.000Z',
+  seasons: [],
+  requestedBy: { id: 5, displayName: 'Sam' },
+  media: { mediaType: 'movie', tmdbId: 301, status: 2 },
+};
+async function requestRoutes(page: Page) {
+  const asked: string[] = [];
+  await page.route('**/api/v1/request**', async (route) => {
+    const req = route.request();
+    const url = new URL(req.url());
+    const path = url.pathname.slice(7);
+    if (req.method() !== 'GET') return route.fallback();
+    asked.push(path + url.search);
+    if (path === '/request/count')
+      return route.fulfill({ json: { total: 1, pending: 1 } });
+    if (path !== '/request') return route.fallback();
+    const mine = url.searchParams.has('requestedBy');
+    const pending = url.searchParams.get('filter') === 'pending';
+    return route.fulfill({
+      json: {
+        pageInfo: { pages: 1, results: 1 },
+        results: !mine && pending ? [waitingRequest] : [],
+      },
+    });
+  });
+  await page.route('**/api/v1/movie/301', (route) =>
+    route.fulfill({ json: details301 })
+  );
+  return asked;
+}
+
+test('admins see everyone’s requests and approve or decline them', async ({
+  page,
+}) => {
+  const { posts, errors } = await fixtures(page, { permissions: 2 });
+  await requestRoutes(page);
+  await page.route('**/api/v1/request/77/*', (route) => {
+    if (route.request().method() !== 'POST') return route.fallback();
+    posts.push({
+      path: new URL(route.request().url()).pathname.slice(7),
+      body: {},
+    });
+    return route.fulfill({ json: {} });
+  });
+  await page.goto('/requests');
+  const tab = page.getByRole('button', { name: /Everyone/ });
+  await expect(tab).toContainText('1');
+  await tab.click();
+  const row = page.locator('.rq', { hasText: 'Only In 4K' });
+  await expect(row).toContainText('Sam');
+  await expect(row).toContainText('Waiting for approval');
+  await row.getByRole('button', { name: 'Approve' }).click();
+  await expect
+    .poll(() => posts.map((p) => p.path))
+    .toContain('/request/77/approve');
+  await row.getByRole('button', { name: 'Decline' }).click();
+  await expect
+    .poll(() => posts.map((p) => p.path))
+    .toContain('/request/77/decline');
+  expect(errors).toEqual([]);
+});
+
+test('people who can’t manage requests get no Everyone tab', async ({
+  page,
+}) => {
+  await fixtures(page, { permissions: 32 }); // REQUEST only
+  const asked = await requestRoutes(page);
+  await page.goto('/requests?tab=everyone');
+  await expect(page.getByRole('button', { name: /^Active/ })).toBeVisible();
+  await expect(page.getByRole('button', { name: /Everyone/ })).toHaveCount(0);
+  await expect(page.locator('.rq', { hasText: 'Sam' })).toHaveCount(0);
+  expect(asked.some((a) => a.startsWith('/request/count'))).toBe(false);
+  expect(
+    asked.some((a) => a.startsWith('/request?') && !a.includes('requestedBy'))
+  ).toBe(false);
+});
+
+test('admins can request on someone else’s behalf', async ({ page }) => {
+  const { posts } = await fixtures(page, { permissions: 2 });
+  await page.route('**/api/v1/user?*', (route) =>
+    route.fulfill({
+      json: {
+        pageInfo: { pages: 1, results: 2 },
+        results: [
+          { id: 1, displayName: 'fam' },
+          { id: 5, displayName: 'Sam' },
+        ],
+      },
+    })
+  );
+  await page.goto('/movies');
+  await quickRequest(page, 'Fresh Pick');
+  const sheet = page.getByRole('dialog', { name: 'Request Fresh Pick' });
+  const who = sheet.getByLabel('Request as');
+  await expect(who).toHaveValue('1');
+  await expect(who.locator('option')).toHaveText(['Me (fam)', 'Sam']);
+  await who.selectOption('5');
+  await expect(sheet.getByLabel('Folder')).toBeVisible();
+  await sheet.getByRole('button', { name: 'Request', exact: true }).click();
+  await expect(sheet).toHaveCount(0);
+  expect(posts.find((p) => p.path === '/request')?.body).toMatchObject({
+    mediaType: 'movie',
+    mediaId: 302,
+    userId: 5,
+  });
+});
+
+test('request managers without Manage Users get no Request as', async ({
+  page,
+}) => {
+  const asked: string[] = [];
+  await fixtures(page, { permissions: 16 }); // MANAGE_REQUESTS only
+  await page.route('**/api/v1/user?*', (route) => {
+    asked.push(route.request().url());
+    return route.fulfill({
+      json: { results: [{ id: 5, displayName: 'Sam' }] },
+    });
+  });
+  await page.goto('/movies');
+  await quickRequest(page, 'Fresh Pick');
+  const sheet = page.getByRole('dialog', { name: 'Request Fresh Pick' });
+  await expect(sheet.getByLabel('Folder')).toBeVisible();
+  await expect(sheet.getByLabel('Request as')).toHaveCount(0);
+  expect(asked).toEqual([]);
+});
+
+test('a title in the library shows the check on its page too', async ({
+  page,
+}) => {
+  await fixtures(page);
+  await requestRoutes(page);
+  await page.goto('/movie/301');
+  await expect(page.locator('.dposter .glyph.ok')).toBeVisible();
+  await page.route('**/api/v1/movie/301', (route) =>
+    route.fulfill({ json: { ...details301, mediaInfo: undefined } })
+  );
+  await page.evaluate(() => localStorage.clear());
+  await page.reload();
+  await expect(page.locator('.dtitle h1')).toHaveText('Only In 4K');
+  await expect(page.locator('.dposter .glyph')).toHaveCount(0);
+});
+
+test('admin settings page saves for everyone when the server can', async ({
+  page,
+}) => {
+  await fixtures(page, { permissions: 2, config: { custom: 1 } });
+  const saved: { body: string; type: string }[] = [];
+  await page.route('**/lumen/config', (route) => {
+    const req = route.request();
+    if (req.method() === 'PUT') {
+      saved.push({
+        body: req.postData() || '',
+        type: req.headers()['content-type'] || '',
+      });
+      return route.fulfill({ json: { saved: true } });
+    }
+    return route.fulfill({ json: { canSave: true, folder: 'ok' } });
+  });
+  await page.goto('/me/lumen');
+  const row = page.locator('.cfg-row', {
+    hasText: 'Show books and audiobooks',
+  });
+  await expect(row.locator('select')).toHaveValue('on');
+  await row.locator('select').selectOption('off-locked');
+  await page.getByRole('button', { name: 'Save for everyone' }).click();
+  await expect(page.getByText(/^Saved\./)).toBeVisible();
+  expect(saved).toHaveLength(1);
+  expect(saved[0].type).toBe('application/json');
+  expect(JSON.parse(saved[0].body)).toEqual({
+    custom: 1,
+    defaults: { showBooks: false },
+    locked: ['showBooks'],
+  });
+  // the download stays as a backup
+  await expect(
+    page.getByRole('button', { name: 'Download lumen-config.json' })
+  ).toBeVisible();
+});
+
+test('admin settings page explains a folder it can’t write', async ({
+  page,
+}) => {
+  await fixtures(page, { permissions: 2 });
+  await page.route('**/lumen/config', (route) =>
+    route.fulfill({ json: { canSave: false, folder: 'readonly' } })
+  );
+  await page.goto('/me/lumen');
+  await expect(
+    page.getByRole('button', { name: 'Download lumen-config.json' })
+  ).toBeVisible();
+  await expect(
+    page.getByRole('button', { name: 'Save for everyone' })
+  ).toHaveCount(0);
+  await expect(page.getByText(/can’t write to its \/lumen-data/)).toBeVisible();
+});

From a3308ae00ee6a0ec0b3af700e34919a5c612d848 Mon Sep 17 00:00:00 2001
From: Ncbudd <209378361+ncbudd@users.noreply.github.com>
Date: Sat, 7 Nov 2026 14:15:14 -0500
Subject: [PATCH 3/7] fix(lumen): show downloads that have started, and call 0%
 ones Queued

With a big download queue, the request that was actually downloading
could be far down the history, past the newest requests Lumen lists, so
the Requests page showed only queued titles at 0%. Both Requests lists
now also pull in every request whose download has started (from
SeerrNG's in-progress requests); the Everyone tab puts them right after
the ones waiting for approval, furthest along first.

Radarr and Sonarr report everything in the download client's queue as
"downloading". Requests and posters now say Queued while none of it is
here yet.
---
 lumen/src/components/cards.tsx            |  9 ++-
 lumen/src/pages/Requests.tsx              | 72 +++++++++++++++++++----
 lumen/tests/browser/admin-options.spec.ts | 40 +++++++++++++
 3 files changed, 107 insertions(+), 14 deletions(-)

diff --git a/lumen/src/components/cards.tsx b/lumen/src/components/cards.tsx
index 39375ecdd..42db42039 100644
--- a/lumen/src/components/cards.tsx
+++ b/lumen/src/components/cards.tsx
@@ -61,9 +61,12 @@ export function statusOf(
     return d
       ? {
           k: 'dl',
-          word: d.size
-            ? `Downloading ${Math.round((1 - d.sizeLeft / d.size) * 100)}%`
-            : 'Downloading',
+          // still all to come: waiting its turn in the download client's queue
+          word: !d.size
+            ? 'Downloading'
+            : d.sizeLeft >= d.size
+              ? 'Queued'
+              : `Downloading ${Math.round((1 - d.sizeLeft / d.size) * 100)}%`,
           ico: 'down',
         }
       : { k: 'wait', word: 'Requested', ico: 'clock' };
diff --git a/lumen/src/pages/Requests.tsx b/lumen/src/pages/Requests.tsx
index df467f081..e62e5bb45 100644
--- a/lumen/src/pages/Requests.tsx
+++ b/lumen/src/pages/Requests.tsx
@@ -142,7 +142,13 @@ function state(
   if (downloading)
     return {
       k: 'dl',
-      word: pct != null ? `Downloading ${pct}%` : 'Downloading',
+      // nothing here yet: it's waiting its turn in the download client's queue
+      word:
+        pct === 0
+          ? 'Queued'
+          : pct != null
+            ? `Downloading ${pct}%`
+            : 'Downloading',
       ico: 'down',
       active: true,
       pct,
@@ -176,6 +182,38 @@ function state(
   return { k: 'wait', word: 'Requested', ico: 'clock', active: true };
 }
 
+// How much of a request's download is here (0 to 1). Radarr and Sonarr call everything in the
+// download client's queue "downloading", so this is what tells a running download from a
+// queued one.
+function progress(r: RequestItem) {
+  const dls =
+    (r.is4k
+      ? r.media.downloadStatus4k
+      : r.bookFormat === 'audiobook'
+        ? r.media.audiobookDownloadStatus
+        : r.media.downloadStatus) || [];
+  const size = dls.reduce((a, d) => a + (d.size || 0), 0);
+  const left = dls.reduce((a, d) => a + (d.sizeLeft || 0), 0);
+  return size ? 1 - left / size : 0;
+}
+// Requests whose download has started, wherever they are in the history: a big queue pushes
+// the one that's actually downloading far past the newest requests. `query` narrows the list
+// (e.g. one person's requests). Two pages of SeerrNG's in-progress requests are plenty.
+async function startedDownloads(query = '') {
+  const page = (skip: number) =>
+    api<{ pageInfo?: { pages?: number }; results: RequestItem[] }>(
+      `/request?take=100&skip=${skip}&filter=processing&sort=added${query}`
+    );
+  const first = await page(0);
+  const more =
+    (first.pageInfo?.pages || 1) > 1 ? (await page(100)).results : [];
+  return first.results.concat(more).filter((r) => progress(r) > 0);
+}
+const merge = (...lists: RequestItem[][]) => {
+  const seen = new Set<number>();
+  return lists.flat().filter((r) => !seen.has(r.id) && !!seen.add(r.id));
+};
+
 // titles and artwork don't change, so each request is described once and kept on this device.
 // A lookup that failed for a passing reason isn't kept, so the next visit tries again.
 const descriptionKey = () => {
@@ -499,13 +537,22 @@ export default function Requests() {
         `/request?take=${take}&skip=0&filter=${filter}&sort=added`
       ).then((d) => d.results);
     // every request still waiting, then the newest of the rest
-    Promise.all([list('pending', 50), list('all', 20)])
-      .then(([pending, recent]) => {
-        const seen = new Set(pending.map((r) => r.id));
-        return describeAll(
-          pending.concat(recent.filter((r) => !seen.has(r.id)))
-        );
-      })
+    // waiting for approval, then downloads that have started (furthest along first), then the
+    // newest of the rest
+    Promise.all([
+      list('pending', 50),
+      startedDownloads().catch(() => []),
+      list('all', 20),
+    ])
+      .then(([pending, started, recent]) =>
+        describeAll(
+          merge(
+            pending,
+            started.sort((a, b) => progress(b) - progress(a)),
+            recent
+          )
+        )
+      )
       .then((x) => live && setOthers(x))
       .catch(() => live && setOthers([]))
       .finally(() => live && setRefreshing(false));
@@ -517,9 +564,12 @@ export default function Requests() {
   useEffect(() => {
     if (!user || everyone) return;
     let live = true;
-    const media = api<{ results: RequestItem[] }>(
-      `/request?take=40&skip=0&filter=all&sort=added&requestedBy=${user.id}`
-    ).then((d) => describeAll(d.results));
+    const media = Promise.all([
+      api<{ results: RequestItem[] }>(
+        `/request?take=40&skip=0&filter=all&sort=added&requestedBy=${user.id}`
+      ).then((d) => d.results),
+      startedDownloads(`&requestedBy=${user.id}`).catch(() => []),
+    ]).then(([recent, started]) => describeAll(merge(recent, started)));
     // game requests only when a games category is on (the endpoint refuses otherwise)
     const games = extras.games.length
       ? api<{ results: SoftwareRequest[] }>(
diff --git a/lumen/tests/browser/admin-options.spec.ts b/lumen/tests/browser/admin-options.spec.ts
index a516aac28..f73a80268 100644
--- a/lumen/tests/browser/admin-options.spec.ts
+++ b/lumen/tests/browser/admin-options.spec.ts
@@ -1233,3 +1233,43 @@ test('admin settings page explains a folder it can’t write', async ({
   ).toHaveCount(0);
   await expect(page.getByText(/can’t write to its \/lumen-data/)).toBeVisible();
 });
+
+test('downloads that have started show even when far down the history', async ({
+  page,
+}) => {
+  await fixtures(page, { permissions: 2 });
+  await requestRoutes(page);
+  const download = (sizeLeft: number) => ({
+    ...waitingRequest,
+    status: 2,
+    requestedBy: { id: 1, displayName: 'fam' },
+    media: {
+      ...waitingRequest.media,
+      status: 3,
+      downloadStatus: [{ size: 100, sizeLeft, timeLeft: '00:03:00' }],
+    },
+  });
+  // newest requests: one queued download; the running one is only in the in-progress list
+  await page.route('**/api/v1/request?*', (route) => {
+    const q = new URL(route.request().url()).searchParams;
+    const filter = q.get('filter');
+    const results =
+      filter === 'processing'
+        ? [
+            { ...download(100), id: 80 },
+            { ...download(40), id: 81 },
+          ]
+        : filter === 'all'
+          ? [{ ...download(100), id: 80 }]
+          : [];
+    return route.fulfill({ json: { pageInfo: { pages: 1 }, results } });
+  });
+  await page.goto('/requests');
+  await expect(page.locator('.rq')).toHaveCount(2);
+  await expect(page.locator('.rq').getByText('Downloading 60%')).toBeVisible();
+  await expect(page.locator('.rq').getByText('Queued')).toBeVisible();
+  await page.getByRole('button', { name: /Everyone/ }).click();
+  await expect(page.locator('.rq')).toHaveCount(2);
+  await expect(page.locator('.rq').first()).toContainText('Downloading 60%');
+  await expect(page.locator('.rq').nth(1)).toContainText('Queued');
+});

From 48d2ff30d59d7ba23189403b4d6698be71361132 Mon Sep 17 00:00:00 2001
From: Ncbudd <209378361+ncbudd@users.noreply.github.com>
Date: Sat, 7 Nov 2026 14:39:43 -0500
Subject: [PATCH 4/7] feat(lumen): change, retry and remove requests from the
 Everyone tab

Admins and request managers get SeerrNG's request actions in Lumen:

- Change (waiting requests, and failed movie or series requests): a sheet
  with server, quality, folder, who the request is for and, for a series,
  its seasons, starting from what the request has now. A waiting request
  is then approved or just saved; a failed one is saved and tried again.
- Retry on failed requests.
- Remove on any request, confirmed by a second click on the same button
  (no browser pop-up).

The Back-closes-the-sheet handling moves into useBackCloses so both
sheets share it.
---
 lumen/src/components/detail.tsx           |  30 ++-
 lumen/src/components/requestEdit.tsx      | 225 ++++++++++++++++++++++
 lumen/src/components/requestSheet.tsx     |  46 +++--
 lumen/src/pages/Requests.tsx              |  99 ++++++++--
 lumen/tests/browser/admin-options.spec.ts | 144 ++++++++++++++
 5 files changed, 502 insertions(+), 42 deletions(-)
 create mode 100644 lumen/src/components/requestEdit.tsx

diff --git a/lumen/src/components/detail.tsx b/lumen/src/components/detail.tsx
index 7731a6e1d..7cac2e4e3 100644
--- a/lumen/src/components/detail.tsx
+++ b/lumen/src/components/detail.tsx
@@ -178,10 +178,13 @@ export function AdvancedOptions({
   onChange,
   inline = false,
   onReady,
+  initial,
 }: {
   kind: 'movie' | 'tv';
   is4k: boolean;
   onChange: (o: RequestOptions) => void;
+  // changing an existing request: start from its server, quality, folder and requester
+  initial?: RequestOptions;
   inline?: boolean; // always open, no "Advanced" toggle (the quick-request sheet)
   onReady?: (ready: boolean) => void;
 }) {
@@ -195,7 +198,7 @@ export function AdvancedOptions({
   const [o, setO] = useState<RequestOptions>({});
   const asAllowed = canRequestAs(user?.permissions);
   const [people, setPeople] = useState<RequestUser[] | null>(null);
-  const [asUser, setAsUser] = useState<number | undefined>();
+  const [asUser, setAsUser] = useState<number | undefined>(initial?.userId);
   useEffect(() => {
     if (!open || !asAllowed || people) return;
     api<{ results: RequestUser[] }>('/user?take=100&skip=0&sort=displayname')
@@ -209,7 +212,10 @@ export function AdvancedOptions({
       .then((s) => {
         const mine = s.filter((x) => x.is4k === is4k);
         setServers(mine);
-        const d = mine.find((x) => x.isDefault) || mine[0];
+        const d =
+          mine.find((x) => x.id === initial?.serverId) ||
+          mine.find((x) => x.isDefault) ||
+          mine[0];
         if (d) setO((x) => ({ ...x, serverId: d.id }));
       })
       .catch((e) => setErr(e.message));
@@ -229,8 +235,18 @@ export function AdvancedOptions({
             ? x
             : {
                 ...x,
-                profileId: x.profileId ?? d.server.activeProfileId,
-                rootFolder: x.rootFolder ?? d.server.activeDirectory,
+                profileId:
+                  x.profileId ??
+                  (serverId === initial?.serverId &&
+                  d.profiles.some((p) => p.id === initial?.profileId)
+                    ? initial?.profileId
+                    : d.server.activeProfileId),
+                rootFolder:
+                  x.rootFolder ??
+                  (serverId === initial?.serverId &&
+                  d.rootFolders.some((r) => r.path === initial?.rootFolder)
+                    ? initial?.rootFolder
+                    : d.server.activeDirectory),
               }
         );
       })
@@ -249,12 +265,14 @@ export function AdvancedOptions({
     () =>
       onChange(
         open
-          ? asUser && asUser !== user?.id
+          ? // a new request is the admin's own unless someone else is picked; a request being
+            // changed always says whose it is (picking "Me" moves it to the admin)
+            asUser && (asUser !== user?.id || initial?.userId !== undefined)
             ? { ...o, userId: asUser }
             : o
           : {}
       ),
-    [o, open, asUser, user?.id, onChange]
+    [o, open, asUser, user?.id, initial?.userId, onChange]
   );
   useEffect(() => {
     onReady?.(
diff --git a/lumen/src/components/requestEdit.tsx b/lumen/src/components/requestEdit.tsx
new file mode 100644
index 000000000..09c370238
--- /dev/null
+++ b/lumen/src/components/requestEdit.tsx
@@ -0,0 +1,225 @@
+import { useCallback, useEffect, useState } from 'react';
+import { createPortal } from 'react-dom';
+import {
+  api,
+  type RequestItem,
+  type RequestOptions,
+  type TvDetails,
+} from '../api';
+import { Icon } from '../icons';
+import { AdvancedOptions } from './detail';
+import { useBackCloses } from './requestSheet';
+
+// What SeerrNG says about a request's destination (not in Lumen's RequestItem shape).
+type Destination = {
+  serverId?: number | null;
+  profileId?: number | null;
+  rootFolder?: string | null;
+};
+
+// Admins change a request before acting on it, like SeerrNG's own request editor: server,
+// quality, folder, whose request it is and, for a series, which seasons. A waiting request can
+// then be approved or just saved; a failed one is saved and tried again.
+export function RequestEditSheet({
+  r,
+  title,
+  art,
+  onClose,
+  onDone,
+}: {
+  r: RequestItem;
+  title: string;
+  art?: string;
+  onClose: () => void;
+  onDone: (message: string) => void;
+}) {
+  useBackCloses(onClose);
+  const tv = r.type === 'tv';
+  const waiting = r.status === 1;
+  const d = r as RequestItem & Destination;
+  const [initial] = useState<RequestOptions>(() => ({
+    serverId: d.serverId ?? undefined,
+    profileId: d.profileId ?? undefined,
+    rootFolder: d.rootFolder ?? undefined,
+    userId: r.requestedBy?.id,
+  }));
+  const [opts, setOpts] = useState<RequestOptions>({});
+  const onOpts = useCallback((o: RequestOptions) => setOpts(o), []);
+  const [ready, setReady] = useState(false);
+  const [busy, setBusy] = useState(false);
+  const [err, setErr] = useState('');
+  // series: every season with episodes, starting from the ones asked for
+  const [seasons, setSeasons] = useState<
+    { seasonNumber: number; name?: string; episodeCount?: number }[] | null
+  >(null);
+  const [picked, setPicked] = useState(
+    () => new Set(r.seasons.map((s) => s.seasonNumber))
+  );
+  useEffect(() => {
+    if (!tv) return;
+    let live = true;
+    api<TvDetails>(`/tv/${r.media.tmdbId}`)
+      .then(
+        (t) =>
+          live &&
+          setSeasons(
+            (t.seasons || []).filter(
+              (s) => s.seasonNumber > 0 && (s.episodeCount ?? 1) > 0
+            )
+          )
+      )
+      .catch(() => live && setSeasons([]));
+    return () => {
+      live = false;
+    };
+  }, [tv, r.media.tmdbId]);
+  const toggle = (n: number) =>
+    setPicked((x) => {
+      const y = new Set(x);
+      if (y.has(n)) y.delete(n);
+      else y.add(n);
+      return y;
+    });
+
+  const go = async (then?: 'approve' | 'retry') => {
+    if (busy || !ready || (tv && !picked.size)) return;
+    setBusy(true);
+    setErr('');
+    try {
+      await api(`/request/${r.id}`, {
+        method: 'PUT',
+        body: JSON.stringify({
+          mediaType: r.type,
+          is4k: r.is4k,
+          ...opts,
+          ...(tv ? { seasons: [...picked].sort((a, b) => a - b) } : {}),
+        }),
+      });
+      if (then)
+        await api(`/request/${r.id}/${then}`, {
+          method: 'POST',
+          body: '{}',
+        });
+      onDone(
+        then === 'approve'
+          ? 'Request approved'
+          : then === 'retry'
+            ? 'Request changed and sent again'
+            : 'Request changed'
+      );
+    } catch (e) {
+      setErr(e instanceof Error ? e.message : 'Couldn’t change the request');
+      setBusy(false);
+    }
+  };
+
+  return createPortal(
+    <div className="sheet-wrap open">
+      <div className="sheet-scrim" onClick={onClose} />
+      <div
+        className="sheet"
+        role="dialog"
+        aria-modal="true"
+        aria-label={`Change request for ${title}`}
+      >
+        <div className="grab" />
+        <div className="pk">
+          <div className="pk-head">
+            <div className="p">{art && <img src={art} alt="" />}</div>
+            <div>
+              <h3>Change request for {title}</h3>
+              <span className="sub">
+                {r.requestedBy?.displayName
+                  ? `Asked by ${r.requestedBy.displayName}`
+                  : ''}
+                {r.is4k ? ' · 4K' : ''}
+              </span>
+            </div>
+          </div>
+          <AdvancedOptions
+            kind={tv ? 'tv' : 'movie'}
+            is4k={r.is4k}
+            onChange={onOpts}
+            inline
+            onReady={setReady}
+            initial={initial}
+          />
+          {tv && (
+            <div className="slist" role="group" aria-label="Seasons">
+              {!seasons && <p className="note">Loading seasons…</p>}
+              {seasons?.map((s) => {
+                const on = picked.has(s.seasonNumber);
+                return (
+                  <div
+                    key={s.seasonNumber}
+                    className="srow"
+                    role="checkbox"
+                    aria-checked={on}
+                    tabIndex={0}
+                    onClick={() => toggle(s.seasonNumber)}
+                    onKeyDown={(e) => {
+                      if (e.key === ' ' || e.key === 'Enter') {
+                        e.preventDefault();
+                        toggle(s.seasonNumber);
+                      }
+                    }}
+                  >
+                    <span className="cbx">
+                      <Icon name="check" />
+                    </span>
+                    <span>
+                      <b>{s.name || `Season ${s.seasonNumber}`}</b>
+                      {!!s.episodeCount && (
+                        <small>
+                          {s.episodeCount} episode
+                          {s.episodeCount === 1 ? '' : 's'}
+                        </small>
+                      )}
+                    </span>
+                  </div>
+                );
+              })}
+            </div>
+          )}
+          {err && (
+            <p className="note" role="alert">
+              {err}
+            </p>
+          )}
+          <div className="pk-foot">
+            {waiting ? (
+              <>
+                <button
+                  className="btn btn-primary"
+                  disabled={busy || !ready || (tv && !picked.size)}
+                  onClick={() => go('approve')}
+                >
+                  {busy ? 'Saving…' : 'Approve'}
+                </button>
+                <button
+                  className="btn btn-tonal"
+                  disabled={busy || !ready || (tv && !picked.size)}
+                  onClick={() => go()}
+                >
+                  Save
+                </button>
+              </>
+            ) : (
+              <button
+                className="btn btn-primary"
+                disabled={busy || !ready || (tv && !picked.size)}
+                onClick={() => go('retry')}
+              >
+                {busy ? 'Saving…' : 'Save and try again'}
+              </button>
+            )}
+            <button className="btn btn-quiet" onClick={onClose}>
+              Cancel
+            </button>
+          </div>
+        </div>
+      </div>
+    </div>,
+    document.body
+  );
+}
diff --git a/lumen/src/components/requestSheet.tsx b/lumen/src/components/requestSheet.tsx
index adc5708f8..47745b3ff 100644
--- a/lumen/src/components/requestSheet.tsx
+++ b/lumen/src/components/requestSheet.tsx
@@ -24,30 +24,16 @@ export function useAsksRequestOptions() {
 // a just-closed sheet is about to undo its history step (one sheet is open at a time)
 let pendingBack = false;
 
-export function RequestSheet({
-  it,
-  onClose,
-  onDone,
-}: {
-  it: TitleResult;
-  onClose: () => void;
-  onDone: () => void; // request sent
-}) {
-  const tv = it.mediaType === 'tv';
-  const [opts, setOpts] = useState<RequestOptions>({});
-  const [busy, setBusy] = useState(false);
-  const [ready, setReady] = useState(false);
-  const [err, setErr] = useState('');
-  const onOpts = useCallback((o: RequestOptions) => setOpts(o), []);
+// The phone's Back closes a sheet (like a native dialog) instead of leaving the page: the
+// sheet adds a copy of the current history entry and closes when it's popped.
+export function useBackCloses(onClose: () => void) {
+  const closeRef = useRef(onClose);
+  closeRef.current = onClose;
   useEffect(() => {
-    const k = (e: KeyboardEvent) => e.key === 'Escape' && onClose();
+    const k = (e: KeyboardEvent) => e.key === 'Escape' && closeRef.current();
     document.addEventListener('keydown', k);
     return () => document.removeEventListener('keydown', k);
-  }, [onClose]);
-  // The phone's Back closes the sheet (like a native dialog) instead of leaving the page:
-  // the sheet adds a copy of the current history entry and closes when it's popped.
-  const closeRef = useRef(onClose);
-  closeRef.current = onClose;
+  }, []);
   useEffect(() => {
     let popped = false;
     // remounted at once (React StrictMode runs effects twice): reuse the entry already
@@ -74,6 +60,24 @@ export function RequestSheet({
       }
     };
   }, []);
+}
+
+export function RequestSheet({
+  it,
+  onClose,
+  onDone,
+}: {
+  it: TitleResult;
+  onClose: () => void;
+  onDone: () => void; // request sent
+}) {
+  const tv = it.mediaType === 'tv';
+  const [opts, setOpts] = useState<RequestOptions>({});
+  const [busy, setBusy] = useState(false);
+  const [ready, setReady] = useState(false);
+  const [err, setErr] = useState('');
+  const onOpts = useCallback((o: RequestOptions) => setOpts(o), []);
+  useBackCloses(onClose);
   const send = async () => {
     if (busy || !ready) return;
     setBusy(true);
diff --git a/lumen/src/pages/Requests.tsx b/lumen/src/pages/Requests.tsx
index e62e5bb45..ffc9bd5f0 100644
--- a/lumen/src/pages/Requests.tsx
+++ b/lumen/src/pages/Requests.tsx
@@ -15,6 +15,7 @@ import {
 import { useAuth, useMediaServerName } from '../auth';
 import { shortDate } from '../components/cards';
 import { canChooseRequestOptions, Pill } from '../components/detail';
+import { RequestEditSheet } from '../components/requestEdit';
 import { Avatar } from '../components/Shell';
 import { useToast } from '../components/toast';
 import {
@@ -517,6 +518,14 @@ export default function Requests() {
   const [others, setOthers] = useState<Row[] | null>(null);
   const [waiting, setWaiting] = useState<number | null>(null);
   const [acting, setActing] = useState<number | null>(null);
+  const [editing, setEditing] = useState<Row | null>(null);
+  // Remove asks once more on the same button instead of a pop-up
+  const [removing, setRemoving] = useState<number | null>(null);
+  useEffect(() => {
+    if (removing == null) return;
+    const t = window.setTimeout(() => setRemoving(null), 4000);
+    return () => window.clearTimeout(t);
+  }, [removing]);
 
   useEffect(() => {
     if (!manage) return;
@@ -610,11 +619,23 @@ export default function Requests() {
         ? all
         : act;
   const shown = everyone ? others : rows;
-  const decide = async (id: number, how: 'approve' | 'decline') => {
+  const decide = async (
+    id: number,
+    how: 'approve' | 'decline' | 'retry' | 'remove'
+  ) => {
     setActing(id);
+    setRemoving(null);
     try {
-      await api(`/request/${id}/${how}`, { method: 'POST' });
-      toast(how === 'approve' ? 'Request approved' : 'Request declined');
+      if (how === 'remove') await api(`/request/${id}`, { method: 'DELETE' });
+      else await api(`/request/${id}/${how}`, { method: 'POST', body: '{}' });
+      toast(
+        {
+          approve: 'Request approved',
+          decline: 'Request declined',
+          retry: 'Request sent again',
+          remove: 'Request removed',
+        }[how]
+      );
       setTick((t) => t + 1);
     } catch (e) {
       toast(e instanceof Error ? e.message : 'Couldn’t update the request');
@@ -756,23 +777,58 @@ export default function Requests() {
                   {st.detail && <span className="d">{st.detail}</span>}
                 </div>
                 <div className="rqa">
-                  {everyone && x.r.status === 1 ? (
+                  {everyone ? (
                     <>
-                      <button
-                        className="btn btn-sm btn-ok"
-                        disabled={acting === x.r.id}
-                        onClick={() => decide(x.r.id, 'approve')}
-                      >
-                        <Icon name="check" size="sm" />
-                        Approve
-                      </button>
+                      {x.r.status === 1 && (
+                        <>
+                          <button
+                            className="btn btn-sm btn-ok"
+                            disabled={acting === x.r.id}
+                            onClick={() => decide(x.r.id, 'approve')}
+                          >
+                            <Icon name="check" size="sm" />
+                            Approve
+                          </button>
+                          <button
+                            className="btn btn-sm btn-quiet"
+                            disabled={acting === x.r.id}
+                            onClick={() => decide(x.r.id, 'decline')}
+                          >
+                            <Icon name="x" size="sm" />
+                            Decline
+                          </button>
+                        </>
+                      )}
+                      {x.r.status === 4 && (
+                        <button
+                          className="btn btn-sm btn-tonal"
+                          disabled={acting === x.r.id}
+                          onClick={() => decide(x.r.id, 'retry')}
+                        >
+                          <Icon name="refresh" size="sm" />
+                          Retry
+                        </button>
+                      )}
+                      {(x.r.status === 1 || x.r.status === 4) &&
+                        (x.r.type === 'movie' || x.r.type === 'tv') && (
+                          <button
+                            className="btn btn-sm btn-quiet"
+                            disabled={acting === x.r.id}
+                            onClick={() => setEditing(x)}
+                          >
+                            Change
+                          </button>
+                        )}
                       <button
                         className="btn btn-sm btn-quiet"
                         disabled={acting === x.r.id}
-                        onClick={() => decide(x.r.id, 'decline')}
+                        onClick={() =>
+                          removing === x.r.id
+                            ? decide(x.r.id, 'remove')
+                            : setRemoving(x.r.id)
+                        }
                       >
-                        <Icon name="x" size="sm" />
-                        Decline
+                        {removing === x.r.id ? 'Remove for good?' : 'Remove'}
                       </button>
                     </>
                   ) : st.k === 'ok' &&
@@ -801,6 +857,19 @@ export default function Requests() {
           );
         })}
       </div>
+      {editing && (
+        <RequestEditSheet
+          r={editing.r}
+          title={editing.title}
+          art={editing.art}
+          onClose={() => setEditing(null)}
+          onDone={(message) => {
+            setEditing(null);
+            toast(message);
+            setTick((t) => t + 1);
+          }}
+        />
+      )}
     </>
   );
 }
diff --git a/lumen/tests/browser/admin-options.spec.ts b/lumen/tests/browser/admin-options.spec.ts
index f73a80268..fa36754e5 100644
--- a/lumen/tests/browser/admin-options.spec.ts
+++ b/lumen/tests/browser/admin-options.spec.ts
@@ -1273,3 +1273,147 @@ test('downloads that have started show even when far down the history', async ({
   await expect(page.locator('.rq').first()).toContainText('Downloading 60%');
   await expect(page.locator('.rq').nth(1)).toContainText('Queued');
 });
+
+// ---- admin request actions: change, approve with options, retry, remove ----
+async function adminActionRoutes(page: Page, list: unknown[]) {
+  const calls: { method: string; path: string; body: unknown }[] = [];
+  await page.route('**/api/v1/request?*', (route) => {
+    const q = new URL(route.request().url()).searchParams;
+    const mine = q.has('requestedBy');
+    const results = !mine && q.get('filter') === 'pending' ? list : [];
+    return route.fulfill({ json: { pageInfo: { pages: 1 }, results } });
+  });
+  await page.route(/\/api\/v1\/request\/7\d(\/|$)/, (route) => {
+    const req = route.request();
+    calls.push({
+      method: req.method(),
+      path: new URL(req.url()).pathname.slice(7),
+      body: req.postDataJSON?.() ?? null,
+    });
+    return route.fulfill(
+      req.method() === 'DELETE' ? { status: 204, body: '' } : { json: {} }
+    );
+  });
+  await page.route('**/api/v1/user?*', (route) =>
+    route.fulfill({
+      json: {
+        results: [
+          { id: 1, displayName: 'fam' },
+          { id: 5, displayName: 'Sam' },
+        ],
+      },
+    })
+  );
+  return calls;
+}
+
+test('admins change a waiting request, then approve it', async ({ page }) => {
+  await fixtures(page, { permissions: 2 });
+  await requestRoutes(page);
+  const calls = await adminActionRoutes(page, [waitingRequest]);
+  await page.goto('/requests?tab=everyone');
+  const row = page.locator('.rq', { hasText: 'Only In 4K' });
+  await row.getByRole('button', { name: 'Change' }).click();
+  const sheet = page.getByRole('dialog', {
+    name: 'Change request for Only In 4K',
+  });
+  await expect(sheet.getByLabel('Request as')).toHaveValue('5');
+  await sheet.getByLabel('Server').selectOption('1');
+  await sheet.getByLabel('Folder').selectOption('/movies-kids');
+  await sheet.getByRole('button', { name: 'Approve' }).click();
+  await expect(sheet).toHaveCount(0);
+  await expect(page.getByText('Request approved')).toBeVisible();
+  expect(calls.map((c) => `${c.method} ${c.path}`)).toEqual([
+    'PUT /request/77',
+    'POST /request/77/approve',
+  ]);
+  expect(calls[0].body).toMatchObject({
+    mediaType: 'movie',
+    serverId: 1,
+    rootFolder: '/movies-kids',
+    userId: 5,
+  });
+});
+
+test('changing a series request picks its seasons', async ({ page }) => {
+  await fixtures(page, { permissions: 2 });
+  await requestRoutes(page);
+  const series = {
+    ...waitingRequest,
+    id: 79,
+    type: 'tv',
+    seasons: [{ seasonNumber: 1 }],
+    media: { mediaType: 'tv', tmdbId: 400, status: 2 },
+  };
+  const calls = await adminActionRoutes(page, [series]);
+  await page.route('**/api/v1/tv/400', (route) =>
+    route.fulfill({
+      json: {
+        id: 400,
+        name: 'Long Show',
+        seasons: [
+          { seasonNumber: 0, name: 'Specials', episodeCount: 3 },
+          { seasonNumber: 1, name: 'Season 1', episodeCount: 8 },
+          { seasonNumber: 2, name: 'Season 2', episodeCount: 8 },
+        ],
+      },
+    })
+  );
+  await page.route('**/api/v1/service/sonarr', (route) =>
+    route.fulfill({
+      json: [{ id: 0, name: 'Sonarr', is4k: false, isDefault: true }],
+    })
+  );
+  await page.route('**/api/v1/service/sonarr/0', (route) =>
+    route.fulfill({
+      json: {
+        profiles: [{ id: 1, name: 'HD' }],
+        rootFolders: [{ id: 1, path: '/tv' }],
+        server: { activeProfileId: 1, activeDirectory: '/tv' },
+      },
+    })
+  );
+  await page.goto('/requests?tab=everyone');
+  await page
+    .locator('.rq', { hasText: 'Long Show' })
+    .getByRole('button', { name: 'Change' })
+    .click();
+  const sheet = page.getByRole('dialog', {
+    name: 'Change request for Long Show',
+  });
+  const seasons = sheet.getByRole('group', { name: 'Seasons' });
+  await expect(seasons.getByRole('checkbox')).toHaveCount(2); // no Specials
+  await expect(
+    seasons.getByRole('checkbox', { name: /Season 1/ })
+  ).toHaveAttribute('aria-checked', 'true');
+  await seasons.getByRole('checkbox', { name: /Season 2/ }).click();
+  await expect(sheet.getByLabel('Folder')).toBeVisible();
+  await sheet.getByRole('button', { name: 'Save' }).click();
+  await expect(sheet).toHaveCount(0);
+  expect(calls.map((c) => `${c.method} ${c.path}`)).toEqual([
+    'PUT /request/79',
+  ]);
+  expect(calls[0].body).toMatchObject({ mediaType: 'tv', seasons: [1, 2] });
+});
+
+test('failed requests can be retried, and Remove asks once more', async ({
+  page,
+}) => {
+  await fixtures(page, { permissions: 2 });
+  await requestRoutes(page);
+  const failed = { ...waitingRequest, id: 78, status: 4 };
+  const calls = await adminActionRoutes(page, [failed]);
+  await page.goto('/requests?tab=everyone');
+  const row = page.locator('.rq', { hasText: 'Only In 4K' });
+  await expect(row.getByRole('button', { name: 'Approve' })).toHaveCount(0);
+  await row.getByRole('button', { name: 'Retry' }).click();
+  await expect(page.getByText('Request sent again')).toBeVisible();
+  await row.getByRole('button', { name: 'Remove' }).click();
+  expect(calls.some((c) => c.method === 'DELETE')).toBe(false);
+  await row.getByRole('button', { name: 'Remove for good?' }).click();
+  await expect(page.getByText('Request removed')).toBeVisible();
+  expect(calls.map((c) => `${c.method} ${c.path}`)).toEqual([
+    'POST /request/78/retry',
+    'DELETE /request/78',
+  ]);
+});

From f6bfd8f088746fab70e9d24ad550d1534830f465 Mon Sep 17 00:00:00 2001
From: Ncbudd <209378361+ncbudd@users.noreply.github.com>
Date: Sat, 7 Nov 2026 14:48:41 -0500
Subject: [PATCH 5/7] feat(lumen): upload the logo and tab icon from the admin
 settings page

With the /lumen-data folder mounted, "Lumen settings for everyone" gets an
Upload button next to the logo and the tab icon. The image is checked
(PNG, JPEG, WebP, SVG or ICO by its first bytes, up to 2 MB, SeerrNG
admins only), kept in /lumen-data/branding under a new name each time so
no browser shows an old copy, and its address is saved for everyone
straight away. Other unsaved changes on the page stay unsaved. Older
uploads of the same kind are deleted.

/branding/ now serves uploads first, then a branding folder mounted into
the app, with a CSP that lets nothing there run scripts.

The save script also avoids syntax njs doesn't support (spread, for...of);
the image's proxy tests caught it.
---
 docs/using-seerr/lumen.md                 |   5 +
 lumen/deploy/lumen-config.js              | 130 +++++++++++++++++++---
 lumen/deploy/nginx.conf.template          |  26 +++++
 lumen/src/pages/LumenSettings.tsx         | 102 ++++++++++++++---
 lumen/src/styles/app-react.css            |  15 +++
 lumen/tests/browser/admin-options.spec.ts |  64 +++++++++++
 6 files changed, 310 insertions(+), 32 deletions(-)

diff --git a/docs/using-seerr/lumen.md b/docs/using-seerr/lumen.md
index a460003ec..20a8f5778 100644
--- a/docs/using-seerr/lumen.md
+++ b/docs/using-seerr/lumen.md
@@ -356,6 +356,11 @@ it may write to:
 Only SeerrNG admins can save; Lumen checks with SeerrNG before writing. Settings
 saved this way win over a `lumen-config.json` mounted as below.
 
+With that folder, the page also has **Upload** buttons for the logo and the tab
+icon (PNG, JPEG, WebP, SVG or ICO, up to 2 MB). Lumen keeps the image in
+`lumen-data/branding` and fills in its address, so there's no branding folder to
+mount.
+
 Without that folder, the page offers **Download lumen-config.json** instead, and
 you put the file in place by hand:
 
diff --git a/lumen/deploy/lumen-config.js b/lumen/deploy/lumen-config.js
index 7db7abb29..b5222805f 100644
--- a/lumen/deploy/lumen-config.js
+++ b/lumen/deploy/lumen-config.js
@@ -6,6 +6,9 @@
 //
 // Only a SeerrNG admin may save: the person's own SeerrNG session is checked through
 // /_lumen_session_check (SeerrNG's /auth/me) before anything is written.
+//
+// Admins can also upload the logo and tab icon (branding below). Each upload gets a new file
+// name in /lumen-data/branding, served at /branding/, so no browser keeps an old copy.
 import fs from 'fs';
 
 const DIR = '/lumen-data';
@@ -42,36 +45,42 @@ function sameSite(r) {
   return type.split(';')[0].trim() === 'application/json';
 }
 
-async function save(r) {
-  if (r.method === 'GET') {
-    const f = folder();
-    send(r, 200, { canSave: f === 'ok', folder: f });
-    return;
-  }
-  if (r.method !== 'PUT') {
-    send(r, 405, { message: 'Use PUT.' });
-    return;
-  }
-  if (!sameSite(r)) {
-    send(r, 403, { message: 'Send the settings as JSON from Lumen.' });
-    return;
-  }
+// Is the person sending this a SeerrNG admin? Answers the request itself when not.
+async function isAdmin(r) {
   const me = await r.subrequest('/_lumen_session_check', { method: 'GET' });
   if (me.status !== 200) {
     send(r, 401, { message: 'Sign in again.' });
-    return;
+    return false;
   }
   let user;
   try {
     user = JSON.parse(me.responseText);
   } catch (e) {
     send(r, 502, { message: 'SeerrNG didn’t say who you are.' });
-    return;
+    return false;
   }
   if (!user || ((user.permissions || 0) & ADMIN) === 0) {
     send(r, 403, { message: 'Only admins can change settings for everyone.' });
+    return false;
+  }
+  return true;
+}
+
+async function save(r) {
+  if (r.method === 'GET') {
+    const f = folder();
+    send(r, 200, { canSave: f === 'ok', folder: f });
     return;
   }
+  if (r.method !== 'PUT') {
+    send(r, 405, { message: 'Use PUT.' });
+    return;
+  }
+  if (!sameSite(r)) {
+    send(r, 403, { message: 'Send the settings as JSON from Lumen.' });
+    return;
+  }
+  if (!(await isAdmin(r))) return;
   const text = r.requestText || '';
   if (!text || text.length > MAX_BYTES) {
     send(r, 413, { message: 'The settings are empty or too large.' });
@@ -107,4 +116,91 @@ async function save(r) {
   send(r, 200, { saved: true });
 }
 
-export default { save };
+// ---- logo and tab icon uploads: PUT /lumen/branding/logo or /lumen/branding/icon ----
+const BRANDING = DIR + '/branding';
+const MAX_IMAGE = 2 * 1024 * 1024;
+// what the file really is, from its first bytes (the browser's Content-Type is only a hint)
+function imageType(b) {
+  if (
+    b.length > 8 &&
+    b[0] === 0x89 &&
+    b[1] === 0x50 &&
+    b[2] === 0x4e &&
+    b[3] === 0x47
+  )
+    return 'png';
+  if (b.length > 3 && b[0] === 0xff && b[1] === 0xd8 && b[2] === 0xff)
+    return 'jpg';
+  // (njs has no spread syntax: compare byte by byte)
+  const at = (i, text) => {
+    for (let k = 0; k < text.length; k++)
+      if (b[i + k] !== text.charCodeAt(k)) return false;
+    return true;
+  };
+  if (b.length > 12 && at(0, 'RIFF') && at(8, 'WEBP')) return 'webp';
+  if (b.length > 4 && b[0] === 0 && b[1] === 0 && b[2] === 1 && b[3] === 0)
+    return 'ico';
+  const head = b.toString('utf8', 0, Math.min(b.length, 1024)).trimStart();
+  if (
+    (head.startsWith('<?xml') || head.startsWith('<svg')) &&
+    head.includes('<svg')
+  )
+    return 'svg';
+  return null;
+}
+
+async function branding(r) {
+  const kind = r.uri.split('/').pop();
+  if (kind !== 'logo' && kind !== 'icon') {
+    send(r, 404, { message: 'Upload a logo or an icon.' });
+    return;
+  }
+  if (r.method !== 'PUT') {
+    send(r, 405, { message: 'Use PUT.' });
+    return;
+  }
+  if (!(await isAdmin(r))) return;
+  if (folder() !== 'ok') {
+    send(r, 409, {
+      message:
+        'Lumen has no writable /lumen-data folder, so it can’t keep uploads.',
+    });
+    return;
+  }
+  const body = r.requestBuffer;
+  if (!body || !body.length || body.length > MAX_IMAGE) {
+    send(r, 413, { message: 'Choose an image of up to 2 MB.' });
+    return;
+  }
+  const ext = imageType(body);
+  if (!ext) {
+    send(r, 415, { message: 'Use a PNG, JPEG, WebP, SVG or ICO image.' });
+    return;
+  }
+  const name = kind + '-' + Date.now() + '.' + ext;
+  try {
+    try {
+      fs.mkdirSync(BRANDING);
+    } catch (e) {
+      // already there
+    }
+    const tmp = BRANDING + '/.' + name + '.saving';
+    fs.writeFileSync(tmp, body);
+    fs.renameSync(tmp, BRANDING + '/' + name);
+    // earlier uploads of the same kind are no longer used
+    fs.readdirSync(BRANDING).forEach(function (f) {
+      if (f !== name && f.startsWith(kind + '-'))
+        try {
+          fs.unlinkSync(BRANDING + '/' + f);
+        } catch (e) {
+          // still fine: it's only an unused file
+        }
+    });
+  } catch (e) {
+    send(r, 500, { message: 'Couldn’t keep the image: ' + e.message });
+    return;
+  }
+  send(r, 200, { url: '/branding/' + name });
+}
+
+export default { save, branding };
diff --git a/lumen/deploy/nginx.conf.template b/lumen/deploy/nginx.conf.template
index 5ecc128f4..235323430 100644
--- a/lumen/deploy/nginx.conf.template
+++ b/lumen/deploy/nginx.conf.template
@@ -92,6 +92,32 @@ server {
     client_body_buffer_size 64k;
     js_content lumen.save;
   }
+  # logo and tab icon uploaded from the admin page (PUT, SeerrNG admins only)
+  location ^~ /lumen/branding/ {
+    client_max_body_size 2m;
+    client_body_buffer_size 2m;
+    js_content lumen.branding;
+  }
+  # /branding/: uploads first, then a branding folder mounted into the app. Images only, so
+  # nothing here may run scripts (an SVG opened on its own included).
+  location /branding/ {
+    add_header Cache-Control "no-cache";
+    add_header Content-Security-Policy "default-src 'none'; style-src 'unsafe-inline'; img-src data:; sandbox";
+    add_header X-Frame-Options DENY;
+    add_header X-Content-Type-Options nosniff;
+    add_header Referrer-Policy same-origin;
+    root /lumen-data;
+    try_files $uri @branding_mounted;
+  }
+  location @branding_mounted {
+    add_header Cache-Control "no-cache";
+    add_header Content-Security-Policy "default-src 'none'; style-src 'unsafe-inline'; img-src data:; sandbox";
+    add_header X-Frame-Options DENY;
+    add_header X-Content-Type-Options nosniff;
+    add_header Referrer-Policy same-origin;
+    root /usr/share/nginx/html;
+    try_files $uri =404;
+  }
   # settings saved from the admin page win over a lumen-config.json mounted into the app
   location = /lumen-config.json {
     add_header Cache-Control "no-cache";
diff --git a/lumen/src/pages/LumenSettings.tsx b/lumen/src/pages/LumenSettings.tsx
index 494225808..205efe3ad 100644
--- a/lumen/src/pages/LumenSettings.tsx
+++ b/lumen/src/pages/LumenSettings.tsx
@@ -113,17 +113,20 @@ export default function LumenSettings() {
     a.click();
     setTimeout(() => URL.revokeObjectURL(url), 1000);
   };
+  const putConfig = async (body: string) => {
+    const r = await fetch('/lumen/config', {
+      method: 'PUT',
+      credentials: 'same-origin',
+      headers: { 'Content-Type': 'application/json' },
+      body,
+    });
+    const d = await r.json().catch(() => null);
+    if (!r.ok) throw new Error(d?.message || `Couldn’t save (${r.status})`);
+  };
   const save = async () => {
     setSaving(true);
     try {
-      const r = await fetch('/lumen/config', {
-        method: 'PUT',
-        credentials: 'same-origin',
-        headers: { 'Content-Type': 'application/json' },
-        body: json,
-      });
-      const d = await r.json().catch(() => null);
-      if (!r.ok) throw new Error(d?.message || `Couldn’t save (${r.status})`);
+      await putConfig(json);
       adminSaved(JSON.parse(json));
       touched.current = false;
       toast('Saved. Everyone gets it the next time they open Lumen.');
@@ -133,6 +136,63 @@ export default function LumenSettings() {
       setSaving(false);
     }
   };
+  // Logo and tab icon: the server keeps the image (a new file name each time, so no browser
+  // shows an old copy) and its address goes straight into the saved settings. Other changes
+  // on this page stay unsaved until Save.
+  const [uploading, setUploading] = useState<'logo' | 'icon' | null>(null);
+  const upload = async (kind: 'logo' | 'icon', file: File) => {
+    if (file.size > 2 * 1024 * 1024) {
+      toast('Choose an image of up to 2 MB.');
+      return;
+    }
+    setUploading(kind);
+    try {
+      const r = await fetch(`/lumen/branding/${kind}`, {
+        method: 'PUT',
+        credentials: 'same-origin',
+        headers: { 'Content-Type': file.type || 'application/octet-stream' },
+        body: file,
+      });
+      const d = await r.json().catch(() => null);
+      if (!r.ok || typeof d?.url !== 'string')
+        throw new Error(d?.message || `Couldn’t upload (${r.status})`);
+      const saved: AdminConfig = {
+        ...adminConfig,
+        branding: { ...(adminConfig?.branding || {}), [kind]: d.url },
+      };
+      await putConfig(JSON.stringify(saved, null, 2) + '\n');
+      setCfgState((c) => ({
+        ...c,
+        branding: { ...(c.branding || {}), [kind]: d.url },
+      }));
+      adminSaved(saved);
+      toast(
+        `${kind === 'logo' ? 'Logo' : 'Tab icon'} uploaded and saved for everyone.`
+      );
+    } catch (e) {
+      toast(e instanceof Error ? e.message : 'Couldn’t upload');
+    } finally {
+      setUploading(null);
+    }
+  };
+  const Upload = ({ kind }: { kind: 'logo' | 'icon' }) =>
+    saveState?.canSave ? (
+      <label className="btn btn-tonal btn-sm cfg-upload">
+        {uploading === kind ? 'Uploading…' : 'Upload'}
+        <input
+          type="file"
+          className="sr"
+          accept="image/png,image/jpeg,image/webp,image/svg+xml,image/x-icon"
+          aria-label={kind === 'logo' ? 'Upload logo' : 'Upload tab icon'}
+          disabled={!!uploading}
+          onChange={(e) => {
+            const f = e.target.files?.[0];
+            e.target.value = '';
+            if (f) void upload(kind, f);
+          }}
+        />
+      </label>
+    ) : null;
   const copy = () =>
     navigator.clipboard
       ?.writeText(json)
@@ -304,33 +364,45 @@ export default function LumenSettings() {
               onChange={(e) => setBrand('name', e.target.value)}
             />
           </label>
-          <label className="set cfg-row">
+          <div className="set cfg-row">
             <span>
               <b>Logo</b>
               <small>
-                Square image, e.g. /branding/logo.png (mount a branding folder)
-                or an https address
+                {saveState?.canSave
+                  ? 'Square image: upload one, or an address such as /branding/logo.png or https://…'
+                  : 'Square image, e.g. /branding/logo.png (mount a branding folder) or an https address'}
               </small>
             </span>
             <input
               className="cfg-input"
+              aria-label="Logo address"
               placeholder="/branding/logo.png"
               value={cfg.branding?.logo ?? ''}
               onChange={(e) => setBrand('logo', e.target.value)}
             />
-          </label>
-          <label className="set cfg-row">
+            <Upload kind="logo" />
+          </div>
+          <div className="set cfg-row">
             <span>
               <b>Tab icon</b>
-              <small>PNG or SVG, e.g. /branding/icon.png</small>
+              <small>
+                {saveState?.canSave
+                  ? 'Square PNG or SVG: upload one, or an address such as /branding/icon.png'
+                  : 'PNG or SVG, e.g. /branding/icon.png'}
+              </small>
             </span>
             <input
               className="cfg-input"
+              aria-label="Tab icon address"
               placeholder="/branding/icon.png"
               value={cfg.branding?.icon ?? ''}
               onChange={(e) => setBrand('icon', e.target.value)}
             />
-          </label>
+            {cfg.branding?.icon && (
+              <img className="cfg-icon" src={cfg.branding.icon} alt="" />
+            )}
+            <Upload kind="icon" />
+          </div>
           {(cfg.branding?.logo || cfg.branding?.name !== undefined) && (
             <div className="set">
               <span className="brand cfg-preview">
diff --git a/lumen/src/styles/app-react.css b/lumen/src/styles/app-react.css
index d0f858978..d1277a01b 100644
--- a/lumen/src/styles/app-react.css
+++ b/lumen/src/styles/app-react.css
@@ -432,6 +432,21 @@
   min-width: 0;
   flex: 0 1 280px;
 }
+/* logo / tab icon upload: the file input is hidden inside its button */
+.cfg-upload {
+  position: relative;
+  cursor: pointer;
+}
+.cfg-upload:focus-within {
+  outline: 2px solid var(--accent);
+  outline-offset: 2px;
+}
+.cfg-icon {
+  width: 32px;
+  height: 32px;
+  border-radius: 6px;
+  object-fit: contain;
+}
 .cfg-actions {
   display: flex;
   gap: 10px;
diff --git a/lumen/tests/browser/admin-options.spec.ts b/lumen/tests/browser/admin-options.spec.ts
index fa36754e5..5fe614714 100644
--- a/lumen/tests/browser/admin-options.spec.ts
+++ b/lumen/tests/browser/admin-options.spec.ts
@@ -1417,3 +1417,67 @@ test('failed requests can be retried, and Remove asks once more', async ({
     'DELETE /request/78',
   ]);
 });
+
+test('admins upload a logo, and only the logo is saved straight away', async ({
+  page,
+}) => {
+  await fixtures(page, {
+    permissions: 2,
+    config: { custom: 1, branding: { name: 'Movie Night' } },
+  });
+  const puts: { path: string; body: string; type: string }[] = [];
+  await page.route('**/lumen/config', (route) => {
+    const req = route.request();
+    if (req.method() !== 'PUT')
+      return route.fulfill({ json: { canSave: true, folder: 'ok' } });
+    puts.push({ path: 'config', body: req.postData() || '', type: '' });
+    return route.fulfill({ json: { saved: true } });
+  });
+  await page.route('**/lumen/branding/*', (route) => {
+    const req = route.request();
+    puts.push({
+      path: new URL(req.url()).pathname,
+      body: String(req.postDataBuffer()?.length || 0),
+      type: req.headers()['content-type'] || '',
+    });
+    return route.fulfill({ json: { url: '/branding/logo-123.png' } });
+  });
+  await page.goto('/me/lumen');
+  // an unsaved change elsewhere must not be saved by the upload
+  const row = page.locator('.cfg-row', {
+    hasText: 'Show books and audiobooks',
+  });
+  await row.locator('select').selectOption('off-locked');
+  const png = Buffer.from(
+    'iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mP8z8BQDwAEhQGAhKmMIQAAAABJRU5ErkJggg==',
+    'base64'
+  );
+  await page
+    .getByLabel('Upload logo')
+    .setInputFiles({ name: 'logo.png', mimeType: 'image/png', buffer: png });
+  await expect(
+    page.getByText('Logo uploaded and saved for everyone.')
+  ).toBeVisible();
+  expect(puts.map((p) => p.path)).toEqual(['/lumen/branding/logo', 'config']);
+  expect(puts[0].type).toBe('image/png');
+  expect(JSON.parse(puts[1].body)).toEqual({
+    custom: 1,
+    branding: { name: 'Movie Night', logo: '/branding/logo-123.png' },
+  });
+  await expect(page.getByLabel('Logo address')).toHaveValue(
+    '/branding/logo-123.png'
+  );
+  // the page still holds the unsaved change for Save
+  await expect(row.locator('select')).toHaveValue('off-locked');
+});
+
+test('no upload buttons when the server can’t keep files', async ({ page }) => {
+  await fixtures(page, { permissions: 2 });
+  await page.route('**/lumen/config', (route) =>
+    route.fulfill({ json: { canSave: false, folder: 'missing' } })
+  );
+  await page.goto('/me/lumen');
+  await expect(page.getByLabel('Logo address')).toBeVisible();
+  await expect(page.getByLabel('Upload logo')).toHaveCount(0);
+  await expect(page.getByLabel('Upload tab icon')).toHaveCount(0);
+});

From e71d5f394957c1c106e167d047d2a83a25cb2cc5 Mon Sep 17 00:00:00 2001
From: Ncbudd <209378361+ncbudd@users.noreply.github.com>
Date: Sat, 7 Nov 2026 15:00:03 -0500
Subject: [PATCH 6/7] feat(lumen): logo shape and a custom media server name

Tester feedback (Tatsu, ncbudd/lumen#4):

- branding.logoShape frames the custom logo: "rounded" (default),
  "circle", or "raw" (the file as it is: transparent, uncropped, as wide
  as it is up to 160px). The admin settings page picks it, with a live
  preview. The logo CSS now beats the play mark's own rules, which gave a
  custom logo the accent square on the sign-in card.
- mediaServerName replaces Plex / Jellyfin / Emby in every label, filter
  and the sign-in page (up to 40 characters). Set on the admin page;
  empty keeps the real name.
---
 docs/using-seerr/lumen.md                 | 10 ++-
 lumen/src/components/brand.tsx            |  6 +-
 lumen/src/mediaServer.ts                  | 24 +++++--
 lumen/src/pages/LumenSettings.tsx         | 64 ++++++++++++++---
 lumen/src/settings.tsx                    |  8 ++-
 lumen/src/styles/app-react.css            | 16 ++++-
 lumen/tests/browser/admin-options.spec.ts | 85 +++++++++++++++++++++++
 lumen/tests/mediaServer.test.mjs          | 29 ++++++++
 8 files changed, 225 insertions(+), 17 deletions(-)

diff --git a/docs/using-seerr/lumen.md b/docs/using-seerr/lumen.md
index 20a8f5778..20264b9e3 100644
--- a/docs/using-seerr/lumen.md
+++ b/docs/using-seerr/lumen.md
@@ -374,8 +374,10 @@ you put the file in place by hand:
      "branding": {
        "name": "Movie Night",
        "logo": "/branding/logo.png",
-       "icon": "/branding/icon.png"
+       "icon": "/branding/icon.png",
+       "logoShape": "rounded"
      },
+     "mediaServerName": "Movie Night Server",
      "defaults": {
        "narratorChoice": true,
        "hoverRequest": true,
@@ -399,6 +401,12 @@ you put the file in place by hand:
      `logo` replaces the round play mark, and `icon` is the browser tab and iOS
      home-screen icon. Use files you mount into Lumen (step 2) or `https://`
      addresses.
+     `logoShape` frames the logo: `"rounded"` (a rounded square, the default),
+     `"circle"`, or `"raw"` (the file as it is: transparent, uncropped, and as
+     wide as it is).
+   - `mediaServerName` replaces "Plex", "Jellyfin" or "Emby" in every label,
+     filter and the sign-in page, for example `"On Movie Night Server"`. Leave it
+     out to keep the real name.
    - `requestOptions`: admins and request managers get a sheet to pick the
      Radarr/Sonarr server, quality and folder when they use **Request** on a
      poster. Set it to `false` for one-click requests for them too. Everyone else
diff --git a/lumen/src/components/brand.tsx b/lumen/src/components/brand.tsx
index f72f62fff..f0df569bd 100644
--- a/lumen/src/components/brand.tsx
+++ b/lumen/src/components/brand.tsx
@@ -7,7 +7,11 @@ export function BrandMark() {
   return (
     <>
       {s.logo ? (
-        <img className="mark mark-img" src={s.logo} alt="" />
+        <img
+          className={`mark mark-img mark-${s.logoShape}`}
+          src={s.logo}
+          alt=""
+        />
       ) : (
         <span className="mark">
           <Icon name="play" size="sm" />
diff --git a/lumen/src/mediaServer.ts b/lumen/src/mediaServer.ts
index 92be28509..4a9aad088 100644
--- a/lumen/src/mediaServer.ts
+++ b/lumen/src/mediaServer.ts
@@ -14,7 +14,8 @@ export type MediaServerSetting = 'auto' | MediaServerKind;
 
 export interface MediaServer {
   kind: MediaServerKind;
-  name: string; // product name used in every label: "On Plex", "Watch on Jellyfin"…
+  name: string; // name used in every label: "On Plex", "Watch on Jellyfin"… (admins can rename it)
+  product: string; // what it really is: Plex, Jellyfin or Emby
   source: 'seerrng' | 'config'; // where the choice came from (shown on the Me page)
   localLogin: boolean; // SeerrNG allows email + password accounts
   serverLogin: boolean; // SeerrNG allows signing in with the media server account
@@ -65,7 +66,9 @@ const httpUrl = (v?: string) => {
 
 export function resolveMediaServer(
   setting: unknown,
-  pub: ServerPublicSettings | null
+  pub: ServerPublicSettings | null,
+  // "mediaServerName" in lumen-config.json: what people call it, e.g. the server's own brand
+  customName?: unknown
 ): MediaServer {
   const pinned = isSetting(setting) && setting !== 'auto' ? setting : null;
   const kind =
@@ -85,7 +88,11 @@ export function resolveMediaServer(
   const forgot = httpUrl(pub?.jellyfinForgotPasswordUrl)?.href || host?.href;
   return {
     kind,
-    name: NAMES[kind],
+    name:
+      typeof customName === 'string' && customName.trim()
+        ? customName.trim().slice(0, 40)
+        : NAMES[kind],
+    product: NAMES[kind],
     source: pinned ? 'config' : 'seerrng',
     localLogin: pub?.localLogin !== false,
     serverLogin:
@@ -101,9 +108,16 @@ export function resolveMediaServer(
 // Look and sign-in style, also from lumen-config.json:
 //   "branding": { "name": "Movie Night", "logo": "/branding/logo.png", "icon": "/branding/icon.png" }
 //   "loginStyle": "form"  (Jellyfin/Emby: username + password on the sign-in page itself)
+// rounded: in a rounded square (the default); circle: cropped to a circle; raw: the file as it
+// is, transparent and uncropped, as wide as it needs (up to a limit)
+export type LogoShape = 'rounded' | 'circle' | 'raw';
+export const LOGO_SHAPES: LogoShape[] = ['rounded', 'circle', 'raw'];
+export const logoShapeOf = (v: unknown): LogoShape =>
+  LOGO_SHAPES.includes(v as LogoShape) ? (v as LogoShape) : 'rounded';
 export interface Site {
   name: string; // shown next to the logo and in the tab title; "" hides the text
   logo?: string; // replaces the round play mark
+  logoShape: LogoShape; // how the logo is framed
   icon?: string; // browser tab icon (and iOS home-screen icon)
   loginForm: boolean;
 }
@@ -143,6 +157,7 @@ export function resolveSite(
   return {
     name,
     logo: assetUrl(b.logo),
+    logoShape: logoShapeOf(b.logoShape),
     icon: assetUrl(b.icon),
     loginForm: c.loginStyle === 'form',
   };
@@ -287,7 +302,8 @@ export function MediaServerProvider({ children }: { children: ReactNode }) {
         }
         current = resolveMediaServer(
           config?.mediaServer,
-          pub as ServerPublicSettings | null
+          pub as ServerPublicSettings | null,
+          config?.mediaServerName
         );
         currentSite = resolveSite(config, pub as ServerPublicSettings);
         currentServices = resolveServices(pub as Record<string, unknown>);
diff --git a/lumen/src/pages/LumenSettings.tsx b/lumen/src/pages/LumenSettings.tsx
index 205efe3ad..74e9c6a5d 100644
--- a/lumen/src/pages/LumenSettings.tsx
+++ b/lumen/src/pages/LumenSettings.tsx
@@ -4,7 +4,7 @@ import { useAuth } from '../auth';
 import { Section } from '../components/cards';
 import { useToast } from '../components/toast';
 import { Icon } from '../icons';
-import { mediaServer } from '../mediaServer';
+import { logoShapeOf, mediaServer, type LogoShape } from '../mediaServer';
 import {
   DEFAULT_PREFS,
   DISCOVER_ROWS,
@@ -87,13 +87,16 @@ export default function LumenSettings() {
       else l.delete(path);
       return { ...c, locked: [...l] };
     });
-  const setBrand = (k: 'name' | 'logo' | 'icon', v: string) =>
+  const setBrand = (k: 'name' | 'logo' | 'icon' | 'logoShape', v: string) =>
     setCfg((c) => {
-      const b = { ...(c.branding || {}) };
-      if (v === '' && k !== 'name') delete b[k];
+      const b: Record<string, string> = { ...(c.branding || {}) };
+      // "rounded" is the default, so it needn't be written down
+      if ((v === '' && k !== 'name') || (k === 'logoShape' && v === 'rounded'))
+        delete b[k];
       else b[k] = v;
       return { ...c, branding: b };
     });
+  const shape = logoShapeOf(cfg.branding?.logoShape);
   const setTop = (k: string, v: string | undefined) =>
     setCfg((c) => {
       const n = { ...c };
@@ -289,7 +292,7 @@ export default function LumenSettings() {
               <small>
                 Names in every label and the sign-in button. SeerrNG reports{' '}
                 {mediaServer().source === 'seerrng'
-                  ? mediaServer().name
+                  ? mediaServer().product
                   : 'its own server'}
                 .
               </small>
@@ -310,6 +313,21 @@ export default function LumenSettings() {
               <option value="emby">Emby</option>
             </select>
           </label>
+          <label className="set cfg-row">
+            <span>
+              <b>Media server name</b>
+              <small>
+                Replaces “{mediaServer().product}” everywhere: “On …”, “Watch on
+                …”, filters and sign-in. Leave empty to keep it.
+              </small>
+            </span>
+            <input
+              className="cfg-input"
+              placeholder={mediaServer().product}
+              value={(cfg.mediaServerName as string) || ''}
+              onChange={(e) => setTop('mediaServerName', e.target.value)}
+            />
+          </label>
           <label className="set cfg-row">
             <span>
               <b>Sign-in page</b>
@@ -403,12 +421,42 @@ export default function LumenSettings() {
             )}
             <Upload kind="icon" />
           </div>
+          <div className="set cfg-row">
+            <span>
+              <b>Logo shape</b>
+              <small>
+                How the logo is framed next to the name. “As uploaded” keeps the
+                file as it is: transparent, uncropped and as wide as it is.
+              </small>
+            </span>
+            <div className="seg" role="group" aria-label="Logo shape">
+              {(
+                [
+                  ['rounded', 'Rounded square'],
+                  ['circle', 'Circle'],
+                  ['raw', 'As uploaded'],
+                ] as [LogoShape, string][]
+              ).map(([v, t]) => (
+                <button
+                  key={v}
+                  type="button"
+                  aria-pressed={shape === v}
+                  onClick={() => setBrand('logoShape', v)}
+                >
+                  {t}
+                </button>
+              ))}
+            </div>
+          </div>
           {(cfg.branding?.logo || cfg.branding?.name !== undefined) && (
-            <div className="set">
-              <span className="brand cfg-preview">
+            <div className="set cfg-row">
+              <span>
+                <b>Preview</b>
+              </span>
+              <span className="brand cfg-preview" aria-label="Logo preview">
                 {cfg.branding?.logo ? (
                   <img
-                    className="mark mark-img"
+                    className={`mark mark-img mark-${shape}`}
                     src={cfg.branding.logo}
                     alt=""
                   />
diff --git a/lumen/src/settings.tsx b/lumen/src/settings.tsx
index 73091b66f..b42a28f47 100644
--- a/lumen/src/settings.tsx
+++ b/lumen/src/settings.tsx
@@ -64,7 +64,13 @@ export interface AdminConfig {
   seerrPublicUrl?: string;
   mediaServer?: MediaServerSetting; // read by mediaServer.ts before sign-in
   loginStyle?: 'buttons' | 'form'; // read by mediaServer.ts before sign-in
-  branding?: { name?: string; logo?: string; icon?: string };
+  branding?: {
+    name?: string;
+    logo?: string;
+    icon?: string;
+    logoShape?: 'rounded' | 'circle' | 'raw';
+  };
+  mediaServerName?: string; // replaces Plex / Jellyfin / Emby in every label
   [other: string]: unknown;
 }
 
diff --git a/lumen/src/styles/app-react.css b/lumen/src/styles/app-react.css
index d1277a01b..9b5bbf2ea 100644
--- a/lumen/src/styles/app-react.css
+++ b/lumen/src/styles/app-react.css
@@ -388,14 +388,26 @@
   text-underline-offset: 3px;
 }
 
-/* admin logo (lumen-config.json branding.logo) in place of the play mark */
-.mark.mark-img {
+/* admin logo (lumen-config.json branding.logo) in place of the play mark. Written to beat
+   the play mark's own rules (sidebar, sign-in card, settings preview), which give it the
+   accent background. branding.logoShape picks the frame. */
+.brand .mark.mark-img {
   width: 30px;
   height: 30px;
   border-radius: 9px;
   object-fit: contain;
   background: none;
 }
+.brand .mark.mark-img.mark-circle {
+  border-radius: 50%;
+  object-fit: cover;
+}
+/* raw: the file as it is, transparent and uncropped; wide logos keep their width */
+.brand .mark.mark-img.mark-raw {
+  width: auto;
+  max-width: 160px;
+  border-radius: 0;
+}
 
 /* admin settings page (/me/lumen) */
 .cfg-row {
diff --git a/lumen/tests/browser/admin-options.spec.ts b/lumen/tests/browser/admin-options.spec.ts
index 5fe614714..55d37dc79 100644
--- a/lumen/tests/browser/admin-options.spec.ts
+++ b/lumen/tests/browser/admin-options.spec.ts
@@ -1481,3 +1481,88 @@ test('no upload buttons when the server can’t keep files', async ({ page }) =>
   await expect(page.getByLabel('Upload logo')).toHaveCount(0);
   await expect(page.getByLabel('Upload tab icon')).toHaveCount(0);
 });
+
+test('admins rename the media server everywhere', async ({ page }) => {
+  await fixtures(page, { config: { mediaServerName: 'Tatsuflix' } });
+  await page.goto('/movies');
+  await expect(
+    page.getByRole('button', { name: 'On Tatsuflix', exact: true })
+  ).toBeVisible();
+  await expect(page.getByText(/Jellyfin/)).toHaveCount(0);
+});
+
+for (const [shape, radius, width] of [
+  ['rounded', '9px', 30],
+  ['circle', '50%', 30],
+  ['raw', '0px', null],
+] as const)
+  test(`logo shape "${shape}" frames the logo the same everywhere`, async ({
+    page,
+  }) => {
+    await fixtures(page, {
+      signedIn: false,
+      config: {
+        branding: {
+          name: 'Requests',
+          logo: '/branding/wide.svg',
+          ...(shape === 'rounded' ? {} : { logoShape: shape }),
+        },
+      },
+    });
+    await page.route('**/branding/wide.svg', (route) =>
+      route.fulfill({
+        contentType: 'image/svg+xml',
+        body: '<svg xmlns="http://www.w3.org/2000/svg" width="120" height="40"><rect width="120" height="40" fill="#0af"/></svg>',
+      })
+    );
+    await page.goto('/');
+    const logo = page.locator('.login-card .brand img.mark');
+    await expect(logo).toBeVisible();
+    const look = await logo.evaluate((el) => {
+      const cs = getComputedStyle(el);
+      return {
+        radius: cs.borderTopLeftRadius,
+        bg: cs.backgroundColor,
+        width: el.getBoundingClientRect().width,
+      };
+    });
+    // the sign-in card's accent square must not show behind a custom logo
+    expect(look.bg).toBe('rgba(0, 0, 0, 0)');
+    if (shape === 'circle') expect(look.radius).not.toBe('9px');
+    else expect(look.radius).toBe(radius);
+    if (width) expect(Math.round(look.width)).toBe(width);
+    else expect(look.width).toBeGreaterThan(60); // a wide logo keeps its width
+  });
+
+test('admin page picks the logo shape with a live preview', async ({
+  page,
+}) => {
+  await fixtures(page, {
+    permissions: 2,
+    config: { branding: { name: 'Requests', logo: '/branding/logo.png' } },
+  });
+  await page.goto('/me/lumen');
+  const preview = page.getByLabel('Logo preview').locator('img');
+  await expect(preview).toHaveClass(/mark-rounded/);
+  const shapes = page.getByRole('group', { name: 'Logo shape' });
+  await expect(
+    shapes.getByRole('button', { name: 'Rounded square' })
+  ).toHaveAttribute('aria-pressed', 'true');
+  await shapes.getByRole('button', { name: 'As uploaded' }).click();
+  await expect(preview).toHaveClass(/mark-raw/);
+  await shapes.getByRole('button', { name: 'Circle' }).click();
+  await expect(preview).toHaveClass(/mark-circle/);
+  await page.getByPlaceholder('Jellyfin').fill('Tatsuflix');
+  const json = JSON.parse(
+    await page.getByLabel('lumen-config.json').inputValue()
+  );
+  expect(json).toMatchObject({
+    branding: { logoShape: 'circle' },
+    mediaServerName: 'Tatsuflix',
+  });
+  // back to the default: nothing written
+  await shapes.getByRole('button', { name: 'Rounded square' }).click();
+  expect(
+    JSON.parse(await page.getByLabel('lumen-config.json').inputValue()).branding
+  ).toEqual({ name: 'Requests', logo: '/branding/logo.png' });
+});
diff --git a/lumen/tests/mediaServer.test.mjs b/lumen/tests/mediaServer.test.mjs
index 526c1aa39..a3445f17c 100644
--- a/lumen/tests/mediaServer.test.mjs
+++ b/lumen/tests/mediaServer.test.mjs
@@ -128,6 +128,7 @@ test('branding and sign-in style come from lumen-config.json', async () => {
   assert.deepEqual(resolveSite(null, null), {
     name: 'SeerrNG',
     logo: undefined,
+    logoShape: 'rounded',
     icon: undefined,
     loginForm: false,
   });
@@ -166,4 +167,32 @@ test('branding and sign-in style come from lumen-config.json', async () => {
       undefined
     );
   assert.equal(resolveSite({ loginStyle: 'other' }, null).loginForm, false);
+  // how the logo is framed: rounded unless the admin picks circle or raw
+  for (const shape of ['rounded', 'circle', 'raw'])
+    assert.equal(
+      resolveSite({ branding: { logoShape: shape } }, null).logoShape,
+      shape
+    );
+  assert.equal(
+    resolveSite({ branding: { logoShape: 'hexagon' } }, null).logoShape,
+    'rounded'
+  );
+});
+
+test('admins can rename the media server in every label', () => {
+  const jf = resolveMediaServer('auto', { mediaServerType: 2 }, ' Tatsuflix ');
+  assert.equal(jf.name, 'Tatsuflix');
+  assert.equal(jf.product, 'Jellyfin');
+  assert.equal(jf.kind, 'jellyfin');
+  // empty, blank or not text: the real name
+  for (const bad of ['', '   ', 42, null, undefined])
+    assert.equal(
+      resolveMediaServer('auto', { mediaServerType: 2 }, bad).name,
+      'Jellyfin'
+    );
+  assert.equal(
+    resolveMediaServer('auto', { mediaServerType: 1 }, 'x'.repeat(80)).name
+      .length,
+    40
+  );
 });

From 485677b1e38fdd83b4437a5b26d3ba532d2c6b06 Mon Sep 17 00:00:00 2001
From: Ncbudd <209378361+ncbudd@users.noreply.github.com>
Date: Sat, 7 Nov 2026 15:18:06 -0500
Subject: [PATCH 7/7] feat(lumen): Everyone shows every request: filters and
 Show more

The Everyone tab listed waiting requests, started downloads and only the
20 newest requests, so a big library (hundreds of requests) showed a
small slice. It now has SeerrNG's own filters with their counts (All,
Waiting, Downloading, Failed, Available) and a Show more button that
loads 20 more at a time (in SeerrNG pages of up to 100). All still puts
waiting requests and started downloads first; Downloading puts started
ones first.
---
 lumen/src/pages/Requests.tsx              | 149 +++++++++++++++++-----
 lumen/src/styles/app.css                  |   7 +-
 lumen/tests/browser/admin-options.spec.ts |  46 +++++++
 3 files changed, 170 insertions(+), 32 deletions(-)

diff --git a/lumen/src/pages/Requests.tsx b/lumen/src/pages/Requests.tsx
index ffc9bd5f0..82f5d1255 100644
--- a/lumen/src/pages/Requests.tsx
+++ b/lumen/src/pages/Requests.tsx
@@ -48,6 +48,16 @@ interface Row {
   airing?: boolean;
 }
 
+// Everyone tab: SeerrNG's request filters, and how many requests load at a time
+const EVERYONE_FILTERS = [
+  ['all', 'All', 'total'],
+  ['pending', 'Waiting', 'pending'],
+  ['processing', 'Downloading', 'processing'],
+  ['failed', 'Failed', 'failed'],
+  ['available', 'Available', 'available'],
+] as const;
+const PAGE = 20;
+
 // what a request looks like to the person who made it, in plain words
 // "00:03:03" -> "About 3 min left"
 function eta(t?: string) {
@@ -516,7 +526,19 @@ export default function Requests() {
   const manage = canChooseRequestOptions(user?.permissions);
   const everyone = manage && tab === 'everyone';
   const [others, setOthers] = useState<Row[] | null>(null);
-  const [waiting, setWaiting] = useState<number | null>(null);
+  // SeerrNG's request counts, for the Everyone tab and its filters
+  const [counts, setCounts] = useState<Record<string, number> | null>(null);
+  const waiting = counts?.pending ?? null;
+  // Everyone: which requests (SeerrNG's own filters) and how many pages of them
+  const show = (EVERYONE_FILTERS.find(([v]) => v === p.get('show')) ||
+    EVERYONE_FILTERS[0])[0];
+  const [pages, setPages] = useState(1);
+  const [hasMore, setHasMore] = useState(false);
+  const [loadingMore, setLoadingMore] = useState(false);
+  useEffect(() => {
+    setPages(1);
+    setOthers(null);
+  }, [show, everyone]);
   const [acting, setActing] = useState<number | null>(null);
   const [editing, setEditing] = useState<Row | null>(null);
   // Remove asks once more on the same button instead of a pop-up
@@ -530,9 +552,9 @@ export default function Requests() {
   useEffect(() => {
     if (!manage) return;
     let live = true;
-    api<{ pending: number }>('/request/count')
-      .then((d) => live && setWaiting(d.pending))
-      .catch(() => live && setWaiting(null));
+    api<Record<string, number>>('/request/count')
+      .then((d) => live && setCounts(d))
+      .catch(() => live && setCounts(null));
     return () => {
       live = false;
     };
@@ -541,34 +563,55 @@ export default function Requests() {
   useEffect(() => {
     if (!everyone) return;
     let live = true;
-    const list = (filter: string, take: number) =>
-      api<{ results: RequestItem[] }>(
-        `/request?take=${take}&skip=0&filter=${filter}&sort=added`
-      ).then((d) => d.results);
-    // every request still waiting, then the newest of the rest
-    // waiting for approval, then downloads that have started (furthest along first), then the
-    // newest of the rest
-    Promise.all([
-      list('pending', 50),
-      startedDownloads().catch(() => []),
-      list('all', 20),
-    ])
-      .then(([pending, started, recent]) =>
-        describeAll(
-          merge(
-            pending,
-            started.sort((a, b) => progress(b) - progress(a)),
-            recent
-          )
-        )
-      )
-      .then((x) => live && setOthers(x))
+    // the newest `take` requests of one filter, in SeerrNG's pages of up to 100
+    const list = async (filter: string, take: number) => {
+      const out: RequestItem[] = [];
+      let total = 0;
+      for (let skip = 0; skip < take; skip += 100) {
+        const d = await api<{
+          pageInfo?: { results?: number };
+          results: RequestItem[];
+        }>(
+          `/request?take=${Math.min(100, take - skip)}&skip=${skip}&filter=${filter}&sort=added`
+        );
+        total = d.pageInfo?.results ?? 0;
+        out.push(...d.results);
+        if (d.results.length < Math.min(100, take - skip)) break;
+      }
+      return { results: out, more: total > take };
+    };
+    const take = PAGE * pages;
+    // All: waiting for approval, then downloads that have started (furthest along first), then
+    // the newest of the rest. Downloading: started ones first too. Others: newest first.
+    const started =
+      show === 'all' || show === 'processing'
+        ? startedDownloads()
+            .then((x) => x.sort((a, b) => progress(b) - progress(a)))
+            .catch(() => [])
+        : Promise.resolve([]);
+    const pending =
+      show === 'all'
+        ? list('pending', 50).then((x) => x.results)
+        : Promise.resolve([]);
+    Promise.all([pending, started, list(show, take)])
+      .then(async ([waitingList, startedList, rest]) => {
+        const rows = await describeAll(
+          merge(waitingList, startedList, rest.results)
+        );
+        if (!live) return;
+        setOthers(rows);
+        setHasMore(rest.more);
+      })
       .catch(() => live && setOthers([]))
-      .finally(() => live && setRefreshing(false));
+      .finally(() => {
+        if (!live) return;
+        setRefreshing(false);
+        setLoadingMore(false);
+      });
     return () => {
       live = false;
     };
-  }, [everyone, tick]);
+  }, [everyone, show, pages, tick]);
 
   useEffect(() => {
     if (!user || everyone) return;
@@ -669,7 +712,9 @@ export default function Requests() {
         </div>
         <p className="sub">
           {everyone
-            ? 'Everyone’s requests. Waiting ones first, then the newest.'
+            ? show === 'all'
+              ? 'Everyone’s requests: waiting ones first, then downloads, then the newest.'
+              : 'Everyone’s requests, newest first.'
             : 'Everything you’ve asked for, newest first.'}
         </p>
       </header>
@@ -717,10 +762,38 @@ export default function Requests() {
           {everyone ? 'Loading everyone’s requests…' : 'Loading your requests…'}
         </p>
       )}
+      {everyone && (
+        <div className="chips wrap" role="group" aria-label="Which requests">
+          {EVERYONE_FILTERS.map(([v, t, key]) => (
+            <button
+              key={v}
+              className="chip"
+              aria-pressed={show === v}
+              onClick={() =>
+                setP(
+                  v === 'all'
+                    ? { tab: 'everyone' }
+                    : { tab: 'everyone', show: v },
+                  {
+                    replace: true,
+                  }
+                )
+              }
+            >
+              {t}
+              {counts?.[key] != null && (
+                <span className="n">{counts[key]}</span>
+              )}
+            </button>
+          ))}
+        </div>
+      )}
       {shown && !list.length && everyone && (
         <div className="empty">
-          <b>No requests yet</b>
-          Nobody has asked for anything.
+          <b>{show === 'all' ? 'No requests yet' : 'Nothing here'}</b>
+          {show === 'all'
+            ? 'Nobody has asked for anything.'
+            : 'No requests match this filter right now.'}
         </div>
       )}
       {shown && !list.length && !everyone && (
@@ -857,6 +930,20 @@ export default function Requests() {
           );
         })}
       </div>
+      {everyone && hasMore && shown && (
+        <div className="more-scroll">
+          <button
+            className="btn btn-tonal"
+            disabled={loadingMore}
+            onClick={() => {
+              setLoadingMore(true);
+              setPages((n) => n + 1);
+            }}
+          >
+            {loadingMore ? 'Loading…' : 'Show more'}
+          </button>
+        </div>
+      )}
       {editing && (
         <RequestEditSheet
           r={editing.r}
diff --git a/lumen/src/styles/app.css b/lumen/src/styles/app.css
index 38195e034..32a0cfca2 100644
--- a/lumen/src/styles/app.css
+++ b/lumen/src/styles/app.css
@@ -213,11 +213,16 @@ body.is-detail .tabbar {
     0 1px 2px rgba(0, 0, 0, 0.18),
     0 0 0 1px var(--line);
 }
-.seg .n {
+.seg .n,
+.chip .n {
   font-size: 12px;
   color: var(--ink-3);
   font-weight: 600;
 }
+.chip[aria-pressed='true'] .n {
+  color: inherit;
+  opacity: 0.7;
+}
 .seg.wide {
   display: flex;
 }
diff --git a/lumen/tests/browser/admin-options.spec.ts b/lumen/tests/browser/admin-options.spec.ts
index 55d37dc79..ef4a983d1 100644
--- a/lumen/tests/browser/admin-options.spec.ts
+++ b/lumen/tests/browser/admin-options.spec.ts
@@ -1566,3 +1566,49 @@ test('admin page picks the logo shape with a live preview', async ({
     JSON.parse(await page.getByLabel('lumen-config.json').inputValue()).branding
   ).toEqual({ name: 'Requests', logo: '/branding/logo.png' });
 });
+
+test('Everyone shows more on request and filters by status', async ({
+  page,
+}) => {
+  await fixtures(page, { permissions: 2 });
+  await requestRoutes(page);
+  const asked: string[] = [];
+  const many = Array.from({ length: 45 }, (_, i) => ({
+    ...waitingRequest,
+    id: 100 + i,
+    status: 2,
+    createdAt: `2026-11-0${(i % 9) + 1}T10:00:00.000Z`,
+  }));
+  await page.route('**/api/v1/request?*', (route) => {
+    const q = new URL(route.request().url()).searchParams;
+    asked.push(`${q.get('filter')}:${q.get('skip')}:${q.get('take')}`);
+    if (q.has('requestedBy') || q.get('filter') !== 'all')
+      return route.fulfill({
+        json: { pageInfo: { pages: 1, results: 0 }, results: [] },
+      });
+    const skip = Number(q.get('skip'));
+    const take = Number(q.get('take'));
+    return route.fulfill({
+      json: {
+        pageInfo: { pages: 1, results: many.length },
+        results: many.slice(skip, skip + take),
+      },
+    });
+  });
+  await page.goto('/requests?tab=everyone');
+  await expect(page.locator('.rq')).toHaveCount(20);
+  await page.getByRole('button', { name: 'Show more' }).click();
+  await expect(page.locator('.rq')).toHaveCount(40);
+  await page.getByRole('button', { name: 'Show more' }).click();
+  await expect(page.locator('.rq')).toHaveCount(45);
+  await expect(page.getByRole('button', { name: 'Show more' })).toHaveCount(0);
+  // filters use SeerrNG's own, with its counts
+  const filters = page.getByRole('group', { name: 'Which requests' });
+  await expect(filters.getByRole('button', { name: /Waiting/ })).toContainText(
+    '1'
+  );
+  await filters.getByRole('button', { name: /Failed/ }).click();
+  await expect(page).toHaveURL(/show=failed/);
+  await expect(page.getByText('Nothing here')).toBeVisible();
+  expect(asked).toContain('failed:0:20');
+});