feat(review): Needs review page, SAVED VIEWS row and Activity hook

The concept's Metadata review page at #/review: the notice with the
exact pending count, the queue's media cards (shared with Images through
image-card.mjs), and the Resolve the association panel with the sampler
context, the chosen path's prompt blocks, Leave for later and Apply
association. Apply takes a fresh capture; refusals keep the selection
and explain inline; an unanswered decision is resent once. SAVED VIEWS
lists Needs review after Favorites with its count (retires D50), and an
ended scan that recorded review items offers Review metadata in Activity
(D87). Queue items carry the card's media url.

TESTING.md

@@ -549,8 +549,9 @@ Recorded shell deviations:
   `a saved view row matches the concept's` saves one view in both documents and
   compares the rows; `tests/browser/workspace-saved-views.spec.mjs` covers saving,
   reopening, the defaults that replace rejected values, and failed reads and saves.
-- **D50**: no "Needs review" row in SAVED VIEWS until the tag-review slice (maintainer
-  ruling, 2026-10-21). The comparison maps only that row out.
+- **D50** (retired by #249 PR F, ruling R5): SAVED VIEWS now lists the concept's
+  "Needs review" row after Favorites, with its count; the comparison maps nothing out
+  for it (only the concept's sample count "3" reads as the fixture's "0").
 - **D51** (maintainer ruling, 2026-10-21, beyond the concept): SAVED VIEWS starts with
   the concept's Favorites row (star icon, name, count). Its count is the Favorites
   listing's own `limit=1` total (`/images/output?mode=workspace&favorites=1`), follows
@@ -1585,6 +1586,57 @@ npm run --prefix tools/vendor test:workflows -- inspect-concept.spec.mjs workspa
 npm run --prefix tools/vendor test:comfyui -- inspect-sender.spec.mjs
 ```
 
+### Needs review page and recorded deviations (#249 PR F)
+
+`#/review` is the concept's Metadata review page (app.js `renderReview` a749–760) over
+the review routes (`web/js/workspace/review.mjs`, `review-state.mjs`): breadcrumb and
+document title "Review" (the concept's), heading "Metadata review" with its line and
+**Open activity** (`#/activity`), the `.notice` "N images need a decision" with the
+concept's sentence, then `.gallery-layout`: the queue's concept media cards
+(`image-card.mjs`, shared with Images; the image opens the shared viewer, Info selects
+the item, Tag opens the shared Tag image dialog with the review scope note) and
+`section.surface` "Resolve the association" (filename, Tag image, Sampler context,
+the chosen path's prompt blocks, Leave for later and primary Apply association). The
+first item is selected on load, as the concept's first image is. Sampler context lists
+"Sampler <id> · <positive> / <negative>" per candidate (the server's label), disables
+unusable ones, preselects the first workable one and ends with "Leave unresolved"
+(rulings R2/R3); "Leave unresolved" shows the ambiguous status in both blocks. Apply
+takes a fresh capture (`observe`) and posts the decision; Leave unresolved on a file
+under no current root posts without a capture. Both actions return to Images (R7); a
+recorded decision re-reads the row's count, as does every metadata scan that ends. A
+refused decision keeps the selection and shows the server's sentence (the
+association conflict's explanation included) as `p.warning-note` in the panel; a
+restored storage or a changed queue reads the queue again; a request with no answer
+keeps its capture and body, and the next Apply of the same choice resends it once.
+The SAVED VIEWS row "Needs review" (review icon) follows Favorites with the exact
+pending count (`GET /prompt_manager/review/items?limit=1`, its `total`).
+
+- **D86** (plan D63, ruling R6): an empty queue shows only the notice, "No images need a
+  decision" and "Ambiguous images are added when a metadata scan or a new generation
+  finds more than one sampler path."
+- **D87** (plan D64): an ended metadata scan whose `scope.review_items` is above 0
+  carries the concept's **Review metadata** (app.js a738 `go-review`): in its Activity
+  item after the item's line, and in its job view's heading after Download report. The
+  item's chip still names its state (D54), where the concept's says "Needs attention".
+- **D-NEW-F1** (number to be assigned): the queue cards have no selection checkbox and
+  no star (the page has no selection bar and the queue carries no favorite state); a
+  file under no current root has an empty, `aria-disabled` image button and Tag; more
+  than 40 items add the Images page's `.infinite-continuation` ("40 of 45 images",
+  Load more images) after the layout; loading and a failed read are the page's status
+  line (with Retry); a limited or unavailable file and the decision states are text in
+  the panel's `p.warning-note`; the toasts "Association accepted." and "Left
+  unresolved." replace the concept's prototype toast. The concept's "Sample review
+  queue" chip and "sample" wording are prototype copy (D29).
+- **D3** and **D20** apply to the queue grid (its cards stay in the grid's flow; it is
+  not virtualized) and to the panel's prompt blocks (their mount point is transparent).
+
+Tests: `tests/js/workspace-review-state.test.js` (controller),
+`tests/js/workspace-state.test.js` (route and count),
+`tests/browser/workspace-review.spec.mjs` (queue, count, apply, leave, Tag, empty
+queue, Load more, Activity's Review metadata; items recorded by the real recorder in
+`tests/browser/workspace_review_fixture.py`), and the SAVED VIEWS rows in
+`shell-concept.spec.mjs` and `workspace-saved-views.spec.mjs`.
+
 ## Workspace data fields for the concept pages (#249)
 
 These fields are additive. The legacy `/prompt_manager/images/output` listing (no
@@ -1813,7 +1865,9 @@ Needs review decisions and queue reads (#249, `py/api/review.py`,
 `database/review.py`, `database/review_decisions.py`,
 `tests/test_api_review.py`): `GET /prompt_manager/review/items?limit=1..40&cursor=`
 answers `{success, library_epoch, total, items, next_cursor}` with pending items
-oldest first; `total` is the exact pending count. The cursor is an HMAC keyset
+oldest first (each item adds the card's `url`, the Images listing's
+`/prompt_manager/images/serve/<path>?root=<i>&root_scope=<scope>` formatted without a
+stat, null when the file is under no current root, and `is_video` from its extension); `total` is the exact pending count. The cursor is an HMAC keyset
 on `(created_at, id)` bound to the storage epoch only (ruling M3, so "load more"
 keeps working while the monitor adds an item per generation): a malformed one
 is 400, a well-formed one this process cannot verify (tampered, or opened

py/api/review.py

@@ -24,10 +24,12 @@ import hmac
 import json
 import os
 import re
+import urllib.parse
 
 from aiohttp import web
 
 from .annotations import _HEX64, _TOKEN, _UUID, _capture_error, _error
+from .inspection_service import VIDEO_EXTENSIONS
 from .prompts import bad_request
 
 try:
@@ -253,7 +255,7 @@ class ReviewRoutesMixin:
     def _review_view(self, row: dict, roots, real_roots) -> dict:
         """The public ReviewItem of one stored row (no path, no locator)."""
         found = format_review_target(row["spelled_path"], row["locator"], real_roots)
-        target = None
+        target = url = None
         if found is not None:
             index, relative = found
             target = {
@@ -261,16 +263,25 @@ class ReviewRoutesMixin:
                 "root_scope": self._gallery_root_scope(roots[index], index),
                 "path": relative,
             }
+            # The Images listing's media URL for the same file (formatting only).
+            url = (
+                "/prompt_manager/images/serve/"
+                f"{urllib.parse.quote(relative, safe='/')}?root={index}"
+                f"&root_scope={target['root_scope']}"
+            )
+        filename = os.path.basename(row["spelled_path"])
         return {
             "id": row["id"],
             "state": row["state"],
             "revision": row["revision"],
             "created_at": row["created_at"],
-            "filename": os.path.basename(row["spelled_path"]),
+            "filename": filename,
             "target": target,
             "unavailable": target is None,
             "candidate_count": row["candidate_count"],
             "limited": row["limited"],
+            "url": url,
+            "is_video": os.path.splitext(filename)[1].lower() in VIDEO_EXTENSIONS,
         }
 
     @staticmethod

tests/browser/concept-inventory.mjs

@@ -116,6 +116,8 @@ export async function openProduction(page,route,theme,motion='no-preference') {
     await expect(page.locator('#primary-nav .nav-count')).toHaveCount(3);
     // SAVED VIEWS' Favorites count (D51), the concept's starred images in the concept fixture.
     await expect(page.locator('#saved-nav a[data-route="favorites"] .nav-count')).toHaveCount(1);
+    // SAVED VIEWS' Needs review count (ruling R5): the exact pending count.
+    await expect(page.locator('#saved-nav a[data-route="review"] .nav-count')).toHaveCount(1);
 }
 
 /** Computed outline of the focused element, after keyboard focus so `:focus-visible` applies. */

tests/browser/server.py

@@ -36,6 +36,7 @@ from tests.browser.workspace_library_editor_fixture import (
 )
 from tests.browser.workspace_vocabulary_fixture import register_vocabulary_commands
 from tests.browser.workspace_tagging_fixture import register_tagging_commands
+from tests.browser.workspace_review_fixture import register_review_commands
 
 CANONICAL_ROOT = Path(__file__).resolve().parents[2]
 CANONICAL_ASSETS = {
@@ -193,6 +194,7 @@ def create_app(root: Path) -> web.Application:
     library_editor_commands = register_library_editor_commands(routes, api, root)
     register_vocabulary_commands(routes, api, root)
     register_tagging_commands(routes, api, root, model)
+    register_review_commands(routes, api, root)
     reveal_stub = register_reveal_stub(routes, api, root)
     register_activity_commands(app, routes, api)
 

tests/browser/shell-concept.spec.mjs

@@ -68,12 +68,12 @@ function remainingFooter(footer,spans) {
 const OVERVIEW_GLYPH='M3 11 12 4l9 7M5 10v10h14V10M10 20v-6h4v6';
 
 /**
- * The concept's SAVED VIEWS rows (app.js a331–335) as production lists them: Favorites with its count (D51), then the
- * saved views. D50: no "Needs review" row until the tag-review slice (maintainer ruling 2026-10-21).
+ * The concept's SAVED VIEWS rows (app.js a331–335) as production lists them: Favorites with its count (D51), Needs
+ * review with the exact pending count (ruling R5), then the saved views. The concept's "3" is sample data: the concept
+ * fixture records no review items, so production's count reads "0".
  */
 function savedNav(nav) {
-    const rows=nav.rows.filter(row=>row.text!=='Needs review');
-    return {...nav,rows:rows.map((row,index)=>index===rows.length-1?{...row,gapAfter:null}:row)};
+    return {...nav,rows:nav.rows.map(row=>row.text==='Needs review'?{...row,count:{...row.count,text:'0'}}:row)};
 }
 
 /** Recorded shell deviations only (spec §8). Everything else in the concept inventory must equal production. */
@@ -242,8 +242,9 @@ for(const [width,height] of SIZES)test(`a saved view row matches the concept's $
     await openProduction(page,'images','dark');
     const actual=await save('Save','#workspace-main');
     expect(diffInventory(mapShellConcept(reference).chrome.navs,actual.chrome.navs)).toEqual([]);
+    const referenceRows=reference.chrome.navs.find(nav=>nav.id==='saved-nav').rows;
     expect(actual.chrome.navs.find(nav=>nav.id==='saved-nav').rows.map(row=>[row.text,row.count]))
-        .toEqual([['Favorites',reference.chrome.navs.find(nav=>nav.id==='saved-nav').rows[0].count],['Golden hour',null]]);
+        .toEqual([['Favorites',referenceRows[0].count],['Needs review',{...referenceRows[1].count,text:'0'}],['Golden hour',null]]);
 });
 
 test('the inventory reports a missing shell element by its path instead of failing',async({page})=>{

tests/browser/workspace-review.spec.mjs

@@ -0,0 +1,209 @@
+// Needs review (#249 PR F, plan Task F1, Mock inventory M4): the SAVED VIEWS row and its count, the Metadata review
+// page over the real review routes, and Activity's Review metadata. Items are recorded by the real recorder
+// (tests/browser/workspace_review_fixture.py), as the live monitor records a new output.
+import { startCoverage, saveCoverage } from '../../tools/vendor/browser-coverage.mjs';
+import { test, expect } from './fixtures.mjs';
+
+const review = '/prompt_manager/workspace#/review';
+const main = page => page.locator('#workspace-main');
+const savedNav = page => page.getByRole('navigation', { name: 'Saved views', exact: true });
+const reviewRow = page => savedNav(page).locator('a[data-route="review"]');
+const panel = page => main(page).getByRole('region', { name: 'Resolve the association', exact: true });
+const context = page => panel(page).getByRole('combobox', { name: 'Sampler context', exact: true });
+const cards = page => main(page).locator('.review-queue article.media-card');
+const toast = page => page.locator('#workspace-toast');
+const NOTICE = 'Multiple sampler paths were found. The existing image links were preserved. Choose the correct context or leave them unresolved.';
+const EMPTY = 'Ambiguous images are added when a metadata scan or a new generation finds more than one sampler path.';
+const OPTIONS = ['Sampler 11 · Golden dunes at dusk / Soft negative, blur', 'Sampler 13 · Harbor lights at night / Soft negative, blur',
+    'Leave unresolved'];
+
+async function seed(request, items = 3) {
+    const response = await request.post('/__test__/review/reset', { data: { items } });
+    await expect(response).toBeOK();
+    return response.json();
+}
+async function pending(request) {
+    return (await (await request.get('/prompt_manager/review/items?limit=1')).json()).total;
+}
+/** The page with its first item's sampler paths loaded. */
+async function open(page) {
+    await page.goto(review);
+    await expect(context(page)).toBeEnabled();
+}
+
+test.beforeEach(async ({ page, browserName }) => {
+    await startCoverage(page, browserName);
+    page.reviewErrors = [];
+    page.on('pageerror', error => page.reviewErrors.push(error.message));
+});
+test.afterEach(async ({ page, browserName, request }) => {
+    await saveCoverage(page, browserName);
+    expect(page.reviewErrors).toEqual([]);
+    await request.post('/__test__/jobs/restart');
+});
+
+test('queue shows persisted items and the nav count', async ({ page, request }) => {
+    await seed(request, 3);
+    await open(page);
+    // SAVED VIEWS: Favorites, then Needs review with the exact pending count (ruling R5).
+    await expect(savedNav(page).locator('a').nth(1)).toHaveAttribute('data-route', 'review');
+    await expect(reviewRow(page)).toHaveText('Needs review3');
+    await expect(reviewRow(page)).toHaveAttribute('aria-current', 'page');
+    await expect(page).toHaveTitle('Review · Prompt Manager');
+    await expect(page.locator('#workspace-breadcrumb')).toHaveText('Review');
+    await expect(main(page).getByRole('heading', { level: 1 })).toHaveText('Metadata review');
+    await expect(main(page).locator('.heading p.muted')).toHaveText('Uncertain evidence stays visible until you decide.');
+    await expect(main(page).locator('.notice h2')).toHaveText('3 images need a decision');
+    await expect(main(page).locator('.notice p')).toHaveText(NOTICE);
+    await expect(cards(page)).toHaveCount(3);
+    await expect(cards(page).first()).toHaveClass(/selected/);
+    await expect(panel(page).locator('p.small')).toHaveText('review_0000.png');
+    await expect(context(page).locator('option')).toHaveText(OPTIONS);
+    await expect(context(page)).toHaveValue(/^[0-9a-f]{64}$/);
+    await expect(panel(page).locator('.prompt-section.positive .prompt-text')).toHaveText('Golden dunes at dusk');
+    await expect(panel(page).locator('.prompt-section.negative .prompt-text')).toHaveText('Soft negative, blur');
+    await context(page).selectOption({ label: OPTIONS[1] });
+    await expect(panel(page).locator('.prompt-section.positive .prompt-text')).toHaveText('Harbor lights at night');
+    await context(page).selectOption({ label: 'Leave unresolved' });
+    await expect(panel(page).locator('.prompt-section.positive .prompt-text')).toHaveText('Multiple possible prompts. Source could not be determined.');
+    // Info selects another item.
+    await cards(page).nth(1).getByRole('button', { name: 'Inspect review_0001.png', exact: true }).click();
+    await expect(panel(page).locator('p.small')).toHaveText('review_0001.png');
+    await expect(cards(page).nth(1)).toHaveClass(/selected/);
+    await expect(context(page)).toBeEnabled();
+    // The card's image opens the shared viewer.
+    await cards(page).nth(1).getByRole('button', { name: 'Open review_0001.png', exact: true }).click();
+    await expect(page.locator('#viewer-dialog')).toBeVisible();
+    await page.keyboard.press('Escape');
+    await expect(page.locator('#viewer-dialog')).toHaveCount(0);
+    // Open activity.
+    await main(page).getByRole('button', { name: 'Open activity', exact: true }).click();
+    await expect(page).toHaveURL(/#\/activity$/);
+});
+
+test('apply candidate links the pair and the item leaves the queue and the count drops', async ({ page, request }) => {
+    await seed(request, 2);
+    await open(page);
+    await expect(reviewRow(page)).toHaveText('Needs review2');
+    const decided = page.waitForResponse(item => /\/review\/items\/[^/]+\/decision$/.test(item.url()));
+    await panel(page).getByRole('button', { name: 'Apply association', exact: true }).click();
+    expect((await decided).status()).toBe(200);
+    await expect(toast(page)).toHaveText('Association accepted.');
+    await expect(page).toHaveURL(/#\/images$/);
+    await expect(reviewRow(page)).toHaveText('Needs review1');
+    expect(await pending(request)).toBe(1);
+});
+
+test('leave unresolved removes the item from pending', async ({ page, request }) => {
+    await seed(request, 2);
+    await open(page);
+    await context(page).selectOption({ label: 'Leave unresolved' });
+    await panel(page).getByRole('button', { name: 'Apply association', exact: true }).click();
+    await expect(toast(page)).toHaveText('Left unresolved.');
+    await expect(page).toHaveURL(/#\/images$/);
+    expect(await pending(request)).toBe(1);
+});
+
+test('leave for later writes nothing and goes to Images', async ({ page, request }) => {
+    await seed(request, 2);
+    await open(page);
+    const writes = [];
+    page.on('request', item => { if (item.method() !== 'GET') writes.push(item.url()); });
+    await panel(page).getByRole('button', { name: 'Leave for later', exact: true }).click();
+    await expect(page).toHaveURL(/#\/images$/);
+    expect(writes).toEqual([]);
+    expect(await pending(request)).toBe(2);
+});
+
+test('tag image from review opens the shared dialog with the scope note', async ({ page, request }) => {
+    await seed(request, 1);
+    await open(page);
+    await panel(page).getByRole('button', { name: 'Tag image', exact: true }).click();
+    const dialog = page.getByRole('dialog', { name: 'Tag image', exact: true });
+    await expect(dialog).toBeVisible();
+    await expect(dialog.locator('p.tag-scope-note')).toHaveText('Tags belong to this image. Resolve its prompt association separately in Needs review.');
+    await dialog.getByRole('textbox', { name: 'Image tags · edit manually', exact: true }).fill('dunes');
+    await dialog.getByRole('button', { name: 'Save manual tags', exact: true }).click();
+    await expect(toast(page)).toHaveText('1 tags saved for review_0000.png. Prompt association still awaits review.');
+    await expect(dialog).toHaveCount(0);
+    expect(await pending(request)).toBe(1);
+    await expect(page).toHaveURL(/#\/review$/);
+});
+
+test('an empty queue shows the empty notice only', async ({ page, request }) => {
+    await seed(request, 0);
+    await page.goto(review);
+    await expect(main(page).locator('.notice h2')).toHaveText('No images need a decision');
+    await expect(main(page).locator('.notice p')).toHaveText(EMPTY);
+    await expect(main(page).locator('.gallery-layout')).toHaveCount(0);
+    await expect(reviewRow(page)).toHaveText('Needs review0');
+});
+
+test('load more appends the next page', async ({ page, request }) => {
+    await seed(request, 45);
+    await open(page);
+    await expect(cards(page)).toHaveCount(40);
+    const continuation = main(page).locator('.infinite-continuation');
+    await expect(continuation.locator('p')).toHaveText('40 of 45 images');
+    await continuation.getByRole('button', { name: 'Load more images', exact: true }).click();
+    await expect(cards(page)).toHaveCount(45);
+    await expect(continuation).toHaveCount(0);
+});
+
+test('a scan job with review items offers Review metadata in Activity', async ({ page, request }) => {
+    await seed(request, 1);
+    const started = await (await request.post('/__test__/jobs/start', { data: { total: 10, review_items: 2 } })).json();
+    await expect(await request.post(`/__test__/jobs/${started.job.id}/finish`, { data: {} })).toBeOK();
+    const plain = await (await request.post('/__test__/jobs/start', { data: { total: 10 } })).json();
+    await expect(await request.post(`/__test__/jobs/${plain.job.id}/finish`, { data: {} })).toBeOK();
+    await page.goto('/prompt_manager/workspace#/activity');
+    const item = main(page).locator(`.activity-item[data-job-id="${started.job.id}"]`);
+    await expect(item.getByRole('button', { name: 'Review metadata', exact: true })).toBeVisible();
+    await expect(main(page).locator(`.activity-item[data-job-id="${plain.job.id}"] button`)).toHaveCount(0);
+    await page.goto(`/prompt_manager/workspace#/activity/${started.job.id}`);
+    const actions = main(page).locator('.heading-actions button');
+    await expect(actions).toHaveText(['Download report', 'Review metadata']);
+    await actions.nth(1).click();
+    await expect(page).toHaveURL(/#\/review$/);
+    await expect(main(page).getByRole('heading', { level: 1 })).toHaveText('Metadata review');
+});
+
+test('a failed item read says so and Retry reads it again', async ({ page, request }) => {
+    await seed(request, 1);
+    await page.route(url => /\/prompt_manager\/review\/items\/[0-9a-f-]{36}$/.test(url.pathname),
+        route => route.fulfill({ status: 500, contentType: 'application/json', body: JSON.stringify({ success: false, code: 'review-failed', error: 'x' }) }),
+        { times: 1 });
+    await page.goto(review);
+    await expect(panel(page).locator('.warning-note')).toHaveText('This item could not be read. Select it again to retry.');
+    await expect(panel(page).getByText('Could not read prompts from this file.', { exact: true })).toBeVisible();
+    await expect(panel(page).getByRole('button', { name: 'Apply association', exact: true })).toHaveAttribute('aria-disabled', 'true');
+    await panel(page).getByRole('button', { name: 'Retry prompt details', exact: true }).click();
+    await expect(context(page)).toBeEnabled();
+    await expect(context(page).locator('option')).toHaveText(OPTIONS);
+    await expect(panel(page).locator('.warning-note')).toBeHidden();
+});
+
+test('a failed queue read offers Retry', async ({ page, request }) => {
+    await seed(request, 1);
+    await page.route(url => url.pathname.endsWith('/prompt_manager/review/items') && url.searchParams.get('limit') === '40',
+        route => route.fulfill({ status: 500, contentType: 'application/json', body: JSON.stringify({ success: false, code: 'review-failed', error: 'x' }) }),
+        { times: 1 });
+    await page.goto(review);
+    await expect(main(page).getByRole('alert')).toHaveText('The review queue could not be read.');
+    await main(page).getByRole('button', { name: 'Retry', exact: true }).click();
+    await expect(context(page)).toBeEnabled();
+    await expect(main(page).locator('.notice h2')).toHaveText('1 image needs a decision');
+});
+
+test('an association conflict keeps the selection and explains', async ({ page, request }) => {
+    await seed(request, 1);
+    await open(page);
+    await page.route(url => /\/decision$/.test(url.pathname), route => route.fulfill({ status: 409, contentType: 'application/json',
+        body: JSON.stringify({ success: false, code: 'association-conflict', error: 'This image is already linked to another prompt or negative, so this sampler path cannot be attached safely. The existing links were preserved.' }) }),
+        { times: 1 });
+    await panel(page).getByRole('button', { name: 'Apply association', exact: true }).click();
+    await expect(panel(page).locator('.warning-note')).toHaveText(/already linked to another prompt/);
+    await expect(page).toHaveURL(/#\/review$/);
+    await expect(context(page)).toBeEnabled();
+    expect(await pending(request)).toBe(1);
+});

tests/browser/workspace-saved-views.spec.mjs

@@ -372,7 +372,7 @@ test('Favorites is the first SAVED VIEWS row, with a real count that follows eve
     expect(await favoritesRow(page).evaluate(link => [...link.childNodes].map(node => node.nodeType === Node.TEXT_NODE
         ? `text:${node.textContent}` : `${node.localName}.${node.getAttribute('class')}`)))
         .toEqual(['svg.icon', 'text:Favorites', 'span.nav-count']);
-    expect(await savedNav(page).locator('a').evaluateAll(links => links.map(link => link.dataset.route))).toEqual(['favorites']);
+    expect(await savedNav(page).locator('a').evaluateAll(links => links.map(link => link.dataset.route))).toEqual(['favorites', 'review']);
 
     await star(page, '1:shared/same.png');
     await expect(toast(page)).toHaveText('Added to favorites.');

tests/browser/workspace.spec.mjs

@@ -21,6 +21,8 @@ const routes = [
     ['system', 'System', '/prompt_manager/admin'],
     // #249 D51: SAVED VIEWS' Favorites, Images filtered to favorites.
     ['favorites', 'Favorites', null],
+    // #249 PR F (ruling R5): SAVED VIEWS' Needs review, the concept's Metadata review page (its own heading).
+    ['review', 'Needs review', null, 'Metadata review'],
     // #249 Activity-1: the concept's Activity page in the tools-and-system group.
     ['activity', 'Activity', null],
 ];
@@ -76,10 +78,10 @@ test('workspace starts with real persisted statistics without mutating data', as
 });
 
 test('all shell destinations deep-link, reload and expose working existing applications', async ({ page, request }) => {
-    for (const [route, label, legacy] of routes) {
+    for (const [route, label, legacy, title = label] of routes) {
         await page.goto(`${workspace}#/${route}`);
         const main = page.locator('#workspace-main');
-        await expect(main.getByRole('heading', { level: 1, name: label, exact: true })).toBeVisible();
+        await expect(main.getByRole('heading', { level: 1, name: title, exact: true })).toBeVisible();
         await expect(sidebarLink(page, label)).toHaveAttribute('aria-current', 'page');
         if (route === 'tags' || route === 'inspect') await expect(main.locator('.handoff')).toHaveCount(0);
         if (route === 'inspect') await expect(main.locator('#local-file')).toBeAttached();
@@ -88,7 +90,7 @@ test('all shell destinations deep-link, reload and expose working existing appli
             await expect(await request.get(legacy.split('#')[0])).toBeOK();
         }
         await page.reload();
-        await expect(main.getByRole('heading', { level: 1, name: label, exact: true })).toBeVisible();
+        await expect(main.getByRole('heading', { level: 1, name: title, exact: true })).toBeVisible();
     }
     // D29 and #249 E3: the legacy gallery and Library are reached from Overview's tool cards, not from their pages.
     await page.goto(`${workspace}#/overview`);
@@ -308,9 +310,9 @@ test('overview reports loading, offers retry after failure and renders real empt
 test('small screens keep navigation and the theme accessible without horizontal page overflow', async ({ page }) => {
     await page.setViewportSize({ width: 375, height: 812 });
     await page.goto(`${workspace}#/overview`);
-    for (const [, label] of routes) {
+    for (const [, label, , title = label] of routes) {
         await sidebarLink(page, label).click();
-        await expect(page.locator('#workspace-main h1')).toHaveText(label);
+        await expect(page.locator('#workspace-main h1')).toHaveText(title);
     }
     await expect(page.getByRole('combobox', { name: 'Theme', exact: true })).toBeVisible();
     expect(await page.evaluate(() => document.documentElement.scrollWidth <= window.innerWidth)).toBe(true);

tests/browser/workspace_activity_fixture.py

@@ -131,6 +131,12 @@ def register_activity_commands(app, routes, api):
                 scope={
                     "files": str(data.get("files", "new")),
                     "output_folders": count(data.get("output_folders"), 2),
+                    # A real scan's count of files it added to Needs review.
+                    **(
+                        {"review_items": count(data["review_items"])}
+                        if "review_items" in data
+                        else {}
+                    ),
                 },
                 runner=fake_runner(ending),
                 groups=SCAN_GROUP_NAMES,

tests/browser/workspace_review_fixture.py

@@ -0,0 +1,116 @@
+"""Owned, deterministic Needs review items for the workspace page (#249 PR F).
+
+Each file is a PNG whose workflow has two samplers with their own positive
+encoders and one shared negative, so the resolver finds it ``ambiguous``; it
+is recorded through the real recorder (``record_review_file``), exactly as the
+live monitor records a new output. No path or SQL comes from a request.
+"""
+
+from __future__ import annotations
+
+import json
+import os
+from pathlib import Path
+import shutil
+import time
+from typing import TYPE_CHECKING
+
+from aiohttp import web
+from PIL import Image
+from PIL.PngImagePlugin import PngInfo
+
+if TYPE_CHECKING:
+    from py.api import PromptManagerAPI
+
+POSITIVES = ("Golden dunes at dusk", "Harbor lights at night")
+NEGATIVE = "Soft negative, blur"
+# More than one queue page (40), so Load more has a second page.
+MAX_ITEMS = 45
+_TABLES = (
+    "saved_views",
+    "image_favorites",
+    "media_review_decisions",
+    "media_review_items",
+    "media_image_tags",
+    "media_annotation_bytes",
+    "media_annotation_files",
+    "image_prompt_pairs",
+    "prompt_pair_tags",
+    "prompt_pairs",
+    "generated_images",
+    "prompt_tags",
+    "tags",
+    "prompt_library_state",
+    "prompts",
+)
+
+
+def _graph() -> dict:
+    graph = {
+        "1": {"class_type": "CheckpointLoaderSimple", "inputs": {"ckpt_name": "m"}},
+        "2": {"class_type": "CLIPTextEncode", "inputs": {"text": NEGATIVE}},
+    }
+    for index, text in enumerate(POSITIVES):
+        encoder, sampler = str(10 + 2 * index), str(11 + 2 * index)
+        graph[encoder] = {"class_type": "CLIPTextEncode", "inputs": {"text": text}}
+        graph[sampler] = {
+            "class_type": "KSampler",
+            "inputs": {
+                "model": ["1", 0],
+                "positive": [encoder, 0],
+                "negative": ["2", 0],
+            },
+        }
+    return graph
+
+
+def _png(path: Path, colour: tuple[int, int, int]) -> None:
+    info = PngInfo()
+    info.add_text("prompt", json.dumps(_graph()))
+    path.parent.mkdir(parents=True, exist_ok=True)
+    with Image.new("RGB", (96, 64), colour) as image:
+        image.save(path, pnginfo=info)
+
+
+def seed_review(api: PromptManagerAPI, root: Path, items: int) -> dict:
+    """Replace this server's disposable rows and files with ``items`` queued files."""
+    with api.db.model.get_connection() as conn:
+        for table in _TABLES:
+            conn.execute(f"DELETE FROM {table}")
+    api.close_annotation_captures()
+    for name in ("output", "input"):
+        shutil.rmtree(root / name)
+        (root / name).mkdir()
+    output = root / "output"
+    now = time.time()
+    files = []
+    for number in range(items):
+        relative = f"review/review_{number:04}.png"
+        _png(output / relative, (40 + number * 4, 90, 140))
+        stamp = now - 60 - number
+        os.utime(output / relative, (stamp, stamp))
+        outcome = api.record_review_file(str(output / relative))
+        if outcome != "recorded":
+            raise RuntimeError(f"{relative} was not recorded: {outcome}")
+        files.append({"path": relative, "filename": Path(relative).name})
+    api.invalidate_gallery_cache()
+    return {"files": files, "positives": list(POSITIVES), "negative": NEGATIVE}
+
+
+def register_review_commands(
+    routes: web.RouteTableDef, api: PromptManagerAPI, root: Path
+) -> None:
+    """``POST /__test__/review/reset {items}``: the fixed queue, 0 to MAX_ITEMS."""
+
+    @routes.post("/__test__/review/reset")
+    async def reset(request: web.Request) -> web.Response:
+        data = await request.json() if request.can_read_body else {}
+        if request.query or not isinstance(data, dict) or set(data) - {"items"}:
+            raise web.HTTPBadRequest()
+        items = data.get("items", 3)
+        if isinstance(items, bool) or not isinstance(items, int):
+            raise web.HTTPBadRequest()
+        if not 0 <= items <= MAX_ITEMS:
+            raise web.HTTPBadRequest()
+        manifest = await api._run_in_executor(seed_review, api, root, items)
+        return web.json_response({"success": True, **manifest})

tests/js/workspace-review-state.test.js

@@ -0,0 +1,343 @@
+// Run with: node --test tests/js/workspace-review-state.test.js
+const test = require('node:test');
+const assert = require('node:assert/strict');
+const { createApiClient } = require('../../web/js/api-client.js');
+
+// Only an absent module is tolerated, so RED is an assertion failure, not a crash.
+const source = import('../../web/js/workspace/review-state.mjs').catch(error => {
+    if (error.code !== 'ERR_MODULE_NOT_FOUND') throw error;
+    return {};
+});
+async function load() {
+    const module = await source;
+    assert.equal(typeof module.createReviewController, 'function', 'review-state.mjs is not implemented');
+    return module;
+}
+
+const EPOCH = '11111111-1111-4111-8111-111111111111';
+const SCOPE = 'c'.repeat(64);
+const SHA = 'd'.repeat(64);
+const PRINT = 'e'.repeat(64);
+const HASH_A = 'a'.repeat(64);
+const HASH_B = 'b'.repeat(64);
+const HASH_C = 'f'.repeat(64);
+const ITEMS = '/prompt_manager/review/items';
+const OBSERVE = '/prompt_manager/image-annotations/observe';
+const CAPTURE = '/prompt_manager/image-annotations/capture/';
+
+const flush = () => new Promise(resolve => setImmediate(resolve));
+async function settle(times = 8) { for (let i = 0; i < times; i++) await flush(); }
+function response(status, body) {
+    return { ok: status >= 200 && status < 300, status, statusText: `Status ${status}`, json: async () => body };
+}
+const fail = (status, code, error = `failure ${code}`, extra = {}) => response(status, { success: false, code, error, ...extra });
+
+function item(id, overrides = {}) {
+    const path = `dunes/${id}.png`;
+    return {
+        id, state: 'pending', revision: 0, created_at: `2026-10-22T10:00:0${id.length}+00:00`, filename: `${id}.png`,
+        target: { root_index: 0, root_scope: SCOPE, path }, unavailable: false, candidate_count: 3, limited: false,
+        url: `/prompt_manager/images/serve/${path}?root=0&root_scope=${SCOPE}`, is_video: false, ...overrides,
+    };
+}
+const candidate = (hash, sampler, label, positive, negative, state = 'resolved') => ({
+    hash, sampler_id: sampler, state, reason: '', label,
+    positive: positive === null ? null : { text: positive }, negative: negative === null ? null : { text: negative },
+});
+function detailOf(entry, overrides = {}) {
+    return {
+        success: true, library_epoch: EPOCH, ...entry, total: 2, sha256: SHA, dependency_fingerprint: PRINT,
+        candidates: [
+            candidate(HASH_C, '9', 'No positive / Soft negative', null, 'blur', 'unresolved'),
+            candidate(HASH_A, '12', 'Dunes / Soft negative', 'golden dunes', 'blur'),
+            candidate(HASH_B, '28', 'Dunes / Harsh negative', 'golden dunes', 'noise'),
+        ],
+        ...overrides,
+    };
+}
+const page = (items, overrides = {}) => ({ success: true, library_epoch: EPOCH, total: items.length, items, next_cursor: null, ...overrides });
+const observed = (token = 'capture-1') => ({
+    success: true, library_epoch: EPOCH, target: item('one').target, filename: 'one.png', title: 'one.png', tags: [], tag_revision: 0,
+    capture: { token, sha256: SHA, preview_url: CAPTURE + token, size: 10, width: 8, height: 8, media_type: 'image',
+        expires_at: '2026-10-22T12:00:00+00:00', generate: { supported: true, reason: null } },
+});
+
+/** Real createApiClient over a fetch whose answers come from routes['METHOD path'](call). */
+function harness(routes = {}) {
+    const calls = [];
+    const fetch = (url, init = {}) => {
+        const call = { url, method: init.method, body: init.body === undefined ? undefined : JSON.parse(init.body) };
+        calls.push(call);
+        const path = url.startsWith(CAPTURE) ? CAPTURE : url.split('?')[0];
+        const route = routes[`${call.method} ${path}`];
+        return new Promise((resolve, reject) => {
+            init.signal?.addEventListener('abort', () => reject(new DOMException('Aborted', 'AbortError')));
+            Promise.resolve().then(() => (route ? route(call) : response(200, { success: true }))).then(resolve, reject);
+        });
+    };
+    return {
+        api: createApiClient(fetch), calls,
+        of: (method, prefix) => calls.filter(call => call.method === method && call.url.startsWith(prefix)),
+    };
+}
+const QUEUE = [item('one'), item('two')];
+function routes(extra = {}) {
+    return {
+        [`GET ${ITEMS}`]: () => response(200, page(QUEUE)),
+        [`GET ${ITEMS}/one`]: () => response(200, detailOf(QUEUE[0])),
+        [`GET ${ITEMS}/two`]: () => response(200, detailOf(QUEUE[1], { candidates: [], limited: true, candidate_count: 0 })),
+        [`POST ${OBSERVE}`]: () => response(200, observed()),
+        [`POST ${ITEMS}/one/decision`]: call => response(200, { success: true, library_epoch: EPOCH, total: 1,
+            item: { ...QUEUE[0], state: call.body.choice === 'unresolved' ? 'unresolved' : 'selected', revision: 1 } }),
+        ...extra,
+    };
+}
+async function loaded(extra) {
+    const { createReviewController } = await load();
+    const h = harness(routes(extra));
+    const c = createReviewController({ api: h.api });
+    await c.load();
+    await settle();
+    return { c, h };
+}
+
+test('notice titles for 0, 1 and 3', async () => {
+    const { noticeTitle } = await load();
+    assert.equal(noticeTitle(0), 'No images need a decision');
+    assert.equal(noticeTitle(1), '1 image needs a decision');
+    assert.equal(noticeTitle(3), '3 images need a decision');
+    assert.equal(noticeTitle(1234), '1,234 images need a decision');
+});
+
+test('loads pending items and the exact count', async () => {
+    const { c, h } = await loaded();
+    assert.equal(c.state.status, 'ready');
+    assert.equal(c.state.total, 2);
+    assert.deepEqual(c.state.items.map(entry => entry.id), ['one', 'two']);
+    const [list] = h.of('GET', ITEMS);
+    assert.equal(list.url, `${ITEMS}?limit=40`);
+    // The first item is selected, as the concept selects its first queue image.
+    assert.equal(c.state.selectedId, 'one');
+    assert.ok(Object.isFrozen(c.state));
+});
+
+test('selecting a card loads detail and option labels, first workable preselected, unusable disabled', async () => {
+    const { c } = await loaded();
+    assert.equal(c.state.detailStatus, 'ready');
+    assert.deepEqual(c.state.options.map(option => [option.label, option.disabled]), [
+        ['Sampler 9 · No positive / Soft negative', true],
+        ['Sampler 12 · Dunes / Soft negative', false],
+        ['Sampler 28 · Dunes / Harsh negative', false],
+        ['Leave unresolved', false],
+    ]);
+    assert.equal(c.state.options.at(-1).value, 'unresolved');
+    assert.equal(c.state.choice, HASH_A);
+    assert.deepEqual(c.state.prompts, { positive: { status: 'resolved', text: 'golden dunes' }, negative: { status: 'resolved', text: 'blur' } });
+    c.choose(HASH_C);
+    assert.equal(c.state.choice, HASH_A, 'a disabled option cannot be chosen');
+    c.choose(HASH_B);
+    assert.equal(c.state.prompts.negative.text, 'noise');
+    c.choose('unresolved');
+    assert.equal(c.state.prompts.positive.status, 'ambiguous');
+    await c.select('two');
+    await settle();
+    assert.equal(c.state.selectedId, 'two');
+    assert.deepEqual(c.state.options.map(option => option.label), ['Leave unresolved']);
+    assert.equal(c.state.choice, 'unresolved');
+    assert.match(c.state.warning, /too many sampler paths/i);
+});
+
+test('apply sends the selected candidate hash or unresolved with a fresh capture', async () => {
+    const { c, h } = await loaded();
+    c.choose(HASH_B);
+    const done = await c.apply();
+    assert.equal(done, true);
+    const [observe] = h.of('POST', OBSERVE);
+    assert.deepEqual(observe.body, { target: QUEUE[0].target });
+    const [decision] = h.of('POST', `${ITEMS}/one/decision`);
+    assert.deepEqual(decision.body, { expected_epoch: EPOCH, expected_revision: 0, capture_token: 'capture-1', sha256: SHA,
+        dependency_fingerprint: PRINT, choice: HASH_B });
+    assert.equal(c.state.phase, 'done');
+    assert.equal(c.state.total, 1);
+    assert.equal(c.state.toast, 'Association accepted.');
+    // The server releases a used capture itself.
+    assert.equal(h.of('DELETE', CAPTURE).length, 0);
+
+    const again = await loaded();
+    again.c.choose('unresolved');
+    assert.equal(await again.c.apply(), true);
+    const [unresolved] = again.h.of('POST', `${ITEMS}/one/decision`);
+    assert.equal(unresolved.body.choice, 'unresolved');
+    assert.equal(unresolved.body.capture_token, 'capture-1');
+    assert.equal(again.c.state.toast, 'Left unresolved.');
+});
+
+test('an unavailable file can only be left unresolved, without a capture', async () => {
+    const gone = item('one', { target: null, unavailable: true, url: null });
+    const { c, h } = await loaded({
+        [`GET ${ITEMS}`]: () => response(200, page([gone])),
+        [`GET ${ITEMS}/one`]: () => response(200, detailOf(gone)),
+    });
+    assert.ok(c.state.options.slice(0, -1).every(option => option.disabled));
+    assert.equal(c.state.choice, 'unresolved');
+    assert.match(c.state.warning, /not under a current image source/i);
+    assert.equal(await c.apply(), true);
+    assert.equal(h.of('POST', OBSERVE).length, 0);
+    const [decision] = h.of('POST', `${ITEMS}/one/decision`);
+    assert.equal(decision.body.capture_token, null);
+    assert.equal(decision.body.sha256, SHA);
+});
+
+test('association conflict keeps the selection and shows the inline warning', async () => {
+    const message = 'This image is already linked to another prompt or negative, so this sampler path cannot be attached safely.';
+    const { c, h } = await loaded({ [`POST ${ITEMS}/one/decision`]: () => fail(409, 'association-conflict', message) });
+    assert.equal(await c.apply(), false);
+    assert.equal(c.state.selectedId, 'one');
+    assert.equal(c.state.choice, HASH_A);
+    assert.equal(c.state.phase, 'idle');
+    assert.equal(c.state.warning, message);
+    // The refused decision's capture is released.
+    assert.equal(h.of('DELETE', CAPTURE).length, 1);
+    assert.equal(h.of('GET', `${ITEMS}?`).length, 1, 'no reload');
+});
+
+test('storage-changed requires reload', async () => {
+    let lists = 0;
+    const { c, h } = await loaded({
+        [`GET ${ITEMS}`]: () => { lists += 1; return response(200, page(QUEUE)); },
+        [`POST ${ITEMS}/one/decision`]: () => fail(409, 'storage-changed', 'Prompt storage was restored; reload the review queue.'),
+    });
+    assert.equal(await c.apply(), false);
+    await settle();
+    assert.equal(lists, 2, 'the queue is read again under the new epoch');
+    assert.equal(c.state.warning, 'Prompt storage was restored; reload the review queue.');
+    assert.equal(c.state.canRetry, false);
+    assert.equal(h.of('DELETE', CAPTURE).length, 1);
+});
+
+test('lost response keeps the selection and retry resends once', async () => {
+    let attempts = 0;
+    const { c, h } = await loaded({
+        [`POST ${ITEMS}/one/decision`]: call => {
+            attempts += 1;
+            if (attempts === 1) return Promise.reject(new TypeError('Failed to fetch'));
+            return response(200, { success: true, library_epoch: EPOCH, total: 1, item: { ...QUEUE[0], state: 'selected', revision: 1 } });
+        },
+    });
+    assert.equal(await c.apply(), false);
+    assert.equal(c.state.selectedId, 'one');
+    assert.equal(c.state.canRetry, true);
+    assert.match(c.state.warning, /may not have been saved/i);
+    assert.equal(h.of('DELETE', CAPTURE).length, 0, 'the capture is kept for the retry');
+    const [first] = h.of('POST', `${ITEMS}/one/decision`);
+    assert.equal(await c.retry(), true);
+    const sent = h.of('POST', `${ITEMS}/one/decision`);
+    assert.equal(sent.length, 2);
+    assert.deepEqual(sent[1].body, first.body, 'the identical decision is resent');
+    assert.equal(h.of('POST', OBSERVE).length, 1, 'no second capture');
+    assert.equal(await c.retry(), false, 'nothing left to resend');
+    assert.equal(h.of('POST', `${ITEMS}/one/decision`).length, 2);
+});
+
+test('a retry answered by review-conflict reloads the queue', async () => {
+    let attempts = 0, lists = 0;
+    const { c } = await loaded({
+        [`GET ${ITEMS}`]: () => { lists += 1; return response(200, page(lists === 1 ? QUEUE : [QUEUE[1]])); },
+        [`POST ${ITEMS}/one/decision`]: () => {
+            attempts += 1;
+            if (attempts === 1) return Promise.reject(new TypeError('Failed to fetch'));
+            return fail(409, 'review-conflict', 'This item was decided or changed since it was opened. Reload the queue.');
+        },
+    });
+    await c.apply();
+    assert.equal(await c.retry(), false);
+    await settle();
+    assert.equal(lists, 2);
+    assert.equal(c.state.selectedId, 'two');
+});
+
+test('a review-conflict on a still pending item reads its detail again', async () => {
+    let details = 0, decisions = 0;
+    const { c, h } = await loaded({
+        [`GET ${ITEMS}/one`]: () => { details += 1; return response(200, detailOf({ ...QUEUE[0], revision: details - 1 })); },
+        [`POST ${ITEMS}/one/decision`]: () => {
+            decisions += 1;
+            return decisions === 1 ? fail(409, 'review-conflict', 'This item was decided or changed since it was opened. Reload the queue.')
+                : response(200, { success: true, library_epoch: EPOCH, total: 1, item: { ...QUEUE[0], state: 'selected', revision: 2 } });
+        },
+    });
+    assert.equal(await c.apply(), false);
+    await settle();
+    assert.equal(details, 2, 'the item is read again');
+    assert.equal(c.state.detail.revision, 1);
+    assert.equal(c.state.warning, 'This item was decided or changed since it was opened. Reload the queue.');
+    assert.equal(await c.apply(), true);
+    assert.equal(h.of('POST', `${ITEMS}/one/decision`).at(-1).body.expected_revision, 1);
+});
+
+test('leave for later writes nothing', async () => {
+    const { c, h } = await loaded();
+    c.leave();
+    assert.equal(c.state.phase, 'done');
+    assert.equal(c.state.toast, null);
+    assert.equal(h.of('POST', '/').length, 0);
+    assert.equal(h.of('DELETE', '/').length, 0);
+});
+
+test('load more pages with the cursor and keeps the selection', async () => {
+    const more = [item('three')];
+    const { c, h } = await loaded({
+        [`GET ${ITEMS}`]: call => response(200, call.url.includes('cursor=')
+            ? page(more, { total: 3 }) : page(QUEUE, { total: 3, next_cursor: 'abc_-1' })),
+    });
+    assert.equal(c.state.nextCursor, 'abc_-1');
+    await c.loadMore();
+    assert.equal(h.of('GET', ITEMS).at(-1).url, `${ITEMS}?limit=40&cursor=abc_-1`);
+    assert.deepEqual(c.state.items.map(entry => entry.id), ['one', 'two', 'three']);
+    assert.equal(c.state.nextCursor, null);
+    assert.equal(c.state.selectedId, 'one');
+});
+
+test('a failed queue read is an error state and load retries', async () => {
+    let lists = 0;
+    const { c } = await loaded({ [`GET ${ITEMS}`]: () => { lists += 1; return lists === 1 ? fail(500, 'review-failed') : response(200, page(QUEUE)); } });
+    assert.equal(c.state.status, 'error');
+    await c.load();
+    await settle();
+    assert.equal(c.state.status, 'ready');
+});
+
+test('tag save toast carries the review suffix and the item stays pending', async () => {
+    const { c, h } = await loaded({
+        ['GET /prompt_manager/autotag/models']: () => response(200, { success: true, models: {}, default_prompt: 'x',
+            wd14_general_threshold: 0.35, wd14_character_threshold: 0.85, suggestion_limit: 10 }),
+        ['PUT /prompt_manager/image-annotations/tags']: call => response(200, { success: true, library_epoch: EPOCH, sha256: SHA,
+            tags: call.body.tags, tag_revision: 1, replayed: false }),
+    });
+    const { createImageTaggingController } = await import('../../web/js/workspace/image-tagging-state.mjs');
+    const before = h.calls.filter(call => call.url.startsWith(ITEMS)).length;
+    // The Tag dialog opened from Needs review is the shared controller with the review source.
+    const tagging = createImageTaggingController({ api: h.api, target: QUEUE[0].target, source: 'review' });
+    assert.equal(tagging.state.showScopeNote, true);
+    await tagging.open();
+    await settle();
+    tagging.setManual('dunes');
+    await tagging.save();
+    await settle();
+    assert.equal(tagging.state.toast, '1 tags saved for one.png. Prompt association still awaits review.');
+    tagging.dispose();
+    assert.equal(h.calls.filter(call => call.url.startsWith(ITEMS)).length, before, 'a tag save neither decides nor re-reads the queue');
+    assert.deepEqual(c.state.items.map(entry => [entry.id, entry.state]), [['one', 'pending'], ['two', 'pending']]);
+    assert.equal(c.state.phase, 'idle');
+});
+
+test('dispose releases a kept capture and stops reads', async () => {
+    const { c, h } = await loaded({ [`POST ${ITEMS}/one/decision`]: () => Promise.reject(new TypeError('Failed to fetch')) });
+    await c.apply();
+    c.dispose();
+    await settle();
+    const released = h.of('DELETE', CAPTURE);
+    assert.equal(released.length, 1);
+    assert.equal(released[0].url, CAPTURE + 'capture-1');
+    assert.equal(await c.retry(), false);
+});

tests/js/workspace-state.test.js

@@ -4,7 +4,7 @@ const source = import('../../web/js/workspace/state.mjs');
 
 test('workspace routes resolve only supported deep links', async () => {
     const { resolveRoute } = await source;
-    for (const route of ['overview', 'images', 'library', 'tags', 'inspect', 'system', 'activity']) {
+    for (const route of ['overview', 'images', 'library', 'tags', 'inspect', 'system', 'activity', 'review']) {
         assert.equal(resolveRoute(`#/${route}`).id, route);
     }
     for (const hash of ['', '#', '#/unknown', '#/images/other', '#/<script>', '#/activity/abc', `#/activity/${'A'.repeat(32)}`]) {
@@ -23,7 +23,7 @@ test('tags is a native route titled Tags; only unbuilt routes hand off to legacy
         assert.equal(routeTitle(route), route.label);
     }
     assert.equal(routeTitle(resolveRoute('#/library/7')), 'Prompt library');
-    for (const id of ['images', 'library', 'tags', 'inspect', 'overview', 'activity']) assert.equal(isHandoff(resolveRoute(`#/${id}`)), false, id);
+    for (const id of ['images', 'library', 'tags', 'inspect', 'overview', 'activity', 'review']) assert.equal(isHandoff(resolveRoute(`#/${id}`)), false, id);
     for (const id of ['system']) assert.equal(isHandoff(resolveRoute(`#/${id}`)), true, id);
 });
 
@@ -115,9 +115,10 @@ test('positive library deep links preserve the selected identity without duplica
 
 test('nav counts reject negative, non-integer and missing totals', async () => {
     const { summarizeNavCounts } = await source;
-    const counts = summarizeNavCounts({images: {total: 24}, favorites: {total: 3}, library: {total: 0}, tags: {total: 7}});
+    const counts = summarizeNavCounts({images: {total: 24}, favorites: {total: 3}, library: {total: 0}, tags: {total: 7},
+        review: {total: 3}});
     assert.ok(counts instanceof Map);
-    assert.deepEqual([...counts], [['images', 24], ['favorites', 3], ['library', 0], ['tags', 7]]);
+    assert.deepEqual([...counts], [['images', 24], ['favorites', 3], ['library', 0], ['tags', 7], ['review', 3]]);
     assert.equal(counts.has('inspect'), false, 'Inspect a file has no count');
     for (const invalid of [undefined, null, {}, {total: -1}, {total: 1.5}, {total: '3'}, {total: NaN},
         {total: Infinity}, {total: Number.MAX_SAFE_INTEGER + 1}, {total: null}, [], 'x']) {
@@ -127,7 +128,8 @@ test('nav counts reject negative, non-integer and missing totals', async () => {
         assert.equal(result.get('library'), 2);
         assert.equal(result.get('tags'), null);
     }
-    assert.deepEqual([...summarizeNavCounts()], [['images', null], ['favorites', null], ['library', null], ['tags', null]]);
+    assert.deepEqual([...summarizeNavCounts()], [['images', null], ['favorites', null], ['library', null], ['tags', null],
+        ['review', null]]);
 });
 
 test('nav counts settle independently so a slow images read never delays the others', async () => {
@@ -143,14 +145,14 @@ test('nav counts settle independently so a slow images read never delays the oth
     const settled = [];
     const done = loadNavCounts(api, new AbortController().signal, (id, count) => settled.push([id, count]));
     await new Promise(resolve => setTimeout(resolve, 0));
-    assert.deepEqual(settled.sort(), [['favorites', 2], ['library', 3], ['tags', null]]);
+    assert.deepEqual(settled.sort(), [['favorites', 2], ['library', 3], ['review', null], ['tags', null]]);
     releaseImages({success: true, total: 40});
     const counts = await done;
     assert.deepEqual(settled.at(-1), ['images', 40]);
-    assert.deepEqual([...counts], [['images', 40], ['favorites', 2], ['library', 3], ['tags', null]]);
+    assert.deepEqual([...counts], [['images', 40], ['favorites', 2], ['library', 3], ['tags', null], ['review', null]]);
 });
 
-test('nav counts issue four bounded requests and drop only the failed count', async () => {
+test('nav counts issue five bounded requests and drop only the failed count', async () => {
     const { loadNavCounts } = await source;
     const calls = [];
     const signal = new AbortController().signal;
@@ -158,13 +160,15 @@ test('nav counts issue four bounded requests and drop only the failed count', as
         calls.push([url, options.signal]);
         if (url.startsWith('/prompt_manager/library')) throw new Error('Unavailable');
         if (url.startsWith('/prompt_manager/vocabulary/tags')) return {success: true, total: 5};
+        if (url.startsWith('/prompt_manager/review/items')) return {success: true, total: 2};
         return {success: true, total: 12};
     }};
     const counts = await loadNavCounts(api, signal);
-    assert.deepEqual([...counts], [['images', 12], ['favorites', 12], ['library', null], ['tags', 5]]);
+    assert.deepEqual([...counts], [['images', 12], ['favorites', 12], ['library', null], ['tags', 5], ['review', 2]]);
     const urls = calls.map(([url]) => new URL(url, 'http://host'));
     assert.deepEqual(urls.map(url => url.pathname),
-        ['/prompt_manager/images/output', '/prompt_manager/images/output', '/prompt_manager/library', '/prompt_manager/vocabulary/tags']);
+        ['/prompt_manager/images/output', '/prompt_manager/images/output', '/prompt_manager/library', '/prompt_manager/vocabulary/tags',
+            '/prompt_manager/review/items']);
     for (const url of urls) assert.equal(url.searchParams.get('limit'), '1');
     assert.equal(urls[0].searchParams.get('mode'), 'workspace');
     assert.equal(urls[0].searchParams.has('favorites'), false);
@@ -246,3 +250,22 @@ test('saved-view links resolve to their id and re-render only when the id change
     assert.deepEqual(seen,[['saved',3],['saved',4],['images',undefined]]);
     dispose();
 });
+
+test('Needs review is a native SAVED VIEWS route titled Review, with its own count', async () => {
+    const { resolveRoute, isHandoff, routeTitle, routes, loadNavCounts, REVIEW_WRITE_COUNTS, NAV_COUNT_ROUTES } = await source;
+    const route = resolveRoute('#/review');
+    assert.equal(route.id, 'review');
+    assert.equal(route.label, 'Needs review');
+    assert.equal(routeTitle(route), 'Review');
+    assert.equal(isHandoff(route), false);
+    // No href: Overview lists no legacy card for it.
+    assert.equal(routes.find(item => item.id === 'review').href, undefined);
+    assert.ok(NAV_COUNT_ROUTES.includes('review'));
+    assert.deepEqual([...REVIEW_WRITE_COUNTS], ['review']);
+    assert.ok(Object.isFrozen(REVIEW_WRITE_COUNTS));
+    const calls = [];
+    const api = {get: async url => { calls.push(url); return {success: true, total: 4}; }};
+    const counts = await loadNavCounts(api, new AbortController().signal, () => {}, REVIEW_WRITE_COUNTS);
+    assert.deepEqual(calls, ['/prompt_manager/review/items?limit=1']);
+    assert.deepEqual([...counts], [['review', 4]]);
+});

tests/test_api_review.py

@@ -178,12 +178,21 @@ class TestQueueReads(ReviewRoutesTestCase):
                 "unavailable",
                 "candidate_count",
                 "limited",
+                "url",
+                "is_video",
             },
         )
         self.assertEqual(
             (item["state"], item["revision"], item["filename"]),
             ("pending", 0, "f0.png"),
         )
+        # The card's media URL, formatted like the Images listing's (no stat).
+        scope = item["target"]["root_scope"]
+        self.assertEqual(
+            item["url"],
+            f"/prompt_manager/images/serve/f0.png?root=0&root_scope={scope}",
+        )
+        self.assertIs(item["is_video"], False)
         self.assertEqual(item["candidate_count"], 2)
         self.assertIs(item["unavailable"], False)
         self.assertEqual(item["target"]["path"], "f0.png")
@@ -364,6 +373,7 @@ class TestQueueReads(ReviewRoutesTestCase):
             (item["unavailable"], item["target"], item["filename"]),
             (True, None, "two.png"),
         )
+        self.assertEqual((item["url"], item["is_video"]), (None, False))
         detail = await self._detail(item["id"])
         self.assertIs(detail["unavailable"], True)
         self._no_paths()

tools/vendor/frontend-coverage-baseline.json

@@ -174,10 +174,10 @@
     "statements": 98
   },
   "workspace/activity.mjs": {
-    "lines": 95,
-    "branches": 87,
+    "lines": 96,
+    "branches": 88,
     "functions": 98,
-    "statements": 95
+    "statements": 96
   },
   "workspace/file-inspector.mjs": {
     "lines": 96,
@@ -215,6 +215,12 @@
     "functions": 98,
     "statements": 98
   },
+  "workspace/image-card.mjs": {
+    "lines": 98,
+    "branches": 98,
+    "functions": 98,
+    "statements": 98
+  },
   "workspace/image-layout.mjs": {
     "lines": 98,
     "branches": 98,
@@ -383,6 +389,18 @@
     "functions": 80,
     "statements": 95
   },
+  "workspace/review-state.mjs": {
+    "lines": 94,
+    "branches": 77,
+    "functions": 98,
+    "statements": 94
+  },
+  "workspace/review.mjs": {
+    "lines": 96,
+    "branches": 84,
+    "functions": 90,
+    "statements": 96
+  },
   "workspace/saved-views.mjs": {
     "lines": 98,
     "branches": 95,

web/js/workspace/activity-job-view.mjs

@@ -3,7 +3,8 @@
  * concept's classes.
  *
  * - Header: the page heading names the job; its line is the Activity item's (D54), and its actions are Download report
- *   (the job's JSON report, D59) and, while the job runs, "Cancel scan" (danger).
+ *   (the job's JSON report, D59) and, while the job runs, "Cancel scan" (danger). D87: an ended scan that recorded
+ *   Needs review items adds the concept's **Review metadata** after Download report.
  * - Progress (`section.surface`): `<progress>`, the server's "Processing file N of M · about X min left", and the
  *   outcome counters as `dl.stat-row` tiles: Added to Library (green), Already known, Needs review (warning), No usable
  *   metadata, Errors (red).
@@ -20,7 +21,7 @@ import { pageHeading } from './heading.mjs';
 import { showWorkspaceToast } from './toast.mjs';
 import { noun } from './plural.mjs';
 import { parseJob, JOBS_URL, LOST_DETAIL } from './activity-store.mjs';
-import { jobDetail, CANCEL_FAILED_TOAST } from './activity.mjs';
+import { jobDetail, CANCEL_FAILED_TOAST, createReviewMetadataButton, hasReviewItems } from './activity.mjs';
 import { downloadJobReport } from './activity-scan.mjs';
 import { createMediaViewer } from './media-viewer.mjs';
 import { createInspectionController } from './inspection-state.mjs';
@@ -124,6 +125,7 @@ export function mountActivityJobView(main, { store, scope, api, jobId }) {
     const parts = pageHeading(main);
     const download = createButton('Download report');
     const cancel = createButton('Cancel scan', 'danger');
+    const review = createReviewMetadataButton(scope); // D87
 
     const progressPart = section('Progress', 'job-progress-title');
     const status = element('span', '', 'small');
@@ -275,6 +277,8 @@ export function mountActivityJobView(main, { store, scope, api, jobId }) {
         const lost = job.state === 'lost';
         if (lost && document.activeElement === download) parts.h1.focus();
         download.disabled = lost;
+        if (hasReviewItems(job)) { if (!review.isConnected) download.after(review); } // D87
+        else review.remove();
         if (job.state === 'running') {
             if (!cancel.isConnected) parts.actions.append(cancel);
         } else if (cancel.isConnected) {

web/js/workspace/activity.mjs

@@ -11,6 +11,8 @@
  * - D54: each `.activity-item` is a real job. Its chip names the state (green "Completed", or blue "Running",
  *   "Cancelled", "Failed", "Ended"), its line says when and what, and a running job shows its `<progress>` and
  *   "Cancel job" (no "Simulate completion").
+ * - D87 (plan D64): an ended scan that recorded Needs review items carries the concept's **Review metadata**
+ *   (`go-review`, app.js a738) after its line, which opens `#/review`; its chip still names its state (D54).
  */
 import { createButton } from '../shared/toolkit/core.js';
 import { navigateTo } from './state.mjs';
@@ -23,6 +25,19 @@ export const ACTIVITY_DESCRIPTION = 'Scans, tagging, downloads and maintenance s
 export const EMPTY_ACTIVITY = 'No jobs have run since ComfyUI started. Scans and other long operations appear here.';
 export const LOAD_FAILED = 'Activity could not be read. It is tried again shortly.';
 export const CANCEL_FAILED_TOAST = 'The job could not be cancelled. Try again.';
+
+/** Whether an ended job recorded items for Needs review (a metadata scan's `scope.review_items`). */
+export function hasReviewItems(job) {
+    const count = job?.scope?.review_items;
+    return job?.state !== 'running' && Number.isSafeInteger(count) && count > 0;
+}
+
+/** The concept's **Review metadata** (D87): opens Needs review. */
+export function createReviewMetadataButton(scope) {
+    const button = createButton('Review metadata');
+    scope.listen(button, 'click', () => navigateTo('#/review'));
+    return button;
+}
 const CHIPS = Object.freeze({
     running: ['blue', 'Running'], finished: ['green', 'Completed'], cancelled: ['blue', 'Cancelled'],
     failed: ['blue', 'Failed'], lost: ['blue', 'Ended'],
@@ -120,6 +135,7 @@ function itemFor(job, scope) {
     const actions = element('div', undefined, 'row-actions');
     const cancel = createButton('Cancel job');
     actions.append(cancel);
+    const review = createReviewMetadataButton(scope); // D87
     item.append(heading, detail, progress, actions);
     scope.listen(cancel, 'click', async () => {
         if (cancel.getAttribute('aria-disabled') === 'true') return;
@@ -151,6 +167,8 @@ function itemFor(job, scope) {
             progress.remove();
             actions.remove();
         }
+        if (hasReviewItems(next)) { if (!review.isConnected) detail.after(review); } // D87
+        else review.remove();
     };
     return item;
 }

web/js/workspace/image-card.mjs

@@ -0,0 +1,79 @@
+/**
+ * The concept media card (docs/concepts/workspace/app.js `mediaCard` a396–399), shared by Images, every
+ * Library-embedded gallery and the Needs review queue: `article.media-card` > `.media-art` (the `.image-open` button
+ * holding the media, then `.image-overlays`) and `.media-info` (title, "W × H · EXT · Seed N", then
+ * `.image-card-actions` with Info and Tag). #249 D7–D11, D19.
+ */
+import { createButton } from '../shared/toolkit/core.js';
+import { cardTitle, cardSubtitle, imageKey, mediaRatio } from './images-state.mjs';
+import { createWorkspaceIcon } from './icons.mjs';
+import { createTagButton } from './image-tagging.mjs';
+import { paintStar } from './images-favorites.mjs';
+
+function el(tag, text, className) {
+    const node = document.createElement(tag);
+    if (text !== undefined) node.textContent = text;
+    if (className) node.className = className;
+    return node;
+}
+
+/** The card's media: a video's first frame when it has no thumbnail, else the thumbnail or the image. */
+export function cardMedia(image, lazy = false) {
+    const { resolveUrl } = window.ApiClient;
+    const video = image.is_video && !image.thumbnail_url;
+    const node = el(video ? 'video' : 'img');
+    node.src = resolveUrl(image.thumbnail_url || image.url);
+    if (video) { node.muted = true; node.playsInline = true; node.preload = 'metadata'; }
+    else {
+        // The concept card image: alt is the card title, with the listing's intrinsic size when known.
+        node.alt = cardTitle(image); node.decoding = 'async'; if (lazy) node.loading = 'lazy';
+        if ([image.width, image.height].every(value => Number.isFinite(value) && value > 0)) {
+            node.width = image.width; node.height = image.height;
+        }
+    }
+    return node;
+}
+
+/**
+ * One card for `image`. `checked` (a boolean) adds the D8 selection checkbox, `favoriteBusy` paints a pending star
+ * (D7, shown wherever the image reports `favorite`), and `media: false` leaves the open button empty for a file that
+ * cannot be served.
+ */
+export function createImageCard(image, { checked = null, favoriteBusy = false, media = true } = {}) {
+    const card = el('article', undefined, 'media-card');
+    card.dataset.imageKey = imageKey(image); card.setAttribute('role', 'listitem');
+    card.style.setProperty('--media-ratio', mediaRatio(image));
+    const art = el('div', undefined, 'media-art');
+    const open = createButton('', 'image-open');
+    open.setAttribute('aria-label', `Open ${image.filename}`);
+    if (media) open.append(cardMedia(image, true));
+    // D8: the selection checkbox (Images only: Library-embedded media has no selection bar), then D7: the star,
+    // wherever the listing reports favorites (Images and Library-embedded media).
+    const overlays = el('div', undefined, 'image-overlays');
+    if (typeof checked === 'boolean') {
+        const label = el('label'), box = el('input');
+        box.type = 'checkbox'; box.checked = checked;
+        box.setAttribute('aria-label', `Select ${image.filename}`);
+        label.append(box);
+        overlays.append(label);
+    }
+    if (typeof image.favorite === 'boolean') {
+        const star = createButton('', 'star-button');
+        star.setAttribute('aria-label', `Favorite ${image.filename}`);
+        paintStar(star, image.favorite, favoriteBusy);
+        overlays.append(star);
+    }
+    art.append(open, overlays);
+    const info = el('div', undefined, 'media-info');
+    const text = el('div');
+    const title = el('h3', cardTitle(image)); if (image.path) title.title = image.path;
+    text.append(title, el('p', cardSubtitle(image)));
+    const actions = el('div', undefined, 'image-card-actions');
+    const inspectButton = createButton('', 'icon-btn');
+    inspectButton.append(createWorkspaceIcon('info'));
+    inspectButton.setAttribute('aria-label', `Inspect ${image.filename}`);
+    actions.append(inspectButton, createTagButton(image));
+    info.append(text, actions);
+    card.append(art, info);
+    return card;
+}

web/js/workspace/images.mjs

@@ -1,5 +1,6 @@
 import { createScope, createButton } from '../shared/toolkit/core.js';
-import { createImageStream, withItem, imageKey, countLine, captionDate, scopeLabel, activeRefinements, cardTitle, cardSubtitle, mediaRatio } from './images-state.mjs';
+import { createImageStream, withItem, imageKey, countLine, captionDate, scopeLabel, activeRefinements } from './images-state.mjs';
+import { createImageCard } from './image-card.mjs';
 import { layoutImages, visibleImages, gridMetrics, stacksCardInfo } from './image-layout.mjs';
 import { mountFileInspector } from './file-inspector.mjs';
 import { createInspectionController } from './inspection-state.mjs';
@@ -15,7 +16,7 @@ import { openImportDialog, openRefineDialog } from './workspace-dialogs.mjs';
 import { openMetadataScan } from './activity-scan.mjs';
 import { showWorkspaceToast } from './toast.mjs';
 import { imagesFilters, imagesViewState } from './saved-views.mjs';
-import { createTagButton, onImageTagsSaved } from './image-tagging.mjs';
+import { onImageTagsSaved } from './image-tagging.mjs';
 import { followImageTagSaves, openCardTagging } from './images-tagging.mjs';
 import { favoriteBusy, paintStar, receiveFavorites, setFavoriteVisitTarget, toggleFavorite } from './images-favorites.mjs';
 export { onFavoriteChange } from './images-favorites.mjs';
@@ -108,7 +109,6 @@ export function mountImages(main, api, parentScope, {embedded = false, fetchPage
     parentScope.signal.addEventListener('abort', dispose, {once:true});
     scope.cleanup(() => parentScope.signal.removeEventListener('abort', dispose));
     if (parentScope.signal.aborted) { scope.dispose(); return {dispose}; }
-    const { resolveUrl } = window.ApiClient;
     const sender = createPromptSender({scope});
     let detailInspector;
     const inspection = createInspectionController({api});
@@ -265,20 +265,6 @@ export function mountImages(main, api, parentScope, {embedded = false, fetchPage
         }});
     scope.cleanup(() => mediaViewer.dispose());
 
-    function mediaElement(image, lazy = false) {
-        const video = image.is_video && !image.thumbnail_url;
-        const node = el(video ? 'video' : 'img');
-        node.src = resolveUrl(image.thumbnail_url || image.url);
-        if (video) { node.muted = true; node.playsInline = true; node.preload = 'metadata'; }
-        else {
-            // The concept card image: alt is the card title, with the listing's intrinsic size when known.
-            node.alt = cardTitle(image); node.decoding = 'async'; if (lazy) node.loading = 'lazy';
-            if ([image.width, image.height].every(value => Number.isFinite(value) && value > 0)) {
-                node.width = image.width; node.height = image.height;
-            }
-        }
-        return node;
-    }
     function releaseVideo(video) {
         video.pause(); video.removeAttribute('src'); video.load();
     }
@@ -300,44 +286,10 @@ export function mountImages(main, api, parentScope, {embedded = false, fetchPage
         if (!image) return;
         mediaViewer.open({items:state.items,selectedKey:imageKey(image),trigger:document.activeElement});
     }
-    /** The concept media card (app.js mediaCard): the image opens the viewer, Info inspects (D7–D11, D19). */
+    /** The concept media card (image-card.mjs): the image opens the viewer, Info inspects (D7–D11, D19). */
     function cardFor(image) {
         const key = imageKey(image);
-        const card = el('article', undefined, 'media-card');
-        card.dataset.imageKey = key; card.setAttribute('role', 'listitem');
-        card.style.setProperty('--media-ratio', mediaRatio(image));
-        const art = el('div', undefined, 'media-art');
-        const open = createButton('', 'image-open');
-        open.setAttribute('aria-label', `Open ${image.filename}`);
-        open.append(mediaElement(image, true));
-        // D8: the selection checkbox (Images only: Library-embedded media has no selection bar), then D7: the star,
-        // wherever the listing reports favorites (Images and Library-embedded media).
-        const overlays = el('div', undefined, 'image-overlays');
-        if (bar) {
-            const label = el('label'), box = el('input');
-            box.type = 'checkbox'; box.checked = bar.isChecked(key);
-            box.setAttribute('aria-label', `Select ${image.filename}`);
-            label.append(box);
-            overlays.append(label);
-        }
-        if (typeof image.favorite === 'boolean') {
-            const star = createButton('', 'star-button');
-            star.setAttribute('aria-label', `Favorite ${image.filename}`);
-            paintStar(star, image.favorite, favoriteBusy(key));
-            overlays.append(star);
-        }
-        art.append(open, overlays);
-        const info = el('div', undefined, 'media-info');
-        const text = el('div');
-        const title = el('h3', cardTitle(image)); title.title = image.path;
-        text.append(title, el('p', cardSubtitle(image)));
-        const actions = el('div', undefined, 'image-card-actions');
-        const inspectButton = createButton('', 'icon-btn');
-        inspectButton.append(createWorkspaceIcon('info'));
-        inspectButton.setAttribute('aria-label', `Inspect ${image.filename}`);
-        actions.append(inspectButton, createTagButton(image));
-        info.append(text, actions);
-        card.append(art, info);
+        const card = createImageCard(image, {checked:bar ? bar.isChecked(key) : null, favoriteBusy:favoriteBusy(key)});
         markSelected(card, key === selection);
         return card;
     }

web/js/workspace/index.mjs

@@ -1,7 +1,7 @@
 import '../api-client.js';
 import { createButton, createScope } from '../shared/toolkit/core.js';
 import { routes, mountRouter, summarizeStats, routeTitle, isHandoff, loadNavCounts,
-    LIBRARY_WRITE_COUNTS, NAV_COUNT_ROUTES, FAVORITE_WRITE_COUNTS, FAVORITE_COUNT_DELAY_MS } from './state.mjs';
+    LIBRARY_WRITE_COUNTS, NAV_COUNT_ROUTES, FAVORITE_WRITE_COUNTS, FAVORITE_COUNT_DELAY_MS, REVIEW_WRITE_COUNTS } from './state.mjs';
 import { mountWorkspaceTheme } from './theme.mjs';
 import { mountImages, onFavoriteChange } from './images.mjs';
 import { mountLibrary, mountNewPromptAction, onLibraryWrite } from './library.mjs';
@@ -15,6 +15,7 @@ import { createActivityStore } from './activity-store.mjs';
 import { mountActivityPage, mountActivityTopbar } from './activity.mjs';
 import { mountActivityJobView } from './activity-job-view.mjs';
 import { mountInspect } from './inspect.mjs';
+import { mountReview } from './review.mjs';
 import { createPromptSender } from './prompt-sender.mjs';
 
 const { createApiClient, resolveUrl } = window.ApiClient;
@@ -83,13 +84,14 @@ function mountWorkspace() {
         }
     };
     // SAVED VIEWS (#249 D16): the concept's saved-nav rows (search icon, name, no count), loaded with the shell and
-    // re-read after every change. /* D49 */ no "PROPOSED" badge; /* D50 */ no "Needs review" row. The first row is
-    // the concept's Favorites (star icon, count), kept across every re-read so its count stays (D51).
-    const [favoritesLink] = navLinks([['favorites', 'star']]);
-    savedNav.replaceChildren(favoritesLink);
+    // re-read after every change. /* D49 */ no "PROPOSED" badge. The first rows are the concept's Favorites (star icon,
+    // count, D51) and Needs review (review icon, the exact pending count, ruling R5), kept across every re-read so
+    // their counts stay.
+    const [favoritesLink, reviewLink] = navLinks([['favorites', 'star'], ['review', 'review']]);
+    savedNav.replaceChildren(favoritesLink, reviewLink);
     const savedViews = createSavedViews(api, scope.signal);
     scope.cleanup(savedViews.subscribe(({ views }) => {
-        savedNav.replaceChildren(favoritesLink, ...views.map(view => {
+        savedNav.replaceChildren(favoritesLink, reviewLink, ...views.map(view => {
             const link = element('a');
             link.append(createWorkspaceIcon('search'), document.createTextNode(view.name));
             link.href = savedViewHash(view.id);
@@ -129,6 +131,17 @@ function mountWorkspace() {
         favoriteCountTimer = setTimeout(() => refreshCounts(FAVORITE_WRITE_COUNTS), FAVORITE_COUNT_DELAY_MS);
     }));
     scope.cleanup(() => clearTimeout(favoriteCountTimer));
+    // A metadata scan that ends may have added items to Needs review: re-read its count once per ended scan.
+    const runningScans = new Set();
+    scope.cleanup(activity.subscribe(() => {
+        let ended = false;
+        for (const job of activity.jobs()) {
+            if (job.kind !== 'scan') continue;
+            if (job.state === 'running') runningScans.add(job.id);
+            else if (runningScans.delete(job.id)) ended = true;
+        }
+        if (ended) refreshCounts(REVIEW_WRITE_COUNTS);
+    }));
     refreshCounts(NAV_COUNT_ROUTES);
     let viewScope;
     let firstRender = true;
@@ -237,6 +250,11 @@ function mountWorkspace() {
             else mountActivityPage(main, { store: activity, scope: view });
             return;
         }
+        if (route.id === 'review') {
+            // Needs review (ruling R5): a recorded decision re-reads the row's count.
+            mountReview(main, { api, scope: view, onDecision: () => refreshCounts(REVIEW_WRITE_COUNTS) });
+            return;
+        }
         if (route.id === 'inspect') {
             // The concept's Inspect a file (app.js renderMetadata): a local file, read only in this browser.
             description.textContent = route.description;

web/js/workspace/review-state.mjs

@@ -0,0 +1,273 @@
+/**
+ * Needs review state (#249 PR F): the pending queue, the selected item's sampler paths and one explicit decision, over
+ * the review routes (`py/api/review.py`).
+ *
+ * - The queue is read 40 at a time, oldest first; `total` is the exact pending count. The cursor is bound to the
+ *   storage epoch only, so Load more keeps working while new items arrive.
+ * - Selecting an item reads its detail: one "Sampler <id> · <positive> / <negative>" option per candidate, unusable
+ *   ones disabled, the first workable one chosen, then "Leave unresolved" (rulings R2/R3).
+ * - Apply takes a fresh capture of the file (`observe`), then posts the decision; the server releases a capture it
+ *   used. A refused decision releases the capture and keeps the selection with the server's sentence as the warning;
+ *   a restored storage or a changed queue reads the queue again. A request that got no answer keeps its capture and
+ *   its exact body, and the next Apply of the same choice (`retry()`) resends that body once.
+ * - Leave for later writes nothing. Tagging the image (the shared Tag dialog) never changes the item.
+ */
+import { noun } from './plural.mjs';
+
+export const REVIEW_URL = '/prompt_manager/review/items';
+const OBSERVE_URL = '/prompt_manager/image-annotations/observe';
+const CAPTURE_URL = '/prompt_manager/image-annotations/capture/';
+export const PAGE_LIMIT = 40;
+export const UNRESOLVED = 'unresolved';
+
+export const COPY = Object.freeze({
+    title: 'Metadata review',
+    description: 'Uncertain evidence stays visible until you decide.',
+    notice: 'Multiple sampler paths were found. The existing image links were preserved. Choose the correct context or leave them unresolved.',
+    // D86 (plan D63, ruling R6): the empty queue's sentence.
+    empty: 'Ambiguous images are added when a metadata scan or a new generation finds more than one sampler path.',
+    panelTitle: 'Resolve the association',
+    leaveUnresolved: 'Leave unresolved',
+    // The states the concept lacks are text only (Global Constraints); D-NEW-F1.
+    loading: 'Loading the review queue…',
+    loadFailed: 'The review queue could not be read.',
+    detailLoading: 'Loading sampler paths…',
+    detailFailed: 'This item could not be read. Select it again to retry.',
+    moreFailed: 'More items could not be loaded. Try again.',
+    limited: 'This file has too many sampler paths to list. You can leave it unresolved.',
+    unavailable: 'This file is not under a current image source, so it cannot be opened. You can leave it unresolved.',
+    lost: 'The decision may not have been saved. Apply again to send the same decision once more.',
+    failed: 'The decision could not be saved. Try again.',
+    applied: 'Association accepted.',
+    leftUnresolved: 'Left unresolved.',
+});
+
+// Answers after which the queue itself is out of date: read it again.
+const RELOAD = new Set(['storage-changed', 'review-conflict', 'review-missing']);
+
+/** The notice heading: "No images need a decision", "1 image needs a decision", "3 images need a decision". */
+export function noticeTitle(count) {
+    if (!count) return 'No images need a decision';
+    return `${count.toLocaleString('en-US')} ${noun(count, 'image')} ${count === 1 ? 'needs' : 'need'} a decision`;
+}
+
+/** One Sampler context option's text. */
+export function optionLabel(candidate) {
+    return `Sampler ${candidate.sampler_id} · ${candidate.label}`;
+}
+
+const workable = candidate => candidate?.state === 'resolved' && typeof candidate.positive?.text === 'string' &&
+    typeof candidate.negative?.text === 'string';
+
+/** The Sampler context options of a detail: its candidates (unusable ones disabled), then Leave unresolved. */
+export function contextOptions(detail) {
+    const usable = detail.target !== null && !detail.unavailable;
+    const options = (Array.isArray(detail.candidates) ? detail.candidates : []).map(candidate => Object.freeze({
+        value: candidate.hash, label: optionLabel(candidate), disabled: !usable || !workable(candidate), candidate,
+    }));
+    options.push(Object.freeze({ value: UNRESOLVED, label: COPY.leaveUnresolved, disabled: false, candidate: null }));
+    return Object.freeze(options);
+}
+
+/** The prompt blocks of the chosen option: its two role texts, or the ambiguous status for Leave unresolved. */
+function promptsOf(option) {
+    if (!option?.candidate) return { positive: { status: 'ambiguous' }, negative: { status: 'ambiguous' } };
+    const { positive, negative } = option.candidate;
+    return { positive: { status: 'resolved', text: positive.text }, negative: { status: 'resolved', text: negative.text } };
+}
+
+function warningOf(detail) {
+    if (detail.unavailable || detail.target === null) return COPY.unavailable;
+    if (detail.limited) return COPY.limited;
+    return '';
+}
+
+const isAbort = error => error?.name === 'AbortError';
+// No answer at all (the network, or a body that was not the server's JSON): the decision may have been saved.
+const isLost = error => !isAbort(error) && !error?.code && !(error?.status >= 400 && error?.status < 500);
+
+const initial = () => ({
+    status: 'idle', epoch: null, total: 0, items: Object.freeze([]), nextCursor: null, more: 'idle',
+    selectedId: null, detail: null, detailStatus: 'idle', options: Object.freeze([]), choice: null, prompts: null,
+    phase: 'idle', warning: '', canRetry: false, toast: null,
+});
+
+/**
+ * @param {{api: {get: Function, post: Function, del: Function}}} options
+ * @returns the controller: `state`, `subscribe(listener)`, `load()`, `loadMore()`, `select(id)`, `choose(value)`,
+ *   `apply()`, `retry()`, `leave()`, `dispose()`.
+ */
+export function createReviewController({ api }) {
+    let state = Object.freeze(initial());
+    const listeners = new Set();
+    const lifetime = new AbortController();
+    let listRead = null, detailRead = null, pending = null, disposed = false;
+
+    function set(update) {
+        if (disposed) return;
+        state = Object.freeze({ ...state, ...update });
+        for (const listener of [...listeners]) listener(state);
+    }
+    const signalOf = controller => AbortSignal.any ? AbortSignal.any([lifetime.signal, controller.signal]) : controller.signal;
+
+    function release(token) {
+        if (!token) return;
+        api.del(`${CAPTURE_URL}${encodeURIComponent(token)}`, { keepalive: true }).catch(() => {});
+    }
+    function dropPending() {
+        release(pending?.body.capture_token);
+        pending = null;
+    }
+
+    /** Read the first page; `stale` re-reads the selected item's detail too (its revision or epoch moved). */
+    async function load({ keepWarning = false, stale = false } = {}) {
+        listRead?.abort();
+        const read = listRead = new AbortController();
+        set({ status: state.items.length ? state.status : 'loading', ...(keepWarning ? {} : { warning: '' }) });
+        try {
+            const page = await api.get(`${REVIEW_URL}?limit=${PAGE_LIMIT}`, { signal: signalOf(read), cache: 'no-store' });
+            if (read !== listRead || disposed) return;
+            const items = Object.freeze((page.items ?? []).map(entry => Object.freeze({ ...entry })));
+            set({ status: 'ready', epoch: page.library_epoch, total: page.total, items, nextCursor: page.next_cursor ?? null,
+                more: 'idle' });
+            const keep = items.find(entry => entry.id === state.selectedId);
+            if (keep && state.detail && !stale) return;
+            if (items.length) await select((keep ?? items[0]).id, { keepWarning });
+            else set({ selectedId: null, detail: null, detailStatus: 'idle', options: Object.freeze([]), choice: null, prompts: null });
+        } catch (error) {
+            if (read !== listRead || disposed || isAbort(error)) return;
+            set({ status: 'error' });
+        }
+    }
+
+    async function loadMore() {
+        if (!state.nextCursor || state.more === 'loading') return;
+        const read = listRead = new AbortController();
+        set({ more: 'loading' });
+        try {
+            const query = new URLSearchParams({ limit: String(PAGE_LIMIT), cursor: state.nextCursor });
+            const page = await api.get(`${REVIEW_URL}?${query}`, { signal: signalOf(read), cache: 'no-store' });
+            if (read !== listRead || disposed) return;
+            const known = new Set(state.items.map(entry => entry.id));
+            const added = (page.items ?? []).filter(entry => !known.has(entry.id)).map(entry => Object.freeze({ ...entry }));
+            set({ items: Object.freeze([...state.items, ...added]), total: page.total, nextCursor: page.next_cursor ?? null,
+                more: 'idle' });
+        } catch (error) {
+            if (read !== listRead || disposed || isAbort(error)) return;
+            if (RELOAD.has(error?.code)) { await load({ stale: true }); return; }
+            set({ more: 'error' });
+        }
+    }
+
+    async function select(id, { keepWarning = false } = {}) {
+        if (!state.items.some(entry => entry.id === id) || state.phase === 'applying') return;
+        detailRead?.abort();
+        dropPending();
+        const read = detailRead = new AbortController();
+        set({ selectedId: id, detail: null, detailStatus: 'loading', options: Object.freeze([]), choice: null, prompts: null,
+            canRetry: false, ...(keepWarning ? {} : { warning: '' }) });
+        try {
+            const detail = await api.get(`${REVIEW_URL}/${encodeURIComponent(id)}`, { signal: signalOf(read), cache: 'no-store' });
+            if (read !== detailRead || disposed) return;
+            const options = contextOptions(detail);
+            const chosen = options.find(option => !option.disabled);
+            set({ detail: Object.freeze(detail), detailStatus: 'ready', options, choice: chosen.value, prompts: promptsOf(chosen),
+                warning: (keepWarning && state.warning) || warningOf(detail) });
+        } catch (error) {
+            if (read !== detailRead || disposed || isAbort(error)) return;
+            if (RELOAD.has(error?.code)) { set({ warning: error.message }); await load({ keepWarning: true, stale: true }); return; }
+            set({ detailStatus: 'error', warning: COPY.detailFailed });
+        }
+    }
+
+    function choose(value) {
+        const option = state.options.find(entry => entry.value === value);
+        if (!option || option.disabled || state.phase === 'applying') return;
+        // Another choice is another decision: an unanswered one is no longer resent.
+        if (pending && pending.body.choice !== value) { dropPending(); set({ canRetry: false }); }
+        set({ choice: value, prompts: promptsOf(option) });
+    }
+
+    /** Send `body`; true once the decision is recorded. */
+    async function send(body) {
+        const id = state.selectedId;
+        const choice = body.choice;
+        set({ phase: 'applying', canRetry: false });
+        try {
+            const result = await api.post(`${REVIEW_URL}/${encodeURIComponent(id)}/decision`, body, { signal: lifetime.signal });
+            pending = null;
+            set({ phase: 'done', total: result.total, warning: '',
+                toast: choice === UNRESOLVED ? COPY.leftUnresolved : COPY.applied });
+            return true;
+        } catch (error) {
+            if (disposed || isAbort(error)) return false;
+            if (isLost(error)) {
+                pending = { id, body };
+                set({ phase: 'idle', warning: COPY.lost, canRetry: true });
+                return false;
+            }
+            pending = null;
+            release(body.capture_token);
+            set({ phase: 'idle', warning: error?.message || COPY.failed });
+            if (RELOAD.has(error?.code)) await load({ keepWarning: true, stale: true });
+            return false;
+        }
+    }
+
+    async function apply() {
+        const { detail, choice } = state;
+        if (state.phase !== 'idle' || state.detailStatus !== 'ready' || !detail || !choice) return false;
+        // After an unanswered request, Apply resends that same decision once (its capture and body).
+        if (pending?.id === state.selectedId && pending.body.choice === choice) return retry();
+        dropPending();
+        set({ phase: 'applying', warning: '', canRetry: false });
+        let capture = null, epoch = detail.library_epoch;
+        if (detail.target) {
+            try {
+                const observed = await api.post(OBSERVE_URL, { target: detail.target }, { signal: lifetime.signal });
+                capture = observed.capture;
+                epoch = observed.library_epoch;
+            } catch (error) {
+                if (disposed || isAbort(error)) return false;
+                set({ phase: 'idle', warning: error?.message || COPY.failed });
+                if (RELOAD.has(error?.code)) await load({ keepWarning: true, stale: true });
+                return false;
+            }
+            if (disposed) { release(capture?.token); return false; }
+        }
+        return send({
+            expected_epoch: epoch, expected_revision: detail.revision, capture_token: capture?.token ?? null,
+            sha256: capture?.sha256 ?? detail.sha256, dependency_fingerprint: detail.dependency_fingerprint, choice,
+        });
+    }
+
+    /** Resend the unanswered decision once, with its own capture; false when there is nothing to resend. */
+    async function retry() {
+        if (!pending || state.phase !== 'idle' || pending.id !== state.selectedId) return false;
+        const { body } = pending;
+        pending = null;
+        return send(body);
+    }
+
+    function leave() {
+        if (state.phase === 'applying') return;
+        dropPending();
+        set({ phase: 'done', toast: null, canRetry: false });
+    }
+
+    return {
+        get state() { return state; },
+        subscribe(listener) {
+            listeners.add(listener);
+            return () => listeners.delete(listener);
+        },
+        load: () => load(), loadMore, select: id => select(id), choose, apply, retry, leave,
+        dispose() {
+            if (disposed) return;
+            dropPending();
+            disposed = true;
+            lifetime.abort();
+            listeners.clear();
+        },
+    };
+}

web/js/workspace/review.mjs

@@ -0,0 +1,247 @@
+/**
+ * Needs review (#249 PR F): the concept's Metadata review page (docs/concepts/workspace/app.js `renderReview`
+ * a749–760; style.css s407–415, s796–814 and their breakpoints) over the review controller (review-state.mjs).
+ *
+ * - Heading "Metadata review", its line, and **Open activity** (`#/activity`).
+ * - `.notice`: "N images need a decision" and the concept's sentence; with an empty queue, D86 (plan D63, ruling R6)
+ *   "No images need a decision" and the scan/new-generation sentence, and nothing else.
+ * - `.gallery-layout`: the queue's concept media cards (image-card.mjs; the image opens the shared viewer, Info selects
+ *   the item, Tag opens the shared Tag image dialog with the review scope note), then `section.surface` "Resolve the
+ *   association": filename, Tag image, Sampler context, the chosen path's prompt blocks and the actions Leave for later
+ *   and Apply association. Both return to Images (ruling R7).
+ * - States the concept lacks (loading, a failed read, a refused or unanswered decision, a limited or unavailable file)
+ *   are text: `p.warning-note` in the panel, or the page's status line (D-NEW-F1).
+ * - D-NEW-F1: the queue cards carry no selection checkbox and no star (this page has no selection bar, and the queue
+ *   carries no favorite state); more than 40 items add the Images page's `.infinite-continuation` Load more after the
+ *   layout; the toasts "Association accepted." and "Left unresolved." stand in for the concept's prototype toast.
+ */
+import { createButton } from '../shared/toolkit/core.js';
+import { createReviewController, COPY, noticeTitle } from './review-state.mjs';
+import { createImageCard } from './image-card.mjs';
+import { isTagButton, openImageTagging } from './image-tagging.mjs';
+import { mountPromptBlocks } from './prompt-blocks.mjs';
+import { createPromptSender } from './prompt-sender.mjs';
+import { createMediaViewer } from './media-viewer.mjs';
+import { createInspectionController } from './inspection-state.mjs';
+import { createWorkspaceIcon } from './icons.mjs';
+import { field } from './workspace-dialogs.mjs';
+import { pageHeading } from './heading.mjs';
+import { navigateTo } from './state.mjs';
+import { showWorkspaceToast } from './toast.mjs';
+import { imageKey } from './images-state.mjs';
+
+function el(tag, text, className) {
+    const node = document.createElement(tag);
+    if (text !== undefined) node.textContent = text;
+    if (className) node.className = className;
+    return node;
+}
+function setText(node, text) {
+    if (node.textContent !== text) node.textContent = text;
+}
+function setDisabled(button, disabled) {
+    if (disabled) button.setAttribute('aria-disabled', 'true');
+    else button.removeAttribute('aria-disabled');
+}
+const isDisabled = button => button.getAttribute('aria-disabled') === 'true';
+
+/** A queue item as the card, the viewer and the Tag dialog read a listed image. */
+export function imageOf(item) {
+    const target = item.target ?? {};
+    return { filename: item.filename, root_index: target.root_index, root_scope: target.root_scope, path: target.path,
+        url: item.url, is_video: item.is_video === true, media_type: item.is_video ? 'video' : 'image' };
+}
+
+/**
+ * Mount the page under the shell's heading. `onDecision()` runs after a recorded decision (the shell re-reads the
+ * Needs review count); `controller` is injectable for tests.
+ */
+export function mountReview(main, { api, scope, onDecision = () => {}, controller = createReviewController({ api }) }) {
+    scope.cleanup(() => controller.dispose());
+    const heading = pageHeading(main);
+    heading.h1.textContent = COPY.title;
+    heading.description.textContent = COPY.description;
+    const openActivity = createButton('Open activity');
+    heading.actions.append(openActivity);
+    scope.listen(openActivity, 'click', () => navigateTo('#/activity'));
+
+    const status = el('p', COPY.loading, 'empty-state');
+    status.setAttribute('role', 'status');
+    const retryLoad = createButton('Retry');
+    const notice = el('div', undefined, 'notice');
+    const noticeCopy = el('div');
+    const noticeTitleNode = el('h2');
+    const noticeText = el('p');
+    noticeCopy.append(noticeTitleNode, noticeText);
+    notice.append(noticeCopy);
+
+    const layout = el('div', undefined, 'gallery-layout');
+    const grid = el('div', undefined, 'image-grid review-queue');
+    grid.setAttribute('role', 'list');
+    grid.setAttribute('aria-label', 'Review queue');
+    const panel = el('section', undefined, 'surface review-panel');
+    const panelTitle = el('h2', COPY.panelTitle);
+    panelTitle.id = 'review-panel-title';
+    panel.setAttribute('aria-labelledby', panelTitle.id);
+    const filename = el('p', '', 'small');
+    const tagRow = el('div', undefined, 'row-actions spaced-15');
+    const tagButton = createButton('');
+    tagButton.append(createWorkspaceIcon('tagImage'), ' Tag image');
+    tagRow.append(tagButton);
+    const select = el('select');
+    const contextField = field('Sampler context', select, 'review-context');
+    const warning = el('p', '', 'warning-note'); // D-NEW-F1: the states the concept lacks
+    warning.setAttribute('role', 'status');
+    const blocks = el('div');
+    const actions = el('div', undefined, 'dialog-actions');
+    const later = createButton('Leave for later');
+    const apply = createButton('Apply association', 'ca-primary');
+    actions.append(later, apply);
+    panel.append(panelTitle, filename, tagRow, contextField, warning, blocks, actions);
+    layout.append(grid, panel);
+
+    const continuation = el('div', undefined, 'infinite-continuation'); // D-NEW-F1: Load more past 40 items
+    const moreText = el('p', '', 'small');
+    const more = createButton('Load more images');
+    continuation.append(moreText, more);
+
+    const sender = createPromptSender({ scope });
+    const prompts = mountPromptBlocks(blocks, { prompts: null, sender, parentScope: scope, includePairAction: false,
+        onRetry: () => { if (controller.state.selectedId) controller.select(controller.state.selectedId); } });
+    const inspection = createInspectionController({ api });
+    scope.cleanup(() => inspection.dispose());
+    const viewer = createMediaViewer({ api, container: main, parentScope: scope, inspectionController: inspection,
+        sender, onSelect: image => inspection.select(image) });
+
+    const cards = new Map();
+    let shownItems = null, shownSelected, shownOptions = null, shownPrompts, shownDetail;
+
+    function renderCards(state) {
+        if (state.items !== shownItems) {
+            shownItems = state.items;
+            const ids = new Set(state.items.map(item => item.id));
+            for (const [id, card] of cards) if (!ids.has(id)) { card.remove(); cards.delete(id); }
+            state.items.forEach((item, index) => {
+                let card = cards.get(item.id);
+                if (!card) {
+                    // D-NEW-F1: no selection checkbox and no star on a queue card.
+                    card = createImageCard(imageOf(item), { media: Boolean(item.url) });
+                    card.dataset.reviewId = item.id;
+                    card.item = item;
+                    if (!item.url) setDisabled(card.querySelector('.image-open'), true);
+                    if (!item.target) setDisabled(card.querySelector('.image-card-actions button:last-child'), true);
+                    cards.set(item.id, card);
+                }
+                if (grid.children[index] !== card) grid.insertBefore(card, grid.children[index] ?? null);
+            });
+            shownSelected = undefined;
+        }
+        if (state.selectedId !== shownSelected) {
+            shownSelected = state.selectedId;
+            for (const [id, card] of cards) card.classList.toggle('selected', id === state.selectedId);
+        }
+    }
+
+    function renderPanel(state) {
+        const item = state.items.find(entry => entry.id === state.selectedId);
+        setText(filename, item?.filename ?? '');
+        setDisabled(tagButton, !item?.target || state.phase === 'applying');
+        if (state.options !== shownOptions) {
+            shownOptions = state.options;
+            select.replaceChildren(...state.options.map(option => {
+                const node = el('option', option.label);
+                node.value = option.value;
+                node.disabled = option.disabled;
+                return node;
+            }));
+        }
+        if (state.choice !== null && select.value !== state.choice) select.value = state.choice;
+        select.disabled = state.detailStatus !== 'ready' || state.phase === 'applying';
+        setText(warning, state.warning);
+        warning.hidden = !state.warning;
+        if (state.prompts !== shownPrompts || state.detailStatus !== shownDetail) {
+            shownPrompts = state.prompts;
+            shownDetail = state.detailStatus;
+            if (state.detailStatus === 'ready') prompts.setState({ prompts: state.prompts });
+            else prompts.setState({ loading: state.detailStatus === 'loading', error: state.detailStatus === 'error' });
+        }
+        setDisabled(apply, state.detailStatus !== 'ready' || state.phase !== 'idle');
+        setDisabled(later, state.phase === 'applying');
+    }
+
+    function render(state) {
+        if (scope.signal.aborted) return;
+        if (state.phase === 'done') return finish(state);
+        const ready = state.status === 'ready';
+        if (!ready) {
+            setText(status, state.status === 'error' ? COPY.loadFailed : COPY.loading);
+            status.setAttribute('role', state.status === 'error' ? 'alert' : 'status');
+            if (!status.isConnected) main.append(status);
+            if (state.status === 'error' && !retryLoad.isConnected) main.append(retryLoad);
+            if (state.status !== 'error') retryLoad.remove();
+            if (state.status === 'error' || !state.items.length) { notice.remove(); layout.remove(); continuation.remove(); }
+            return;
+        }
+        status.remove();
+        retryLoad.remove();
+        setText(noticeTitleNode, noticeTitle(state.total));
+        setText(noticeText, state.total ? COPY.notice : COPY.empty); // D86
+        if (!notice.isConnected) main.append(notice);
+        if (!state.items.length) { layout.remove(); continuation.remove(); return; }
+        if (!layout.isConnected) notice.after(layout);
+        renderCards(state);
+        renderPanel(state);
+        if (state.nextCursor) {
+            setText(moreText, `${state.items.length.toLocaleString('en-US')} of ${state.total.toLocaleString('en-US')} images`);
+            setDisabled(more, state.more === 'loading');
+            if (state.more === 'error') setText(moreText, COPY.moreFailed);
+            if (!continuation.isConnected) layout.after(continuation);
+        } else continuation.remove();
+    }
+
+    let finished = false;
+    function finish(state) {
+        if (finished) return;
+        finished = true;
+        if (state.toast) {
+            showWorkspaceToast(state.toast);
+            onDecision();
+        }
+        // Ruling R7: Apply association and Leave for later both return to Images.
+        navigateTo('#/images');
+    }
+
+    scope.listen(retryLoad, 'click', () => controller.load());
+    scope.listen(more, 'click', () => { if (!isDisabled(more)) controller.loadMore(); });
+    scope.listen(select, 'change', () => controller.choose(select.value));
+    scope.listen(apply, 'click', () => { if (!isDisabled(apply)) controller.apply(); });
+    scope.listen(later, 'click', () => { if (!isDisabled(later)) controller.leave(); });
+    scope.listen(tagButton, 'click', () => {
+        const item = controller.state.items.find(entry => entry.id === controller.state.selectedId);
+        if (isDisabled(tagButton) || !item?.target) return;
+        openImageTagging({ api, scope, image: imageOf(item), source: 'review', trigger: tagButton });
+    });
+    scope.listen(grid, 'click', event => {
+        const card = event.target.closest('article[data-review-id]');
+        if (!card) return;
+        const { item } = card;
+        const button = event.target.closest('button');
+        if (!button || isDisabled(button)) return;
+        if (isTagButton(button)) {
+            openImageTagging({ api, scope, image: imageOf(item), source: 'review', trigger: button });
+            return;
+        }
+        if (button.matches('.image-open')) {
+            const items = controller.state.items.filter(entry => entry.url).map(imageOf);
+            viewer.open({ items, selectedKey: imageKey(imageOf(item)), trigger: button });
+            return;
+        }
+        // Info selects the item, as the concept's `inspect` does on this page (app.js a1244–1248).
+        controller.select(item.id);
+    });
+
+    scope.cleanup(controller.subscribe(render));
+    render(controller.state);
+    controller.load();
+    return { controller };
+}

web/js/workspace/state.mjs

@@ -12,13 +12,17 @@ export const routes = [
     { id: 'overview', label: 'Overview' },
     // SAVED VIEWS' first row (#249 D51): Images filtered to favorites. No href, so Overview lists no card for it.
     { id: 'favorites', label: 'Favorites' },
+    // SAVED VIEWS' Needs review row (ruling R5): the concept's Metadata review page (app.js renderReview 749–760; its
+    // breadcrumb is "Review", app.js render 1175–1188),
+    // the queue of ambiguous sampler evidence. No href: no Overview card.
+    { id: 'review', label: 'Needs review', title: 'Review' },
     // The concept's Activity (app.js renderActivity 732–738): this server session's jobs. No href: no Overview card.
     { id: 'activity', label: 'Activity' },
     { id: 'system', label: 'System', href: '/prompt_manager/admin',
         description: 'Open the current dashboard, then choose Settings or Maintenance for configuration, scans, backups and diagnostics.', action: 'Open existing administration' },
 ];
 
-const NATIVE_ROUTES = new Set(['images', 'library', 'tags', 'inspect', 'overview', 'saved', 'favorites', 'activity']);
+const NATIVE_ROUTES = new Set(['images', 'library', 'tags', 'inspect', 'overview', 'saved', 'favorites', 'activity', 'review']);
 
 /** A saved view (#249 D16): the shell resolves its id to the view's page, name and state. */
 const SAVED_ROUTE = Object.freeze({ id: 'saved', label: 'Saved view' });
@@ -62,6 +66,8 @@ const NAV_COUNT_SOURCES = Object.freeze([
     ['favorites', '/prompt_manager/images/output?mode=workspace&favorites=1&limit=1'],
     ['library', '/prompt_manager/library?limit=1'],
     ['tags', '/prompt_manager/vocabulary/tags?limit=1'],
+    // Needs review (ruling R5): the queue's `total` is the exact pending count.
+    ['review', '/prompt_manager/review/items?limit=1'],
 ]);
 
 /** Route id -> count for the sidebar links; null when a page is missing or its total is not a count. */
@@ -76,7 +82,7 @@ export function summarizeNavCounts(pages = {}) {
  * Read the counts; a failed read yields null for its route only. `onCount(id, count)` runs as each read settles, so a
  * slow listing (the Images output scan) never holds back the cheap Library and Tags counts.
  */
-/** The sidebar routes that carry a count (WORKSPACE, plus SAVED VIEWS' Favorites). */
+/** The sidebar routes that carry a count (WORKSPACE, plus SAVED VIEWS' Favorites and Needs review). */
 export const NAV_COUNT_ROUTES = Object.freeze(NAV_COUNT_SOURCES.map(([id]) => id));
 
 /** The counts a confirmed Library or vocabulary write can change; the Images listing cannot. */
@@ -84,6 +90,8 @@ export const LIBRARY_WRITE_COUNTS = Object.freeze(['library', 'tags']);
 
 /** The count a confirmed favorite change can change. */
 export const FAVORITE_WRITE_COUNTS = Object.freeze(['favorites']);
+/** The count a review decision or a finished metadata scan can change. */
+export const REVIEW_WRITE_COUNTS = Object.freeze(['review']);
 // Trailing delay that coalesces quick star toggles into one Favorites count read (#249 M1).
 export const FAVORITE_COUNT_DELAY_MS = 300;
 

web/js/workspace/workspace.css

@@ -376,3 +376,13 @@ pre.prompt-text { font: inherit; font-size: 12px; line-height: 1.75; margin-bloc
     /* D83: the chip's × keeps the concept's 40px coarse target. */
     .ca-tools #tag-suggestions .chip.tag-suggestion > button { min-block-size: 40px; min-inline-size: 40px; }
 }
+
+/* Needs review (#249 PR F): the concept's Metadata review page (app.js a749–760) in its own classes. */
+/* #249 D3: the review queue is not virtualized, so its cards stay in the concept grid's flow. */
+.image-grid.review-queue > .media-card { position: static; /* D3 */ }
+/* #249 D20: the prompt blocks' mount point is transparent, so the chosen path's sections sit in the panel as the
+   concept's do. */
+.review-panel > .prompt-inspector { display: contents; /* D20 */ }
+/* D-NEW-F1: a file that cannot be served (no current root) has an inert, empty media button. */
+.review-queue .image-open[aria-disabled="true"] { cursor: not-allowed; }
+.review-panel > p.small { min-inline-size: 0; overflow-wrap: anywhere; }