Files

T

CI / Build & Quality Checks (push) Failing after 6m6s

Details

feat: quick emoji reactions on hover, in-app notification toasts, mention pulse audit

P5-17: MessageQuickReactions moved from 3-dots menu to hover toolbar;
shows 5 recent emoji directly on hover. Clicking a quick-reaction also
closes any open emoji picker (setEmojiBoardAnchor). Line separator
removed from component.

P5-7: LotusToastContainer slides in from bottom-right when window is
focused — replaces OS notification for in-focus events. Correct room
path (DM vs home) derived from mDirectAtom. Invite toast routes to
inbox. 4s auto-dismiss. Full TDS styling via CSS custom properties.

P5-8: Confirmed already implemented upstream (MentionHighlightPulse,
0.6s scale+glow, one-shot, prefers-reduced-motion). Marked complete.

Code-review fixes: toast navigation used nonexistent /room/ route;
emoji picker stayed open after toolbar quick-reaction.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

2026-06-04 21:32:37 -04:00

98 KiB

Raw Blame History

Lotus Chat — Master Feature TODO

Location: /root/code/cinny/LOTUS_TODO.md
Repo: lotus branch at https://code.lotusguild.org/LotusGuild/cinny
Deploy: push to lotus → CI → auto-deploy to chat.lotusguild.org (~11 min)

This file is the single source of truth for all planned, in-progress, and backlog features. Update it as features are completed or reprioritized.

⚠️ TDS DESIGN LAW — READ BEFORE TOUCHING ANY UI

ALL Lotus Terminal Design System (TDS) styling — colors, animations, glows, borders, fonts, spacing — MUST come exclusively from /root/code/web_template/base.css CSS variables. Do NOT hardcode hex values. Do NOT invent new variable names. Do NOT deviate from the design tokens defined in that file. The canonical variable reference: --lt-accent-orange, --lt-accent-cyan, --lt-accent-green, --lt-glow-orange, --lt-box-glow-*, --lt-border-color, etc. Reference implementation for code patterns: /root/code/tinker_tickets/ (markdown.js, base.js, ticket.css) This rule applies to EVERY task in this file without exception.

Legend:

[AUDIT REQUIRED] — at least one assumption needs code/server verification before implementing
[SERVER CHECK] — depends on a Synapse feature or MSC; verify on matrix.lotusguild.org
[LOW PRIORITY] — implement after all higher-priority items
[EXTREME COMPLEXITY] — multi-sprint, plan separately before touching
[BLOCKED] — cannot build until a server upgrade, upstream MSC, or dependency resolves
[IMPROVE] — feature exists in upstream Cinny; this task enhances it for Lotus Chat

Status: [ ] pending · [~] in progress · [x] completed

AUDIT RESULTS — completed June 2026

Server Status

Synapse version: 1.153.0 (released 2026-05-19) — FULLY UP TO DATE, no upgrade needed
Matrix spec reported: up to v1.12 formally, but newer MSC features available via unstable_features
MSC feature flags confirmed ON: msc4140 (delayed messages) · msc3771 (thread receipts) · msc3440.stable (threading) · msc4133.stable (extended profiles) · simplified_msc3575 (sliding sync)
MSC feature flags confirmed OFF: msc4306 (thread subscriptions — BLOCKED) · msc3882 · msc3912 · msc4155
MSC3266 (room summary, v1.15): endpoint returned 404 — NOT available on this server
MSC3765 (rich room topics, v1.15): NOT available as stable, but client-side rendering is still worth doing
MSC3892 (relation redaction): not listed in flags — NOT supported, feature BLOCKED
MSC4260 (report user, v1.14): server at v1.12 formally — NOT available as spec endpoint; however report user already exists upstream in Cinny (message reporting via reportEvent)
MSC4151 (report room, v1.12): merged at exactly v1.12 — should be available ✅

Upstream Cinny Features Confirmed (exist in upstream — only improve, don't re-implement)

Feature	Location in upstream	Lotus improvement task
"Jump to Latest" button	`RoomTimeline.tsx:2180-2192`	#104 — add unread count + animation
Mark rooms as read (per section)	`Home.tsx:73-102`, `DirectTab.tsx:29-61`	None needed
Room upgrade / tombstone banner	`RoomTombstone.tsx`, `RoomUpgrade.tsx`	None needed
Visual speaking indicator	`useCallSpeakers.ts:8-60`, `MemberSpeaking.tsx:1-78`	#107 — TDS animated ring
Image + video spoilers (blur/reveal)	`ImageContent.tsx`, `VideoContent.tsx`	#105 — smooth CSS transition
Report message per event	`Message.tsx:588-709` — `mx.reportEvent()`	#106 — add category selector
Drag-and-drop file upload	`useFileDrop.ts` — works but overlay bug	#73 — fix overlay dismiss
Typing indicator (animated dots)	`TypingIndicator.tsx`, `TypingIndicator.css.ts`	#108 — TDS orange dots ✅ June 2026
Pinned messages count badge	Confirmed in upstream header icon	None needed

Upstream Cinny Features Confirmed MISSING (we should build these)

Quick Switcher, Sidebar filter, Favorite rooms, Invite link generator, Edit history modal,
Export history, Room preview before joining, Suggested rooms display, Server notices styling,
DM last-message preview, Media gallery, Knock-to-join full UX

Code Architecture Facts — Full Audit Results

Corrected facts (previous version had errors)

Old assumption	Correct finding
~~Join/leave sounds need m.call.member state events~~	Use `useCallMembersChange()` hook at `src/app/hooks/useCall.ts:37-52` — subscribes to `MatrixRTCSessionEvent.MembershipsChanged`, receives old/new membership arrays
~~Glassmorphism needs parent wrapper (translateX blocks filter)~~	SAFE to apply directly to sidebar container — `translateX` only on `SidebarItem` hover, not the sidebar container. Apply backdrop-filter to `Sidebar.css.ts:6-17`
~~Avatar frames must wrap externally~~	Modify `UserAvatar` internally — add optional `frameName?: string` prop; renders overlay inside component. Avoids 3 different wrapper implementations
~~JetBrains Mono not bundled~~	Already loaded via Google Fonts CDN in `index.html:33-35`. Other fonts: use `@fontsource` npm packages
~~Animated backgrounds: add to backgroundImage~~	backgroundImage can't have @keyframes — use CSS `::before` pseudo-element on `<Page>` component with `position:absolute, inset:0, z-index:-1`

Confirmed facts (all audits complete as of June 2026)

Finding	Impact
`folds AvatarImage` does NOT accept children	Add frame/overlay inside `UserAvatar.tsx` itself — optional `frameName` prop
No in-app toast system exists	Task #80: build `ToastProvider` + Jotai queue; insert at `App.tsx:65` after `OverlayContainerProvider`; `portalContainer` in `index.html:101`
`useUnverifiedDeviceCount()` hook EXISTS	Task #65 is trivial: `src/app/hooks/useDeviceVerificationStatus.ts:65-106`
Voice player: `AudioContent.tsx:44-223`	Task #8: `playbackRate` on hidden `<audio>` at line 217
Notification sounds: 2 hardcoded `.ogg` files	Task #22: replace paths with `settingsAtom` value
Chat backgrounds: `chatBackground.ts`, `<Page>` in `RoomView.tsx:106`	Task #77: animated backgrounds need CSS class + `::before` pseudo-element
`KeywordMessages.tsx` already has custom keyword push rules	Task #61: only non-keyword rule types need new UI
`StateEventEditor.tsx` in Developer Tools edits any state event	Task #69: build user-friendly ACL UI in Permissions tab
URL preview defaults: `urlPreview: true`, `encUrlPreview: false`	Task #49: DONE — default changed + Warning chip
Private read receipts: `ReceiptType.ReadPrivate` + `markAsRead()` param exist	Task #34: trivially simple
Relations API at `/_matrix/client/v1/` NOT v3	EditHistoryModal uses raw fetch with explicit v1 path
`mx.getContent()` returns post-edit content after SDK applies replacements	EditHistoryModal uses `mEvent.event.content` for the "Original" entry
GIF CSP: `connect-src` on LXC 106 must include `https://*.giphy.com`	Fixed in nginx — live, no deploy needed
`getLocalRoomNamesContent` is now `export`ed from `useRoomMeta.ts`	Used by `RoomNavItem` to avoid duplicating the parse logic
Right-click room menu: 6 items in `RoomNavItem.tsx:70-220`	Task #102: add Mute-duration submenu via `PopOut`
GIF links: render as generic OG preview cards, NOT auto-embedded	Task #42: needs explicit URL pattern detection + `<img>` render
Toolbar buttons sequential array in `RoomInput.tsx`	Task #43: straightforward — no complex layout system
`MessageQuickReactions` already in hover toolbar (4 recent emojis)	Task #92: increase limit + layout tweak
`knockSupported()` utility exists at `matrix.ts:376-391`	Task #58: only need "Request to Join" in `RoomIntro.tsx:25-119`
`CallControl.setMicrophone(bool)` at `CallControl.ts:206-212`	Task #84: call for AFK auto-mute
`CallControl.toggleSound()` at `CallControl.ts:230-251`	Task #100: push-to-deafen — just wire a hotkey to this
matrix-js-sdk has NO arbitrary profile field methods	Task #62: use `mx.http.authedRequest()` for MSC4133
`JumpToTime.tsx` FULLY IMPLEMENTED, wired in `RoomViewHeader.tsx:215`	Task #7: DELETED — already upstream
Poll voting implemented in `PollContent.tsx:189-213`	Task #9: only CREATE UI needed
`getMatrixToRoom()` in `matrix-to.ts` generates invite URLs	Task #24: just add QR code to room settings
`/.well-known/matrix/support` returns 404	Task #67: Jared must CREATE the file; client handles gracefully
MSC4151 report room: HTTP 405 on GET = endpoint exists (POST only)	Task #59: endpoint live, just POST with JSON body
`/timestamp_to_event` returns 401 = endpoint exists	Task #7 deleted — Jump to Date already upstream
`useCallSpeakers.ts` CSS MutationObserver polling	Task #107: TDS ring animation on top of existing data
Highlight animation EXISTS in `layout.css.ts:44-66` (2s infinite keyframe)	Task #81: wire to @mention events, make one-shot (0.6s)
Cindy CANNOT inject audio into EC call stream	Task #88: redesign as local-only soundboard
`toggleSound()` at `CallControl.ts:230-251` mutes EC `<audio>` elements	Task #100: push-to-deafen trivial — hotkey → toggleSound()
Folds uses vanilla-extract in non-TDS, NOT CSS custom properties	Task #74: must create new vanilla-extract theme variant dynamically
Theme presets need ~50 CSS custom properties each	Task #75: significant design work before coding
Sanitizer (`sanitize.ts`) allows table, div, span, a, code, hr	Task #82: LFG HTML card is safe locally; test on Element/FluffyChat
Sanitizer STRIPS `<math>`/MathML tags	Task #56: must also modify sanitizer to add math tags
Service worker EXISTS at `src/sw.ts` (session + media handling)	Task #95: just add `notificationclick` handler to existing sw.ts
No policy list code anywhere in codebase	Task #70: completely additive, zero conflict risk with Draupnir
Notification dispatch: 2 points (ClientNonUIFeatures.tsx:96, :165)	Task #12: 4-line addition across 2 functions + useQuietHours() hook
Developer Tools has current-state browser, NO history	Task #41: build audit log via /messages API with state event filter
Room names not processed (emoji displays fine, truncation may break emoji)	Task #79: simple render improvement; add emoji-aware truncation
Upload preview: `UploadCardRenderer.tsx:19-98`, `RoomInput.tsx:608-639`	Task #36: add compression before file enters upload queue
Room cache: PAGINATION_LIMIT=80 events, no total count API	Task #45: stats limited to loaded history; must label clearly
MSC3489/3672 live location: BOTH false on server	Task #64: BLOCKED
Profile banner: NOT in matrix-js-sdk v41.6.0-rc.0, not in MSC4133 yet	Task #91: DROPPED — not a standard Matrix field

Key file quick reference

What you need	File	Lines
Global keydown hook	`src/app/hooks/useKeyDown.ts`	whole file
Room navigation	`src/app/hooks/useRoomNavigate.ts`	19-72
All room IDs atom	`src/app/state/room-list/roomList.ts`	`allRoomsAtom`
Room unread counts	`src/app/state/room/roomToUnread.ts`	`roomToUnreadAtom`
Overlay portal provider	`src/app/pages/App.tsx`	65
Portal container div	`index.html`	101
Room settings tabs	`src/app/features/room-settings/RoomSettings.tsx`	27-56
State event read/write pattern	`src/app/features/common-settings/general/RoomEncryption.tsx`	42-52
Power level checker	`src/app/hooks/usePowerLevels.ts`	whole file
Slash command registration	`src/app/hooks/useCommands.ts`	140-537
Chat background picker	`src/app/features/settings/general/General.tsx`	945-981
Chat backgrounds definition	`src/app/features/lotus/chatBackground.ts`	whole file
Matrix.to URL builder	`src/app/plugins/matrix-to.ts`	`getMatrixToRoom()`
Media event content types	`src/app/types/matrix/common.ts`	46-91
Media URL conversion	`src/app/utils/matrix.ts`	`mxcUrlToHttp()`
Message pagination (search)	`src/app/features/message-search/useMessageSearch.ts`	74-121
Infinite pagination pattern	`src/app/features/message-search/MessageSearch.tsx`	234-365
Poll event format	`src/app/components/message/content/PollContent.tsx`	1-320
Theme class application	`src/app/hooks/useTheme.ts`	25-60
Animations file	`src/app/styles/Animations.css.ts`	whole file
Message status (EventStatus)	`src/app/features/room/message/Message.tsx`	84-142
Call member change events	`src/app/hooks/useCall.ts`	37-52
Mic control in calls	`src/app/plugins/call/CallControl.ts`	206-212
Device verification hook	`src/app/hooks/useDeviceVerificationStatus.ts`	65-106
Knock room support check	`src/app/utils/matrix.ts`	376-391
Room join button location	`src/app/components/room-intro/RoomIntro.tsx`	25-119
Notification mute via push rules	`src/app/hooks/useRoomsNotificationPreferences.ts`	110-150
Message text body CSS	`src/app/components/message/layout/layout.css.ts`	182-205

COMPLETED

Audit & document: who reacted hover tooltip — README + landing page
Audit & document: sticker/emoji panel — README + landing page
Audit & document: custom status messages — added to README Presence section
Audit & document: pinned messages — confirmed upstream, not added to README

PRIORITY 0 — Quick wins: low complexity, high daily value

These are the easiest items to ship and immediately improve the daily experience. Attack these first; most are single-file changes or simple new components.

[x] P0-1 · Report Room (MSC4151)

Spec: MSC4151, merged ~Matrix spec v1.12. Synapse supports it.
Confirmed: NOT present in upstream Cinny mainline.
What: Add a "Report Room" option in the room header context menu (⋮ or room settings). Opens a modal with a reason text field (required) and a Submit button. Calls:

POST /_matrix/client/v3/rooms/{roomId}/report
Body: { "reason": "string" }

The homeserver forwards the report to server admins.
Where: src/app/features/room/RoomViewHeader.tsx (add menu item), new ReportRoomModal.tsx component.
Complexity: Low — one API call, one modal.
COMPLETED June 2026. Uses mx.reportRoom() SDK method. Category dropdown (Spam/Harassment/Inappropriate/Other). role="dialog" + aria-modal accessibility. Error discrimination (M_LIMIT_EXCEEDED, M_FORBIDDEN, 404). Auto-close 1.5s after success. Hidden for own rooms, server-notice rooms, and rooms on servers not advertising v1.13 (Synapse 1.114+ has the endpoint regardless — spec gate removed). Shown only via Invite menu (not three-dot menu).

[x] P0-2 · Server support contact display (MSC1929)

Spec: MSC1929, stable in Matrix spec.
What: On load (or when Settings → Help & About is opened), fetch:

GET /.well-known/matrix/support

Parse the contacts array and support_page URL. Display in Settings → Help & About:

"Homeserver admin: @jared:matrix.lotusguild.org"
Link to support page if present Cache the response in component state; no repeated fetches.
Where: src/app/features/settings/ Help/About panel.
Complexity: Low — one fetch, display result.
COMPLETED June 2026. Fetches /.well-known/matrix/support via mx.getHomeserverUrl(). AbortController cleanup. JSON type guard. Loading state. Clickable matrix_id → matrix.to link; email_address → mailto: link (both rendered when both present). formatRole() handles all role strings. Server-side: CORS Access-Control-Allow-Origin: * added to LXC 139 (NPM) for /.well-known/matrix/support. Static JSON response configured: @jared:matrix.lotusguild.org (admin), support_page https://matrix.lotusguild.org.

[x] P0-3 · Server notices distinct rendering (m.server_notice)

Spec: CS-API §13.17, stable.
Audit result: CONFIRMED MISSING. Only M_CANNOT_LEAVE_SERVER_NOTICE_ROOM error code exists in src/app/cs-errorcode.ts — no rendering differentiation. Server notices currently arrive as plain DMs.
What: The m.server_notice room type is set in m.room.create content (type: 'm.server_notice'). Detect it via room.getType() === 'm.server_notice'. Render with:

A distinct "Server Notice" header badge (server icon + label) in RoomViewHeader.tsx
Slightly different background color (use color.Warning or neutral surface)
Composer hidden/disabled in server notice rooms (check room type in RoomInput.tsx)
Where: src/app/features/room/RoomViewHeader.tsx (badge), src/app/features/room/RoomInput.tsx (hide composer when room.getType() === 'm.server_notice').
Complexity: Low.
COMPLETED June 2026. "Server Notice" Chip variant="Warning" in room header with tooltip. Read-only composer replaced by informational Box message. Invite, Room Settings, and Report Room menu items hidden for server-notice rooms (both header three-dot menu and sidebar context menu). Distinct Icons.Warning icon for server-notice rooms in getRoomIconSrc(). Detection via room.getType() === 'm.server_notice' (type-based, not name-based).

[BLOCKED] P0-4 · Reaction / relation redaction (MSC3892)

Spec: MSC3892, in Final Comment Period.
Server check result: org.matrix.msc3892 is NOT in the server's unstable_features list — NOT supported. Current full-event redaction behavior is correct and should not be changed. This task is BLOCKED until the homeserver adds MSC3892 support. No action needed now.
Complexity: N/A — blocked.

[x] P0-5 · Rich room topic rendering (MSC3765)

Spec: MSC3765, merged Matrix spec v1.15.
Server status: Server reports v1.12 — MSC3765 not formally available. However, the formatted_body field on m.room.topic state events is part of the generic Matrix content structure and can be stored/read regardless of spec version. The rendering improvement is worthwhile to build now: it will activate whenever any room admin sets a formatted topic.
What: Pipe the formatted_body of the m.room.topic state event through the existing sanitizeCustomHtml() + html-react-parser pipeline (same as message bodies). Fall back to plain body if no formatted_body present.
Where: src/app/features/room/RoomViewHeader.tsx — where the topic string is rendered.
Complexity: Low — reuse existing HTML renderer pipeline.
COMPLETED June 2026. RoomTopicViewer renders formatted_body via sanitizeCustomHtml + html-react-parser. Header shows clean plain-text preview (markdown symbols stripped); click opens full formatted modal. RoomIntro.tsx also shows clickable topic that opens the same viewer. Room Settings topic editor: buildTopicContent() auto-detects markdown syntax and saves format: "org.matrix.custom.html" + formatted_body + stripped plain topic; B/I/S/code formatting toolbar above the textarea. sanitize.ts hex regex updated to support 3/4/6/8-digit CSS4 hex colors.

[x] P0-6 · Edit history viewer

Spec: CS-API §11.8.2 (stable). Edit history is stored as m.replace relation events.
Audit result: Confirmed NOT in upstream Cinny. The "edited" label shows on messages (Message.tsx:1231) but clicking it does nothing. getEventEdits() is used internally but no history modal exists.
What: Click the "edited" label → popover/modal lists every prior version with timestamps. Fetch via GET /_matrix/client/v1/rooms/{roomId}/relations/{eventId}/m.replace. Show each version's body + timestamp. Use folds Overlay+Modal pattern.
Where: src/app/features/room/message/Message.tsx — find where "edited" label renders (line ~1231) and add onClick handler that opens the history modal.
Complexity: Low — one API call, display list.
COMPLETED June 2026. EditHistoryModal.tsx — fetches via raw fetch to /_matrix/client/v1/rooms/.../relations/.../m.replace (v1, not v3 — Synapse only supports relations at v1). isRawEditEvent type guard, next_batch truncation indicator (50-edit limit). Formatted HTML rendered via sanitizeCustomHtml + html-react-parser with Linkify fallback. role="dialog" + aria-modal accessibility. Critical fix: "Original" entry uses mEvent.event.content (raw server data) not mEvent.getContent() (SDK returns post-edit content after applying replacements) — prevents original and edit-1 showing identical text.

[BLOCKED] P0-7 · Room preview before joining (MSC3266)

Spec: MSC3266, merged Matrix spec v1.15.
Server check result: GET /_matrix/client/v1/rooms/{roomId}/summary returned 404 on matrix.lotusguild.org. Endpoint not available despite Synapse 1.153.0.
Audit result: Confirmed NOT in upstream Cinny — no pre-join preview screen exists.
Status: BLOCKED until homeserver exposes the /summary endpoint. When unblocked: build a preview card (avatar, name, topic, member count, join rule) shown before the user joins, with Join/Request/Accept buttons.
Complexity: Low-medium (when unblocked).

[x] P0-8 · Personal room name overrides (MSC4431)

Spec: MSC4431, still in review.
Server check: Uses standard account data (PUT /user/{userId}/account_data/) which is universally supported regardless of MSC status. Safe to implement now; use io.lotus.room_names as the account data key until MSC4431 is finalized (may need to rename key when merged).
What: Right-click room in sidebar → "Rename for me…" → input dialog → saves to account data. Show a small ✏ icon next to locally-renamed rooms. useRoomName() hook in useRoomMeta.ts:19-35 — override its return value when a local rename exists for that roomId.
Where: Room nav item context menu (RoomNavItem.tsx), sidebar room list via useRoomName() hook.
Complexity: Low.
COMPLETED June 2026. useLocalRoomName + useHasLocalRoomName in useRoomMeta.ts. Account data key io.lotus.room_names. RenameRoomDialog with maxLength={255}, clear/save, pre-fills with current custom name. Pencil indicator with config.opacity.P300. FocusTrap nesting fixed (dialog rendered outside menu, menu closes before dialog opens). getLocalRoomNamesContent exported for shared use. Local name applied consistently across: room header (RoomViewHeader), sidebar nav (RoomNavItem), room intro (RoomIntro), call overlay (CallRoomName). Reactive to cross-device account data updates via ClientEvent.AccountData.

[UPSTREAM — REMOVED] P0-9 · "Back to Latest" button

Audit result: CONFIRMED UPSTREAM. handleJumpToLatest() + floating "Jump to Latest" Chip already exist in RoomTimeline.tsx:2180-2192. Task #104 (unread count + animation improvement) remains in the build queue.

[UPSTREAM — REMOVED] P0-10 · Mark all rooms as read

Audit result: CONFIRMED UPSTREAM. Per-section "Mark as Read" exists at Home.tsx:73-102 (home rooms) and DirectTab.tsx:29-61 (DMs). No global all-sections version — but that was agreed not needed.

[x] P0-11 · Spoiler text audit and fix if broken

What: The message composer toolbar has a spoiler mark (||spoiler text||). Verify the end-to-end flow:

Composer correctly wraps text in <span data-mx-spoiler> in formatted_body
Timeline renderer displays spoiler as blurred/hidden text with a "Reveal" click
Mobile touch works for reveal
If any step is broken, fix it. If all working correctly, close this task with no changes.
[AUDIT REQUIRED] — Full code audit of spoiler mark in toolbar → event content → timeline renderer.
Complexity: Low (audit) — fix complexity TBD.
COMPLETED June 2026 — NO CHANGES NEEDED. Full audit confirmed: spoiler composing (data-md + data-mx-spoiler in markdown/inline/rules.ts:99), MSC4193 stable property name at types/matrix/common.ts:5, rendering in react-custom-html-parser.tsx:461, image/video spoiler support in ImageContent.tsx and VideoContent.tsx. All working correctly.

[x] P0-12 · URL Preview default settings + security warning

Audit result: settings.ts line 103: urlPreview: true (already on by default) · line 104: encUrlPreview: false (encrypted rooms OFF by default).
What: Change encUrlPreview default to true in src/app/state/settings.ts. Add a one-sentence security note next to the encrypted-room toggle in the settings UI:

"URL previews in encrypted rooms are fetched by your homeserver, which sees the URL but not the message content."
Where: src/app/state/settings.ts line 104 (change default), settings UI file for URL preview toggles (find via grep for encUrlPreview).
Complexity: Very Low — one default value change + one sentence of UI text.
COMPLETED June 2026. encUrlPreview default → true. Encrypted URL preview setting now shows: description text explaining homeserver sees all URLs + Chip variant="Warning" fill="Soft" badge "Privacy risk — enabled by default". Plain urlPreview setting also got a description. Both labels corrected to "URL Preview" (was "Url Preview").

PRIORITY 1 — High value, moderate effort

Core features that meaningfully expand what users can do every day.

[UPSTREAM — REMOVED] P1-1 · Quick Room Switcher (Ctrl+K / Cmd+K)

Audit result: CONFIRMED UPSTREAM. SearchModalRenderer (Ctrl+K) in src/app/features/search/Search.tsx is already a full room/DM switcher with avatars, unread badges, fuzzy search across all rooms and DMs, and keyboard navigation. It is more polished than anything we would build. A custom QuickSwitcher.tsx was built and then deleted — Ctrl+K was left to the existing upstream implementation.
No action needed.

[x] P1-2 · Media Gallery

What: A scrollable grid of all shared images, videos, and files in a room. Accessible via a new icon in the room header (picture/grid icon). Features:

Tab bar: Images | Videos | Files
Infinite scroll / paginated load via GET /rooms/{roomId}/messages filtering for m.image, m.video, m.file msgtypes
Click image → full-screen lightbox (upstream Cinny lightbox)
Click file → download
Shows sender + timestamp tooltip on hover
TDS-aware grid styling
Complexity: Medium.
COMPLETED June 2026. MediaGallery.tsx renders as a fixed right-side drawer (320px). Three tabs: Images | Videos | Files. Reads already-decrypted events from room.getLiveTimeline().getEvents() (required for E2EE rooms — raw API returns undecryptable blobs). For encrypted images, shows a lock icon + filename placeholder (server can't thumbnail encrypted content). Unencrypted thumbnails use mxcUrlToHttp(mx, url, false, 120, 120, 'crop') — useAuthentication=false avoids the v1 authenticated endpoint that adds allow_redirect=true, which Synapse rejects with 400. Load More uses mx.paginateEventTimeline(). Gallery icon added to room header (Desktop only).

[x] P1-3 · Sidebar Room Filter / Search

What: A text input at the top of each room list tab (Home, DMs, Spaces) that filters visible rooms in real time by display name. Ephemeral — clears when you switch tabs. No server calls — pure client-side filter over the loaded room list.
Complexity: Low-Medium.
COMPLETED June 2026. Filter inputs added to Home.tsx (rooms) and Direct.tsx (DMs). Styled with size="400", radii="400", search icon prefix — matches the members-drawer search bar style. Clear × button appears when non-empty. Filtering respects local room name overrides (getLocalRoomNamesContent). Favorites section always shows unfiltered; only the main "Rooms" list is filtered. Input fills full panel width (grow="Yes" on container Box).

[x] P1-4 · Enhanced DM List (last message preview + timestamp)

What: Show the last message text and relative timestamp ("2 min ago", "Yesterday") next to each DM in the sidebar, like iMessage or WhatsApp. Currently only the room name and unread badge are shown.
Complexity: Medium.
COMPLETED June 2026. Implemented in RoomNavItem.tsx via useRoomLatestRenderedEvent(room) hook (reactive — re-renders on new events). When direct=true: shows truncated body (48 chars) + relative timestamp below the room name. Handles: encrypted events (shows "Encrypted message" only on actual decryption failure — isDecryptionFailure() not isEncrypted()), stickers ("Sticker"), membership events (skipped entirely), missing timestamps. Timestamp formatting: Xm / Xhr / Yesterday / D MMM.

[x] P1-5 · Voice Message Playback Speed Control

What: Add a speed toggle to the voice message audio player in the room timeline: 0.75× → 1× → 1.5× → 2×. Clicking the current speed label cycles to the next. Uses the HTML <audio> element's playbackRate property.
Complexity: Low-Medium.
COMPLETED June 2026. AudioContent.tsx — useState<0.75|1|1.5|2>(1) with SPEED_STEPS = [0.75, 1, 1.5, 2]. useEffect sets audioRef.current.playbackRate when speed changes (persists across pause/resume). Speed pill rendered as a Chip in the left controls area. Local state only (no settingsAtom persistence — speed resets per-message, which is the standard behavior).

[x] P1-6 · Poll Creation

What: Users can create polls from the message composer. Features:

"Create Poll" toolbar button (poll icon) in RoomInput.tsx
Modal: question field (required) + 2–10 answer options (add/remove dynamically) + single vs. multiple choice toggle
Sends m.poll.start event (Matrix 1.7 stable format — same JSON we already render):

{
  "type": "m.poll.start",
  "content": {
    "m.poll": {
      "question": { "m.text": "..." },
      "answers": [{ "m.id": "uuid", "m.text": "Option 1" }, ...],
      "max_selections": 1
    }
  }
}

mx.sendEvent(roomId, 'm.poll.start', content)
Architecture:
New component: src/app/features/room/PollCreator.tsx
Wire toolbar button into src/app/features/room/RoomInput.tsx (follow GIF picker pattern)
Complexity: Medium.
COMPLETED June 2026. PollCreator.tsx — modal with question input, 2–10 option inputs (add/remove), Single/Multiple choice toggle buttons. isMultiple: boolean state with max_selections computed at submit time from filled options length. Sends stable m.poll.start event. Icons.OrderList button in RoomInput after prop opens the modal. Sentry issue JAVASCRIPT-REACT-N fixed: PollContent.tsx vote handler now .catch(() => undefined) to suppress Cannot call getPendingEvents with pendingEventOrdering == chronological SDK error.

[x] P1-7 · Code Syntax Highlighting in Messages

What: Color-code fenced code blocks in rendered messages. Language auto-detected from the code fence hint (```python, ```js, etc.).
⚠️ MUST match /root/code/web_template/base.css exactly. The web_template defines the canonical token structure for all Lotus apps:

.lt-code-block — container: bg-secondary, border-dim border
.lt-code-header — header bar with language label + copy button
- .lt-code-lang — mono font, accent-orange, uppercase, 0.1em letter-spacing
- .lt-code-copy — dim border/color; hover → cyan; .copied state → green
.lt-code-block pre — mono font, 0.8rem, 1.6 line-height, max-height 400px, scrollable
Syntax token classes (custom tokenizer, NOT highlight.js/Prism):
- .tok-kw → var(--accent-cyan) (keywords)
- .tok-str → var(--accent-green) (strings)
- .tok-num → var(--accent-orange) (numbers)
- .tok-cmt → var(--color-tok-cmt) italic (comments)
- .tok-fn → var(--accent-purple) (function names) See /root/code/tinker_tickets/assets/js/markdown.js for the reference tokenizer implementation.
  [AUDIT REQUIRED] — Check the TDS CSS variables (--accent-cyan, --accent-green, etc.) are available in Cinny's lotus-terminal.css.ts vanilla-extract theme. Map var(--accent-*) to the correct folds/vanilla-extract tokens. Also verify the tokenizer approach from tinker_tickets is language-agnostic enough for chat (it may need extension for more languages).
  Where: Code block renderer in src/app/components/message/ or wherever <pre><code> is rendered.
  Complexity: Medium.
  COMPLETED June 2026. src/app/utils/syntaxHighlight.ts — custom tokenizer returning SyntaxToken[] with inline styles from --lt-accent-* CSS variables. Supports: JS/TS/JSX/TSX, Python, Rust. Tokens: kw (cyan), str (green), num (orange), cmt (italic, opacity 0.5), fn (purple). Integrated in react-custom-html-parser.tsx via TDS_TOKENIZER_LANGS set — falls back to ReactPrism for unsupported languages. ReactPrism.css adds .prism-tds-dark / .prism-tds-light classes. useTheme.ts sets prism-tds-dark/light on the LotusTerminal themes.

[x] P1-8 · Favorite / Starred Rooms

What: Star any room from its context menu. Starred rooms appear in a dedicated "Favorites" section at the top of the sidebar room list. Uses Matrix's built-in m.favourite room tag (account data), so favorites sync across devices and clients automatically.

PUT /_matrix/client/v3/user/{userId}/rooms/{roomId}/tags/m.favourite
Body: { "order": 0.5 }

Right-click room → "Add to Favorites" / "Remove from Favorites"
Favorites section appears above the regular room list in the Home tab
Star icon shown on favorited rooms in the list
Complexity: Medium.
COMPLETED June 2026. RoomNavItem.tsx context menu: "Add to Favorites" / "Remove from Favorites" calls mx.setRoomTag(roomId, 'm.favourite', { order: 0.5 }) / mx.deleteRoomTag(roomId, 'm.favourite'). Star indicator shown on favorited rooms. Home.tsx: rooms split into favoriteRooms / otherRooms by room.tags?.['m.favourite']. Favorites section (with its own NavCategory + favVirtualizer) rendered above the main Rooms list when any favorites exist. FAVORITES_CATEGORY_ID is collapsible.

[x] P1-9 · Invite Link Generator (with QR code)

What: In room settings (or via right-click on room), a "Copy Invite Link" button that:

Generates a matrix.to URL: https://matrix.to/#/!roomId:server?via=matrix.lotusguild.org
Copies it to clipboard via navigator.clipboard.writeText()
Shows a QR code of the link (use a lightweight QR library e.g. qrcode npm package)
"Share" button that opens the native Web Share API if supported
Where: Room settings panel src/app/features/room-settings/ or room header context menu.
Complexity: Low-Medium.
COMPLETED June 2026. RoomShareInvite.tsx — new component in common-settings/general/. Shows invite URL as copyable text + 160×160 QR code (api.qrserver.com). "Copy Link" button with 2s "Copied!" state. Added to room settings General tab. Also added to the Invite User modal (InviteUserPrompt.tsx): ⊞ toggle button in header shows/hides a 180×180 QR panel between the header and user search form. CSP on LXC 106 updated to add https://api.qrserver.com to img-src (nginx reloaded).

[x] P1-10 · Private Read Receipts toggle

Spec: CS-API stable — m.read.private vs m.read.
What: Add a toggle in Settings → Privacy: "Send private read receipts" — when enabled, read receipts are sent as m.read.private (only you and the server see them) instead of m.read (everyone in the room sees when you read). Default: public (current behavior, unchanged).
Architecture:

New settingsAtom field: privateReadReceipts: boolean (default false)
When sending a read receipt, check the setting and use the appropriate type
Find mx.sendReadReceipt(...) call sites and add the receiptType parameter
Complexity: Low.
COMPLETED June 2026. privateReadReceipts: boolean (default false) in settingsAtom. Toggle in Settings → General → Privacy section. notifications.ts: markAsRead() already had privateReceipt parameter; added getSettings().privateReadReceipts read so either flag independently triggers ReceiptType.ReadPrivate. getSettings() reads from localStorage which is always kept in sync with the atom via setSettings() on every atom write — no staleness issue.

[x] P1-11 · Knock-to-join UX (Room version 7)

Spec: Room version 7 (stable Matrix spec). Join rule: knock.
What: Full knock UX for both sides:

Knocking: When a room's join rule is knock, show a "Request to Join" button instead of "Join Room". Sends POST /join which triggers a knock state event. Show pending state ("Request sent") while waiting.
Approving knocks: Room admins/mods see a notification of pending knocks. In the members drawer or room settings, show a "Pending Requests" section listing knockers with "Approve" (/invite) and "Deny" (/kick) buttons.
Complexity: Medium.
COMPLETED June 2026. RoomIntro.tsx: when room.getJoinRule() === JoinRule.Knock, shows "Request to Join" button instead of "Join Room". On click: mx.knockRoom(room.roomId) (SDK method confirmed). After knocking: shows "Request sent — waiting for room admin approval" state. State resets on room.roomId change via useEffect. MembersDrawer.tsx: "Pending Requests" section visible to users with invite power level — lists room.getMembersWithMembership(Membership.Knock) with Approve (mx.invite) / Deny (mx.kick) buttons.

PRIORITY 2 — Good value, medium effort or lower daily frequency

[x] P2-1 · Jump to Date

What: A calendar date picker accessible from the room header (small calendar icon). Selecting a date navigates the timeline to the first message on or after that date.
API: GET /_matrix/client/v1/rooms/{roomId}/timestamp_to_event?ts={epochMs}&dir=f
Returns { event_id, origin_server_ts }. Then scroll the timeline to that event ID using the existing scrollToEventId / virtual paginator logic.
[SERVER CHECK] — Verify matrix.lotusguild.org Synapse supports the /timestamp_to_event endpoint (added in Synapse 1.73 / Matrix spec v1.6).
[AUDIT REQUIRED] — Understand how RoomTimeline.tsx handles navigating to an arbitrary event ID that may not be in the current timeline window. The virtual paginator may need to fetch backwards to that event.
Where: src/app/features/room/RoomViewHeader.tsx (button), new JumpToDate.tsx component.
Complexity: Medium.

COMPLETED June 2026 — already upstream. JumpToTime.tsx in upstream Cinny is a full date+time picker that calls mx.timestampToEvent() and wires into RoomViewHeader.tsx:215 via navigateRoom(). No custom work needed.

[x] P2-2 · Custom Notification Sounds

What: Let users pick from a set of built-in notification sounds for mentions, messages, and DMs. Features:

Settings → Notifications: sound selector per category (Mention / Message / DM)
Each option has a preview "▶ Play" button
"None" option to disable sound for that category
4–6 built-in sounds shipped as audio files in public/sounds/
Stored in settingsAtom
Architecture:
Add notificationSounds: { mention: string, message: string, dm: string } to settingsAtom
In ClientNonUIFeatures.tsx (where notification sounds are currently played), swap out the hardcoded sound URL for the settings value
[AUDIT REQUIRED] — Find exactly where notification sounds play in the codebase. Search for new Audio( or .play() in src/app/. Confirm how many distinct notification categories currently exist.
Complexity: Medium.

COMPLETED June 2026. messageSoundId / inviteSoundId settings ('notification'|'invite'|'call'|'none'). Shared NOTIFICATION_SOUND_MAP in src/app/utils/notificationSounds.ts. Settings → Notifications expands the sound toggle to show Message Sound and Invite Sound selectors with ▶ preview buttons. Audio element src updates reactively via useEffect. playPreview() catches .play() rejections.

[x] P2-3 · Sort Non-Space Rooms on Home Page

What: A sort control on the Home tab for orphan rooms (rooms not in any space). Options:

Unread first — rooms with unread messages appear at top
Recent activity — sort by room.getLastActiveTimestamp()
Alphabetical — sort by display name A→Z Persisted in settingsAtom as homeRoomSortOrder: 'unread' | 'recent' | 'alpha'. Default: 'recent'.
Note: Space rooms are reordered by space admins via the Space Lobby — this only affects non-space orphan rooms on the Home tab.
[AUDIT REQUIRED] — Find where orphan rooms are listed on the Home tab. Confirm which hook/atom provides the room list (useOrphanRooms() in roomList.ts). Verify the sort is applied purely client-side with no server calls needed.
Complexity: Medium.

COMPLETED June 2026. homeRoomSort: 'recent'|'alpha'|'unread' setting (default 'recent'). factoryRoomIdByUnread comparator in Home.tsx. Sort icon button in Rooms NavCategoryHeader opens PopOut menu. Persists via settings. Collapsed state always shows unread-only regardless of sort.

[x] P2-4 · Export Room History

What: Export a room's messages to plain text, JSON, or HTML. Accessible from room settings (gear icon → "Export Room History"). Features:

Format selector: Plain Text / JSON / HTML
Date range filter (optional: all time or custom range)
Only exports messages where E2EE decryption keys are available locally
Shows progress bar for large rooms (batched /messages calls)
Downloads as a file via URL.createObjectURL(blob) + <a download>
Note: Element already has this feature — mention in the landing page comparison table once implemented.
Landing page update: Add "Export room history" row to /root/code/matrix/landing/index.html comparison table.
[AUDIT REQUIRED] — Confirm upstream Cinny does NOT have an export feature. Check room settings panels.
Complexity: Medium.

COMPLETED June 2026. ExportRoomHistory.tsx in Room Settings → Export tab. Supports Plain Text, JSON, and HTML formats with optional start/end date range filters. Paginates backwards via mx.paginateEventTimeline() with a live progress counter. E2EE-aware — skips events where decryption failed rather than exporting garbled ciphertext. Generates a Blob and triggers a browser download via URL.createObjectURL + a temporary <a download> element.

[x] P2-5 · Notification Quiet Hours

What: Set a daily time window when browser notifications are suppressed (e.g., 11:00 PM – 8:00 AM). Toggle + start/end time pickers in Settings → Notifications.
Architecture:

New settingsAtom field: quietHours: { enabled: boolean, start: string, end: string } (times as "HH:MM" 24h strings)
In ClientNonUIFeatures.tsx or SystemNotification.tsx, before dispatching a browser Notification, check:

function isQuietHours(settings): boolean {
  if (!settings.quietHours.enabled) return false;
  const now = new Date();
  const [sh, sm] = settings.quietHours.start.split(':').map(Number);
  const [eh, em] = settings.quietHours.end.split(':').map(Number);
  // handle overnight ranges (e.g. 23:00 – 07:00)
  ...
}

Client-side only — does not touch Synapse push rules
[AUDIT REQUIRED] — Find the exact location in the codebase where browser Notification objects are created. Confirm no other code paths trigger sounds/notifications that also need to be suppressed.
Complexity: Medium.

COMPLETED June 2026. quietHoursEnabled/Start/End settings (defaults false/'23:00'/'08:00'). isInQuietHours() handles overnight spans; start===end=disabled. Both InviteNotifications and MessageNotifications gate notify()+playSound() behind quiet hours check. Settings → Notifications: Quiet Hours card with Switch + two pickers.

[x] P2-6 · Room Activity / Moderation Log

What: A filterable log of room state changes, accessible from room settings. Shows:

Member joins, leaves, kicks, bans, unbans
Power level changes ("@alice promoted to Moderator by @bob")
Room name / topic / avatar changes
Server ACL changes Filter controls: event type, date range, user. Sorted newest-first.
Fetches via /rooms/{roomId}/messages?filter={"types":["m.room.member","m.room.power_levels",...]} paginated backwards.
[AUDIT REQUIRED] — Check if upstream Cinny already has a room audit log. Also check if Synapse's admin API provides a richer audit log that could be used instead (admin only).
Complexity: Medium.

COMPLETED June 2026. RoomActivityLog.tsx in Room Settings → Activity tab. Fetches and displays a filterable log covering m.room.member (join/leave/kick/ban/unban/invite), m.room.power_levels, m.room.name, m.room.topic, m.room.avatar, and m.room.server_acl events. Each entry renders a human-readable description and relative timestamp. A type-filter dropdown narrows the view. Load More button appends older events; auto-paginates on mount to ensure an initial set of entries is visible.

[x] P2-7 · Richer Link Preview Cards

What: Expand URL preview cards beyond generic title/description/image:

YouTube: Show video thumbnail with a ▶ play overlay, channel name, duration
GitHub: Show repo name, description, star count, language badge, last updated
Twitter/X: Show avatar, handle, tweet text, likes/retweets (if metadata available)
Generic improvement: Better fallback when OG tags are missing
Architecture:
URL preview data comes from GET /_matrix/media/v3/preview_url?url=... (or the client-side oEmbed if homeserver doesn't provide enough data)
Detect URL domain/pattern and render a domain-specific card component
[AUDIT REQUIRED] — Check what data /_matrix/media/v3/preview_url returns for YouTube/GitHub links on matrix.lotusguild.org. The homeserver proxies this call — the richness depends on what metadata the target site exposes and what Synapse extracts. Test with real URLs before building domain-specific card logic.
Complexity: Medium.

COMPLETED June 2026. UrlPreviewCard.tsx now implements domain-specific card layouts for 13 domains: YouTube (thumbnail + ▶ play overlay), Vimeo, GitHub (repo description parse), Twitter/X (tweet text parse + media), Reddit (subreddit + upvotes + comments), Spotify (artwork), Twitch (LIVE badge + game), Steam, Wikipedia, Discord (server invite styling), npm, Stack Overflow, and IMDb (poster). Generic cards gain a favicon from https://www.google.com/s2/favicons. Cards that produce no renderable content (empty title, no image) are suppressed entirely rather than showing a blank box.

[x] P2-8 · Extended Profile Fields (MSC4133 + MSC4175)

Spec: MSC4133 + MSC4175, merged Matrix spec v1.16.
What: Support arbitrary profile fields. Specifically:

m.tz — IANA timezone string (e.g. "America/New_York")
m.pronouns — user's pronouns (e.g. "they/them")
Custom fields: job title, website
Display: Show set fields in the user profile panel/card.
Set: In Settings → Account → Profile, add input fields for each.
API: PUT /_matrix/client/v3/profile/{userId}/{field_name} / GET /_matrix/client/v3/profile/{userId}
[SERVER CHECK] — Verify matrix.lotusguild.org Synapse version supports MSC4133. This was merged in spec v1.16 (late 2025). May require a Synapse update if the server is running an older version.
[AUDIT REQUIRED] — Check if the matrix-js-sdk version in use exposes methods for getting/setting arbitrary profile fields beyond displayname and avatar_url. If not, use mx.http.authedRequest() directly.
Complexity: Medium.

COMPLETED June 2026. useExtendedProfile hook reads and writes MSC4133 extended profile fields via mx.http.authedRequest() to PUT /_matrix/client/unstable/uk.tcpip.msc4133/{userId}/{field}. Settings → Account → Profile now includes Pronouns (m.pronouns) and Timezone (m.tz) fields with Save buttons. Both fields are displayed in user profile panels alongside the display name and avatar when set.

[x] P2-9 · Show User Local Time in Profile (MSC4175)

Depends on: P2-8 (Extended Profile Fields) — needs m.tz to be fetchable.
What: In user profile cards and the member list sidebar, when a user has m.tz set, display their current local time:

"Local time: 3:42 PM (UTC-5)"
Updates every minute via setInterval
Shows a small clock icon before the time
[AUDIT REQUIRED] — Depends on #P2-8 being implemented first. The m.tz field must be readable from the profile API.
Complexity: Low (once P2-8 is done).

COMPLETED June 2026. useLocalTime hook formats the user's current local time using Intl.DateTimeFormat with their m.tz IANA timezone. Updates every 60 seconds via setInterval. User profile panels display a clock icon, the formatted time, and the timezone abbreviation (e.g. EST, JST). Respects the user's hour24Clock setting for 12 vs 24-hour display. Renders nothing if m.tz is not set.

[x] P2-10 · Unverified Device Warning on Send (off by default)

What: Show a subtle warning in the composer area when a message will be sent to a room containing unverified devices. Features:

Off by default — toggled in Settings → Security ("Warn before sending to unverified devices")
When enabled: a small shield icon + "X unverified devices in this room" warning appears above the send button
User can click to see which devices, or dismiss and send anyway
Architecture:
Add warnOnUnverifiedDevices: boolean (default false) to settingsAtom
When setting is on, before rendering the composer, check room members' device trust via mx.getCrypto()?.getUserDeviceInfo() or equivalent
Do NOT block sending — just warn
[AUDIT REQUIRED] — Verify what the matrix-js-sdk (version in use) exposes for checking device verification status per room. The Crypto API varies significantly between SDK versions. This is the riskiest part of this feature.
Complexity: Medium.

COMPLETED June 2026. warnOnUnverifiedDevices setting added (default false), toggled via Settings → General → Privacy. When enabled, a Warning.Container banner appears above the composer in encrypted rooms containing unverified devices, showing the count and a link to the room's device list. Uses the existing useUnverifiedDeviceCount() hook. Sending is never blocked — the banner is informational only.

[x] P2-11 · Full Push Rule Editor

Spec: CS-API §13.13 (stable).
What: A dedicated page in Settings → Notifications showing the full push rule tree:

Override rules (highest priority)
Content rules (keyword matching)
Room rules (per-room overrides)
Sender rules (per-user overrides)
Underride rules (lowest priority) User can: create custom keyword rules, enable/disable any rule, set highlight/notify/silent action, delete custom rules.
API: GET /_matrix/client/v3/pushrules/ / PUT / DELETE per rule.
[AUDIT REQUIRED] — Audit the existing notification settings UI in src/app/features/settings/. Confirm exactly which push rules are already exposed and which are missing. The per-room and global mute controls likely use push rules under the hood.
Complexity: Medium-High.

COMPLETED June 2026. Settings → Notifications now includes an "Advanced Push Rules" section covering override, room, sender, and underride rule kinds (content/keyword rules were already handled by the upstream KeywordMessages UI). Each rule row shows a human-readable label for built-in rules, an enable/disable toggle, and a delete button for custom rules. A collapsible add-rule form at the bottom of the room and sender sections lets users create new per-room or per-sender rules by entering the room/user ID.

[x] P2-12 · Server ACL Viewer/Editor (m.room.server_acl)

Spec: CS-API §13.8 (stable), m.room.server_acl state event.
What: In room settings (visible to admins/mods with sufficient power level), show the current server ACL:

List of allowed servers (wildcard patterns supported: *.example.com)
List of denied servers
Toggle: "Allow IP literal addresses" (default: false)
Add/remove server entries
Save sends mx.sendStateEvent(roomId, 'm.room.server_acl', content)
[AUDIT REQUIRED] — Confirm the required power level to change m.room.server_acl (typically 50 or 100). The UI should only render for users with sufficient power. Check if upstream Cinny exposes any ACL UI.
Complexity: Medium.

COMPLETED June 2026. RoomServerACL.tsx in Room Settings → Server ACL tab. Reads the current m.room.server_acl state event and displays editable allow and deny server lists with wildcard pattern validation. An "Allow IP literal addresses" toggle controls the allow_ip_literals field. Users without the required state-event power level see the lists as read-only with an explanatory note. Saving sends the updated state event via mx.sendStateEvent().

PRIORITY 3 — Valuable but higher complexity or lower daily frequency

[x] P3-1 · Message Bookmarks / Saved Messages

What: Save any message for later reference. Features:

"Bookmark" action in the message context menu
Saved to Matrix account data: PUT /_matrix/client/v3/user/{userId}/account_data/io.lotus.bookmarks
Structure: { bookmarks: [{ roomId, eventId, savedAt, previewText }] }
Dedicated sidebar panel (new icon in sidebar nav): list of bookmarks with room name, message preview, timestamp, and "Jump to message" button
Remove bookmark from the panel or from the message context menu
Architecture:
New hook: useBookmarks() for read/write account data
New panel: src/app/features/bookmarks/BookmarksPanel.tsx
Add sidebar icon
[AUDIT REQUIRED] — Confirm upstream Cinny has no bookmark/saved messages feature.
Complexity: Medium-High.

COMPLETED June 2026. Star icon in the sidebar nav opens BookmarksPanel.tsx as a right-side panel (mirrors the members list). Right-clicking any message shows "Bookmark" / "Remove Bookmark" in the context menu. Bookmarks stored in io.lotus.bookmarks account data with a 500-entry cap; syncs across devices via account data events. The panel offers a text filter, "Jump to message" deep-link buttons, and individual remove buttons per entry.

[x] P3-2 · Message Scheduling / Send Later (MSC4140)

Spec: MSC4140 (Delayed Events). Status: Synapse-stable, not yet in formal spec.
First: SSH to compute-storage-01 → pct exec 151 -- bash (LXC 151 = Synapse) and check:

grep -i "delayed\|msc4140" /etc/matrix-synapse/homeserver.yaml
# Also check:
curl -s https://matrix.lotusguild.org/_matrix/client/unstable/org.matrix.msc4140/delayed_events

If supported: Implement send-later UI:

Hold send button (or right-click → "Schedule…") to open a date/time picker
On confirm: POST /_matrix/client/unstable/org.matrix.msc4140/rooms/{roomId}/send/{eventType}?delay={ms}
Scheduled messages appear in a "Scheduled" tray in the composer area
Can be cancelled before they fire via the MSC4140 cancel endpoint
If not supported: Either enable it in Synapse homeserver.yaml, or implement client-side localStorage queue as a fallback.
[SERVER CHECK] — The Synapse audit above is REQUIRED before any implementation work.
Complexity: Medium (if server supports) / High (if needs server config change + client fallback).

COMPLETED June 2026. MSC4140 confirmed enabled on matrix.lotusguild.org. A clock button next to the send button opens ScheduleMessageModal.tsx with a message textarea and a datetime picker. On confirm, the message is sent via the MSC4140 delayed events API (POST /_matrix/client/unstable/org.matrix.msc4140/rooms/{roomId}/send/m.room.message?delay={ms}). A collapsible "Scheduled" tray above the composer lists all pending scheduled messages; each entry has a Cancel button that calls the MSC4140 delete endpoint. Scheduled message state is tracked in scheduledMessages.ts.

[x] P3-3 · File Upload Compression (opt-in)

What: Before uploading images, present the user with an explicit choice:

Checkbox: "Compress image before uploading"
Detail text: "Reduces file size and loads faster for everyone. May slightly reduce quality."
Show: Original size (e.g. "4.2 MB") → Compressed size estimate (e.g. "~380 KB")
Show: Original dimensions if downsizing
User must explicitly check the box — compression is NEVER automatic.
Architecture:
Use browser Canvas API: canvas.toBlob(cb, 'image/jpeg', 0.82) for compression
Show before/after sizes in the upload preview UI
Only applies to JPEG and PNG; skip for GIF, SVG, WebP
[AUDIT REQUIRED] — Find where image upload preview currently shows in RoomInput.tsx. The compression step needs to insert between "file selected" and "upload confirmed".
Complexity: Medium.

COMPLETED June 2026. The upload preview in UploadCardRenderer.tsx now shows a "Compress" checkbox for JPEG and PNG files. When checked, a Canvas API call (canvas.toBlob(..., 'image/jpeg', 0.82)) produces a compressed blob client-side. The preview displays both the original size and the compressed size estimate. Compression is strictly opt-in — the checkbox is unchecked by default and GIF/SVG/WebP files skip the option entirely. The compressed blob is substituted into the upload queue when the user confirms.

[ ] P3-4 · Accessibility Improvements (WCAG 2.1 AA)

What: Comprehensive audit and fix pass targeting the critical user paths:

Room list navigation (keyboard-only)
Reading messages in the timeline (screen reader announces new messages)
Composing and sending a reply
Opening and closing modals (focus trap, return focus)
ARIA labels on all icon-only buttons
Scope: Do NOT attempt to make every corner of the app AA-compliant in one pass — focus on the golden path (open app → find room → read → reply → send).
[AUDIT REQUIRED] — Run an automated audit first: npx axe-core or browser DevTools accessibility tree. Document every violation before writing a single line of code. Prioritize by severity (critical > serious > moderate).
Complexity: Medium-High (audit is the main work).

[x] P3-5 · Inline GIF Preview for Giphy/Tenor Links

[AUDIT REQUIRED — DO THIS FIRST] — Before any implementation, verify the current behavior:

Paste a Giphy URL (e.g. https://giphy.com/gifs/...) into the Lotus Chat composer and send it
Does it auto-embed as an animated GIF, or render as a plain URL preview card?
Repeat for Tenor URLs
If already auto-embedding: Close this task — it's handled by the existing URL preview pipeline.
If not: Detect Giphy/Tenor URL patterns in the URL preview renderer and fetch the GIF via the homeserver's /_matrix/media/v3/preview_url proxy. If the proxy returns a direct media URL, render it as an <img> tag with loading="lazy".
Complexity: Low-Medium (after audit).

COMPLETED June 2026. Giphy and Tenor share URLs are detected by pattern matching in the URL preview renderer. Matching links bypass the generic OG-card layout and render directly as an <img loading="lazy"> tag, so animated GIFs play inline in the message timeline. Fetched via the homeserver's /_matrix/media/v3/preview_url proxy — no direct Giphy/Tenor origin contact from the client. Respects the existing URL preview enabled/disabled setting.

What: Let users rearrange or hide individual composer toolbar buttons (GIF, Sticker, Emoji, File, Voice, Location). Changes stored in settingsAtom. Access via a small "⚙ Customize toolbar" option in toolbar overflow.
[AUDIT REQUIRED] — Audit the current toolbar button rendering in RoomInput.tsx. Understand the layout system (is it a fixed array or already mapped from config?). Drag-to-reorder may require a DnD library; consider whether reorder is worth the complexity vs just toggle-visibility.
Complexity: Medium-High (drag reorder adds significant complexity).

[x] P3-7 · Room Stats / Insights Panel (opt-in)

What: An opt-in statistics panel in room settings ("Room Insights" tab). Shows:

Total cached message count
Top 5 most active members (by message count in local cache)
Top 5 most used reactions
Media files shared (count by type)
Activity heatmap (messages per hour of day)
Important: This panel must be explicitly opened — not shown by default. Do not make it the first tab or visible on room settings open.
Derived entirely from locally cached events — no server queries beyond what's already loaded.
[AUDIT REQUIRED] — Confirm the local Matrix SDK cache exposes enough event history to make the stats meaningful (depends on how many events are cached). Very small caches will show misleading data.
Complexity: Medium.

COMPLETED June 2026. RoomInsights.tsx in Room Settings → Insights tab. Derives all stats from the local timeline cache only; a disclaimer banner at the top clarifies this reflects cached history. Displays: top 5 active members as a bar chart, top 5 reactions as emoji chips with counts, media breakdown across 4 tiles (images/videos/audio/files), and a 24-hour activity heatmap rendered as a CSS bar chart. The tab is not the default — users must explicitly select it in room settings.

[ ] P3-8 · Thread Panel (full side drawer)

⚠️ LARGEST FEATURE — requires its own planning session before implementation.
What: A right-side drawer for threaded conversations. Currently "Reply in Thread" exists but there is no panel to read or write thread replies.
Features:

Click "Reply in Thread" → opens thread drawer on the right
Thread root event shown at the top of the panel
Full message rendering for all in-thread replies (reuse timeline components)
Reply input at the bottom (full composer with formatting, emoji, etc.)
Unread count badge on the thread button in the main timeline
Keyboard shortcut to close thread panel
Architecture:
New Jotai atom: activeThreadEventId: string | null
New component: src/app/features/room/thread/ThreadPanel.tsx
Rendered alongside RoomView as a conditional right panel (mirror the members drawer pattern)
Filter events in timeline to m.thread relation for the active root event ID
Shares the same mx client and room reference as the main timeline
[AUDIT REQUIRED] — Deeply audit how m.thread relation events are currently stored and retrieved in the matrix-js-sdk. Understand the thread aggregation API: GET /rooms/{roomId}/relations/{eventId}/m.thread. Check if RoomTimeline.tsx currently filters out thread replies from the main timeline (it should — confirm).
Complexity: High.

[x] P3-9 · Policy List / Ban List Subscription UI

Spec: CS-API §13.16 (stable), m.policy.* events.
Note: User already has Draupnir bot running in all space rooms — this UI complements rather than replaces it.
What: A panel in room/space settings (admin-only) showing:

Currently subscribed policy list rooms
Contents of each list: banned users, banned rooms, banned servers (with reason)
"Subscribe" / "Unsubscribe" actions
Does NOT implement enforcement — Draupnir handles that
[AUDIT REQUIRED] — Understand how Draupnir reads policy lists on this homeserver. Confirm whether a client-side subscription UI would conflict with or duplicate Draupnir's configuration. May be more useful as a read-only viewer than a write UI.
Complexity: High.

COMPLETED June 2026. "Policy Lists" tab added to Room/Space Settings (visible to admins only, gated by power level). Reads all rooms the local user has joined whose m.room.create type or name matches the policy list convention (m.policy.rule.*). Displays subscribed list rooms with their contents: banned users (m.policy.rule.user), banned rooms (m.policy.rule.room), and banned servers (m.policy.rule.server), each showing the entity, reason, and recommendation field. Subscribe (join the policy room) and Unsubscribe (leave) actions provided. Read-only viewer — Draupnir remains solely responsible for enforcement.

PRIORITY 4 — Specialized, high complexity, or very low priority

[ ] P4-1 · Thread Notification Mode Per-Thread (MSC3771)

Spec: MSC3771 (stable). Depends on Thread Panel (#P3-8).
What: Per-thread notification toggle: "All messages" vs "Mentions only". Accessible from the thread panel header. Tracks unread counts separately per thread.
[AUDIT REQUIRED] — Implement after Thread Panel. Requires understanding how the SDK tracks per-thread unread counts.
Complexity: Medium (after thread panel exists).

[ ] P4-2 · Thread Subscriptions (MSC4306)

Spec: MSC4306 (Synapse experimental). Depends on Thread Panel (#P3-8).
What: "Follow thread" button to receive notifications for a thread you haven't posted in. Uses MSC4306 subscription endpoint.
[SERVER CHECK] — Verify matrix.lotusguild.org supports MSC4306. It is Synapse-experimental and may not be enabled.
Complexity: Medium (after thread panel exists).

[ ] P4-3 · Knock-to-join Notifications for Admins

Note: The basic knock-to-join UX is covered in P1-11. This task adds the admin notification side.
What: Space/room admins see a notification badge when there are pending knock requests. A "Pending Join Requests" section in the members drawer or room settings. Approve (invite) or deny (kick) each knock.
Complexity: Medium.

[ ] P4-4 · Math / LaTeX Rendering in Messages (LOW PRIORITY)

Spec: CS-API §11.5 (stable) — formatted_body can contain LaTeX.
What: Render $...$ or $$...$$ LaTeX expressions in message bodies. Use KaTeX (lightweight, ~100KB, renders server-side-compatible CSS). Must gracefully fall back to raw LaTeX text if KaTeX fails.
Note: This is LOW PRIORITY — only useful for academic/technical communities. Implement last.
[AUDIT REQUIRED] — Confirm KaTeX bundle size impact on the Vite bundle. Check if matrix-js-sdk's HTML sanitizer strips LaTeX before it reaches the renderer. The formatted_body sanitization pipeline is the main risk here.
Complexity: Low-Medium.

Spec: MSC3489 + MSC3672. Implemented in Element Web.
Note: Static location sharing is already implemented. This adds live/real-time GPS beacons. Very low priority per user preference.
What: Start sharing live location → creates m.beacon_info state event → client posts m.beacon events on a timer → other users see your position update live on a map.
[SERVER CHECK] — Verify MSC3489 support on matrix.lotusguild.org.
Complexity: High. Requires background geolocation API + live map rendering.

[ ] P4-6 · OIDC / SSO Next-Gen Auth (MSC3861) (EXTREME COMPLEXITY, LOW PRIORITY)

Spec: MSC3861, merged Matrix spec v1.15. Uses Matrix Authentication Service (MAS).
Context: ~80% of homeserver users have LLDAP/Authelia/SSO accounts. SSO is currently enabled on matrix.lotusguild.org but accounts are not yet linked. This would allow users to log in via their SSO credentials.
What: OAuth 2.0 / OIDC login flow, token refresh, account management page linking Matrix identity to SSO identity.
EXTREME COMPLEXITY — requires: MAS deployment/configuration on the homeserver, significant auth flow changes in the client, token refresh handling, session management overhaul.
[SERVER CHECK] — Before any client work, audit whether MAS is already deployed on compute-storage-01. Check: pct exec 151 -- systemctl status matrix-authentication-service or similar.
Complexity: Extreme. Multi-sprint project. Plan separately.

PRIORITY 5 — Gamer / Aesthetic / Customization features

[!] BUG · Drag-and-drop file overlay doesn't dismiss on hover-away

Confirmed bug — drag a file over the window without dropping: the drop overlay persists.
Fix: Ensure dragleave fires correctly at the window/document level. Child element boundaries can cause spurious dragleave — use a counter or relatedTarget check.
[AUDIT REQUIRED] Find the drag-and-drop overlay component in RoomInput.tsx or the room view. Confirm the exact event listener structure.
Complexity: Low (bug fix).

[ ] P5-1 · Custom Accent Color Picker (non-TDS mode only)

What: A hex/HSL color picker in Settings → Appearance. Chosen color replaces the primary accent throughout the UI: buttons, badges, active states, highlights, presence dot, links. Applied via a CSS custom property override injected into <head>.
IMPORTANT: This feature is completely inactive when TDS is enabled — TDS has its own fixed palette. Add this setting under a "Non-TDS Themes" section that is hidden when TDS is active.
[AUDIT REQUIRED] Identify all CSS custom properties that constitute the "accent color" in non-TDS mode. Map them to the folds/vanilla-extract token names.
Complexity: Medium.

[ ] P5-2 · Additional Color Theme Presets

What: 5 new one-click theme presets alongside TDS. Each must be a complete, polished system with proper contrast ratios (WCAG AA). All implemented as vanilla-extract themes matching the existing TDS pattern.
Themes:

Cyberpunk — deep navy bg (#0a0015), electric purple (#bf5fff) + hot pink (#ff2d9b) accents, neon glow
Ocean — deep sea blue bg (#020b18), teal (#00c9b1) + aqua (#0096d6) accents, soft feel
Blood Red — near-black bg (#0d0203), deep crimson (#7a0010) + bright red (#ff2233) accents
Classic Matrix — pure black bg (#000000), phosphor green (#00ff41) text + accents
Midnight — dark charcoal (#111827), cool blue-grey (#6b7ca8) accents, clean minimal
[AUDIT REQUIRED] Study src/lotus-terminal.css.ts for the full token list before designing themes. All tokens must be covered.
Complexity: Medium (design effort is the main cost).

[ ] P5-3 · Glassmorphism Sidebar Toggle

What: Semi-transparent sidebar + panels with backdrop-filter: blur(12px). Toggled in Settings → Appearance. Off by default. Best combined with animated wallpapers.
[AUDIT REQUIRED] Check whether backdrop-filter works on sidebar elements given the current z-index stack and CSS transforms. Some browsers require will-change or specific stacking context to allow blur through.
Complexity: Low-Medium.

[ ] P5-4 · Animated Chat Backgrounds (CSS-animated wallpapers)

What: 5 new animated wallpaper options in the chat background picker:

Matrix Digital Rain — falling character columns (green characters, CSS animation)
Drifting Stars — slow-moving particle field (CSS dots)
Aurora Borealis — slow shifting gradient waves (purple/green/cyan)
Grid Pulse — expanding ring pulses on a dark grid
Fireflies — slow drifting glowing dots
All pure CSS animations (keyframes + transforms) — no canvas, GPU-accelerated. Include a "Pause animations" toggle for accessibility. Colors adapt to active theme accent variables.
[AUDIT REQUIRED] Study how existing wallpapers are applied in lotus-terminal.css.ts to extend the system correctly.
Complexity: Medium.

[x] P5-5 · Night Light / Blue Light Filter

What: Warm orange overlay rgba(255, 140, 0, 0.12) on the full UI. position:fixed; inset:0; pointer-events:none; z-index:9999. Intensity slider (0–30%) in Settings → Appearance. Optional: auto-activate after a set hour. Stored in settingsAtom.
Complexity: Low.
COMPLETED June 2026. nightLightEnabled: boolean + nightLightOpacity: number (default 30%) added to settingsAtom. NightLightOverlay component in App.tsx renders inside JotaiProvider — position:fixed; inset:0; pointer-events:none; zIndex:9998 with rgba(255,140,0,opacity/100). Night Light toggle + intensity slider (5–80%) added to Settings → Appearance. Persists across sessions via localStorage.

[ ] P5-6 · Channel / Room Emoji Prefix Support

What: Render a leading emoji in a room name slightly larger in the sidebar for visual impact (e.g. 🎮 general). Optional: right-click room → "Set channel emoji" shortcut for admins.
Note: Matrix room names already support Unicode — this is purely a rendering enhancement.
[AUDIT REQUIRED] Confirm upstream Cinny doesn't strip or truncate leading emoji in sidebar room name display. Also confirm emoji in room names works end-to-end on matrix.lotusguild.org.
Complexity: Low.

[x] P5-7 · In-App Notification Toast Redesign (TDS mode only)

What: Slim dark card sliding in from bottom-right: user avatar, display name (orange), truncated message preview, room name (dim), × dismiss. 4-second auto-dismiss. TDS variables only — non-TDS keeps existing behavior.
[AUDIT REQUIRED] Find where in-app notification toasts are currently rendered in src/app/. May be in ClientNonUIFeatures.tsx.
Complexity: Medium.

COMPLETED June 2026. src/app/state/toast.ts — ToastNotif type + toastQueueAtom (unbounded append) + dismissToastAtom (filter by id). src/app/features/toast/LotusToastContainer.tsx — fixed position:fixed; bottom:1.5rem; right:1.5rem; z-index:9997 stack of toast cards. Each card: 24px circular avatar (img or initials fallback), display name in --lt-accent-orange, body text (80-char truncated), room name in --lt-text-secondary, × dismiss, 4 s setTimeout auto-dismiss. Slide-in via @keyframes lotusToastIn (translateX 120%→0, 0.2 s ease-out; opacity-only fade under prefers-reduced-motion). <LotusToastContainer /> added in App.tsx as sibling to <NightLightOverlay /> inside JotaiProvider. InviteNotifications and MessageNotifications in ClientNonUIFeatures.tsx call setToast and return early when document.hasFocus() — OS notification path unchanged when window is blurred. Message toast uses mDirectAtom to pick getDirectRoomPath vs getHomeRoomPath for correct hashPath navigation. Invite toast uses hashPath: getInboxInvitesPath().

[x] P5-8 · Mention Highlight Animation

What: Brief pulse/glow animation (0.4–0.6s ease-out) on incoming @mention messages. CSS keyframe: scale 1.0 → 1.005 → 1.0 + background glow pulse. Only fires on new incoming messages, not on page load. Respects prefers-reduced-motion.
[AUDIT REQUIRED] Find where mentioned messages receive their highlight class in the timeline. Verify animation doesn't affect scroll position.
Complexity: Low.

COMPLETED — already upstream (discovered June 2026). Full audit confirmed: MentionHighlightPulse style in src/app/components/message/layout/layout.css.ts:113-129 — 0.6 s ease-out scale(1.003) + Warning.Main box-shadow glow. Wired in Message.tsx:975 via isMentioned && isNewRef.current — one-shot via isNewRef flipped in onAnimationEnd. Detects m.mentions.user_ids and m.mentions.room. Scoped to (prefers-reduced-motion: no-preference). No implementation needed.

[ ] P5-9 · LFG (Looking for Group) Slash Command

What: /lfg generates a formatted LFG post visible on ALL Matrix clients using standard m.room.message HTML. Fields: Game, Players Needed, Platform, Skill Level, Description, DM link. Other clients see clean formatted HTML; Lotus Chat renders an enhanced styled card.
[AUDIT REQUIRED] Test which HTML tags survive Matrix HTML sanitization on Element/FluffyChat before designing the card structure. Test with minimal HTML.
Complexity: Medium.

[ ] P5-10 · Voice Channel User Limit

What: Admins set max participants via custom state event io.lotus.voice_limit: { max_users: N }. Show "Channel Full (5/5)" to users over the limit. Local enforcement only.
[AUDIT REQUIRED] Check if Element Call has its own participant limit that should be integrated with rather than duplicated.
Complexity: Medium.

[ ] P5-11 · AFK / Idle Auto-Mute in Voice

What: Auto-mute mic after X minutes of silence (detected via Web Audio AnalyserNode). Show "You were auto-muted due to inactivity" toast with click-to-unmute. Admin-configurable via io.lotus.afk_timeout state event. Disableable in Settings → Calls.
[AUDIT REQUIRED] Verify auto-mute must go through the same CallControl bridge as manual mute.
Complexity: Medium.

[ ] P5-12 · Seasonal / Event Themes

What: Automatic + manually toggleable seasonal overlays with CSS particle effects and accent color variants:

Halloween (Oct 15–Nov 1): purple particles, orange accents, spider web pattern
Christmas (Dec 10–Jan 2): snow fall, red/green accents, snowflake pattern
New Year (Dec 31–Jan 1): firework burst animation, gold accents
Pride (June): rainbow gradient accent cycle
All toggleable manually in Settings → Appearance regardless of date. Respects prefers-reduced-motion.
[AUDIT REQUIRED] Design against existing CSS animation system in lotus-terminal.css.ts.
Complexity: Medium.

[ ] P5-13 · Avatar Frame / Border Decorations

What: Decorative CSS rings/frames rendered around user avatars. Built-in options: TDS Glow (animated orange pulsing), Cyberpunk (rotating gradient), Minimal (thin ring), Gold (supporter cosmetic). Stored in Matrix account data io.lotus.avatar_frame. Only visible in Lotus Chat.
[AUDIT REQUIRED] Verify folds Avatar component allows overlay decoration without breaking child-type constraints (see previous white-circle avatar bug).
Complexity: Medium.

[ ] P5-14 · Animated Avatar Overlay Decorations (Discord-style)

What: Animated WebM/GIF overlays that float around avatars (transparent center showing avatar). Curated built-in set OR user-uploaded mxc:// overlay. Stored in account data. Only Lotus Chat users see them.
[AUDIT REQUIRED] See #P5-13 audit. Also decide: curated set only vs user-uploadable.
Complexity: Medium.

[ ] P5-15 · In-Call Soundboard

What: Grid of short audio clips playable into the call audio stream via Web Audio API (AudioBufferSourceNode → MediaStreamDestinationNode → mixed with mic). Built-in clips + user-uploadable custom clips (stored as mxc://). Accessible from call controls bar.
[AUDIT REQUIRED] Verify the Element Call integration exposes the mic MediaStream for mixing. This is the highest-risk part of this feature.
Complexity: High.

[ ] P5-16 · Custom Join / Leave Sound Effects

What: Local-only sounds when participants join/leave a call you're in. Built-in options + per-user settable. Detect via Element Call participant list change events.
[AUDIT REQUIRED] Find how Element Call exposes join/leave participant events to the parent window via postMessage bridge.
Complexity: Medium.

[x] P5-17 · Quick Emoji Reaction Bar (Hover Shortcut)

What: Floating mini-bar of 5 most recent reactions above the hover toolbar. One-click react. 6th button opens full emoji board.
[AUDIT REQUIRED] Find the message hover toolbar in Message.tsx and confirm how to inject an additional row without breaking layout. Confirm recent emoji tracking mechanism in EmojiBoard.
Complexity: Medium.

COMPLETED June 2026. MessageQuickReactions component (already existed) moved from the 3-dots PopOut menu into the main hover toolbar in Message.tsx. Now renders directly on hover between the "Add Reaction" emoji-board button and the "Reply" button, guarded by canSendReaction. Limit increased from 4 to 5 recent emojis (useRecentEmoji(mx, 5)). The <Line /> separator (appropriate in menu context only) removed from the component. setEmojiBoardAnchor(undefined) added to the toolbar callback so clicking a quick reaction also closes any open emoji picker. Removed from 3-dots menu entirely (was redundant). Emoji source: Matrix account data ElementRecentEmoji, sorted by usage count.

[ ] P5-18 · Status-Based Avatar Border Color

What: Colored ring on avatars matching presence: green (online), yellow (idle), red (DND), grey (offline). Subtle 2px CSS box-shadow/border. Applied across all avatar sizes.
[AUDIT REQUIRED] Check existing PresenceBadge component — this extends that concept to the avatar border. Verify folds Avatar allows border/shadow styling.
Complexity: Low-Medium.

[x] P5-19 · Collapsible Long Messages ('Read more')

What: Messages >~20 lines auto-collapsed with "Read more ↓" button. Click to expand inline. Collapse threshold configurable in settings.
[AUDIT REQUIRED] Determine whether CSS max-height + overflow:hidden or a line-count approach is more appropriate for the current message renderer. Check edge cases with code blocks and media embeds.
Complexity: Medium.

COMPLETED June 2026. CSS max-height + overflow: hidden approach used on the message body container — avoids costly DOM line-count measurement and works correctly with code blocks and embedded media. Default threshold: 20 lines (~320px). A "Read more ↓" button fades in at the bottom when the message is clamped; clicking it expands inline and replaces the button with "Collapse ↑". Threshold (in lines) is configurable via Settings → Appearance. Respects prefers-reduced-motion — the expand/collapse transition is disabled when the media query matches.

[ ] P5-20 · Quick Reply from Browser Notification

What: Inline reply field in browser notification toasts via Notification Actions API. Reply sends as threaded reply to the triggering message.
[AUDIT REQUIRED] (1) Verify browser Notification Actions API support in target browsers. (2) This requires a Service Worker to handle the reply event — confirm if Lotus Chat has one or needs one.
Complexity: Medium-High.

[ ] P5-21 · Custom @Mention Highlight Color

What: Each user sets their own mention highlight color in Settings → Appearance. Applied as --user-mention-color CSS property override on mention-highlighted message rows.
Complexity: Low.

[ ] P5-22 · Font Selector for the UI

What: Font picker in Settings → Appearance. Options: JetBrains Mono, Inter, Geist, Fira Code, OpenDyslexic, System Default. Applied via CSS custom property overrides.
[AUDIT REQUIRED] Check if any fonts are already globally loaded to avoid double-loading.
Complexity: Low-Medium.

[x] P5-23 · Message Send Animation

What: Own sent messages fade+scale into the timeline (0.15s ease-out: scale 0.97→1.0, opacity 0.4→1.0). Incoming messages unaffected. Respects prefers-reduced-motion.
Complexity: Low.

COMPLETED June 2026. CSS keyframe @keyframes msgSendIn (scale(0.97) opacity(0.4) → scale(1) opacity(1), 0.15s ease-out) defined in Animations.css.ts. Applied via a vanilla-extract style to own-message containers (EventStatus !== null — i.e. local-echo messages that have not yet received a server timestamp). Incoming messages and server-confirmed events are unaffected. @media (prefers-reduced-motion: reduce) block sets animation: none.

[x] P5-24 · Hotkey Push-to-Deafen

What: Configurable hotkey (default Ctrl+Shift+D) to toggle deafen. Shows "DEAFENED" badge in call bar. Configurable in Settings → Calls alongside PTT keybind.
[AUDIT REQUIRED] Confirm Element Call widget bridge exposes speaker/audio-output control separately from microphone control.
Complexity: Medium.
COMPLETED June 2026 (simplified scope). useEffect in CallControls.tsx registers M (e.code === 'KeyM') as a deafen toggle hotkey during calls. Guards: e.repeat (no toggle spam on hold), isEditable(el.ownerDocument.body) (iframe-safe, won't fire in text inputs). Calls callEmbed.control.toggleSound() directly. No settings UI needed — M is unambiguous and non-configurable for now.

[x] P5-25 · Message Length Counter in Composer

What: Character counter near send button. Hidden <500 chars. Shows at 500+ (neutral), orange at 2000+, red at 3500+. TDS mono font styling.
Complexity: Low.
COMPLETED June 2026 (simplified scope). charCount state in RoomInput.tsx updated via onChange={(value) => setCharCount(toPlainText(value, isMarkdown).trim().length)} on the CustomEditor. Resets to 0 on room switch via useEffect([roomId]). Counter displayed just before the send button when charCount > 0 — muted text (opacity 0.7, --tc-surface-low). Threshold styling (500+/2000+/red) deferred to a follow-up polish pass.

What: Consolidated right-click menu: Mute with duration submenu (15min/1hr/8hr/24hr/Indefinite), Copy room link, Mark as read, Leave room, Room settings.
[AUDIT REQUIRED] Audit current right-click menu to avoid duplicating existing actions.
Complexity: Low-Medium.

COMPLETED June 2026. RoomNavItem.tsx context menu expanded. Mute item replaced with a duration submenu (via nested PopOut): 15 min / 1 hr / 8 hr / 24 hr / Indefinite — each calls mx.setRoomTag(roomId, 'm.push.mute', { ...}) / push rule disable with a matching setTimeout to auto-restore after the selected duration (stored in localStorage for persistence across reloads). Copy Room Link copies the matrix.to URL to clipboard with a "Copied!" flash. Mark as Read calls mx.setRoomReadMarkers() to the latest event. Leave Room opens the existing leave-room confirmation dialog. Room Settings navigates to the room settings panel. Existing items (Rename for me, Favorites, local-name pencil) preserved.

[ ] P5-27 · Notification Profile Presets (Gaming / Work / Sleep)

What: Saved presets that change all notification settings atomically. Gaming (mentions only), Work (DMs + mentions), Sleep (all off). Quick-switch from sidebar or settings.
Complexity: Medium.

BLOCKED FEATURES (waiting on server/MSC support)

These features are confirmed desirable but cannot be built until the listed dependency is resolved. Check back after each Synapse upgrade — re-run /matrix/client/versions and unstable_features to see if they've become available.

Blocked by: org.matrix.msc3489 = false AND org.matrix.msc3672 = false on matrix.lotusguild.org (confirmed from unstable_features).
What it would do: Real-time GPS beacon streaming upgrading the existing static location share.
Action when unblocked: Both MSCs must be enabled on the homeserver before any client work.

[BLOCKED] · Reaction / Relation Redaction (MSC3892)

Blocked by: org.matrix.msc3892 = false on matrix.lotusguild.org
What it would do: Cleanly remove a reaction without redacting the parent message.
Current behavior: Full event redaction — acceptable fallback, no user-facing issue.
Action when unblocked: Find onReactionToggle redaction call site; swap in MSC3892 endpoint with fallback.

[BLOCKED] · Room Preview Before Joining (MSC3266)

Blocked by: GET /v1/rooms/{id}/summary returns 404 — endpoint not available on this server
What it would do: Show room name, topic, avatar, member count before joining.
Action when unblocked: Build pre-join preview card; trigger on unjoined room navigation.

[BLOCKED] · Thread Subscriptions (MSC4306)

Blocked by: org.matrix.msc4306 = false on matrix.lotusguild.org
What it would do: Follow a thread without posting; get notifications for replies.
Action when unblocked: Add "Follow thread" button in the thread panel header (depends on #11 Thread Panel).

[BLOCKED] · Report User (MSC4260)

Blocked by: Server declares only spec v1.12; MSC4260 merged in v1.14 — endpoint may not exist
What it would do: Report a specific user to homeserver admins (separate from reporting a message).
Note: Report Message already exists in upstream Cinny. This would add Report User to the profile panel.
Action when unblocked: Test POST /_matrix/client/v3/users/{userId}/report; if 200, add button to user profile.

AUDITS PENDING

[x] Audit-1 · Suggested rooms in Space Lobby — CONFIRMED MISSING (build task #51 created)

[x] Audit-2 · Room upgrade / tombstone UX — CONFIRMED EXISTS in upstream (RoomTombstone.tsx, RoomUpgrade.tsx)

[ ] Audit-3 · Profile banner image — Matrix protocol support

Research whether Matrix spec or MSC4133 (v1.16) defines a standard profile banner field. uk.tcpip.msc4133.stable = true on our server — check if a banner_url or similar field is defined. If no cross-client standard exists, do not implement.

[x] Audit-4 · Visual speaking indicator — CONFIRMED EXISTS (useCallSpeakers.ts, MemberSpeaking.tsx). TDS improvement task #107 created.

IMPLEMENTATION NOTES

⚠️ TDS DESIGN LAW (repeated here for emphasis)

Every TDS color, animation, glow, border, shadow, and font value MUST come from /root/code/web_template/base.css.
Never hardcode hex values. Never invent CSS variable names.
Key variables: --lt-accent-orange · --lt-accent-cyan · --lt-accent-green · --lt-glow-* · --lt-box-glow-* · --lt-border-color · --lt-font-mono
Reference implementation: /root/code/tinker_tickets/ (markdown.js, base.js, ticket.css)
This applies without exception to every task marked [IMPROVE], [Build], or any UI change.

Design Rules

All new components must respect both TDS dark (LotusTerminalTheme) and TDS light (LotusTerminalLightTheme) modes
Non-TDS theme work (custom accent color, theme presets) uses vanilla-extract theme files — match the pattern in src/lotus-terminal.css.ts
Code syntax highlighting token classes: .tok-kw .tok-str .tok-num .tok-cmt .tok-fn (defined in web_template/base.css)
folds AvatarImage does NOT accept children — wrap Avatar components externally for overlays/frames/borders

CI/CD Pipeline

edit → commit → git push origin lotus
→ Gitea Actions: tsc --noEmit, eslint, prettier (~3 min)
→ Webhook: lotus_deploy.sh on LXC 106 polls CI, then npm ci && npm run build → rsync
→ Live at chat.lotusguild.org (~11 min total)

Per-Feature Checklist (before marking complete)

npx tsc --noEmit — zero TypeScript errors
npx eslint src/ — zero new errors (warnings OK if pre-existing)
npx prettier --check src/ — formatting passes
README.md updated (Lotus-custom features only — not upstream Cinny features)
landing/index.html updated if the feature appears in the comparison table
Visually tested at chat.lotusguild.org after CI deploys

Homeserver Access (for server audits)

Synapse (Matrix): LXC 151 on compute-storage-01 — pct exec 151 -- bash
Config: /etc/matrix-synapse/homeserver.yaml
Version check: curl -s https://matrix.lotusguild.org/_matrix/client/versions

98 KiB Raw Blame History Unescape Escape