brain-of-reese/.agents/phases/complete/106_document_dates/08_ui_dates.md

Task 08 — UI: Created file column, Updated folder column, viewer Created badge (D8)

Phase: 106_document_dates · Source: owner request 2026-09-13 — "The UI must also show a date for every document at the top of that document when the user clicks it"; "I would also like to see a last updated dates/timestamps on folders before the description column but after the documents column in the UI"; "For files, include a date/timestamp before the 'indexed' column in the UI."

Objective

Render the dates the task-05 APIs serve: the file table's Created column (before Indexed), the folder/source table's Updated column (after Documents, before Description), and the clicked document's Created badge in the shared viewer core's top meta row (modal + full page). The date EDITOR is task 09 — this task ships display only.

Work

1. frontend/index.html — the two header rows (RAG view):
   • File table (L485-492): insert <th scope="col">Created</th> between <th scope="col">Chunks</th> and <th scope="col">Indexed</th>.
   • Folder table (L470-478): insert <th scope="col">Updated</th> between <th scope="col">Documents</th> and <th scope="col">Description</th>. (No other shell markup — the rows are built by JS; a brief phase-106 comment above each inserted <th> in the house style.)
2. frontend/assets/sources.js:
   • makeRow (L1375-1410): the cell loop (L1401) becomes for (const value of [d.title, String(d.chunks), fmtDate(d.created_at), fmtDate(d.indexed_at)]) — the Created cell lands BEFORE Indexed (D8 verbatim). The loop's plain-td shape can't carry per-cell titles, so the date cells get one refinement: build the Created cell explicitly (a td with textContent = fmtDate(d.created_at) AND title = d.created_at — the ISO hover/precision value, the path-cell title idiom) between the chunks and Indexed cells (the E2E asserts on the locale-stable title, not on toLocaleString output). The row object fed from tree file nodes (L1341-1350) gains created_at: f.created_at (task 05's tree shape — the flat GET /api/docs path, if makeRow is still fed from it anywhere, carries created_at too — grep makeRow( call sites and extend every one).
   • makeSourceRow (L1217-1235) + makeFolderRow (L1237-1261): between the count td and the description cell, one new td — const updatedTd = document.createElement("td"); updatedTd.textContent = s.updated_at ? fmtDate(s.updated_at) : "–"; (the statLast null idiom, L1294 — None for a 0-document source, D9). title attribute = the ISO value (hover precision on the ellipsized cell, the makeRow path-cell idiom).
   • renderLevel/treeStats — UNCHANGED (the stat cards keep their indexed_at "last indexed" semantics — the owner asked for the column, not the cards).
3. frontend/assets/document.js — renderDocument (L118-176, the ONE shared core — the modal AND /document.html render through it): the .doc-meta badge row (L123-129) gains the badge BEFORE the Indexed one:

   metaBadge("doc-created", `Created ${fmtDate(doc.created_at)}`),
   metaBadge("doc-indexed", `Indexed ${fmtDate(doc.indexed_at)}`),
   

   (the date at the top of a clicked document, D8). doc-created is the NEW class — the badge's title attribute carries the full ISO timestamp (the titleEl ellipsis-precision idiom, L122-124). document-modal.js needs no change (it calls the shared core with its own metaEl — the module docstring's contract is unchanged; verify the modal's meta element exists — it does: metaEl L48).
4. frontend/assets/styles.css — next to the existing .doc-indexed rule (grep for it): .doc-created — same badge family (the doc-indexed rule copied, provenance comment citing phase 106 D8); the new table cells need no new CSS beyond what .docs-table already styles (verify the column count change doesn't break the table's responsive rules — the #docs-table/.kb-folders-table grid/width rules: if a rule hard-codes the column count, extend it). WCAG: the date text reuses the table ink (≥4.5:1 by construction — record the verified pair in the comment, house style); the badge contrast mirrors doc-indexed's recorded ratio.
5. tests/unit/test_sources_dates.py (NEW — the house read-the-assets-as-text pattern, tests/unit/test_source_ignore_paths.py's sibling style):
   • frontend/index.html — both header rows' cell ORDER pinned (the <th> sequence strings: Source | Path | Title | Chunks | Created | Indexed and Folder | Documents | Updated | Description);
   • frontend/assets/sources.js — the makeRow value-list order (created_at before indexed_at), the updatedTd null→"–" branch present in BOTH row builders, the file-row object carries created_at;
   • frontend/assets/document.js — the badge order in the meta row (doc-created before doc-indexed), the Created label + fmtDate(doc.created_at) template, the single-source cross-file check that the doc-created class exists in styles.css;
   • frontend/assets/styles.css — the .doc-created rule present with a provenance comment.
6. Run uv run pytest tests/unit/test_sources_dates.py -q + the existing sources/JS unit suites — green.

Testing & Quality

• Unit: the source-level wiring pins above (order, null handling, cross-file class check).
• Coverage: >90% on app/ (no app/ code this task — the gate is the full-suite one, held by the other tasks; the JS pins are the house frontend-test pattern).

Completion Criteria

• The file table shows Created between Chunks and Indexed (formatted like the Indexed cell — fmtDate); the folder/source table shows Updated between Documents and Description (subtree max from the tree API, – when null)
• The clicked document's top meta row carries Created <date> BEFORE Indexed in BOTH the modal and /document.html (one shared core — no per-surface copy)
• tests/unit/test_sources_dates.py pins the orders + null branch + cross-file class and passes; existing JS unit suites stay green; uv run ruff check . && uv run pyright clean