feat(room-info): redesign info page to match Settings shell (LC-449) #441

Merged
longjacksonle merged 1 commit from feat/room-info-settings-redesign into main 2026-06-24 20:12:38 +02:00

What

Redesign the room info page (/room/{id}/info) to match the new Settings page (LC-426). Same two-column shell, sticky vertical tab rail with icons, .lc-set-card hierarchy, spacing, and theme tokens, plus instant client-side tab switching instead of a full-page reload per tab.

Closes LC-449 (subtasks LC-450, LC-451, LC-452, LC-453).

Changes

  • routes/room_info.rs: get_page now loads pinned + first-page files unconditionally (was gated on the active tab) so all three panels render in the DOM. ?tab= now only sets the initial selection. Both loads are bounded scans.
  • templates/room/info.html: rebuilt on .lc-set-shell / .lc-set-nav / .lc-set-card. Three panels: Docs (description + wiki + nickname + danger/delete), Pinned, Files. Delete-room is a .lc-set-card--danger.
  • assets/roominfo.js (new): client-side tab toggle, hash + sessionStorage synced (lc-roominfo-tab), roving-tabindex arrow nav, no-JS fallback reveals every panel and hides the rail. Mirrors settings.js; loaded globally from base.html, self-gates on [data-lc-roominfo].
  • Inline htmx edit/view/load-more fragments (description_*, wiki_*, files_fragment) adopt the shared .btn vocabulary so swaps stay visually consistent with the cards.

Scope / safety

Presentation + interaction only. All htmx behaviors (description/wiki inline edit, files filter + load-more, nickname set/clear, delete-room) and all authz are unchanged. Not operator-visible: no marker.

Verification

just build-css, node --check roominfo.js, just check (clean), just test + just test-saas (both green).

🤖 Generated with Claude Code

## What Redesign the room info page (`/room/{id}/info`) to match the new Settings page (LC-426). Same two-column shell, sticky vertical tab rail with icons, `.lc-set-card` hierarchy, spacing, and theme tokens, plus instant client-side tab switching instead of a full-page reload per tab. Closes LC-449 (subtasks LC-450, LC-451, LC-452, LC-453). ## Changes - `routes/room_info.rs`: `get_page` now loads pinned + first-page files unconditionally (was gated on the active tab) so all three panels render in the DOM. `?tab=` now only sets the initial selection. Both loads are bounded scans. - `templates/room/info.html`: rebuilt on `.lc-set-shell` / `.lc-set-nav` / `.lc-set-card`. Three panels: Docs (description + wiki + nickname + danger/delete), Pinned, Files. Delete-room is a `.lc-set-card--danger`. - `assets/roominfo.js` (new): client-side tab toggle, hash + sessionStorage synced (`lc-roominfo-tab`), roving-tabindex arrow nav, no-JS fallback reveals every panel and hides the rail. Mirrors `settings.js`; loaded globally from `base.html`, self-gates on `[data-lc-roominfo]`. - Inline htmx edit/view/load-more fragments (`description_*`, `wiki_*`, `files_fragment`) adopt the shared `.btn` vocabulary so swaps stay visually consistent with the cards. ## Scope / safety Presentation + interaction only. All htmx behaviors (description/wiki inline edit, files filter + load-more, nickname set/clear, delete-room) and all authz are unchanged. Not operator-visible: no marker. ## Verification `just build-css`, `node --check roominfo.js`, `just check` (clean), `just test` + `just test-saas` (both green). 🤖 Generated with [Claude Code](https://claude.com/claude-code)
feat(room-info): redesign info page to match Settings shell (LC-449)
Some checks failed
Create release / Create release from merged PR (pull_request) Has been skipped
check-secrets / TruffleHog (push) Successful in 8s
check-secrets / Nosey parker (push) Successful in 7s
check-secrets / Kingfisher (push) Successful in 9s
check-secrets / TruffleHog (pull_request) Successful in 9s
check-secrets / Nosey parker (pull_request) Successful in 9s
check-secrets / Kingfisher (pull_request) Successful in 10s
Check / clippy + fmt + tests (pull_request) Has been cancelled
c9713ea8f3
Bring /room/{id}/info in line with the redesigned Settings page (LC-426): the same two-column shell, sticky vertical tab rail with icons, card hierarchy, spacing, and theme tokens, plus instant client-side tab switching instead of a full-page reload per tab.

The route now renders all three panels' data (description/wiki, pinned, files) upfront so a new roominfo.js can toggle panel visibility client-side (hash + sessionStorage synced, roving-tabindex arrow nav), mirroring settings.js. ?tab= still sets the initial panel for deep-links and the no-JS fallback (which reveals every panel and hides the inert rail). Pinned and files were previously loaded only when their tab was active; both are bounded scans, cheap on every load.

The Docs/Pinned/Files sections move into .lc-set-card containers (delete-room becomes a .lc-set-card--danger), and the inline htmx edit/view/load-more fragments adopt the shared .btn vocabulary so swaps stay visually consistent. Presentation + interaction only: all htmx behaviors (description/wiki inline edit, files filter + load-more, nickname set/clear, delete-room) and authz are unchanged.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
longjacksonle scheduled this pull request to auto merge when all checks succeed 2026-06-24 20:10:22 +02:00
longjacksonle deleted branch feat/room-info-settings-redesign 2026-06-24 20:12:38 +02:00
Sign in to join this conversation.
No reviewers
No labels
No milestone
No project
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set

Reference
psa-systems/lets-chat!441
No description provided.