- N69: @mention highlight color now uses HexColorPickerPopOut + react-colorful
HexColorPicker behind a folds Button (color swatch); built-in onRemove
replaces the separate Reset, dropping the OS-native <input type="color">
- N10: mentionPulseKeyframes animates only box-shadow (dropped the imperceptible
scale(1.003)) so it no longer fights MsgAppearClass over `transform` on
self-sent @mention messages
- N22: Direct.tsx virtualizer estimateSize 38 -> 52 (two-line DM row height) to
avoid the initial-render jump before measureElement corrects each row
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Extract a shared ReportCategorySelect: folds Button trigger + PopOut +
FocusTrap + Menu + MenuItem (escape + arrow-key nav, like OrderButton),
replacing the OS-styled native <select> in both ReportRoomModal and
ReportUserModal.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Selecting a join/leave sound auto-plays a preview, but nothing communicated
that. Add it to the SettingTile description.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Both rendered as <Box as="form" role="dialog"> with manually assembled
background/borderRadius(R400)/boxShadow. Switch to <Dialog as="form"
variant="Surface"> so the surface comes from the design system (R300 radius),
matching the other message-action dialogs.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
ReportRoomModal/ReportUserModal rendered as <Box as="form" role="dialog">
with inline background/borderRadius(R400)/boxShadow. Switch both to
<Dialog as="form" variant="Surface"> so the surface (background, R300 radius,
shadow) comes from the design system, matching MessageReportItem and every
other message-action modal.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
- N14 ForwardMessageDialog: add folds <Header> with title + close IconButton
(was closeable only by clicking outside)
- N20 Notification presets: bare <button> with undefined --border-interactive-
normal / --bg-surface-low vars -> folds <Button variant="Secondary" fill="Soft">
- N68 syntaxHighlight tokenStyle: use the theme-aware --prism-* variable family
(keyword/selector/boolean/atrule/comment) instead of TDS-only --lt-accent-*
vars with dark-only Monokai fallbacks; comment uses --prism-comment not opacity
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Pure formatting reflows (multi-line wrapping of long lines/imports/tables);
no behavior change. Clears the working tree of pending prettier diffs.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
The real reason the gallery didn't look or function like the Members drawer
or Saved Messages: it was a position:fixed overlay floating over the timeline,
mounted from RoomViewHeader. Now it docks into the room layout row exactly like
MembersDrawer.
- new mediaGalleryAtom (mirrors bookmarksPanelAtom) holds the open state
- RoomViewHeader toggles the atom instead of local useState and no longer
renders the panel
- Room.tsx renders <MediaGallery> as a flex sibling of the timeline with a
vertical Line separator on desktop and key={room.roomId} to reset per room
- MediaGallery.css: static width on desktop, position:fixed inset:0 full-screen
only on mobile (identical strategy to MembersDrawer.css); root Box shrink="No"
The panel now shares the row with the timeline instead of overlapping it.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
The Media Gallery panel worked but didn't look like a first-party Cinny
drawer. Redesign the chrome to match MembersDrawer / Saved Messages and the
PolicyListViewer tab precedent:
- panel + header: Surface -> Background variant; header uses Text size="H4"
and a plain close IconButton (dropped the bespoke tooltip-wrapped button)
- tabs: moved into a bordered toolbar strip; adopt the repo's
variant={active?'Primary':'Secondary'} fill={active?'Solid':'Soft'} pattern
and show per-tab counts (Images (N) / Videos (N) / Files (N))
- month grouping: replaced the centered "lines + label" divider with a
left-aligned group label (the Cinny group-label pattern)
- thumbnail tiles: hover/focus border + caption overlay are now CSS-driven
(:hover / :focus-visible) instead of React state, and live in
MediaGallery.css.ts; grid + file rows tokenized
- caption overlay also reveals on keyboard focus (a11y)
All styling consolidated into MediaGallery.css.ts; no inline grid/tile styles.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Avatar decorations: useAvatarDecoration cached ALL profile-field fetch
failures as "no decoration" permanently for the session. The member list
and timeline mount many avatars at once, so one rate-limited (429) burst
would wipe everyone's decoration until a full reload. Now only a genuine
404 (field unset) is cached; transient errors retry on the next mount.
Saved Messages panel — full redesign to match the canonical MembersDrawer:
- co-located BookmarksPanel.css.ts: toRem(266) + max-width:750px full-screen
media query, replacing the old position:absolute/zIndex:100 mobile "modal"
that had no backdrop or escape
- variant="Background" header; room avatars on each item (was a generic hash)
- priority tokens replace all raw opacity hacks; 3px borderLeft accent removed
- Escape-to-close; multi-line preview is now a proper folds Button (N38)
Media Gallery (N12): moved fixed positioning + width into MediaGallery.css.ts
using toRem(320) + a full-screen media query; border/header use config tokens;
added Escape-to-close on the panel (previously only the lightbox handled it).
Presence (SettingsTab / useUserPresence):
- N16: wrap presence-dot trigger in TooltipProvider; replace undefined
--bg-surface with color.Background.Container
- N17: add escapeDeactivates + isKeyForward/isKeyBackward to the FocusTrap
- N19: align reader labels (usePresenceLabel) to the setter vocabulary
(Online/Idle/Offline) so a chosen status matches the tooltip others see
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Four changes to match screenshare full-screen UX for camera feeds:
1. Fullscreen button always visible
CallControls.tsx: remove `screenshare &&` gate — the ⛶ fullscreen
button now appears in camera-only calls, not just during screenshare.
2. Per-participant camera focus (CallControl.focusCameraParticipant)
Finds the target's video tile in the EC iframe DOM via:
[data-testid="videoTile"] / [data-video-fit]
closest ancestor of [aria-label="${userId}"]
Enables spotlight mode if not already active, then clicks the tile
so EC's internal focus handler runs. Falls back gracefully if the
tile is not in the DOM (camera off).
3. MemberGlance participant popup
Clicking a participant avatar in the call status bar now shows a
small menu: "Focus camera" (calls focusCameraParticipant) and
"View profile" (existing behaviour). Previously it opened the
profile immediately with no way to focus the camera.
4. PiP fullscreen button
A ⛶/⊡ icon button appears in the PiP overlay top-right area,
letting users go fullscreen directly from PiP mode without
navigating back to the call room first.
UNTESTED — requires a real multi-participant call to verify tile
clicking behaviour and fullscreen transitions.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Replace raw error object logging (which may contain Matrix event
payloads, user IDs, or message bodies) with e.message-only strings
in three files:
- CallEmbed.ts: state update and event widget feed errors
- msgContent.ts: image/video element load failures and thumb errors
- RoomInput.tsx: GIF send failure
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Previously PipMuteOverlay fired on useRemoteAllMuted (any remote
muted) and rendered in the bottom-left corner — the conventional
position for local-user mic status — causing users to think their
own mic was muted when it wasn't.
Fix: split into two distinct indicators
- Bottom-left: local mic muted only (from useCallControlState),
labelled "You" so attribution is unambiguous
- Top-right: "All muted" warning (warning color, not critical) when
all remote participants are muted
UNTESTED — verify in a real call at chat.lotusguild.org.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- Wrap RoomTimeline in ErrorBoundary — a single bad event no longer
crashes the entire timeline; shows a graceful "Timeline unavailable"
message instead
- Wrap RoomInput in ErrorBoundary — composer crashes show a fallback
placeholder rather than a blank white section
- Animate SpeakerAvatarOutline with a 1.2s pulse keyframe so it's
visually distinct from a static ring; respects prefers-reduced-motion
- Fix var(--border-surface-variant) undefined variable in UserRoomProfile
device session rows; replaced with color.SurfaceVariant.ContainerLine
UNTESTED — verify at chat.lotusguild.org post-deploy.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- Add SelectSenderButton: clickable people picker for the From filter
replacing the text-only from:@user syntax
- Add date preset shortcuts in DateRangeButton (Today, Last week,
Last month, Last year) for one-click range selection
- Add Has link chip backed by Matrix contains_url API filter; toggle
removes cleanly with X badge
- Wire containsUrl through URL params, useMessageSearch hook, and
SearchFilters props
UNTESTED — verify at chat.lotusguild.org post-deploy.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Replaces undefined --border-surface-variant CSS variable with
color.SurfaceVariant.ContainerLine from folds, and --bg-surface-variant
with color.SurfaceVariant.Container. Both are valid theme tokens
that adapt to light/dark mode correctly.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Adds 'Ringtone Volume' slider (0–100, default 70%) to Settings → Calls.
The IncomingCall audio element reads the setting and applies it as
audioElement.volume before playing, replacing the implicit browser
default of 1.0.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Reaction.tsx now computes aria-label='{shortcode} reaction, N people'
using getShortcodeFor so screen readers announce emoji name and count
instead of an ambiguous button. Custom (mxc://) emoji falls back to
'custom emoji reaction'.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
PageHeader now exposes aria-label="{room name} room header" so screen
reader users know which room's header they are navigating.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Screen readers now announce new messages politely via role='log' +
aria-live='polite' on the message container in RoomTimeline.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Two icon-adjacent buttons were missing descriptive labels: the
"Exit formatting" key-symbol button in Toolbar.tsx and the "Pinned
messages" pin icon in RoomViewHeader.tsx.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
OS notifications now show the real message body ("user: text" instead
of "New inbox notification from user"), clicking jumps directly to the
room at the triggering event, and window.focus() brings the tab to
front. Reminder toasts also link to the specific event via eventId.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Adds objectPosition:'center top' to all cover-fit thumbnail surfaces so
portrait images show faces/subjects instead of the center-slice when
the 600px AttachmentBox height cap forces cropping.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
MediaGallery: fixed panel now goes full-width (100%) on mobile instead
of the inaccessible 320px right sidebar. Added 'Media Gallery' MenuItem
to RoomMenu (visible only on mobile) so users can open it from the
More Options (···) button.
MembersDrawer: removed ScreenSize.Desktop gate in Room.tsx so it now
renders on mobile too. CSS media query (≤750px) makes it position:fixed
inset:0 width:100% on mobile instead of the 266px desktop sidebar.
Added 'Members' MenuItem to RoomMenu for mobile access.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Adds enabled=true param to useDecryptedMediaUrl in MediaGallery.tsx.
GalleryTile now uses useNearViewport(300px) — decryption is deferred
until the tile approaches the viewport, preventing burst of 100
concurrent decrypt/fetch calls when a pagination batch loads.
Blob revocation was already correct (no actual leak); this fixes the
load-burst performance issue. Full windowing virtualization deferred.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Completes the mobile fullscreen modal pass — adds useModalStyle to
DeviceVerificationSetup, DeviceVerificationReset, AddExistingModal,
RoomEncryption prompt, RoomUpgradeDialog, Modal500, ReadReceiptAvatars,
and RoomTopicViewer. All floating Dialog/Modal components now go
fullscreen on mobile (≤750px). UIAFlowOverlay was already fullscreen
via <Overlay>; JoinRulesSwitcher/RoomNotificationSwitcher are dropdowns.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Creates useNearViewport hook (IntersectionObserver, 200px rootMargin,
one-shot disconnect after first trigger). ImageContent and VideoContent
now gate loadSrc() on nearViewport — when autoPlay is enabled, encrypted
media is not decrypted until the element is within 200px of the visible
area, reducing initial page load cost on long timelines.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
TauriUpdateFeature component in ClientNonUIFeatures checks for updates
on mount and every 12h (skips if checked within the window). On update
available, fires a Lotus toast: "Lotus Chat vX.Y.Z is ready to install."
Clicking the toast calls install(). No-op on web (isTauri guard).
Also adds optional onClick to ToastNotif type and wires it in
LotusToastContainer so custom click handlers can skip hash navigation.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- matrix.ts: rateLimitedActions fallback delay now uses capped exponential
backoff (min(1000 * 2^n, 30s)) instead of flat 3000ms when server omits
Retry-After; server header still takes precedence
- RenderMessageContent: add objectFit:cover + 100% fill to video thumbnail
<Image> so thumbnails fill their container without letterboxing (P5-6)
- CreateRoomModal, CreateSpaceModal: apply useModalStyle(480) for fullscreen
on mobile
- LOTUS_BUGS: mark usePan memory leak + httpStatus check as FALSE POSITIVE;
mark rateLimitedActions backoff as FIXED
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
On mobile, SidebarNav (which contains BookmarksTab) is hidden while
inside a room. Added a Saved Messages toggle to the RoomMenu (···More
Options) so users can open/close the bookmarks panel without leaving
the room. Works on all screen sizes; UNTESTED on device.
Also marks Remind Me Later as done in LOTUS_TODO — it was already
fully wired (RemindMeDialog + ReminderMonitor + Message.tsx trigger).
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
ScheduleMessageModal, PollCreator, JoinAddressPrompt, JumpToTime,
EditHistoryModal, ForwardMessageDialog, RemindMeDialog — all now
render fullscreen on mobile (≤750px) and as a capped-width box on
desktop, consistent with the existing useModalStyle pattern.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- Bug #10: use `100dvh` on <html> so layout shrinks when mobile virtual keyboard
appears (prevents composer from being pushed off-screen)
- Bug #7: add `minWidth/minHeight: 44px` to all 8 composer toolbar IconButtons on
mobile via mobileOrTablet() check (WCAG 2.1 AA touch target requirement)
- Bug #8: add `@media (max-width: 750px) { width: 100% }` to PageNav recipe
variants so the nav panel fills full width on mobile instead of overflowing
with its fixed desktop width
- Bug #9: introduce `useModalStyle(maxWidth)` hook — returns fullscreen styles on
mobile (no border-radius, no max-width cap, height 100%) and desktop box styles
otherwise; applied to LeaveRoomPrompt, LeaveSpacePrompt, ReportRoomModal,
ReportUserModal
- Bug #11: mark as FALSE POSITIVE in LOTUS_BUGS.md — `useState(() => atom(...))`
is the correct Jotai pattern for stable local atom references
- Scheduled Messages persistence: mark as FIXED — already uses atomWithStorage +
createJSONStorage with error-safe JSON parsing
- UrlPreviewCard TDS colors: mark as BRAND EXCEPTION — SVG logo fills and site
badge backgrounds are official third-party brand colors; cannot convert without
inventing new CSS variables (violates TDS rule 3)
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- Add ReportUserModal.tsx — category dropdown + reason input, calls
POST /_matrix/client/v3/users/{userId}/report via mx.http.authedRequest,
inline success/error feedback, auto-closes 1500ms after success
- Wire Report User button into UserRoomProfile.tsx between UserModeration
and UserDeviceSessions (hidden for own profile)
- Bug #6: enforce mutual exclusion between chat backgrounds and seasonal
themes — ChatBgGrid clears seasonal→'off' on non-'none' pick;
SeasonalBgGrid clears chatBackground→'none' on real theme pick;
SeasonalEffect guards against legacy persisted state at render time
- TDS: strip all hardcoded hex/rgba fallbacks from LotusToastContainer.tsx
(var(--lt-bg-card), --lt-accent-orange, --lt-text-primary/secondary,
--lt-accent-orange-dim/border, --lt-box-glow-orange)
- Mark Bug #6 FIXED, MSC4260 DONE, toast TDS FIXED in LOTUS_BUGS.md and
LOTUS_TODO.md; note EventReaders + CallControls already compliant
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Replace raw CSS variables and Button presets with folds color/config
tokens and MenuItem components, matching the ForwardMessageDialog and
ScheduleMessageModal patterns exactly.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Move the model comparison out of the always-visible Noise Suppression
description and into the ML-only sub-settings. Add a compact info card
for the selected model (CPU / voice quality / transients / download) plus
a collapsible 4-model comparison. Group ML sub-settings into Model,
Enhancements, and Test & calibrate sections with clear labels and
separators. Fix invented --lt-border-color token and hardcoded
rgba background to real TDS tokens. Build the model dropdown and
DenoiseTester labels/compare buttons from DENOISE_MODELS so
DeepFilterNet 3 is handled correctly.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Integrate DeepFilterNet 3 (deepfilternet3-noise-filter@1.2.1) as a new
client-side denoise model id 'deepfilternet', mirroring the DTLN pattern.
The npm package ships only an ESM whose AudioWorklet processor + wasm-bindgen
glue are inlined as a string (loaded via a Blob URL — no CDN for the worklet).
Its only runtime fetches are a single-threaded df_bg.wasm and an ONNX model
tarball, which previously loaded from an external CDN. We now VENDOR both
(build/denoise-vendor/deepfilternet/v2/...) and self-host them under
denoise/deepfilternet/, overriding the package's cdnUrl so nothing hits the
upstream CDN — keeping it self-hosted / Tauri-CSP safe.
The wasm is single-threaded (no SharedArrayBuffer / atomics / imported shared
memory), so it needs no COOP/COEP cross-origin isolation and runs fine in EC's
non-isolated iframe. Runs at 48 kHz fullband. Any init/runtime failure falls
back to the raw mic, like the other models.
- vite.config.js: copy ESM + vendored wasm/model into the EC denoise dir with a
required-asset guard that aborts the build if any entry is missing.
- build/lotus-denoise.js: 'deepfilternet' branch — dynamic-import the ESM, build
a DeepFilterNet3Core pointed at the self-hosted base, await init, return the
worklet node; 48 kHz; raw-mic fail-safe preserved.
- denoisePipeline.ts: 'deepfilternet' branch for the in-app tester + sampleRate.
- settings.ts: add 'deepfilternet' to DenoiseModelId + getSettings whitelist.
- lotusDenoiseUtils.ts: add the comparison-chart row.
- General.tsx: add the "DeepFilterNet 3 (beta)" dropdown option.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Two issues found from real testing of the in-app tester:
1. Raw ≈ RNNoise ≈ Speex sounded identical in Record & compare because the clip
was captured with browser noise suppression ON (the user's native-NS
setting), so "Raw" was already cleaned and the models had nothing left to
remove. Record & compare now captures fully raw audio (noiseSuppression /
AGC / echoCancellation off) so each model's effect on real noise is audible.
(Friends still heard differences in calls — the models work; the test was
feeding them pre-cleaned audio.)
2. DTLN was robotic/choppy/quiet because @workadventure/noise-suppression
targets 16 kHz (AUDIO_CONFIG.sampleRate) and does NOT resample internally,
while we ran it at 48 kHz. Run DTLN's whole graph in a 16 kHz context:
- denoisePipeline: add sampleRateFor(model) (16k for dtln, 48k otherwise);
tester live-monitor + playback contexts use it (bufferSource resamples the
48k clip down for DTLN).
- shim (build/lotus-denoise.js): SAMPLE_RATE is now model-aware, so DTLN is
correct in real calls too (it was previously broken at 48 kHz). The 16 kHz
processed track is still published to LiveKit (WebRTC/Opus resamples).
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
The previous "Test Microphone" meter only showed a raw 0-100% level bar — it
never ran the gate or any model, and its scale wasn't dBFS, so it couldn't tell
you which threshold to pick or let you hear the models solo. Replace it with a
real tester that reuses the shipped worklets (/public/element-call/denoise/) in
a main-app AudioContext, mirroring the call pipeline (source -> gate -> model).
- denoisePipeline.ts: shared loader for the RNNoise/Speex flat worklets and the
DTLN @workadventure helper, the noise gate, and a dBFS RMS meter helper.
- DenoiseTester.tsx:
- Live monitor: hear yourself through the selected model (+gate) in real time
(headphones) with In/Out dBFS meters and a threshold marker on the In meter
so the gate value is meaningful to calibrate.
- Record & compare: capture a short clip, then A/B the same audio Raw vs
RNNoise vs Speex vs DTLN.
- Wire it into the ML settings block; remove the old raw-only MicMeter. Use real
TDS tokens (--accent-*, --border-color, --bg-card) instead of the invented
--lt-* names + hardcoded hex the old meter used.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
The prior DTLN attempt (89a2321d) broke the build (missing dep, wrong
`cinny/` asset paths) and typecheck (`'dtln'` not in DenoiseModelId), and was
wired against an API the package doesn't expose. @workadventure/noise-
suppression is not a flat AudioWorklet — it's a self-contained ES module whose
processor name is `workadventure-noise-suppression` and which resolves its own
LiteRT WASM + TFLite models via import.meta.url. Driving it by hand-rolled
addModule + processorOptions cannot work.
- Re-add @workadventure/noise-suppression@0.0.4 (package.json + lockfile).
- vite: copy the package's whole dist/ tree intact to
denoise/workadventure/ (preserving assets/ + vendor/litert) so import.meta
resolution works at runtime; fail the build if the entry module is missing.
- shim: for the DTLN model, dynamic-import denoise/workadventure/audio-worklet
.js and use createNoiseSuppressionAudioWorklet(ctx, { bypassUntilReady })
to build the node; RNNoise/Speex keep their direct flat-worklet path. Async
init errors are logged + reported and fall back to the raw mic.
- Restore 'dtln' in DenoiseModelId (+ settings coercion), the model chart, and
the settings dropdown, labelled "(beta)".
DTLN builds and is fully self-hosted, but its in-call audio is UNVERIFIED in
this environment — needs a real-call test. DeepFilterNet stays excluded (CDN
asset loading, incompatible with self-hosting / Tauri CSP).
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Audit/repair of the multi-model denoise work so it actually builds and only
exposes working, self-hosted models.
- Complete the DTLN/DFN3 revert: uninstall @workadventure/noise-suppression
and deepfilternet3-noise-filter (package.json + lockfile), drop the unused
DTLN asset-copy block from vite.config.js (was shipping ~2MB of unused
tflite/wasm), and narrow DenoiseModelId to the bundled models (rnnoise,
speex). Coerce any retired persisted model value back to the default.
- Fix General.tsx CI typecheck failures introduced by the denoise UI: restore
three imports the rewrite deleted (useDateFormatItems, SequenceCardStyle,
useTauriUpdater), add the missing denoise/sound imports, and correct
hallucinated Folds props (Text has no variant/bold; Box uses
alignItems/justifyContent). tsc now passes with 0 errors.
- Harden the vite denoise plugin: required RNNoise/Speex/gate assets and the
shim now fail the build loudly if missing (instead of a silent warn that
shipped a broken ML feature), and the index.html shim injection is verified.
- CI: move the cinny-desktop submodule bump into ci.yml as a `trigger-desktop`
job gated on `needs: build`, and delete the standalone trigger-desktop.yml.
A failing push no longer kicks off the slow Tauri builds in parallel.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
- Remove non-functional DTLN and DFN3 dependencies and UI options.
- Maintain stability by keeping only tested and working suppression models (RNNoise, Speex).
- Verified that build passes and all assets are correctly bundled.
- Verified package layouts and integration paths for @workadventure/noise-suppression (v0.0.4) and deepfilternet3-noise-filter (v1.2.1).
- Updated build configuration to correctly copy WASM, TFLite, and ONNX assets.
- Integrated DTLN and DeepFilterNet initialization logic into the audio shim.
- Enabled all four models (RNNoise, Speex, DTLN, DFN3) in Settings UI.
Implement a flexible, multi-model noise suppression pipeline for Element Call/LiveKit integration:
- ML Engines: Added support for RNNoise, Speex, DTLN, and DeepFilterNet 3 models.
- Pipeline Architecture: Implemented modular audio processing in lotus-denoise.js, supporting 'Series Suppression' (running browser-native NSNet2 before ML) and a hardware-style Noise Gate.
- UI & UX Enhancements:
- Settings UI: Added model comparison chart with CPU/Quality metadata.
- Tuning: Added Live Microphone Meter for calibrating Noise Gate thresholds.
- Reporting: Added LotusToast system to alert users when ML suppression fails or falls back to raw input.
- Robustness & Quality:
- Capture Fidelity: Removed forced 48kHz capture constraints to allow native-rate capture (solving static issues with high-end audio interfaces).
- Performance: Added WASM SIMD detection with transparent fallback.
- Capability Detection: Added browser feature detection to disable unsupported ML modes.
- Build Integration: Updated Vite config to self-host all model WASM/tflite assets in /denoise/ directory.
ML noise suppression produced loud static on real calls. RNNoise requires
mono 48kHz float input; feeding it stereo or wrong-rate data is the classic
cause of that static. Harden the shim:
- request mono (channelCount:1) + 48kHz capture
- run a 48kHz AudioContext and BAIL to the raw mic if the browser won't
give a true 48kHz context (wrong-rate data -> static)
- force the worklet node to explicit mono in/out
- use the non-SIMD rnnoise.wasm (SIMD build artifacts on some GPUs)
- share one AudioContext across captures
Also fix the two CI-blocking eslint errors (unused vars in UrlPreviewCard
and useLocalMessageSearch) and apply repo-wide prettier formatting so
check:eslint and check:prettier pass.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Replace the boolean call noise-suppression setting with a 3-way control
(Off / Browser-native / ML beta) in Settings -> General -> Calls.
- Off: noiseSuppression=false to Element Call
- Browser-native: EC's built-in WebRTC suppressor (prior default)
- ML (beta): on-device RNNoise (@sapphi-red/web-noise-suppressor)
Element Call captures the mic inside its iframe and publishes to LiveKit,
so the host can't reach that track; LiveKit's Krisp filter is Cloud-only
(we self-host the SFU) and EC's own RNNoise PR #3892 is unmerged. The ML
tier instead injects a same-origin pre-init shim into the vendored EC
index.html (build/lotus-denoise.js, wired by the lotusDenoise vite plugin)
that patches getUserMedia and routes the captured mic through an RNNoise
AudioWorklet before LiveKit sees it -- the same post-capture pipeline as
#3892, with no EC fork/AGPL/rebase burden. Falls back to the raw mic if
setup fails; keeps echoCancellation/AGC on the raw capture.
- settings.ts: callNoiseSuppression -> 'off'|'browser'|'ml' + legacy
boolean migration (true->browser, false->off)
- CallEmbed/useCallEmbed: tier maps to noiseSuppression param and appends
lotusDenoise=ml (native suppressor off in ML mode)
- vite.config.js: copy RNNoise worklet/wasm + shim into the EC bundle and
inject the shim <script> before EC's module entry
- docs: LOTUS_FEATURES.md, LOTUS_TODO.md (P5-30 done)
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
* fix: update PageHero styles for better text handling and add PageHeroText class
* trigger cla recheck
* refactor: remove unused styles from PageHeroText and LobbyHeroTopic
* fix: remove unnecessary class names from PageHero for cleaner markup
style: add styles to LobbyHeroTopic for improved text display
- New Year: replace flashing animBurst rays with gentle falling confetti
- Lunar New Year: reduce 9 lanterns to 4, halve sizes, dim silk/shimmer
- April Fools: remove all glitch/scanline/watermark effects; replace
with a subtle rainbow stripe and falling punctuation symbols
- Add SeasonalPreview export (position:absolute, reduced-motion) for
use inside contained card elements
- Replace SettingsSelect dropdown for Seasonal Theme with SeasonalBgGrid,
a visual card grid (matches ChatBgGrid pattern) showing ambient previews
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
The previous fix (7f329e3b) made Page transparent so the body background
would show through. But PageRoot sits between Page and body with an opaque
Background.Container color, so the body background was blocked — it only
showed through the glassmorphism sidebar (which is a sibling of PageRoot,
not a child).
Revert to applying getChatBg() directly to Page via inline style, which
overrides PageRoot's class-level background-color by CSS specificity rules.
SidebarNav continues to mirror the same background to document.body so the
glassmorphism sidebar can blur through it.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- UserHero: move AvatarDecoration inside AvatarPresence so the decoration
inline-flex container sizes to the avatar only, not the presence badge
- SidebarNav: add will-change: background-position, background-size on
document.body for animated backgrounds, promoting them to a compositor
layer so overlaid text/UI doesn't repaint on every animation frame
- scheduledMessages: back the atom with atomWithStorage so the scheduled
message tray survives page refreshes via localStorage
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Typing "from:jared" with no additional text now shows all cached
messages from that user across all rooms.
- SearchInput: call onSearch() even when only from: tokens were
extracted (no remaining body text), passing an empty string term
- useLocalMessageSearch: introduce senderOnlyMode (empty term +
senders set) which searches ALL rooms instead of encrypted-only,
and skips text matching — just filters by sender
- MessageSearch: define hasActiveSearch / senderOnlyMode flags;
use them to enable local search and fix placeholder/loading/results
conditions; adapt local results section header and description
Server-side search is skipped in sender-only mode (Matrix search API
requires a search_term); results come from the local event cache.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- ExportRoomHistory: make addEvents() async, call decryptEventIfNeeded()
before inspecting type/content so E2EE rooms export decrypted text
- UrlPreviewCard: remove Google S2 favicon (privacy leak); show
generic Icons.Link instead — no third-party external calls
- Profile: add statusDirtyRef so server presence sync cannot clobber
in-flight emoji insertions or keystrokes; cleared on save/clear
- useLocalMessageSearch: include m.sticker, m.poll.start, and
org.matrix.msc3381.poll.start in encrypted room search; index poll
question and answer bodies
- SeasonalEffect: z-index 9997 → 9999 so overlays render above
animated chat backgrounds
- LOTUS_BUGS.md: mark all resolved, document remaining blocked items
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Previously the background was applied directly to <Page> (room view
only) when glassmorphism was off, and to document.body only when
glassmorphism was on. This caused two bugs:
- Without glassmorphism: background only visible in the chat panel,
not behind the sidebar
- With glassmorphism: Page reverted to its opaque theme surface color,
so the body background only showed through the glass sidebar
Fix: SidebarNav now always applies the active background to
document.body (regardless of glassmorphism). RoomView's <Page> is
made transparent whenever a background is active so the body
background shows through both the sidebar and the chat area.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
AvatarPresence had position:absolute via UserAvatarContainer, which
made it position relative to the AvatarDecoration wrapper (a new
stacking context) instead of the hero container, shifting the
decoration image one avatar-width to the left.
Fix: apply UserAvatarContainer to an outer div so AvatarDecoration
sits inside the absolute-positioned slot, not the other way around.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Selected option borders and backgrounds used rgba(var(--mx-primary-rgb,
0,132,255), ...) which rendered as the default Cinny blue, ignoring the
Lotus Terminal Design System palette. Replaced with --accent-cyan,
--accent-cyan-dim, --accent-cyan-border, and --border-color.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Wraps the profile hero avatar with AvatarDecoration so a user's chosen
decoration ring is visible when viewing their profile panel. Added an
optional `inset` prop to AvatarDecoration so the profile hero can use
a larger bleed (20px) proportional to the bigger avatar size.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
The outer Box(direction=Column, gap=300) was a flex column with flex-shrink:1
on children. With maxHeight:480 + overflowY:auto, when total content exceeded
480px the flex children compressed into each other, making cells appear to
overlap regardless of the gap on the inner flex container.
Replace with:
- Plain div scroll container (display:flex flex-direction:column gap:24)
so children never shrink — they overflow into scroll area
- Plain div per category (gap:10 between label and grid)
- CSS grid (auto-fill, 72px columns, gap:20) for cells so row spacing is
explicit and cannot be affected by flex layout math
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
The INSET overflow approach (position:absolute images extending beyond
52×52 buttons) was fundamentally broken: absolutely positioned children
don't contribute to flex row height, so rowGap controlled button-to-button
spacing but image pixels still painted into the gap, causing visual overlap
regardless of how large rowGap was set.
New approach: 72×72 circle cells, overflow:hidden, image fills the cell
via inset:0 with objectFit:contain. Gap of 16px is actual clear space
between cell edges — no math needed. Also bumped maxHeight 420→480.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
public/fonts/ (custom-fonts.css + woff2 files) was never listed in the
static copy plugin config, so it was absent from every dist build output.
The site served HTML instead of CSS for /fonts/custom-fonts.css, causing
JetBrains Mono and Fira Code to 404. Adding the target copies the directory
to dist/fonts/ where nginx serves it correctly.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
rowGap 36→52 (40px visual gap between image rows), columnGap separate at 28.
The 52×52 buttons have 8px image overflow on each side so row gap needed to
account for 8+visual+8 = actual gap. Previous 36→20px visual was still tight.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- chatBackground.ts: remove animRainGlowKeyframe and animGridBrightnessKeyframe
from LIGHT anim-rain and anim-pulse definitions (these were removed from the
import and from DARK variants in the previous session but the LIGHT variants
were missed, leaving stale references that would cause a build error)
- ProfileDecoration.tsx: increase decoration grid gap 20→36 (visual gap was
only 4px due to 8px image overflow beyond each 52×52 button), fix paddingBottom
4→8 and add paddingRight:8 to prevent edge clipping
- LOTUS_BUGS.md: correct bug #8 root cause (CSP, not lazy-loading), add
bugs #9 (grid spacing) and #10 (Windows taskbar badge)
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Settings dropdowns (Bug #3):
- Add reusable SettingsSelect component using Menu+PopOut+FocusTrap — exact
same pattern as Message Layout, so all dropdowns look consistent
- Replace raw <select> for Seasonal Theme, UI Font, AFK Timeout, and
Join & Leave Sounds with SettingsSelect
Animated chat backgrounds bleeding onto content (Bug #6 / #7):
- Remove filter:brightness() and opacity animations from chatBackground.ts
(animRainGlowKeyframe, animGridBrightnessKeyframe, animFirefliesGlowKeyframe,
animFirefliesBlinkKeyframe). These were applied to the Page element which
caused ALL descendants (messages, composer) to flash in sync.
Also created a CSS stacking context on Page that pushed SeasonalEffect
(position:fixed; z-index:9997) behind the animated background layer.
- Only backgroundPosition / backgroundSize animations remain — safe, do not
affect descendants, and do not create stacking contexts.
- Remove now-unused animation keyframe imports from chatBackground.ts.
Voice ringing in persistent rooms (Bug #5):
- Narrow the ringing condition from (Invite|Knock|Restricted) to only Invite,
matching exactly the rooms where the call button is visible.
- Add room.isCallRoom() early-exit so m.join_rule:call rooms never ring.
Avatar decoration images not loading (Bug #8):
- Change loading="lazy" → loading="eager" in DecorationPreviewCell.
Lazy loading does not reliably trigger for images inside nested overflow
scroll containers (the settings panel scroll area), so images never loaded.
Docs: LOTUS_BUGS.md updated with root cause and resolution for all 5 new bugs.
Docs: LOTUS_TODO.md adds P5-35/P5-36 (deferred desktop notification/jump list).
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- Point DECORATION_CDN at Lotus Nextcloud WebDAV share instead of external
avatardecoration.com; all 99 APNG files are self-hosted and served via
direct DAV URL (no CORS issue for <img> elements)
- Add onError handler to AvatarDecoration.tsx to silently hide the overlay
if a file is missing or the CDN is unreachable
- Rewrite scripts/syncDecorations.mjs: now sends HTTP HEAD requests to the
live Nextcloud CDN (batches of 16 in parallel) and removes catalog entries
for files that return non-2xx; empty categories are pruned automatically.
Workflow: delete files from Nextcloud → run `npm run sync:decorations` →
commit the updated avatarDecorations.ts. No local files needed.
- Add public/decorations/ to .gitignore; delete the 85 MB local APNG cache
that was downloaded during development (files live on Nextcloud now)
- Add sync:decorations script to package.json
- Update LOTUS_FEATURES.md, LOTUS_TODO.md (P5-13 + P5-14 ✓), README.md
with avatar decoration documentation and catalog sync workflow
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
256×256 APNG overlays from avatardecoration.com (open CORS CDN).
Stored in the user's Matrix profile as io.lotus.avatar_decoration via
MSC4133 so all Lotus Chat users see each other's decorations.
- avatarDecorations.ts: curated catalog of 110 original-IP decorations
across 9 categories (Gaming, Cyber, Space, Fantasy, Elements,
Japanese, Nature, Spooky, Cozy)
- useAvatarDecoration: per-user profile fetch with module-level cache
and in-flight deduplication so concurrent renders for the same userId
share one HTTP request
- AvatarDecoration: position:relative wrapper that overlays the APNG
8px beyond the avatar on all sides; renders nothing when no decoration
is set (zero cost for undecorated users)
- ProfileDecoration: scrollable grid picker in Settings → Profile,
grouped by category with live preview; Save button appears only when
the selection differs from what's saved
- Applied at all five avatar display sites: message timeline, members
drawer, knock list, @mention autocomplete, notifications inbox
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- usePresenceUpdater: replace stale closure with readStatus() called at
invocation time so changing custom status in Profile Settings is never
silently overwritten by subsequent activity events
- CallEmbedProvider: fix m.space.parent state-key lookup by switching
getStateEvent → getStateEvents (plural); space channel voice rooms no
longer trigger the incoming-call ring/animation
- Add useUserNotes hook (io.lotus.user_notes account data, reactive via
useAccountDataCallback, 500-char limit, cross-device sync)
- UserRoomProfile: add UserPrivateNotes textarea with 800ms debounced
auto-save, saving indicator, char counter when <100 chars remain;
shown only when viewing another user's profile
- LOTUS_FEATURES.md: add Private Notes section, Status Revert fix note,
animation improvements subsection, Seasonal Themes section
- LOTUS_BUGS.md: mark presence revert + voice ringing bugs as resolved
- README.md + landing/index.html: document all new June 2026 features
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Adds 11 CSS-only seasonal overlays (Halloween, Christmas, New Year, Autumn,
April Fool's, Lunar New Year, Valentine's Day, St. Patrick's Day, Earth Day,
Deep Space, Retro Arcade) with date-based auto-detection and a manual override
dropdown in Settings → Appearance → Seasonal Theme. All themes respect
prefers-reduced-motion. SeasonalEffect mounts at z-index 9997 in App.tsx.
Also rewrites all 5 animated chat background keyframes for smoother, more
organic motion: Digital Rain gains a phosphor glow flicker; Star Drift now
loops each layer by exactly its own tile size (no more seam); Grid Pulse adds
an independent brightness oscillation at a prime period; Aurora Flow drives
all four gradient layers through distinct paths; Fireflies adds glow-pulse and
opacity-blink animations at prime periods for unsynchronised bioluminescence.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Extends useTauriNotificationBadge to also invoke set_tray_unread (mirror the
unread-mention state onto the tray icon, visible when minimized) and flash_window
(flash the taskbar button when new mentions arrive while the window is unfocused).
No-op outside Tauri.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Adds useDeepLinkNavigate (mounted in ClientNonUIFeatures): listens for the
'lotus-deeplink' DOM CustomEvent that the Tauri shell dispatches when a
matrix:/matrix.to link opens the app, converts matrix: URIs to matrix.to, and
navigates via the same path as useMentionClickHandler (reusing matrix-to.ts
parsers + useRoomNavigate). No-op outside Tauri.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
The committed file had the transparency 'checkerboard' baked in as opaque
gray/white pixels (it was fully opaque), so it would have produced icons with a
checkerboard background. Flood-filled the dove to protect it, removed the
checkerboard, and restored the dove — the lotus line-art + white dove now sit on
a real alpha-transparent background. Used as the source for the desktop icons.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
The Room Settings description still said 'Enforced locally by Lotus Chat
clients' from before the voice-limit-guard was deployed. The cap is now
enforced server-side (via the lk-jwt-service guard) for all Matrix clients.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
vite-plugin-static-copy v4 preserves the full source path under dest, so the
old { src: '.../dist', dest: 'public', rename: 'element-call' } target placed
Element Call at dist/public/node_modules/@element-hq/element-call-embedded/dist/
instead of dist/public/element-call/. The call widget URL
(/public/element-call/index.html) therefore 404'd.
This broke voice/video calls on cinny-desktop (served via tauri-plugin-localhost
from a fresh build). The web client only kept working because its deployed
/public/element-call/ was a stale artifact from before the v4 bump — the next
web rebuild would have broken calls there too.
Fix: copy the dist directory to public/element-call with rename:{stripBase:4}
to strip the source path segments, mirroring the android/locales targets.
Verified: a fresh build now produces dist/public/element-call/index.html +
assets/ with intact relative asset refs.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Sounds (P5-16): browsers block the Web Audio context until a user gesture
starts it, so join/leave sounds — which fire later with no gesture — were
silent. unlockCallSounds() now primes/resumes the shared AudioContext inside
the Join click (centralized in useCallStart so every join path is covered),
making the per-client sounds reliably audible to everyone in the call.
Voice limit (P5-10): the limit is now a hard, cross-client server-side cap
enforced by the voice-limit-guard sidecar (matrix repo) that fronts
lk-jwt-service and refuses LiveKit tokens when a room is full. Updated
LOTUS_FEATURES.md / README.md / LOTUS_TODO.md to reflect that the client
'Channel Full' check is UX only and the server is authoritative.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
P5-10 Voice Channel User Limit:
- New StateEvent.LotusVoiceLimit (io.lotus.voice_limit) with { max_users }
- RoomVoiceLimit admin control in Room Settings > General > Voice
(power-level gated via permissions.stateEvent)
- CallPrescreen reads the limit reactively and disables Join with a
'Channel Full (N/N)' message at capacity; existing members can rejoin
P5-16 Custom Join/Leave Sound Effects:
- useCallJoinLeaveSounds hook wired into CallUtils; detects participant
join/leave via MatrixRTCSession membership changes (sender|deviceId),
filters out self, only fires while joined
- Sounds synthesized in-browser with Web Audio (callSounds.ts) - no
assets bundled; styles Off/Chime/Soft/Retro
- 'Join & Leave Sounds' selector in Settings > Calls (previews on change)
Docs: LOTUS_FEATURES.md, README.md, LOTUS_TODO.md (P5-10/P5-16 marked done)
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
- LOTUS_FEATURES.md: added sections for Knock-to-Join Notifications for
Admins and AFK Auto-Mute in Voice under their parent headings
- LOTUS_TODO.md: marked P4-3 and P5-11 as [x] completed
- README.md: updated Calls & Voice bullet list with AFK auto-mute entry;
expanded knock admin badge entry with badge-count detail
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
composedPath() returns an empty array once the native event is no longer
dispatching. In React 19, events from a portal-within-portal (EmojiBoard
inside #portalContainer, which already hosts the Settings Overlay) can reach
the synthetic event handler after the native dispatch window closes.
The fallback walks up from evt.target so handleGroupItemClick still finds
the emoji button and calls onEmojiSelect — fixing emoji selection in the
status-message editor in Settings > Account > Profile.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
P4-3 — Knock-to-join Notifications for Admins:
- usePendingKnocks() hook reactively tracks knocking members via
RoomMemberEvent.Membership; returns empty array if user lacks invite power
- Members icon in RoomViewHeader shows a Warning badge with the knock count
when there are pending requests; badge updates in real time without
needing to open the drawer; aria-label updated to describe pending count
P5-11 — AFK Auto-Mute in Voice:
- useAfkAutoMute() hook opens a monitoring-only getUserMedia stream,
connects it to an AnalyserNode, and polls RMS every 500ms
- If mic is on and RMS stays below threshold for the configured timeout,
calls callEmbed.control.setMicrophone(false) and shows an in-app toast
- Hook is called inside CallControls so monitoring is only active during calls
- Settings: afkAutoMute toggle + afkTimeoutMinutes select (1/5/10/20/30 min,
default 10) added to Settings → Calls
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Pushing to cinny-desktop main already fires release.yml via on:push.
The explicit API dispatch call was redundant, caused double-job runs,
and failed with 401 when the temporary admin token expired. Removed.
DISPATCH_TOKEN secret is no longer needed.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- EditHistoryModal: decrypt fetched edit events in E2EE rooms via
mx.decryptEventIfNeeded() before rendering; previously events not
found in the room cache showed ciphertext or "(no text)"
- CallEmbedProvider: add touch support for PiP resize corners;
extracted shared applyResize() helper; onTouchStart wired to all
four corners alongside existing onMouseDown
- RoomView: skip chatBgStyle when glassmorphism is active; document.body
already carries the background for the blur effect, rendering it twice
doubled CSS animation work unnecessarily
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
ACTIONS_TOKEN's dispatch attempts were failing silently. DISPATCH_TOKEN is
a new cinny repo secret with confirmed actions:write scope. Also fix the
HTTP check to use -ge/-lt arithmetic instead of -lt/-gt.
NOTE: DISPATCH_TOKEN should be replaced with a permanent Gitea API token
that has actions:write scope (create in Gitea user settings → Applications).
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
RELEASE_TOKEN may lack Actions write scope. ACTIONS_TOKEN already exists
as a repo secret and is the correct token for dispatching workflows.
Also capture and print the HTTP response so failures are visible in logs.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Status message: Synapse clears status_msg when a user goes offline/reconnects.
Fix by caching to localStorage and re-sending on setOnline(). The sync
effect no longer overwrites the local value with an empty server event.
Timezone: PUT /profile/{userId}/m.tz is MSC1769 (unstable) and not
supported by standard Synapse — save/load silently fails. Fix by using
Matrix account data (im.lotus.timezone) instead, which is fully
supported. Own profile falls back to account data; other users still
try the m.tz profile endpoint (for federated servers that support it).
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Omitting sendNotificationType for call rooms caused Element Call to
default to ring behavior. Now all starting-call events explicitly set
notification (or ring for DMs). Voice channels always get notification.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Presence: subscribe on MatrixClient (mx) instead of individual User objects.
User EventEmitters have a 10-listener default; the same user appears in many
mounted components simultaneously (member list, avatars, presence rings) and
was accumulating 11+ listeners per event, causing MaxListenersExceededWarning
on User.presence, User.currentlyActive, and User.lastPresenceTs.
Fonts: download JetBrains Mono and Fira Code latin subsets to public/fonts/
and replace Google Fonts CDN links (two external origins) with a local CSS
file. Windows WebView2 tracking prevention was blocking googleapis.com and
gstatic.com, logging 18+ "blocked" warnings per session. VT323 remains on
Google Fonts as it's decorative and not a default option.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
trigger-desktop.yml was pushing a submodule bump commit (which fires
release.yml via the push event) AND then explicitly dispatching
release.yml via the API, causing every cinny push to produce two
back-to-back desktop builds. Drop the dispatch step; the push alone
is sufficient.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Adds a Tauri command (set_badge_count) that draws a red circle badge
with a highlight count onto the Windows taskbar button overlay icon,
matching Discord's behavior. Badge shows @mention/highlight count only
(not total messages), clears to zero when all highlights are read.
Frontend: useTauriNotificationBadge hook reads roomToUnreadAtom and
calls set_badge_count via window.__TAURI_INTERNALS__.invoke whenever
the unread map changes. No-ops silently in the browser (non-Tauri).
Mounted as TauriEffects inside JotaiProvider in App.tsx.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
8 individual SettingTile rows collapsed into a single wrapped chip grid.
Active chips show as Primary+outlined; inactive as Secondary. Clicking
any chip toggles it. Drops from ~83 lines to ~25 and reads at a glance.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
* fix: Update featured communities in Explore
* Add new spaces and rooms to config.json
* Remove #pcapdroid room from configuration
* Update rooms list in config.json
Replaced '#archlinux:archlinux.org' with '#tuwunel:grin.hu' in rooms list.
* Update channel list in config.json
* add option to start video all in DM
* show speaker icon for dm's in call status name
* show call view if call is active in room
* add Atria call ringtone
* update element call and widget api
* add option to start voice/video call in dms
* only show call button if user have permission
* allow call widget to send call notification event
* show incoming call dialog and play sound
* fix call permission checks
* allow option to start call in all rooms
* send notification when starting call in non-voice rooms
* hide header call button from voice rooms
* prevent call join if call not supported and started by other party
* update call menu style
* show call not supported message on incoming call notification
* improve the incoming call layout
* video call with right click without opening menu
* allow call widget to fetch media url
* add webRTC missing error
* improve call permission label
---------
Co-authored-by: Krishan <33421343+kfiven@users.noreply.github.com>
* fix: do not attempt to join call on doubleclick if missing permissions
* update comment
* export getPowersLevelFromMatrixEvent for usage elsewhere
* only read vc permissions when actually needed instead of reactively
* chore: add matrixrooms.info to directory list
matrixrooms.info is a directory of all public Matrix rooms it can find,
regardless of homeserver. It is much larger than the morg directory,
so is more useful as a general search
* chore: install deps related to semantic release
* chore: add husky config
* ci: add a script to update version number on new release
* ci: update ci/cd to include semantic release changes
* chore: merge dev to semantic-release
Allow using filenames in codeblocks
- If there is a dot in the language name, we instead treat the first line after ``` as the filename and everything after the last dot as the language
- we use a custom "data-label" attribute on the code block to specify the name of the file (so only compatible with cinny from this point onwards)
* Show large image overlay when clicking url preview thumbnail
* Move image overlay into its own component
* Move ImageOverlay props into extended type
* Remove export for internal type
* fix member button tooltip in call room header
* hide sticker button in room input based on chat window width
* render camera on off data instead of duplicate join messages
* hide duplicate call member changes instead of rendering as video status
* fix prescreen message spacing
* allow user to end call if error when loading
* show call support missing error if livekit server is not provided
* prevent joining from nav item double click if no livekit support
Fix recent emoji are not getting saved
Refactor recent emoji retrieval to ensure structured cloning and proper type checking. The sdk was not updating account data because we are mutating the original and it compare and early return if found same.
* add mutation observer hok
* add hook to read speaking member by observing iframe content
* display speaking member name in call status bar and improve layout
* fix shrining
* add joined call control bar
* remove chat toggle from room header
* change member speaking icon to mic
* fix joined call control appear in other
* show spinner on end call button
* hide call statusbar for mobile view when room is selected
* make call statusbar more mobile friendly
* fix call status bar item align
* add mutation observer hok
* add hook to read speaking member by observing iframe content
* display speaking member name in call status bar and improve layout
* fix shrining
* Add users on the nav to showcase call activity and who is in the call
* add check to prevent DCing from the call you're currently in...
* Add avatar and username for the space (needs to be moved into RoomNavItem proper)
* Add background variant to buttons
* Update hook to keep method signature (accepting an array of Rooms instead) to support multiple room event tracking of the same event
* Add state listener so the call activity is real time updated on joins/leaves within the space
* Add RoomNavUser for displaying the user avatar + name in the nav for a visual of call activity and participants
* rename CallNavBottom to CallNavStatus
* Rename callnavbottom and fix linking implementation to actually be correct
* temp fix to allow the status to be cleared in some way
* re-add background to active call link button
* prepare to feed this to child elements for visibility handling
* loosely provide nav handling for testing refactoring
* Add CallView
* Update to funnel Outlet context through for Call handling (might not be the best approach, but removes code replication in PersistentCallContainer where we were remaking the roomview entirely)
* update client layout to funnel outlet the iframes for the call container
* funnel through just iframe for now for testing sake
* Update room to use CallView
* Pass forward the backupIframeRef now
* remove unused params
* Add backupIframeRef so we can re-add the lobby screen for non-joined calls (for viewing their text channels)
* Remove unused imports and restructure to support being parent to clientlayout
* Re-add layout as we're no longer oddly passing outlet context
* swap to using ref provider context from to connect to persistentcallcontainer more directly
* Revert to original code as we've moved calling to be more inline with design
* Revert to original code as we've moved the outlet context passing out and made more direct use of the ref
* Fix unexpected visibility in non-room areas
* correctly provide visibility
* re-add mobile chat handling
* Improve call room view stability
* split into two refs
* add ViewedRoom usage
* Disable
* add roomViewId and related
* (broken) juggle the iframe states proper... still needs fixing
* Conditionals to manage the active iframe state better
* add navigateRoom to be in both conditions for the nav button
* Fix the view to correctly display the active iframe based on which is currently hosting the active call (juggling views)
* Testing the iframe juggling. Seems to work for the first and second joins... so likely on the right path with this
* add url as a param for widget url
* fix backup iframe visibility
* Much closer to the call state handling we want w/ hangups and joins
* Fix the position of the member drawer to its correct location
* Ensure drawer doesn't appear in call room
* Better handling of the isCallActive in the join handler
* Add ideal call room join behavior where text rooms to call room simply joins, but doesn't swap current view
* Fix mobile call room default behavior from auto-join to displaying lobby
* swap call status to be bound to call state and not active call id
* Remove clean room ID and add default handler for if no active call has existed yet, but user clicks on show chat
* Applies the correct changes to the call state and removes listeners of old active widget so we don't trigger hang ups on the new one (the element-call widget likes to spam the hang up response back several times for some reason long after you tell it to hang up)
* Remove superfluous comments and Date.now() that was causing loading... bug when widgetId desynced
* Remove Date.now() that was causing widgetId desync
* add listener clearing, camel case es lint rule exception, remove unneeded else statements
* Remove unused
* Add widgetId as a getWidgetUrl param
* Remove no longer needed files
* revert ternary expression change and add to dependency array
* add widgetId to correct pos in getWidgetUrl usage
* Remove CallActivation
* Move and rename RoomCallNavStatus
* update imports and dependency array
* Rename and clean up
* Moved CallProvider
* Fix spelling mistake
* Fix to use shorthand prop
* Remove unneeded logger.errors
* Fixes element-call embedded support (but it seems to run poorly)
* null the default url so that we fallback to the embedded version (would recommend hosting it until performance issue is determined)
* Fix vite build to place element-call correctly for embedded npm package support
* add vite preview as an npm script
* Move files to more correct location
* Add package-lock changes
* Set dep version to exact
* Fix path issue from moving file locations
* Sets initial states so the iframes don't cause the other to fail with the npm embedded package
* Revert navitem change
* Just check for state on both which should only occur at initial
* Fixes call initializing by default on mobile
* Provides correct behavior when call isn't active and no activeClientWidgetApi exists yet
* Corrects the state for the situations where both iframes are "active" (not necessarily visible)
* Reduce code reuse in handleJoin
* Seems to sort out the hangup status button bug the occurred after joining a call via lobby
* Re-add the default view current active room behavior
* Remove repetitive check
* Add storing widget for comparing with (since we already store room id and the clientWidgetApi anyway)
* Update rendering logic to clear up remaining rendering bug (straight to call -> lobby of another room and joining call from that interface -> lobby of that previous room and joining was leading to duplication of the user in lobbies. This was actually from listening to and acknowledging hangups from the viewed widget in CallProvider)
* Prevent null rooms from ever rendering
* This seems to manage the hangup state with the status bar button well enough that black screens should never be encountered
* Remove viewed room setting here and pass the room to hang up (seems state doesn't update fast enough otherwise)
* Remove unused
* Properly declare new hangup method sig
* Seems to avoid almost all invalid states (hang up while viewing another lobby and hitting join seems to black screen, sets the active call as the previous active room id, but does join the viewed room correctly)
* Fix for cases where you're viewing a lobby and hang up your existing call and try to join lobby (was not rendering for the correct room id, but was joining the correct call prior)
* Re-add intended switching behavior
* More correct filter (viewedRoom can return false on that compare in some cases)
* Seems to shore up the remaining state issues with the status bar hangup
* Fix formatting
* In widget hang up button should be handled correct now
* Solves the CHCH sequence issue, CLJH remains
* Fixes CLJH, found CCH
* Solves CCH. Looks like CLCH left
* A bit of an abomination, but adds a state counter to iteratively handle the diverse potential states (where a user can join from the nav bar or the join button, hang up from either as well, and account for the juggling iframes)
Black screens shouldn't be occurring now.
* Fix dependency array
* Technically corrects the hangup button in the widget, should be more precise though
* Bind the on messaging iframe for easier access in hangup/join handling
* Far cleaner and more sensible handling of the call window... I just really don't like the idea of sending a click event, but right now the element-call code treats preload/skipLobby hangups (sent from our end) as if they had no lobby at all and thus black screens. Other implementation was working around that without just sending a click event on the iframe's hangup button.
* Fixes a bug where if you left a call then went to a lobby and joined it didn't update the actual activeCallRoomId
* Fixes complaints of null contentDocument in iframe
* Update to use new icons (thank you)
* Remove unneeded prop
* Re-arrange more options and add checks for each option to see if it is a call room (probably should manage a state to see if a header is already on screen and provide a slightly modified visual based on that for call rooms)
* Invert icons to show the state instead of the action they will perform (more visual clarity)
* Update src/app/features/room-nav/RoomCallNavStatus.tsx
Co-authored-by: Gimle Larpes <97182804+GimleLarpes@users.noreply.github.com>
* Update src/app/features/room-nav/RoomCallNavStatus.tsx
Co-authored-by: Gimle Larpes <97182804+GimleLarpes@users.noreply.github.com>
* Update src/app/features/room-nav/RoomCallNavStatus.tsx
Co-authored-by: Gimle Larpes <97182804+GimleLarpes@users.noreply.github.com>
* Update src/app/features/room-nav/RoomCallNavStatus.tsx
Co-authored-by: Gimle Larpes <97182804+GimleLarpes@users.noreply.github.com>
* Update src/app/features/room-nav/RoomCallNavStatus.tsx
Co-authored-by: Gimle Larpes <97182804+GimleLarpes@users.noreply.github.com>
* Update src/app/features/room-nav/RoomCallNavStatus.tsx
Co-authored-by: Gimle Larpes <97182804+GimleLarpes@users.noreply.github.com>
* Update src/app/features/room-nav/RoomNavItem.tsx
Co-authored-by: Gimle Larpes <97182804+GimleLarpes@users.noreply.github.com>
* Update src/app/features/room/RoomViewHeader.tsx
Co-authored-by: Gimle Larpes <97182804+GimleLarpes@users.noreply.github.com>
* Update src/app/features/room-nav/RoomNavItem.tsx
Co-authored-by: Gimle Larpes <97182804+GimleLarpes@users.noreply.github.com>
* Update src/app/features/room-nav/RoomNavItem.tsx
Co-authored-by: Gimle Larpes <97182804+GimleLarpes@users.noreply.github.com>
* Update src/app/features/room-nav/RoomNavItem.tsx
Co-authored-by: Gimle Larpes <97182804+GimleLarpes@users.noreply.github.com>
* Update src/app/features/room-nav/RoomNavItem.tsx
Co-authored-by: Gimle Larpes <97182804+GimleLarpes@users.noreply.github.com>
* Update src/app/features/room-nav/RoomNavItem.tsx
Co-authored-by: Gimle Larpes <97182804+GimleLarpes@users.noreply.github.com>
* Update src/app/features/room-nav/RoomNavItem.tsx
Co-authored-by: Gimle Larpes <97182804+GimleLarpes@users.noreply.github.com>
* Update src/app/features/room-nav/RoomNavUser.tsx
Co-authored-by: Gimle Larpes <97182804+GimleLarpes@users.noreply.github.com>
* Update src/app/features/room-nav/RoomNavUser.tsx
Co-authored-by: Gimle Larpes <97182804+GimleLarpes@users.noreply.github.com>
* Update src/app/features/room-nav/RoomNavUser.tsx
Co-authored-by: Gimle Larpes <97182804+GimleLarpes@users.noreply.github.com>
* Update src/app/pages/client/space/Space.tsx
Co-authored-by: Gimle Larpes <97182804+GimleLarpes@users.noreply.github.com>
* Update src/app/features/call/CallView.tsx
Co-authored-by: Gimle Larpes <97182804+GimleLarpes@users.noreply.github.com>
* Update src/app/features/call/CallView.tsx
Co-authored-by: Gimle Larpes <97182804+GimleLarpes@users.noreply.github.com>
* Update src/app/features/call/CallView.tsx
Co-authored-by: Gimle Larpes <97182804+GimleLarpes@users.noreply.github.com>
* Update src/app/features/room/RoomView.tsx
Co-authored-by: Gimle Larpes <97182804+GimleLarpes@users.noreply.github.com>
* Update src/app/features/room/RoomView.tsx
Co-authored-by: Gimle Larpes <97182804+GimleLarpes@users.noreply.github.com>
* adjust room header for calling
* Remove No Active Call text when not in a call
* update element-call version
* Update src/app/features/room/RoomViewHeader.tsx
Co-authored-by: Gimle Larpes <97182804+GimleLarpes@users.noreply.github.com>
* Update src/app/features/room/RoomViewHeader.tsx
Co-authored-by: Gimle Larpes <97182804+GimleLarpes@users.noreply.github.com>
* Update src/app/features/room/RoomViewHeader.tsx
Co-authored-by: Gimle Larpes <97182804+GimleLarpes@users.noreply.github.com>
* Update src/app/features/room/RoomViewHeader.tsx
Co-authored-by: Gimle Larpes <97182804+GimleLarpes@users.noreply.github.com>
* Update src/app/features/room/RoomViewHeader.tsx
Co-authored-by: Gimle Larpes <97182804+GimleLarpes@users.noreply.github.com>
* Revert most changes to Space.tsx
* Show call room even if category is collapsed
* changes to RoomNavItem, RoomNavUser and add useCallMembers
* Rename file, sprinkle in the magic one line for matrixRTCSession. and remove comment block
* swap userId to callMembership as a prop and add a nullchecked userId that uses the membership sender
* update references to use callMembership instead
* Simplify RoomNavUser
Discard future functionality since it probably won't exist in time for merging this PR
* Simplify RoomViewHeader.tsx
Remove unused UI elements that don't have implemented functionality. Replace custom function for checking if a room is direct with a standard hook.
* Update Room.tsx to accomodate restructuring of Room, RoomView and CallView
* Update RoomView.tsx to accomodate restructuring of Room, RoomView and CallView
* Update CallView.tsx to accomodate restructuring of Room, RoomView and CallView + suggested changes
* add call related permissions to room permissions
* bump element call to 0.16.3, apply cinny theme to element call ui, replace element call lobby (backup iframe) with custom ui and only use element call for the in-call ui
* update text spacing
* redo roomcallnavstatus ui, force user preferred mute/video states when first joining calls, update variable names and remove unnecessary logic
* set default mic state to enabled
* clean up ts/eslint errors
* remove debug logs
* format using prettier rules from project prettierrc
* fix: show call nav status while active call is ongoing
* fix: clean up call nav/call view console warnings
* fix: keep call media controls visible before joining
* fix: restore header icon button fill behavior
Fixes regression from b074d421b66eb4d8b600dfa55b967e6c4f783044.
* style: blend header and room input button styles in call nav
* fix page header background color on room view header
* fix: permissions and room icon resolution (#2)
* Initialize call state upon room creation for call rooms, remove subsequent useless permission
* handle case of missing call permissions
* use call icon for room item summary when room is call room
* replace previous icon src resolution function with a more robust approach
* replace usages of previous icon resolution function with new implementation
* fix room name not updating for a while when changed
* set up framework for room power level overrides upon room creation
* override join call permission to all members upon room creation
* fix broken usages of RoomIcon
* remove unneeded import
* remove unnecessary logic
* format with prettier
* feat: show connected/connecting call status
* fix: preserve navigation context when opening non-call rooms
* fix: reset room name state when room instance changes
* feat: Disable webcam by default using callIntent='audio'
* Add channel type selecor
* Add option for voice rooms, which for now sets the default selected
option in the creation modal
* Add proper support for room selection from the enu
* Move enums to `types.ts` and change icons selection to use
`getRoomIconSrc`
* fix: group duplicate conditions into one
* fix: typo
* refactor: rename kind/voice to access/type and simplify room creation
- rename CreateRoomVoice to CreateRoomType and modal voice state to type
- rename CreateRoomKind to CreateRoomAccess and KindSelector to AccessSelector
- propagate access/defaultAccess through create room and create space forms
- set voice room power levels via createRoom power_level_content_override
* refactor: unify join rule icon mapping and update call/space icons
- bump folds from 2.5.0 to 2.6.0
- replace separate room/space join-rule icon hooks with useJoinRuleIcons(roomType)
- route join-rule icons through getRoomIconSrc for consistent room type handling
- simplify getRoomIconSrc by removing the locked override path
- use VolumeHighGlobe for public call rooms and VolumeHighLock for private call rooms
* chore(deps): bump matrix-widget-api to 1.17 and remove react-sdk-module-api
* fix: adapt SmallWidget to matrix-widget-api 1.17.0 API
* fix: render call room chat only when chat panel is open
* fix(permissions): show call settings permissions only for call rooms
* refactor: remove redundant room-nav props/guards and minor naming cleanup
* fix: use PhoneDown icon for hang up action
* chore(hooks): remove unused useStateEvents hook
* fix(room): enable members drawer toggle in desktop call rooms
- show filled User icon when the drawer is open
* Revert "fix: adapt SmallWidget to matrix-widget-api 1.17.0 API"
This reverts commit a4c34eff8a.
* fix: semi-revert matrix-widget-api 1.17 bump and migrate to 1.13 API
* fix(call): wait for Element Call contentLoaded before widget handshake
- fixes not working on firefox
* fix missing imports
* improve create room type design and add beta badge for voice room
* add beta badge for voice room in space lobby
* fix create room modal title
* pass missing roomType param to roomicon component
* add roomtype
* Add deafen functionality (#2695)
* feat:(deafen functionality)
* feat:(reworked voice controls for deafen)
* ref:(use muted instead of volume for deafen)
* fix:(backpedal audio_enabled rename)
* ref:(renaming of deafened vars)
* add stack avatar component
* add call status bar - WIP
* remove call status from navigation drawer
* fix deprecated method use in use call members hook
* render new call status bar
* move call widget driver to plugins
* remove old status bar usage from navigation drawer
* add call session and joined hook
* remove unknown changes
* upgrade widget api
* add element call embed plugin
* remove unknown change
* add call embed atom
* add call embed hooks and context
* add call embed provider
* replace old call implementation
* stop joining other call on second click if already in a call
* refactor embed placement hook
* add merge border prop to sequence card
* add call preferences
* add prescreen to call view - WIP
* prevent joining new call if already in call
* make call layout adaptive
* render call chat as right panel
* show call members in prescreen
* render call join leave event in timeline
* remove unknown rewrite in docker-nginx file
* render call event without hidden event enable
---------
Co-authored-by: Gigiaj <gigiaboone@yahoo.com>
Co-authored-by: Jaggar <18173108+GigiaJ@users.noreply.github.com>
Co-authored-by: Gimle Larpes <97182804+GimleLarpes@users.noreply.github.com>
Co-authored-by: Gimle Larpes <gimlelarpes@gmail.com>
Co-authored-by: YoJames2019 <jamesclark1700@gmail.com>
Co-authored-by: YoJames2019 <yobiscuit0@gmail.com>
Co-authored-by: hazre <mail@haz.re>
Co-authored-by: haz <37149950+hazre@users.noreply.github.com>
Co-authored-by: Ajay Bura <32841439+ajbura@users.noreply.github.com>
Co-authored-by: James <49845975+YoJames2019@users.noreply.github.com>
Co-authored-by: James Reilly <jreilly1821@gmail.com>
Co-authored-by: Tymek <vonautymek@gmail.com>
Co-authored-by: Thedustbuster <92692948+Thedustbustr@users.noreply.github.com>
* Pin all the action deps to SHA
* Add more docker related action checks
* Limit Docker build platforms to linux/amd64
Updated Docker build action to target only linux/amd64 platform.
* request session info from sw if missing
* fix async session request in fetch
* respond fetch synchronously and add early check for non media requests (#2670)
* make sure we call respondWith synchronously
* simplify isMediaRequest in sw
* improve naming in sw
* get back baseUrl check into validMediaRequest
* pass original request into fetch in sw
* extract mediaPath util and performs checks properly
---------
Co-authored-by: mmmykhailo <35040944+mmmykhailo@users.noreply.github.com>
Previously markAsRead() only sent m.read receipts via sendReadReceipt().
This meant the read position was not persisted across page refreshes,
especially noticeable in bridged rooms.
Now uses setRoomReadMarkers() which sets both:
- m.fully_read marker (persistent read position)
- m.read receipt
Fixes issue where rooms would still show as unread after refresh.
fix: detect muted rooms with empty actions array
The mute detection was checking for `actions[0] === "dont_notify"` but
Cinny sets `actions: []` (empty array) when muting a room, which is
the correct behavior per Matrix spec where empty actions means no
notification.
This caused muted rooms to still show unread badges and contribute to
space badge counts.
Fixes the isMutedRule check to handle both:
- Empty actions array (current Matrix spec)
- "dont_notify" string (deprecated but may exist in older rules)
* Replace 'envs.net' with 'unredacted.org' in config
https://envs.net/ is shutting down their Matrix server
* Update defaultHomeserver and reorder servers list
* Remove 'monero.social' from homeserver list
* Add support for MSC4193: Spoilers on Media
* Clarify variable names and wording
* Restore list atom
* Improve spoilered image UX with autoload off
* Use `aria-pressed` to indicate attachment spoiler state
* Improve spoiler button tooltip wording, keep reveal button from conflicting with load errors
* Make it possible to mark videos as spoilers
* Allow videos to be marked as spoilers when uploaded
* Apply requested changes
* Show a loading spinner on spoiled media when unblurred
---------
Co-authored-by: Ajay Bura <32841439+ajbura@users.noreply.github.com>
On most browsers, pressing Enter to end IME composition produces this
sequence of events:
* keydown (keycode 229, key Processing/Unidentified, isComposing true)
* compositionend
* keyup (keycode 13, key Enter, isComposing false)
On Safari, the sequence is different:
* compositionend
* keydown (keycode 229, key Enter, isComposing false)
* keyup (keycode 13, key Enter, isComposing false)
This causes Safari users to mistakenly send their messages when they
press Enter to confirm their choice in an IME.
The workaround is to treat the next keydown with keycode 229 as if it
were part of the IME composition period if it occurs within a short time
of the compositionend event.
Fixes#2103, but needs confirmation from a Safari user.
* Add arrow to message bubbles and improve spacing
* make bubble message avatar smaller
* add bubble layout for event content
* adjust bubble arrow
* fix missing return statement for event content
* hide bubble for event content
* add new arrow to bubble message
* fix avatar username relative alignment
* fix types
* fix code block header background
* revert avatar size and make arrow less sharp
* show event messages timestamp to right when bubble is hidden
* fix avatar base css
* move message header outside bubble
* fix event time appears on left in hidden bubles
* extract emoji search component
* extract emoji board tabs component
* extract sidebar component
* extract no stickers component
* create emoji/sticker preview atom
* extract component from emoji/sticker item and sidebar buttons
* fix image group icon not loading
* separate emojis and sticker groups logic
* extract layout and emoji group components
* add virtualization in emoji board groups
* fix scroll to alignment
* add new search modal
* remove search modal from searchTab
* fix member avatar load for space with 2 member
* use media authentication when rendering avatar
* fix hotkey for macos
* add @ in username
* replace subspace minus separator with em dash
* fix 0 displayed in invite with no timestamp
* support displaying invite reason for receiver
* show invite reason as compact message
* remove unused import
* revert: show invite reason as compact message
* remove unused import
* add new invite prompt
* WIP - support room version 12
* add room creators hook
* revert changes from powerlevels
* improve use room creators hook
* add hook to get dm users
* add options to add creators in create room/space
* add member item component in member drawer
* remove unused import
* extract member drawer header component
* get room creators as set only if room version support them
* add room permissions hook
* support room v12 creators power
* make predecessor event id optional
* add info about founders in permissions
* allow to create infinite powers to room creators
* allow everyone with permission to create infinite power
* handle additional creators in room upgrade
* add option to follow space tombstone
* WIP - new profile view
* render common rooms in user profile
* add presence component
* WIP - room user profile
* temp hide profile button
* show mutual rooms in spaces, rooms and direct messages categories
* add message button
* add option to change user powers in profile
* improve ban info and option to unban
* add share user button in user profile
* add option to block user in user profile
* improve blocked user alert body
* add moderation tool in user profile
* open profile view on left side in member drawer
* open new user profile in all places
* add new create room
* rename create room modal file
* default restrict access for space children in room create modal
* move create room kind selector to components
* add radii variant to sequence card component
* more more reusable create room logic to components
* add create space
* update address input description
* add new space modal
* fix add room button visible on left room in space lobby
* Add setting to enable 24-hour time format
* added hour24Clock to TimeProps
* Add incomplete dateFormatString setting
* Move 24-hour toggle to Appearance
* Add "Date & Time" subheading, cleanup after merge
* Add setting for date formatting
* Fix minor formatting and naming issues
* Document functions
* adress most comments
* add hint for date formatting
* add support for 24hr time to TimePicker
* prevent overflow on small displays
* add simple button to start a thread on reply
* force build
* remove useless actions
* add actions back
* change icon to ThreadPlus
* add button to context menu
* fix capital T
---------
Co-authored-by: Ajay Bura <32841439+ajbura@users.noreply.github.com>
* Improve focus behaviour on search boxes and chats
* Implemented MR #2317
* Fix crash if canMessage is false
* Prepare for PR #2335
* disable autofocus on message field
* fix inaccessible space on alias change
* fix new room in space open in home
* allow opening space timeline
* hide event timeline feature behind dev tool
* add navToActivePath to clear cache function
* kick-ban all members by servername
* Add command for deleting multiple messages
* remove console logs and improve ban command description
* improve commands description
* add server acl command
* fix code highlight not working after editing in dev tools
* fix room setting crash in knock_restricted join rule
* only show knock & space member join rule for space children
* fix knock restricted icon and label
* add active theme context
* add chroma js library
* add hook for accessible tag color
* disable reply user color - temporary
* render user color based on tag in room timeline
* remove default tag icons
* move accessible color function to plugins
* render user power color in reply
* increase username weight in timeline
* add default color for member power level tag
* show red slash in power color badge with no color
* show power level color in room input reply
* show power level username color in notifications
* show power level color in notification reply
* show power level color in message search
* render power level color in room pin menu
* add toggle for legacy username colors
* drop over saturation from member default color
* change border color of power color badge
* show legacy username color in direct rooms
* WIP - add room settings dialog
* join rule setting - WIP
* show emojis & stickers in room settings - WIP
* restyle join rule switcher
* Merge branch 'dev' into new-room-settings
* add join rule hook
* open room settings from global state
* open new room settings from all places
* rearrange settings menu item
* add option for creating new image pack
* room devtools - WIP
* render room state events as list
* add option to open state event
* add option to edit state event
* refactor text area code editor into hook
* add option to send message and state event
* add cutout card component
* add hook for room account data
* display room account data - WIP
* refactor global account data editor component
* add account data editor in room
* fix font style in devtool
* show state events in compact form
* add option to delete room image pack
* add server badge component
* add member tile component
* render members in room settings
* add search in room settings member
* add option to reset member search
* add filter in room members
* fix member virtual item key
* remove color from serve badge in room members
* show room in settings
* fix loading indicator position
* power level tags in room setting - WIP
* generate fallback tag in backward compatible way
* add color picker
* add powers editor - WIP
* add props to stop adding emoji to recent usage
* add beta feature notice badge
* add types for power level tag icon
* refactor image pack rooms code to hook
* option for adding new power levels tags
* remove console log
* refactor power icon
* add option to edit power level tags
* remove power level from powers pill
* fix power level labels
* add option to delete power levels
* fix long power level name shrinks power integer
* room permissions - WIP
* add power level selector component
* add room permissions
* move user default permission setting to other group
* add power permission peek menu
* fix weigh of power switch text
* hide above for max power in permission switcher
* improve beta badge description
* render room profile in room settings
* add option to edit room profile
* make room topic input text area
* add option to enable room encryption in room settings
* add option to change message history visibility
* add option to change join rule
* add option for addresses in room settings
* close encryption dialog after enabling
* add hide activity toggle
* stop sending/receiving typing status
* send private read receipt when setting toggle is activated
* prevent showing read-receipt when feature toggle in on
* Remove reply fallbacks & add m.mentions
(WIP) the typing on line 301 and 303 needs fixing but apart from that this is mint
* Less jank typing
* Mention the reply author in m.mentions
* Improve typing
* Fix typing in m.mentions finder
* Correctly iterate through editor children, properly handle @room, ...
..., don't mention the reply author when the reply author is ourself, don't add own user IDs when mentioning intentionally
* Formatting
* Add intentional mentions to edited messages
* refactor reusable code and fix todo
* parse mentions from all nodes
---------
Co-authored-by: Ajay Bura <32841439+ajbura@users.noreply.github.com>
* Add support for MSC4193: Spoilers on Media
* Clarify variable names and wording
* Restore list atom
* Improve spoilered image UX with autoload off
* Use `aria-pressed` to indicate attachment spoiler state
* Improve spoiler button tooltip wording, keep reveal button from conflicting with load errors
* add hook to fetch one level of space hierarchy
* add enable param to level hierarchy hook
* improve HierarchyItem types
* fix type errors in lobby
* load space hierarachy per level
* fix menu item visibility
* fix unknown spaces over federation
* show inaccessible rooms only to admins
* fix unknown room renders loading content twice
* fix unknown room visible to normal user if space all room are unknown
* show no rooms card if space does not have any room
* escape inline markdown character
* fix typo
* improve document around custom markdown plugin and add escape sequence utils
* recover inline escape sequences on edit
* remove escape sequences from plain text body
* use `s` for strike-through instead of del
* escape block markdown sequences
* fix remove escape sequence was not removing all slashes from plain text
* recover block sequences on edit
* remove limit from emoji autocomplete
* remove search limit from user mention
* remove limit from room mention autocomplete
* increase user search limit to 1000
* better search string selection for emoticons
* Corrected button title
Media would load automatically if the option is checked not the other way around.
* Update src/app/features/settings/general/General.tsx
* Update General.tsx
* Update General.tsx
---------
Co-authored-by: Krishan <33421343+kfiven@users.noreply.github.com>
* Add rendering image captions
* Handle sending captions for images
* Fix caption rendering on m.video and m.audio too
* Remove unused renderBody() parameter
* Fix m.file rendering body instead of filename where possible
* Add caption rendering for generic files
+ Fix video and audio not properly sending captions
* Use m.text for captions & render on demand
* Allow custom HTML in sending captions
* Don't *send* captions
* mvoe content const into renderCaption()
---------
Co-authored-by: Ajay Bura <32841439+ajbura@users.noreply.github.com>
Appeareantly Firefox (and maybe Chrome) won't let service workers take over requests from <video> and <audio> tags, so we just fetch the URL ourselves.
* fix set power level broken after sdk update
* add media authentication hook
* fix service worker types
* fix service worker not working in dev mode
* fix env mode check when registering sw
* chore: Bump matrix-js-sdk to 34.4.0
* feat: Authenticated media support
* chore: Use Vite PWA for service worker support
* fix: Fix Vite PWA SW entry point
Forget this. :P
* fix: Also add Nginx rewrite for sw.js
* fix: Correct Nginx rewrite
* fix: Add Netlify redirect for sw.js
Otherwise the generic SPA rewrite to index.html would take effect, breaking Service Worker.
* fix: Account for subpath when regisering service worker
* chore: Correct types
* support room via server params and eventId
* change copy link to matrix.to links
* display matrix.to links in messages as pill and stop generating url previews for them
* improve editor mention to include viaServers and eventId
* fix mention custom attributes
* always try to open room in current space
* jump to latest remove target eventId from url
* add create direct search options to open/create dm with url
* handle client boot error in loading screen
* use sync state hook in client root
* add loading screen options
* removed extra condition in loading finish
* add sync connection status bar
* update silver theme
* update unread badge style to look more slim
* update nav item style to look less sharp
* fix type focus message input typo
* decrease navigation drawer width to bring main chat layout to little more center
* increase sidebar width to make it less congested
* fix sidebar item style
* decrease dark theme contrast
* improve dark theme
* revert sidebar width change
* add join with address option in home context menu
* match legacy theme with latest themes
* optimize room typing members hook
* remove unused code - WIP
* remove old code from initMatrix
* remove twemojify function
* remove old sanitize util
* delete old markdown util
* delete Math atom component
* uninstall unused dependencies
* remove old notification system
* decrypt message in inbox notification center and fix refresh in background
* improve notification
---------
Co-authored-by: Krishan <33421343+kfiven@users.noreply.github.com>
* load room on url change
* add direct room list
* render space room list
* fix css syntax error
* update scroll virtualizer
* render subspaces room list
* improve sidebar notification badge perf
* add nav category components
* add space recursive direct component
* use nav category component in home, direct and space room list
* add empty home and direct list layout
* fix unread room menu ref
* add more navigation items in room, direct and space tab
* add more navigation
* fix unread room menu to links
* fix space lobby and search link
* add explore navigation section
* add notifications navigation menu
* redirect to initial path after login
* include unsupported room in rooms
* move router hooks in hooks/router folder
* add featured explore - WIP
* load featured room with room summary
* fix room card topic line clamp
* add react query
* load room summary using react query
* add join button in room card
* add content component
* use content component in featured community content
* fix content width
* add responsive room card grid
* fix async callback error status
* add room card error button
* fix client drawer shrink
* add room topic viewer
* open room card topic in viewer
* fix room topic close btn
* add get orphan parent util
* add room card error dialog
* add view featured room or space btn
* refactor orphanParent to orphanParents
* WIP - explore server
* show space hint in room card
* add room type filters
* add per page item limit popout
* reset scroll on public rooms load
* refactor explore ui
* refactor public rooms component
* reset search on server change
* fix typo
* add empty featured section info
* display user server on top
* make server room card view btn clickable
* add user server as default redirect for explore path
* make home empty btn clickable
* add thirdparty instance filter in server explore
* remove since param on instance change
* add server button in explore menu
* rename notifications path to inbox
* update react-virtual
* Add notification messages inbox - WIP
* add scroll top container component
* add useInterval hook
* add visibility change callback prop to scroll top container component
* auto refresh notifications every 10 seconds
* make message related component reusable
* refactor matrix event renderer hoook
* render notification message content
* refactor matrix event renderer hook
* update sequence card styles
* move room navigate hook in global hooks
* add open message button in notifications
* add mark room as read button in notification group
* show error in notification messages
* add more featured spaces
* render reply in notification messages
* make notification message reply clickable
* add outline prop for attachments
* make old settings dialog viewable
* add open featured communities as default config option
* add invite count notification badge in sidebar and inbox menu
* add element size observer hook
* improve element size observer hook props
* improve screen size hook
* fix room avatar util function
* allow Text props in Time component
* fix dm room util function
* add invitations
* add no invites and notification cards
* fix inbox tab unread badge visible without invite count
* update folds and change inbox icon
* memo search param construction
* add message search in home
* fix default message search order
* fix display edited message new content
* highlight search text in search messages
* fix message search loading
* disable log in production
* add use space context
* add useRoom context
* fix space room list
* fix inbox tab active state
* add hook to get space child room recursive
* add search for space
* add virtual tile component
* virtualize home and directs room list
* update nav category component
* use virtual tile component in more places
* fix message highlight when click on reply twice
* virtualize space room list
* fix space room list lag issue
* update folds
* add room nav item component in space room list
* use room nav item in home and direct room list
* make space categories closable and save it in local storage
* show unread room when category is collapsed
* make home and direct room list category closable
* rename room nav item show avatar prop
* fix explore server category text alignment
* rename closedRoomCategories to closedNavCategories
* add nav category handler hook
* save and restore last navigation path on space select
* filter space rooms category by activity when it is closed
* save and restore home and direct nav path state
* save and restore inbox active path on open
* save and restore explore tab active path
* remove notification badge unread menu
* add join room or space before navigate screen
* move room component to features folder and add new room header
* update folds
* add room header menu
* fix home room list activity sorting
* do not hide selected room item on category closed in home and direct tab
* replace old select room/tab call with navigate hook
* improve state event hooks
* show room card summary for joined rooms
* prevent room from opening in wrong tab
* only show message sender id on hover in modern layout
* revert state event hooks changes
* add key prop to room provider components
* add welcome page
* prevent excessive redirects
* fix sidebar style with no spaces
* move room settings in popup window
* remove invite option from room settings
* fix open room list search
* add leave room prompt
* standardize room and user avatar
* fix avatar text size
* add new reply layout
* rename space hierarchy hook
* add room topic hook
* add room name hook
* add room avatar hook and add direct room avatar util
* space lobby - WIP
* hide invalid space child event from space hierarchy in lobby
* move lobby to features
* fix element size observer hook width and height
* add lobby header and hero section
* add hierarchy room item error and loading state
* add first and last child prop in sequence card
* redirect to lobby from index path
* memo and retry hierarchy room summary error
* fix hierarchy room item styles
* rename lobby hierarchy item card to room item card
* show direct room avatar in space lobby
* add hierarchy space item
* add space item unknown room join button
* fix space hierarchy hook refresh after new space join
* change user avatar color and fallback render to user icon
* change room avatar fallback to room icon
* rename room/user avatar renderInitial prop to renderFallback
* add room join and view button in space lobby
* make power level api more reusable
* fix space hierarchy not updating on child update
* add menu to suggest or remove space children
* show reply arrow in place of reply bend in message
* fix typeerror in search because of wrong js-sdk t.ds
* do not refetch hierarchy room summary on window focus
* make room/user avatar un-draggable
* change welcome page support button copy
* drag-and-drop ordering of lobby spaces/rooms - WIP
* add ASCIILexicalTable algorithms
* fix wrong power level check in lobby items options
* fix lobby can drop checks
* fix join button error crash
* fix reply spacing
* fix m direct updated with other account data
* add option to open room/space settings from lobby
* add option in lobby to add new or existing room/spaces
* fix room nav item selected styles
* add space children reorder mechanism
* fix space child reorder bug
* fix hierarchy item sort function
* Apply reorder of lobby into room list
* add and improve space lobby menu items
* add existing spaces menu in lobby
* change restricted room allow params when dragging outside space
* move featured servers config from homeserver list
* removed unused features from space settings
* add canonical alias as name fallback in lobby item
* fix unreliable unread count update bug
* fix after login redirect
* fix room card topic hover style
* Add dnd and folders in sidebar spaces
* fix orphan space not visible in sidebar
* fix sso login has mix of icon and button
* fix space children not visible in home upon leaving space
* recalculate notification on updating any space child
* fix user color saturation/lightness
* add user color to user avatar
* add background colors to room avatar
* show 2 length initial in sidebar space avatar
* improve link color
* add nav button component
* open legacy create room and create direct
* improve page route structure
* handle hash router in path utils
* mobile friendly router and navigation
* make room header member drawer icon mobile friendly
* setup index redirect for inbox and explore server route
* add leave space prompt
* improve member drawer filter menu
* add space context menu
* add context menu in home
* add leave button in lobby items
* render user tab avatar on sidebar
* force overwrite netlify - test
* netlify test
* fix reset-password path without server redirected to login
* add message link copy button in message menu
* reset unread on sync prepared
* fix stuck typing notifications
* show typing indication in room nav item
* refactor closedNavCategories atom to use userId in store key
* refactor closedLobbyCategoriesAtom to include userId in store key
* refactor navToActivePathAtom to use userId in storage key
* remove unused file
* refactor openedSidebarFolderAtom to include userId in storage key
* add context menu for sidebar space tab
* fix eslint not working
* add option to pin/unpin child spaces
* add context menu for directs tab
* add context menu for direct and home tab
* show lock icon for non-public space in header
* increase matrix max listener count
* wrap lobby add space room in callback hook
* emojify msg txt find&replace instead of recursion
* move findAndReplace func in its own file
* improve find and replace
* move markdown file to plugins
* make find and replace work without g flag regex
* fix pagination stop on msg arrive
* render blurhash in small size
* remove shift from editor hotkeys
* fix inline markdown not working
* add block md parser - WIP
* emojify and linkify text without react-parser
* no need to sanitize text when emojify
* parse block markdown in editor output - WIP
* add inline parser option in block md parser
* improve codeblock regex
* ignore html tag when parsing inline md in block md
* add list markdown rule in block parser
* re-generate block markdown on edit
* change copy from inline markdown to markdown
* fix trim reply from body regex
* fix jumbo emoji in reply message
* fix broken list regex in block markdown
* enable markdown by defualt
* make system-emoji default & twitter emoji optional
* add mozilla twemoji-colr credit
* fix wrong audio duration
* set locales to empty in member count millify
* render system emoji as same size of custom emoji
* use hotkey using key instead of which (default)
* remove shift from block formatting hotkeys
* smartly exit formatting with backspace
* set markdown to off by default
* exit formatting with escape
* add commands hook
* add commands in editor
* add command auto complete menu
* add commands in room input
* remove old reply code from room input
* fix video component css
* do not auto focus input on android or ios
* fix crash on enable block after selection
* fix circular deps in editor
* fix autocomplete return focus move editor cursor
* remove unwanted keydown from room input
* fix emoji alignment in editor
* test ipad user agent
* refactor isAndroidOrIOS to mobileOrTablet
* update slate & slate-react
* downgrade slate-react to 0.98.4
0.99.0 has breaking changes with ReactEditor.focus
* add sql to readable ext mimetype
* fix empty editor formatting gets saved as draft
* add option to use enter for newline
* remove empty msg draft from atom family
* prevent msg ctx menu from open on text selection
* add func to parse html to editor input
* add plain to html input function
* re-construct markdown
* fix missing return
* fix falsy condition
* fix reading href instead of src of emoji
* add message editor - WIP
* fix plain to editor input func
* add save edit message functionality
* show edited event source code
* focus message input on after editing message
* use del tag for strike-through instead of s
* prevent autocomplete from re-opening after esc
* scroll out of view msg editor in view
* handle up arrow edit
* handle scroll to message editor without effect
* revert prev commit: effect run after editor render
* ignore relation event from editable
* allow data-md tag for del and em in sanitize html
* prevent edit without changes
* ignore previous reply when replying to msg
* fix up arrow edit not working sometime
* add inline markdown in editor
* send markdown re-generative data in tags
* enable vscode format on save
* fix match italic and diff order
* prevent formatting in code block
* make code md rule highest
* improve inline markdown parsing
* add comment
* improve code logic
* fix type
* fix missing member from reaction
* stop context menu event propagation in msg modal
* prevent encode blur hash from freezing app
* replace roboto font with inter and fix weight
* add recent emoji when selecting emoji
* fix room latest evt hook
* add option to drop typing status
* fix intersection & resize observer
* add binary search util
* add scroll info util
* add virtual paginator hook - WIP
* render timeline using paginator hook
* add continuous pagination to fill timeline
* add doc comments in virtual paginator hook
* add scroll to element func in virtual paginator
* extract timeline pagination login into hook
* add sliding name for timeline messages - testing
* scroll with live event
* change message rending style
* make message timestamp smaller
* remove unused imports
* add random number between util
* add compact message component
* add sanitize html types
* fix sending alias in room mention
* get room member display name util
* add get room with canonical alias util
* add sanitize html util
* render custom html with new styles
* fix linkifying link text
* add reaction component
* display message reactions in timeline
* Change mention color
* show edited message
* add event sent by function factory
* add functions to get emoji shortcode
* add component for reaction msg
* add tooltip for who has reacted
* add message layouts & placeholder
* fix reaction size
* fix dark theme colors
* add code highlight with prismjs
* add options to configure spacing in msgs
* render message reply
* fix trim reply from body regex
* fix crash when loading reply
* fix reply hover style
* decrypt event on timeline paginate
* update custom html code style
* remove console logs
* fix virtual paginator scroll to func
* fix virtual paginator scroll to types
* add stop scroll for in view item options
* fix virtual paginator out of range scroll to index
* scroll to and highlight reply on click
* fix reply hover style
* make message avatar clickable
* fix scrollTo issue in virtual paginator
* load reply from fetch
* import virtual paginator restore scroll
* load timeline for specific event
* Fix back pagination recalibration
* fix reply min height
* revert code block colors to secondary
* stop sanitizing text in code block
* add decrypt file util
* add image media component
* update folds
* fix code block font style
* add msg event type
* add scale dimension util
* strict msg layout type
* add image renderer component
* add message content fallback components
* add message matrix event renderer components
* render matrix event using hooks
* add attachment component
* add attachment content types
* handle error when rendering image in timeline
* add video component
* render video
* include blurhash in thumbnails
* generate thumbnails for image message
* fix reactToDom spoiler opts
* add hooks for HTMLMediaElement
* render audio file in timeline
* add msg image content component
* fix image content props
* add video content component
* render new image/video component in timeline
* remove console.log
* convert seconds to milliseconds in video info
* add load thumbnail prop to video content component
* add file saver types
* add file header component
* add file content component
* render file in timeline
* add media control component
* render audio message in room timeline
* remove moved components
* safely load message reply
* add media loading hook
* update media control layout
* add loading indication in audio component
* fill audio play icon when playing audio
* fix media expanding
* add image viewer - WIP
* add pan and zoom control to image viewer
* add text based file viewer
* add pdf viewer
* add error handling in pdf viewer
* add download btn to pdf viewer
* fix file button spinner fill
* fix file opens on re-render
* add range slider in audio content player
* render location in timeline
* update folds
* display membership event in timeline
* make reactions toggle
* render sticker messages in timeline
* render room name, topic, avatar change and event
* fix typos
* update render state event type style
* add room intro in start of timeline
* add power levels context
* fix wrong param passing in RoomView
* fix sending typing notification in wrong room
Slate onChange callback was not updating with react re-renders.
* send typing status on key up
* add typing indicator component
* add typing member atom
* display typing status in member drawer
* add room view typing member component
* display typing members in room view
* remove old roomTimeline uses
* add event readers hook
* add latest event hook
* display following members in room view
* fetch event instead of event context for reply
* fix typo in virtual paginator hook
* add scroll to latest btn in timeline
* change scroll to latest chip variant
* destructure paginator object to improve perf
* restore forward dir scroll in virtual paginator
* run scroll to bottom in layout effect
* display unread message indicator in timeline
* make component for room timeline float
* add timeline divider component
* add day divider and format message time
* apply message spacing to dividers
* format date in room intro
* send read receipt on message arrive
* add event readers component
* add reply, read receipt, source delete opt
* bug fixes
* update timeline on delete & show reason
* fix empty reaction container style
* show msg selection effect on msg option open
* add report message options
* add options to send quick reactions
* add emoji board in message options
* add reaction viewer
* fix styles
* show view reaction in msg options menu
* fix spacing between two msg by same person
* add option menu in other rendered event
* handle m.room.encrypted messages
* fix italic reply text overflow cut
* handle encrypted sticker messages
* remove console log
* prevent message context menu with alt key pressed
* make mentions clickable in messages
* add options to show and hidden events in timeline
* add option to disable media autoload
* remove old emojiboard opener
* add options to use system emoji
* refresh timeline on reset
* fix stuck typing member in member drawer
* Disable asset inlining
* Prevent `manifest.json` from being inlined
* Update backtick to single quote in vite.config.js
---------
Co-authored-by: Ajay Bura <32841439+ajbura@users.noreply.github.com>
* fix room members hook
* fix resize observer hook
* add intersection observer hook
* install react-virtual lib
* improve right panel - WIP
* add filters for members
* fix bug in async search
* categories members and add search
* show spinner on room member fetch
* make invite member btn clickable
* so no member text
* add line between room view and member drawer
* fix imports
* add screen size hook
* fix set setting hook
* make member drawer responsive
* extract power level tags hook
* fix room members hook
* fix use async search api
* produce search result on filter change
* Add ESC btn to toolbar to quickly exit formatting
* add horizontal scroll to toolbar item
* make editor toolbar usable in touch device
* fix editor hotkeys not working in window
* remove unused import
* focus editor on reply click
* fix emoji and sticker img object-fit
* fix cursor not moving with autocomplete
* stop sanitizing sending plain text body
* improve autocomplete query parsing
* add escape to turn off active editor toolbar item
That way, browsers will suggest to the users to upload an image file instead of any kind of file.
The behaviour is in-line with Element's, which specifies the same attribute when selecting an avatar.
Please note that it does not prevent users from uploading non-image files as avatars, as browsers interpret that attribute as a mere suggestion, which can be bypassed in the file select dialog.
Partially fixes#982.
* remove kde.org from config
because they have disabled registrations, which is required to be listed on login.register page.
* remove halogen.city
seems dead hs now
* add converser.eu
seems to be working again
* Update config.json
* halogen.city is back
* Handle nested lists
* Allow heading to not be followed by an empty line
* Don't parse as inline code if contains newlines
* Use escape rule in plain as well
* Force mentions to have a space after the #
* Use types for rendering
* Parse HTML
* Add code block support
* Add table support
* Allow starting heading without a space
* Escape relevant plaintext areas
* Resolve many crashes
* Use better matrix id regex
* Don't match . after id
* Don't parse mentions as links
* Add emote support
* Only emit HTML link if necessary
* Implement review changes
* Parse room input from user id and emoji
* Add more plain outputs
* Add reply support
* Always include formatted reply
* Add room mention parser
* Allow single linebreak after codeblock
* Remove margin from math display blocks
* Escape shrug
* Rewrite HTML tag function
* Normalize def keys
* Fix embedding replies into replies
* Don't add margin to file name
* Collapse spaces in HTML message body
* Don't crash with no plaintext rendering
* Add blockquote support
* Remove ref support
* Fix image html rendering
* Remove debug output
* Remove duplicate default option value
* Add table plain rendering support
* Correctly handle paragraph padding when mixed with block content
* Simplify links if possible
* Make blockquote plain rendering better
* Don't error when emojis are matching but not found
* Allow plain only messages with newlines
* Set user id as user mention fallback
* Fix mixed up variable name
* Replace replaceAll with replace
* Add .npmrc so that it works with newer npm
* Remove engine upper limit as it works with npmrc
* Lockfile maintainace, created new mapping with npm install
* Add npmrc so Docker doesnt fail on new npm version
* Revert 8a1946d558 will set renovate
* Switch markdown parser
* Add inline maths
* Basic plain text rendering
* Add display math support
* Remove unnecessary <p> tag
* Fixed spoiler not working
* Add spoiler reason input support
* Make paragraphs display with newline in between
* Handle single newlines
* Fix typo when allowing start attribute
* Cleanup for merge
* Remove unused import
* Push Docker image to ghcr registry
* Fix secret name
* add permission to token to write package to ghcr
Co-authored-by: Ajay Bura <32841439+ajbura@users.noreply.github.com>
* Select last room on space/tab change (#353)
* Update sidbar on room select from search (#374)
* Select last room on space/tab change (#353)
* Update sidbar on room select from search (#374)
* Fix wrong space gets selected with some rooms
* Fix auto select room in categorized space
* Fix room remain selected on leave
* Fix leaved room appear in category & search
* Remove globally exposed vars
* Hide pin spaces from home
* Fix selecting dm always open dm tab
* Order category by AtoZ (#769)
Co-authored-by: Krishan <33421343+kfiven@users.noreply.github.com>
* move allowed MIME types to own util file
* add check for safe MIME type before choosing how to upload
* check for allowed blob type to decide what component to load
* re-add check for safe mimetype
* fix bracket positioning
* Support RTL text in the room input field
set the correct direction for text according to the language written in
* Make all input RTLable
Co-authored-by: Krishan <33421343+kfiven@users.noreply.github.com>
* Generate blurhash client side
* Make blurhash generation faster
* Simple blurhash display support
* Make image display simpler
* Support non square images
* Don't attach video blurhash to thumbnail
* Add video display support
* Ignore alt tag missing warning
Co-authored-by: Ajay Bura <32841439+ajbura@users.noreply.github.com>
* Remove comments
* Show custom emoji first in suggestions
* Show global image packs in emoji picker
* Display emoji and sticker in room settings
* Fix some pack not visible in emojiboard
* WIP
* Add/delete/rename images to exisitng packs
* Change pack avatar, name & attribution
* Add checkbox to make pack global
* Bug fix
* Create or delete pack
* Add personal emoji in settings
* Show global pack selector in settings
* Show space emoji in emojiboard
* Send custom emoji reaction as mxc
* Render stickers as stickers
* Fix sticker jump bug
* Fix reaction width
* Fix stretched custom emoji
* Fix sending space emoji in message
* Remove unnessesary comments
* Send user pills
* Fix pill generating regex
* Add support for sending stickers
This allows users to mark all rooms in a space as read, matching similar
features found in other popular chat applications.
We opted to place the mark as read button at the top of the list instead
of next to the add user button like in room options since we felt this
will be the most-used button in the list.
Fixes#645.
Co-authored-by: Maple <mapletree.dv@gmail.com>
Co-authored-by: Maple <mapletree.dv@gmail.com>
From https://spec.matrix.org/v1.3/appendices/#matrixto-navigation:
The components of the matrix.to URI (<identifier> and <extra parameter>) are to be percent-encoded as per RFC 3986.
Historically, clients have not produced URIs which are fully encoded. Clients should try to interpret these cases to the best of their ability. For example, an unencoded room alias should still work within the client if possible
* nodejs 17.9.0 also works
* Add github sponser link
* Add Public PGP key of signed tarball
* Update README.md
* Add download badge also.
* Add docker pulls
* Reduce dependence on third-party build scripts in release pipeline
This removes one third-party build script from the release
pipeline for the release tar.gz, though one is still used in the
now-separate netlify deploy.
* Reduce GITHUB_TOKEN perms in actions when using 3rd party scripts
This avoids allowing third parties to arbitrarily overwrite the
repository.
* Replace PGP signing action with the bash script from the same
The PGP signing action ultimately just calls gpg with arguments
set in
https://github.com/actionhippie/gpgsign/blob/v1/overlay/usr/local/bin/entrypoint
so its rather trivial to simply take the required arguments and
put them directly in CI.
This is substantially safer than the PGP signing action used as the
action currently downloads, unverified and un-pinned, a docker
image in order to access PGP.
* pasting should focus the message field
also refactored a small amount to use KeyEvent.code
instead of KeyEvent.keyCode, which is deprecated.
fixesajbura/cinny#544
* fix lint
* comments
* Initial display support
* Use better colors for error in math parsing
* Parse math markdown
* Use proper jsx
* Better copy support
* use css var directly
* Remove console.debug call
* Lazy load math module
* Show fallback while katex is loading
* Now adapting to small screen sizes, needs improvements
* Fix that site only gets into mobile mode when resized
* - Added navigation event triggered if user requests to return to navigation on compact screens
- People drawer wont be shown on compact screens
- Still accessible using settings
- would be duplicated UI
- mobileSize is now compactSize
* Put threshold for collapsing the base UI in a shared file
* Switch to a more simple solution using CSS media queries over JS
- Move back button to the left a bit so it doesnt get in touch with room icon
* switch from component-individual-thresholds to device-type thresholds
- <750px: Mobile
- <900px: Tablet
- >900px: Desktop
* Make Settings drawer component collapse on mobile
* Fix EmojiBoard not showing up and messing up UI when screen is smaller than 360px
* Improve code quality; allow passing classNames to IconButton
- remove unnessesary div wrappers
- use dir.side where appropriate
- rename threshold and its mixins to more descriptive names
- Rename "OPEN_NAVIGATION" to "NAVIGATION_OPENED"
* - follow BEM methology
- remove ROOM_SELECTED listener
- rename NAVIGATION_OPENED to OPEN_NAVIGATION where appropriate
- this does NOT changes that ref should be used for changing visability
* Use ref to change visability to avoid re-rendering
* Use ref to change visability to avoid re-rendering
* Fix that room component is not hidden by default.
This resulted in a broken view when application is viewed in mobile size without having selected a room since loading.
* fix: leaving a room should bring one back to navigation
Co-authored-by: Ajay Bura <32841439+ajbura@users.noreply.github.com>
* Fix power level in permissions
Fix allowed value of power level in room permissions, earlier the max value was 100 even if room members have power level more than 100.
* Update RoomPermissions.jsx
* Fixes#434
* Fixes#433
* Prtially fixes#432
* Disable auto labelling of issues
* Use yaml instead of yml as recommended by yaml.org
* shortened the strings
* simplified option description
* Allow node type prop in setting tile
Signed-off-by: Ajay Bura <ajbura@gmail.com>
* Update popup window max height
Signed-off-by: Ajay Bura <ajbura@gmail.com>
* Add device management setting
Signed-off-by: Ajay Bura <ajbura@gmail.com>
* Add password based login
Signed-off-by: Ajay Bura <ajbura@gmail.com>
* truncate long list of verified devices
Signed-off-by: Ajay Bura <ajbura@gmail.com>
* Add invite sound
Signed-off-by: Ajay Bura <ajbura@gmail.com>
* Add credits
Signed-off-by: Ajay Bura <ajbura@gmail.com>
* Change invite sound to google material
* Sort search result by activity
Signed-off-by: Ajay Bura <ajbura@gmail.com>
* Optimize generateResults function codes
Signed-off-by: Ajay Bura <ajbura@gmail.com>
* Improve jump to unread button
Signed-off-by: Ajay Bura <ajbura@gmail.com>
* Remove unused cod
Signed-off-by: Ajay Bura <ajbura@gmail.com>
* Fix mark as read not hidding jump to unread btn
Signed-off-by: Ajay Bura <ajbura@gmail.com>
* Add notification mark as read action
Signed-off-by: Ajay Bura <ajbura@gmail.com>
* Add esc as hotkey to mark room as read
Signed-off-by: Ajay Bura <ajbura@gmail.com>
* Add message icons
Signed-off-by: Ajay Bura <ajbura@gmail.com>
* Change jump to unread icon
Signed-off-by: Ajay Bura <ajbura@gmail.com>
* Add recent section to emoji board
* Add section to emoji board sidebar
* Add emoji limit like element web has
* Ignore custom emojis
* Filter out invalid emojis
* Update heart icon with clock
Co-authored-by: Krishan <33421343+kfiven@users.noreply.github.com>
* Add sort util
Signed-off-by: Ajay Bura <ajbura@gmail.com>
* Use sort util for members
Signed-off-by: Ajay Bura <ajbura@gmail.com>
* Sort dms by activity
Signed-off-by: Ajay Bura <ajbura@gmail.com>
* Sort dms activily
Signed-off-by: Ajay Bura <ajbura@gmail.com>
* Chanege roomIdByLastActive func name
Signed-off-by: Ajay Bura <ajbura@gmail.com>
* Fix new message no appearing
Signed-off-by: Ajay Bura <ajbura@gmail.com>
* Fix room not marking as read
Signed-off-by: Ajay Bura <ajbura@gmail.com>
* Fix room automatically gets mark as read
Signed-off-by: Ajay Bura <ajbura@gmail.com>
* Fix sending wrong read recipt
Signed-off-by: Ajay Bura <ajbura@gmail.com>
* Fix sending message not mark as read
Signed-off-by: Ajay Bura <ajbura@gmail.com>
* Move getNotifType function
Signed-off-by: Ajay Bura <ajbura@gmail.com>
* Fix bug in getNotiType
Signed-off-by: Ajay Bura <ajbura@gmail.com>
* Add isMuted prop in room selector
Signed-off-by: Ajay Bura <ajbura@gmail.com>
* Fix muted room show unread indicator
Signed-off-by: Ajay Bura <ajbura@gmail.com>
* Fix muted room notification visible in space
Signed-off-by: Ajay Bura <ajbura@gmail.com>
* Fix space shows muted room notification on load
Signed-off-by: Ajay Bura <ajbura@gmail.com>
* Toggle room mute when changed from other client
Signed-off-by: Ajay Bura <ajbura@gmail.com>
Signed-off-by: Clament John <cj@hackerlab.in>
fixes#376
When we click view source for an edited message we were showing
the original event (the unedited event) instead of the latest
edited event.
* Simplify production build actions
This merges both the netlify-prod and docker action and also automatically add tarball to releases.
* Delete docker.yaml
* Delete netlify-prod.yaml
* Cosmetic changes and add dockerhub check
* Cosmetic changes
* Fix check runs on Tuesdays only
* Add basic drop overlay
* Prevent crash when dragging text
* Only show popup when files are being dragged
* Make drop box bigger
* Make drag drop overlay without a modal
* Don't show drag drop menu on top of modals
* Use different way to check for modal
* Focus when opening the emoji board and editing a message
* Clean emoji board after closing
* Focus room search and member search
* Resolve conversations
* Use npm ci over install to achive faster and more expectable build results;
Split copy package(-lock).json files and ci then to avoid reinstalling dependencies when not needed => Faster build times
* Stopp adding wasm type to mime.types, its already there (duplicate):
- avoids warning in console
- cleans up
- might have been missing in past nginx:alpine versions but now exists
* Change node tag from alpine and nginx to more specific ones for #260
* Add notifications
* Abide push actions
* Handle browsers not having notification support
* Ask for notification permission after loading
* Make usePermission work without live permission support
* Focus message when clicking the notification
* make const all caps
* Fix usePermission error in Safari
* Fix live permissions
* Remove userActivity and use document.visibilityState instead
* Change setting label to "desktop notifications"
* Check for notification permissions in the settings.js
* Add Auto theme that uses browser's preferred color scheme
This will use dark mode automatically if the browser requests it.
* fixup! Add Auto theme that uses browser's preferred color scheme
* Use a toggle to use system theme
* Display custom emoji in picker
Adds a single category at the start of the emoji picker to display the user's custom emoji
* Show any amount of custom emoji packs in the Emoji Board
* Use thumbnails in emoji picker + mark as emoji
* Fix emoji picker stretching when too many packs are available
* Sprinkle in a few comments for good measure
* Remove emoji-less packs from the emoji picker
* Add support for sending room-local emoji
Does not add support for sending a room's emoji outside of that room, but enables users to
send an emoji if the packs in a room support it. Does not include room emoji in the
picker YET.
* Amend PR #209: Don't freak out if the `pack` tag is missing
* Amending PR: Refactor emojifier, use better method for retrieving packs
* Amending PR: Improve resiliance to bad data in emoji state events
* Amend PR: Remove redundant code, fix crash on edit
* Add support for sending user emoji using autocomplete
What's included:
- An implementation for detecting user emojis
- Addition of user emojis to the emoji autocomplete in the command bar
- Translation of shortcodes into image tags on message sending
What's not included:
- Loading emojis from the active room, loading the user's global emoji packs, loading emoji from spaces
- Selecting custom emoji using the emoji picker
This is a predominantly proof-of-concept change, and everything here may be subject to
architectural review and reworking.
* Amending PR: Allow sending multiple of the same emoji
* Amending PR: Add support for emojis in edited messages
* Amend PR: Apply requested revisions
This commit consists of several small changes, including:
- Fix crash when the user doesn't have the im.ponies.user_emotes account data entry
- Add mx-data-emoticon attribute to command bar emoji
- Rewrite alt text in the command bar interface
- Remove "vertical-align" attribute from sent emoji
* Amending PR: Fix bugs (listed below)
- Fix bug where sending emoji w/ markdown off resulted in a crash
- Fix bug where alt text in the command bar was wrong
* Amending PR: Add support for replacement of twemoji shortcodes
* Amending PR: Fix & refactor getAllEmoji -> getShortcodeToEmoji
* Amending PR: Fix bug: Sending two of the same emoji corrupts message
* Amending PR: Stylistic fixes
* Display messages containing only <7 emoji bigger
* Amending PR: Address mentioned concerns
This fixes several concerns raised during the PR review process. A summary of the changes
implemented is below:
- Size jumbo emoji using the text-h1 class, instead of hardcoding a size
- Increase the emoji limit to 10
- Re-wrap m.text messages in a p tag, fixing a bug where newlines were lost
Line 335 already gives blockquotes their padding. The mixin explicitly sets the right padding back to 0 and the left padding to exactly what it was already set to.
* Fix commands activating anywhere in the input
Writing `The command to leave a channel is /leave` might have had "fun"
consequences for users.
Fixes#155
* Fix go-to commands activating anywhere in the input
While less obtrusive than `/` commands activating anywhere, it seems
logical to only activate completion of those when at the beginning of
the input.
`break-all` meant that links would split mid-word e.g. I observed `email` become `e\nmail`. `break-word` avoids this but also ensures long links still break before overflowing the line length.
* Address 301 redirect issue and Safari regex issue.
* Restored login redirect
as this doesn't not fix the sso redirect #143.
Co-authored-by: Ajay Bura <32841439+ajbura@users.noreply.github.com>
This document tracks identified bugs, edge cases, and architectural discrepancies.
This document tracks identified bugs, edge cases, and architectural discrepancies found during the audit of the Lotus Chat codebase. Recommended fixes are provided for each item.
---
## ✅ Resolved Issues (Recently Fixed)
## 🚩 Critical & UI Bugs
***GIF Sending Bypasses E2EE**: Fixed in `RoomInput.tsx`.
***Scheduled Messages Bypass E2EE**: Fixed in `scheduledMessages.ts`.
***Drag-and-Drop Overlay Persistence**: Fixed in `useFileDrop.ts`.
***Stale Member List in Verification Banner**: Fixed in `useDeviceVerificationStatus.ts`.
***Incomplete Python Comment Highlighting**: Fixed in `syntaxHighlight.ts`.
***Search Button Hidden in E2EE Rooms**: Fixed in `RoomViewHeader.tsx`.
***TDS Design Law Violations (Hardcoded Hex)**: Fixed in `GifPicker.tsx` and `VoiceMessageRecorder.tsx`.
***Recent Emoji Sort Order**: Fixed in `recent-emoji.ts` (recency order, not frequency).
***Encrypted Search Misses Historic Events**: Fixed in `useLocalMessageSearch.ts`.
***Presence Updater Base URL Hack**: Fixed in `usePresenceUpdater.ts`.
***Presence Badge Accessibility**: Fixed in `Presence.tsx` (`aria-label` on badge).
- **Status:** **FIXED ⚠️ UNTESTED** — needs verification in a live call with at least one other participant who mutes/unmutes
- **Issue:** The muted-mic badge in the Picture-in-Picture window used `useRemoteAllMuted` (fires when ANY remote participant is muted) and rendered in the bottom-left corner — the conventional position for "YOUR" mic status. Users read it as their own mic being muted.
- **Root Cause:** `PipMuteOverlay` was triggering on remote-mute events while displaying in a position that implies local-user status.
- **Fix Applied:**
- **Bottom-left badge** now shows only when the LOCAL user's mic is muted (checked via `!controlState.microphone` from `useCallControlState`). Includes "You" label to make it unambiguous. Uses `color.Critical.Main`.
- **Top-right badge** (new) shows "All muted" in `color.Warning.Main` when all remote participants are muted — positioned and labeled so it's clearly about other people, not the local user.
- Both badges use `aria-label` / `title` for accessibility.
- **Issue:** Automatic screenshare spotlighting forces primary display override, preventing users from manually focusing on camera feeds.
- **Root Cause:** Current spotlighting logic prioritizes active screenshare streams over manual participant selections, effectively ignoring or overriding user-initiated focus states.
- **Proposed Fix:** Introduce a manual 'Focus' state that takes precedence over automatic screenshare spotlighting, implemented via a toggle/click UI on participant tiles. Update the video renderer to respect this manual override.
***Issue:** The modal fetches edit history via raw `fetch`. The returned events are not decrypted.
***Impact:** In encrypted rooms, the edit history shows ciphertext or "(no text)" for all previous versions.
***Recommended Fix:** After fetching raw events, check if they are encrypted. Use `mx.decryptEventIfNeeded(event)` for each event in the chunk before rendering.
- **Status:** **FIXED ⚠️ UNTESTED** — needs verification on a real device with an animated background active
- **Issue:** Animated background properties cause visible flickering on message text and the composer area, particularly on browsers/GPUs susceptible to repaint-induced artifacts.
- **Root Cause:** Animation triggers excessive repaints or layout recalculations on descendant elements, likely due to animating non-GPU accelerated properties on parent containers without proper rendering context isolation.
- **Fix Applied:** `getChatBg()` now injects `willChange: 'background-position'` and `contain: 'paint'` for any animated variant. This promotes the element to its own compositor layer and isolates repaints from descendants. Background-position animation is already GPU-hinted on modern browsers; `contain: paint` prevents descendant elements from being invalidated during each frame.
***Issue:** Access tokens are stored in an in-memory `sessions` Map within the SW.
***Impact:** Closing all app tabs wipes the sessions. Background tasks (like future push notification handling or media pre-fetching) will fail.
***Recommended Fix:** Persist the session info (accessToken/baseUrl) in IndexedDB within the Service Worker so it survives app restarts.
- **Issue:** Avatar decorations are failing to render within the call/room interface member lists.
- **Root Cause:** Likely a mismatch between the expected `member` object structure required by the `AvatarDecoration` component and the data actually provided by the call/room UI components. Matrix event data for decorations might not be propagating correctly to these UI member objects.
- **Proposed Fix:** Analyze the data propagation chain from Matrix events to the member object in `cinny/src/app/components/call` and `room`, ensuring that decoration-related properties are correctly mapped and passed to the `AvatarDecoration` component.
- **Status:** **PARTIALLY FIXED ⚠️ UNTESTED** — Volume control added. Remaining: ringtone selection, suppression during active calls.
- **Issue:** Incoming call ringtone is hardcoded, lacks volume control, and is suppressed if the user is already in an active call.
- **Root Cause:** Ringing logic is tightly coupled to `RTCNotification` events in `CallEmbedProvider.tsx`, using a hardcoded audio file path. It lacks an abstraction for sound management or user-configurable settings for ringtones/volumes.
- **Fix Applied:** Added `ringtoneVolume` setting (0–100, default 70). `IncomingCall` reads this setting and applies `audioElement.volume = ringtoneVolume / 100` before `play()`. Slider added to Settings → General → Calls section.
- **Remaining:** (a) Ringtone selection (still hardcoded to `call.ogg`); (b) Suppression during active calls — not investigated.
### 5. Seasonal Themes and Chat Backgrounds Design
- **Issue:** Basic CSS or random moving lines are insufficient for high-fidelity wallpaper/theming. They lack professional design theory, coherence, and aesthetic depth.
- **Root Cause:** Current implementation relies on basic CSS, lacks advanced design theory, and does not leverage modern, performant CSS wallpaper techniques.
- **Goal:** Treat each theme/background as a week-long development sprint to ensure professional polish, WCAG AA contrast compliance for overlaying UI, and seamless integration with the Lotus TDS.
### 6. Exclusive Background vs. Seasonal Choice
- **File:** `cinny/src/app/state/settings.ts`
- **Status:** **FIXED ⚠️ UNTESTED** — needs verification: (a) pick a background, confirm seasonal theme auto-clears; (b) pick a seasonal theme, confirm background auto-clears; (c) set both via old localStorage data and reload, confirm SeasonalEffect guard suppresses the overlay
- **Issue:** Concurrent application of both Chat Backgrounds and Seasonal Themes causes visual clutter and high GPU usage.
- **Root Cause:** These are currently handled as independent settings in the `settingsAtom` and applied simultaneously without mutual exclusion.
- **Fix Applied:** Mutual exclusion enforced at two layers: (1) `General.tsx` — ChatBgGrid clears seasonalThemeOverride→'off' when any non-'none' background is picked; SeasonalBgGrid clears chatBackground→'none' when any real seasonal theme is selected. (2) `SeasonalEffect.tsx` — runtime guard returns null if `chatBackground !== 'none'`, protecting against legacy persisted state.
- **Status:** **FIXED ⚠️ UNTESTED** — needs verification on a real mobile device: open composer, confirm all toolbar buttons are tappable without mis-taps
- **Issue:** Toolbar buttons have hit areas smaller than the WCAG-recommended 44x44px for touch, hindering mobile accessibility.
- **Fix Applied:** Added `touchTarget = { minWidth: '44px', minHeight: '44px' }` computed from `mobileOrTablet()` and applied as `style={touchTarget}` to all 8 composer toolbar `IconButton` elements (attach, format, sticker, emoji, GIF, location, poll, schedule, send).
- **Status:** **FIXED ⚠️ UNTESTED** — needs verification: open Room Settings on a narrow mobile screen, confirm nav panel fills full width and no horizontal scrollbar appears
- **Issue:** Wide tables and input elements in room settings cause horizontal overflow on mobile viewports.
- **Fix Applied:** Added `@media (max-width: 750px) { width: '100%' }` to both `'400'` and `'300'` size variants of the `PageNav` vanilla-extract recipe in `style.css.ts`.
### 9. Modal Float-Style Responsiveness
- **File:** Multiple modal files
- **Status:** **FIXED ⚠️ UNTESTED** — needs verification by opening each modal on a real mobile device
- **Issue:** Modals appear as floating boxes on mobile, creating navigation and readability challenges.
- **Fix Applied:** Created `useModalStyle(desktopMaxWidth)` hook (`src/app/hooks/useModalStyle.ts`) that returns fullscreen styles on mobile (no border-radius, no max-width, `height: 100%`) and desktop box styles otherwise. Applied to all 22+ modal files: `LeaveRoomPrompt`, `LeaveSpacePrompt`, `ReportRoomModal`, `ReportUserModal`, `DeviceVerification`, `InviteUserPrompt`, `LogoutDialog`, `DeviceVerificationSetup`, `DeviceVerificationReset`, `JoinAddressPrompt`, `JumpToTime`, `EditHistoryModal`, `ForwardMessageDialog`, `RemindMeDialog`, `CreateRoomModal`, `CreateSpaceModal`, `ScheduleMessageModal`, `PollCreator`, `AddExistingModal`, `RoomEncryption`, `RoomUpgrade`, `Modal500`, `ReadReceiptAvatars`, `RoomTopicViewer`.
- **Note:** `UIAFlowOverlay` already fullscreen via `<Overlay>` — no change needed. `JoinRulesSwitcher`/`RoomNotificationSwitcher` are dropdowns, not modals.
### 10. Composer Keyboard Obscurity
- **File:** `src/index.css`
- **Status:** **FIXED ⚠️ UNTESTED** — needs verification on iOS Safari specifically (the worst offender); on Android Chrome `100dvh` has been standard since Chrome 108
- **Issue:** The chat composer is often partially or fully obscured by the virtual keyboard on mobile.
- **Fix Applied:** Added `height: 100dvh` (dynamic viewport height) to `html` alongside the existing `height: 100%` fallback. `dvh` updates when the software keyboard appears, ensuring the layout shrinks correctly and the composer stays visible.
- **Issue:** Inline Jotai atom creation in a hook risks re-rendering components unnecessarily.
- **Resolution:** `useState(() => atom(...))` IS the correct Jotai pattern for local stable atom references. The factory function form of `useState` ensures the atom is created only once per component mount. No change warranted.
| State Sync | Fire-and-forget network call to set offline presence during `pagehide` event may not complete reliably, potentially causing UI drift in presence status. | `cinny/src/app/hooks/usePresenceUpdater.ts` | OPEN |
| State Sync | Fire-and-forget network call `setPresence().catch(...)` suppresses errors, meaning the app may falsely assume presence update success. | `cinny/src/app/hooks/usePresenceUpdater.ts` | OPEN |
| Memory Leak | Decrypted Media Memory Leak (Gallery & Lightbox) due to missing virtualization and blob revocation. | `cinny/src/app/features/room/MediaGallery.tsx` | PARTIALLY FIXED ⚠️ UNTESTED — Blob revocation was already correct; added `enabled` param to `useDecryptedMediaUrl` and `useNearViewport(300px)` to each `GalleryTile` to gate decryption until near-viewport, reducing burst on pagination. True virtualization (windowing) deferred — requires significant refactor. |
| Data Persistence | Scheduled Messages are ephemeral (lost on refresh) due to fragile `localStorage` parsing. | `cinny/src/app/state/scheduledMessages.ts` | FIXED — now uses `atomWithStorage` + `createJSONStorage` (Jotai's built-in persistence with error-safe JSON parsing) |
| Memory Leak | Potential memory leak due to uncleaned `handleMouseMove` listener in `usePan`. | `cinny/src/app/hooks/usePan.ts` | FALSE POSITIVE — `usePan` already uses `attachedRef` to track listeners and cleans them up in an unmount `useEffect`. No change needed. |
| Asset Optimization | Large unoptimized media asset (213KB) found in `public/res`. | `public/res/Lotus.png` | OPEN |
| Data Persistence | Non-atomic `localStorage` updates in session management can lead to inconsistent state. | `cinny/src/app/state/sessions.ts` | OPEN |
| Data Persistence | Lack of cross-tab synchronization for `localStorage` updates in session management risks race conditions. | `cinny/src/app/state/sessions.ts` | OPEN |
| Network Resilience | `uploadContent` lacks retry logic, failing immediately upon network error. | `cinny/src/app/utils/matrix.ts` | OPEN |
| Network Resilience | `rateLimitedActions` uses basic retry logic without exponential backoff, which may exacerbate 429 issues. | `cinny/src/app/utils/matrix.ts` | FIXED — fallback delay now uses capped exponential backoff (`min(1000 * 2^retryCount, 30_000)ms`) when server doesn't send `Retry-After`; server header still takes precedence via `getRetryAfterMs()`. |
| Matrix Event Robustness | `useMatrixEventRenderer` handles unknown events gracefully by returning `null`, which may hide potentially important unrendered data. | `cinny/src/app/hooks/useMatrixEventRenderer.ts` | OPEN |
| Data Contract | `MatrixError` instantiation with `UploadResponse` might be brittle. | `cinny/src/app/utils/matrix.ts` | OPEN |
| Type Safety | `addRoomIdToMDirect` uses `as any` cast for `AccountDataEvent.Direct`, bypassing type contract validation. | `cinny/src/app/utils/matrix.ts` | OPEN |
| Robustness | `rateLimitedActions` relies on `MatrixError.httpStatus` which might not exist on all error variants. | `cinny/src/app/utils/matrix.ts` | FALSE POSITIVE — `MatrixError.httpStatus` is defined as `readonly httpStatus?: number` in `matrix-js-sdk/lib/http-api/errors.d.ts`. It is optional (not on all instances) but the `?.` optional chain already guards against undefined. No change needed. |
| Type Contract | Custom types in `cinny/src/types/matrix` mirror SDK types instead of using them, risking drift and contract mismatches. | `cinny/src/types/matrix/` | OPEN |
| Hardcoded color `#EE1D52`, `#9146ff`, `#ff4500`, `#cb3837`, `#f48024` ⚠️ **BRAND EXCEPTION** | `cinny/src/app/components/url-preview/UrlPreviewCard.tsx` + `UrlPreview.css.tsx` — official third-party brand colors in SVG logos and site badge backgrounds; cannot convert to CSS variables without inventing new tokens (violates TDS rule 3) |
| Massive number of hardcoded `backgroundColor` values ⚠️ **PATTERN CONTENT EXCEPTION** | `cinny/src/app/features/lotus/chatBackground.ts` — each background's base color is aesthetic content that defines the pattern identity; converting requires inventing 40+ CSS variables (violates TDS rule 3) or using CSS4 `relative-color-syntax` in inline styles (insufficient browser support); these are visual content, not UI chrome |
| Bundle Size | Large unoptimized media asset (213KB) | `public/res/Lotus.png` | OPEN |
| Matrix Logic | Inefficient repeated `mx.getRoom()` calls in component render loops | `src/app/features/lobby/Lobby.tsx` | OPEN |
| Matrix Logic | Inefficient repeated `mx.getRoom()` calls in component render loops | `src/app/components/emoji-board/EmojiBoard.tsx` | OPEN |
| Performance | Numerous event handlers (e.g., handleUserClick, handleReplyClick) lack `useCallback`, leading to unnecessary re-renders of message components. | `cinny/src/app/features/room/RoomTimeline.tsx` | OPEN |
| Performance | The `submit` function and file handling callbacks (e.g., handleSendUpload) are re-created on every render, causing re-renders of the editor and toolbar components. | `cinny/src/app/features/room/RoomInput.tsx` | OPEN |
| Dependencies | `lodash` pinned to non-existent version `4.18.1` | `cinny/package.json` | OPEN |
| Dependencies | Various pinned versions of `@atlaskit`, `matrix-js-sdk` | `cinny/package.json` | OPEN |
| Dependencies | `matrix-js-sdk` pinned to Release Candidate (`41.6.0-rc.0`) | `cinny/package.json` | OPEN |
| Dependencies | Unstable/experimental versions for build tools (`vite` 8.0.14, `typescript` 6.0.3, `eslint` 9.39.4) | `cinny/package.json` | OPEN |
| CI/CD | `package-manager-cache` set to `false` | `cinny/.github/workflows/build-pull-request.yml` | OPEN |
| CI/CD | Inefficient sequential execution in deployment | `cinny/.github/workflows/prod-deploy.yml` | OPEN |
| CI/CD | Aggressive 1-minute timeout for Netlify deploy | `cinny/.github/workflows/prod-deploy.yml` | OPEN |
| DevEx | Stale upstream bug tracker link/donations/CLA | `cinny/CONTRIBUTING.md` | OPEN |
| DevEx | Alignment issue between README and CONTRIBUTING | `cinny/README.md` | OPEN |
| Testing | No evident automated testing configuration/files | `cinny/src/` | OPEN |
| Type Safety | Extensive use of `as any` type assertions | `cinny/src/` | OPEN |
| Security | Hardcoded public CDN URL; consider moving to environment variable | /root/code/cinny/scripts/syncDecorations.mjs | OPEN |
| Architecture | Modifying node_modules directly is brittle; use patch-package instead | /root/code/cinny/scripts/patch-folds.mjs | OPEN |
| Robustness | Missing security headers (HSTS, CSP, etc.) and inefficient asset serving using rewrites instead of try_files | /root/code/cinny/contrib/nginx/cinny.domain.tld.conf | OPEN |
| Robustness | Incomplete documentation/placeholder path in Caddyfile | /root/code/cinny/contrib/caddy/caddyfile | OPEN |
| Matrix SDK | Inefficient listener management (`setMaxListeners: 150`) and incomplete SDK state transition handling. | `src/client/initMatrix.ts` | OPEN |
| PWA Robustness | Service worker lacks caching strategy for application assets, resulting in no offline capability. | `cinny/src/sw.ts` | OPEN |
| PWA Integrity | `manifest: false` in `vite.config.js` might prevent correct PWA installation if not handled externally. | `cinny/vite.config.js` | OPEN |
| PII Leakage | Potential PII exposure via console.error (parameter e likely contains event data). | `cinny/src/app/plugins/call/CallEmbed.ts` | OPEN |
| PII Leakage | Potential PII exposure via console.warn (parameter imgError/videoError/thumbError object). | `cinny/src/app/features/room/msgContent.ts` | OPEN |
| PII Leakage | Potential PII exposure via console.error (parameter e likely contains event data). | `cinny/src/app/features/room/RoomInput.tsx` | OPEN |
| Element Call Integration | Lacks robust iframe failure monitoring beyond initial 'preparing' event; can result in a permanently hung 'Loading...' state with no user-visible error or recovery path. | `src/app/plugins/call/CallEmbed.ts` | OPEN |
| Component Resilience | `RoomTimeline` has no `ErrorBoundary` wrapper — a single malformed event crashing the renderer takes down the entire timeline with no fallback UI. | `src/app/features/room/RoomTimeline.tsx` | OPEN |
| Component Resilience | `RoomInput` has no `ErrorBoundary` wrapper — a crash in the composer leaves users unable to send messages. | `src/app/features/room/RoomInput.tsx` | OPEN |
| Fallback Logic | No explicit empty/error fallback for Matrix SDK data calls in `RoomTimeline`; relies purely on SDK internal error propagation, meaning silent failures show a blank timeline. | `src/app/features/room/RoomTimeline.tsx` | OPEN |
| Dependency | Potential for complex dependency chains due to deep nesting in `src/app/features/` and `src/app/hooks/`. | `src/app/` | OPEN |
| Hydration/Race Condition | The SyncState listener registered by useSyncState may miss the initial 'PREPARED' event if the client initializes synchronously from IndexedDB before the effect runs, leading to an infinite loading state. | `cinny/src/app/pages/client/ClientRoot.tsx` | OPEN |
| Structure | High number of small, highly coupled utility hooks (`src/app/hooks/`) may obscure dependency graphs. | `src/app/hooks/` | OPEN |
| Dead Code | Potential for unused CSS modules or UI components in `src/app/features/`. | `src/app/` | OPEN |
| Security | Sensitive session data (access tokens, device ID) stored in `localStorage` is vulnerable to XSS. | `src/app/state/sessions.ts` | OPEN |
| Privacy | Sensitive user status messages and expiry timestamps are persisted in `localStorage`. | `src/app/features/settings/account/Profile.tsx` | OPEN |
| Privacy | Unsent composer drafts stored in `localStorage` without encryption could leak info on shared devices. | `src/app/features/room/RoomInput.tsx` | OPEN |
| Persistence | Scheduled messages relying on fragile `localStorage` parsing are prone to data loss on session expiry or error. | `src/app/state/scheduledMessages.ts` | OPEN |
| Bundle Bloat | Inefficient `lodash` import; risks including entire library instead of necessary utilities. | `cinny/package.json` | OPEN |
| Bundle Bloat | Large `matrix-js-sdk` (RC version) dependency; high potential for tree-shaking overhead. | `cinny/package.json` | OPEN |
| Architectural Debt | Redundant style variant logic in `SpacingVariant` could be simplified. | `cinny/src/app/components/message/layout/layout.css.ts` | OPEN |
| Overhead Analysis | Potential CSS bloat from `DropTarget` composition across multiple recipes (`SidebarItem`, `SidebarFolder`). | `cinny/src/app/components/sidebar/Sidebar.css.ts` | OPEN |
| Workflow | Monolithic "Fix all bugs" commits (e.g., `10f6544e`, `aa48c9ef`) make `git bisect` difficult. | Git History | OPEN |
| Workflow | Inconsistent commit message prefixes (e.g., `fix`, `feat`, `docs`, `assets`). | Git History | OPEN |
| Workflow | Use of `fix` or `feat` for large-scale changes affecting multiple disparate systems (e.g., `938ead79`). | Git History | OPEN |
---
## 🎨 Native UI/UX Consistency — Lotus vs. Cinny Baseline
> Audit of every Lotus-custom UI feature against Cinny's native folds design-system conventions. "Native pattern" means the `folds` component library, vanilla-extract tokens (`color.*`, `config.radii.*`, `config.space.*`), and established Cinny component patterns. 52 findings, organized by severity.
---
### 🔴 Major — Broken Styling / Functional Regressions
#### N1. `ProfileDecoration` Save Button — Undefined `--accent-cyan` Variable (border invisible on all non-TDS themes)
- **Status:** **FIXED** — replaced raw `<button>` with `<Button size="400" variant="Success" fill="Solid" radii="300">`, removed undefined `--accent-cyan` reference
- **Issue:** The save button is a raw `<button>` with `border: '1px solid var(--accent-cyan)'` and `color: 'var(--accent-cyan)'`. The variable `--accent-cyan` (without the `--lt-` prefix) is never defined in any theme file — the correct prefixed form is `--lt-accent-cyan`. On all non-TDS themes the border is **invisible** and the text has no color.
- **Root Cause:** Missing `--lt-` prefix. Additionally, the raw `<button>` should be a folds `<Button>` to match every other save button in the same `Profile.tsx` settings panel (e.g., `ProfileDisplayName` save at `Profile.tsx:303`).
- **Fix:** Replace raw `<button>` with `<Button size="400" variant="Success" fill="Solid" radii="300">`. Remove the `--accent-cyan` reference.
#### N2. `UserPrivateNotes` Textarea — Undefined `--border-interactive` Variable (border invisible on all themes)
- **Status:** **FIXED** — replaced undefined CSS vars with `color.SurfaceVariant.ContainerLine`, `config.radii.R300`, `config.space.S200/S300`
- **Issue:** The notes textarea sets `border: '1px solid var(--border-interactive)'`. This variable is never defined anywhere in the codebase — the correct equivalents are `--bg-surface-border` (`src/index.css`) or `color.SurfaceVariant.ContainerLine` (folds token). The border is **invisible on all themes**.
- **Root Cause:** Invented CSS variable name. Also uses raw pixel sizing (`borderRadius: '6px'`, `padding: '8px 10px'`, `fontSize: '14px'`) instead of folds tokens.
- **Status:** **FIXED** — raised toast `zIndex` from `9997` to `10001` (above Night Light at 9998 and modals at 9999)
- **Issue:** The toast container uses hardcoded `zIndex: 9997`. The Night Light overlay is at `z-index: 9998`. The folds `Overlay`/`Dialog` components used for all modals resolve to `z-index: 9999`. Result: (a) toasts render **under** the Night Light tint and take on the warm orange filter; (b) any open modal covers toasts entirely, making notifications invisible.
- **Root Cause:** The toast container does not use the `folds``OverlayContainerProvider` portal that manages z-index correctly — it is a plain `position: fixed` div injected directly in `App.tsx`.
- **Fix:** Either route the toast portal through `OverlayContainerProvider` (matching how all other floating UI works), or raise `zIndex` above all overlay layers (10001+). Also audit Night Light's z-index (9998) relative to toasts.
#### N4. `PollContent` Vote Buttons — Entirely Outside the Folds Design System
- **Issue:** Each poll answer is a native `<button>` with ~15 hardcoded inline style properties using undefined CSS variables (`--accent-cyan`, `--accent-cyan-dim`, `--accent-cyan-border`). Checkbox/radio indicators, percentage spans, and the poll label use raw pixel font sizes (`0.68rem`, `0.78rem`, `0.88rem`) and hardcoded `borderRadius: '8px'`. None of these variables exist in any theme — the entire component will render unstyled on non-TDS themes. All other interactive message content (audio, file, image) uses folds `Chip` or `Button` variants.
- **Root Cause:** Custom implementation that bypasses folds primitives entirely.
- **Fix:** Rewrite using folds `Button` or `Chip` for answers; replace `--accent-cyan*` with `color.Secondary.*` folds tokens; use `Text size="T300"` for labels.
---
### 🟠 Moderate — Interaction Pattern or Visual Deviations
| N5 | Read Receipts | `ReadReceiptAvatars.tsx` | 62–137 | Trigger button is raw `<button>` with `onMouseEnter`/`onMouseLeave` JS style mutation for hover state — **FIXED**: hover/focus emphasis moved to co-located `ReadReceiptAvatars.css.ts` (`:hover`/`:focus-visible`), no JS `.style` mutation | All interactive elements use `useHover` from `react-aria` and folds variant system for hover; direct `.style` mutation used nowhere else on buttons |
| N6 | Read Receipts | `ReadReceiptAvatars.tsx` & `Message.tsx` | 32–56 / 268–283 | Two code paths open `EventReaders`: avatar-pill path uses `useModalStyle(360)` for mobile fullscreen; context-menu path (`MessageReadReceiptItem`) does not — on mobile the context menu path opens a fixed-size non-fullscreen modal for the same content | All modals that share a layout variant use `useModalStyle` consistently; `MessageReadReceiptItem` was not updated when `useModalStyle` was added |
| N7 | Delivery Status | `Message.tsx` | 89–148 | `DeliveryStatus` renders Unicode glyphs (`⟳ ✓ ✕`) in a `<span>` with `fontSize: '10px'` instead of folds `<Icon>` components — **FIXED**: replaced with `Icons.Check/Cross/Send` via `<Icon size="100">` | `Icons.Check`, `Icons.Cross`, etc. are used for all other status glyphs; folds `Text` size tokens for all supplementary text |
| N8 | GIF Picker | `GifPicker.tsx` | 83–124 | GIF picker container uses fully bespoke inline styles (`borderRadius: '12px'`, `boxShadow: '0 8px 32px rgba(0,0,0,0.4)'`, raw `rgba` border) — two separate style sets for TDS and non-TDS paths — **FIXED**: non-TDS path now uses folds tokens (`color.Surface.Container`, `config.radii.R400`, `color.Surface.ContainerLine`, `color.Other.Shadow`), dropping the undefined `var(--bg-surface)`; the TDS branch keeps its `--lt-*` glow chrome (valid TDS styling) | `EmojiBoard` has no caller-applied container styling; folds components handle their own surface internally via design tokens |
| N9 | GIF Button | `RoomInput.tsx` | 1076–1087 | GIF toolbar button renders `<Text size="T200">` with hand-rolled `fontWeight`/`fontSize`/`letterSpacing` instead of `<Icon>` — **WON'T FIX (deliberate)**: folds has no GIF icon, and "GIF" is a widely-recognized text affordance (Slack/Discord/Element all use a text label). Converting to an arbitrary icon would be less clear, not more. | All 8 other toolbar buttons (`Smile`, `Sticker`, `Location`, `Poll`, etc.) use `<Icon src={...} />` exclusively |
| N10 | Send Animation | `Message.tsx` + `Animations.css.ts` | 979–998 / 60–71 | `MsgAppearClass` and `MentionHighlightPulse` both animate `transform: scale` on the same `MessageBase` DOM node — on self-sent mention messages both classes apply simultaneously and fight over the `transform` property — **FIXED**: `mentionPulseKeyframes` now animates only `box-shadow` (dropped the imperceptible `scale(1.003)`), so the appear-scale and the mention glow no longer contend for `transform` | Pre-existing `highlightAnime` only animates `backgroundColor`; no prior `transform` animation on `MessageBase` |
| N11 | AvatarDecoration | `AvatarDecoration.tsx` | 5 / 38–41 | Fixed 8px inset on all sides regardless of avatar size — at folds size `"200"` (~32px) the decoration bleeds 50% of the avatar diameter, clipping against `overflow: hidden` parent containers in member lists. **Inset issue still OPEN.**_Related regression fixed in `useAvatarDecoration.ts`_: the decoration fetch cached **all** failures (including transient 429/5xx) as "no decoration" permanently for the session, so a single rate-limited burst (member list / timeline mount many avatars at once) would make decorations vanish until a full reload. Now only a genuine 404 is cached; transient errors retry on the next mount. | Folds `Avatar` and `PresenceRingAvatar` do not emit overflow outside their bounding box |
| N12 | MediaGallery Drawer | `MediaGallery.tsx` | 651–661 | Drawer uses `position: 'fixed'` with hardcoded `width: '320px'` as inline styles on a `<Box>` — **FIXED**: moved positioning/width into co-located `MediaGallery.css.ts` using `toRem(320)` + a `max-width: 750px` full-screen media query (mirrors `MembersDrawer`); border/header now use `config.borderWidth`/`config.space` tokens. Added Escape-to-close on the panel (previously only the lightbox handled Escape). **Full chrome redesign (round 2)** to match native conventions: panel + header switched from `Surface` to `Background` variant (matching `MembersDrawer`/Saved Messages); header now `Text size="H4"` + plain close `IconButton` (dropped the bespoke tooltip-wrapped button); tabs moved to a bordered toolbar strip with the `variant={active?'Primary':'Secondary'} fill={active?'Solid':'Soft'}` pattern from `PolicyListViewer` and now show per-tab counts; the centered "lines + label" month divider replaced with a left-aligned group label (Cinny group-label pattern); thumbnail tiles moved hover/focus styling to CSS `:hover`/`:focus-visible` (no JS hover state) and into `MediaGallery.css.ts`; file rows + grid tokenized. **Docking fix (round 3)** — the core of the finding: the gallery was a `position: fixed` overlay floating over the timeline, mounted from `RoomViewHeader`. It is now a **docked flex sibling** in the room layout row, exactly like `MembersDrawer`: open state lifted to a `mediaGalleryAtom` (mirrors `bookmarksPanelAtom`), rendered in `Room.tsx` with a vertical `Line` separator on desktop and `key={room.roomId}` to reset per room; the CSS is static-width on desktop and only `position: fixed; inset: 0` full-screen on mobile (identical strategy to `MembersDrawer.css`). It now shares the row with the timeline instead of overlapping it. | `MembersDrawer` uses a vanilla-extract class with `width: toRem(266)` and is placed by the layout system, not `position: fixed`. 54px width discrepancy also breaks visual rhythm if both panels could be open |
| N13 | ScheduledMessagesTray | `ScheduledMessagesTray.tsx` | 108–126 | Collapsible tray header is `<Box as="button">` with `cursor: 'pointer'` inline style and no folds variant — no hover state, no focus ring — **FIXED**: replaced with folds `<Button variant="Secondary" fill="None" radii="0">` using `before`/`after` icon props (gains design-system hover/focus) | All clickable header/toggle elements in the room view use folds `<Button>` or `<IconButton>` with explicit variants for hover/focus; `<Box as="button">` with no variant is used nowhere else |
| N14 | ForwardMessageDialog | `ForwardMessageDialog.tsx` | 137–154 | Dialog uses `<Modal>` but has no `<Header>` component and no close `<IconButton>` — only way to close is clicking outside — **FIXED**: added a folds `<Header variant="Surface" size="500">` with the title + close `<IconButton radii="300">`, matching every other modal | Every other modal using `<Modal>` or `<Box role="dialog">` includes a `<Header>` with a close `<IconButton>` in the top-right (EditHistoryModal, LeaveRoomPrompt, ScheduleMessageModal, RemindMeDialog, etc.) |
| N15 | ScheduleMessageModal | `ScheduleMessageModal.tsx` | 180–193 | Modal root is `<Box as="form" role="dialog">` with manually assembled `borderRadius: config.radii.R400`/`boxShadow` — **FIXED**: shell is now `<Dialog as="form" variant="Surface">`; removed inline surface styles | `ForwardMessageDialog` uses folds `<Modal size="400">` with `R500` radius; the R400 vs R500 mismatch is visible when both dialogs appear in the same session |
| N16 | Presence Picker | `SettingsTab.tsx` | 118–144 | Presence trigger dot is raw `<button>` with `position: absolute; bottom: 2; right: 2` inline and no folds focus ring; no tooltip — **FIXED**: wrapped the trigger in a folds `TooltipProvider` (shows "Status: …"); replaced the undefined `var(--bg-surface)` with `color.Background.Container`. Kept the absolute-positioned `<button>` (it overlays the avatar corner; a full `IconButton` would be too large for the dot). | Every other sidebar icon button uses folds `IconButton` with `SidebarItemTooltip` and `TooltipProvider` |
| N17 | Presence Picker | `SettingsTab.tsx` | 80–86 | `PresencePicker``FocusTrap` missing `escapeDeactivates: stopPropagation` and `isKeyForward`/`isKeyBackward` — **FIXED**: added all three options, matching the theme selector / sort menus | Every other `PopOut`+`FocusTrap`+`Menu` combo supplies both (theme selector `General.tsx:143–160`, `SettingsSelect`, sort menus) — without it Escape bubbles past the trap and arrow-key navigation is absent |
| N18 | Profile Selects | `Profile.tsx` | 547–575 / 816–848 | `ProfileStatus` auto-clear and `ProfileTimezone` selectors are native `<select>` elements with hardcoded `colorScheme: 'dark'` — will render in dark mode on light themes | General.tsx uses folds `SettingsSelect<T>` (`Button`+`PopOut`+`Menu`) for all dropdowns; `colorScheme: 'dark'` breaks light/custom theme appearance |
| N19 | Presence Labels | `useUserPresence.ts` vs `SettingsTab.tsx` | 55–62 / 36–42 | `PresenceBadge` tooltip shows "Active / Busy / Away"; `PresencePicker` options read "Online / Idle / Do Not Disturb / Invisible" — a DND user shows tooltip "Busy", not "Do Not Disturb" — **FIXED**: aligned `usePresenceLabel` reader vocabulary to the setter (online→"Online", unavailable→"Idle", offline→"Offline") | Within the same Lotus feature set the user-facing vocabulary is inconsistent between the setter UI and the reader tooltip |
| N20 | Notification Presets | `Notifications.tsx` | 57–107 | Gaming/Work/Sleep preset buttons are bare `<button>` elements with Lotus-specific CSS vars (`--border-interactive-normal`, `--bg-surface-low`) not defined in all themes — **FIXED**: converted to folds `<Button variant="Secondary" fill="Soft" radii="300">` (auto height) wrapping the emoji/label/description column; undefined vars removed | Grouped preset/action buttons elsewhere use folds `Chip variant="Primary/Secondary" outlined radii="Pill"` (e.g., Composer Toolbar toggles in `General.tsx:1100–1113`) |
| N21 | Notification Sound Selects | `SystemNotification.tsx` | 111–305 | Message sound, invite sound, and quiet-hours time pickers are bare `<select>`/`<input type="time">` with `colorScheme: 'dark'` workaround | All other dropdowns in settings use the `Button`+`PopOut`+`Menu`+`MenuItem` folds pattern; the native select renders OS-styled on all platforms |
| N22 | DM Preview Virtualizer | `RoomNavItem.tsx` / `Direct.tsx` | 608–627 / 232 | DM preview adds a second text row to each DM item, making it taller than 38px, but `useVirtualizer` in `Direct.tsx` still uses `estimateSize: () => 38` — causes layout jump/overlap on initial render — **FIXED**: bumped `estimateSize` to 52 (the two-line DM-row height) so the initial estimate matches the common case; `measureElement` still corrects each row exactly | Non-DM rooms in Home.tsx also estimate 38px; DM items with a preview are now a different height, creating two visual densities in the same nav column |
| N23 | RoomServerACL | `RoomServerACL.tsx` | 100–115 / 298–309 | Server-name text input is a raw `<input type="text">` with inline style object; "Allow IP literal addresses" is a raw `<input type="checkbox">` with `style={{ width: 16, height: 16 }}` — **FIXED**: text input → folds `<Input variant={error?'Critical':'Secondary'}>`; checkbox → folds `<Checkbox variant="Primary">` | All other text/boolean controls in room settings use folds `Input` and `Checkbox` components (`RoomAddress.tsx:163`, `RoomAddress.tsx:330`) |
| N24 | PolicyListViewer | `PolicyListViewer.tsx` | 245–264 | Room-ID add input is a raw `<input type="text">` with manually replicated folds token values — **FIXED**: replaced with folds `<Input variant={error?'Critical':'Secondary'} size="400" radii="300">` | Native pattern: folds `<Input variant="Secondary" size="300" radii="300">` — no inline style needed |
| N25 | ExportRoomHistory Inputs | `ExportRoomHistory.tsx` | 258–292 | Both date range pickers are raw `<input type="date">` with inline styles — **FIXED**: replaced with folds `<Input type="date" variant="Secondary" size="400" radii="300">` | Native pattern: folds `Input` component; `<input type="date">` renders OS-native date picker, unstyled relative to the rest of the settings panel |
| N26 | RoomShareInvite QR | `RoomShareInvite.tsx` | 66–73 | QR code `<img>` has no `onError` handler and no loading state — broken-image placeholder shown when the external API is unreachable — **FIXED**: added `loading="lazy"` + `onError` that swaps to a folds "QR code unavailable" placeholder card | Cinny avatar components and MediaGallery use `onError` handlers; this is the only settings element making a request to a third-party server with no graceful degradation |
| N27 | GIF Picker | `GifPicker.tsx` | 103–110 | `FocusTrap` omits `returnFocusOnDeactivate: false` — focus returns to GIF button on dismiss instead of staying in the editor — **FIXED**: added `returnFocusOnDeactivate: false` (matches EmojiBoard) | `EmojiBoard` in `RoomInput.tsx:978` explicitly sets `returnFocusOnDeactivate={false}`; GIF picker dismiss behaviour is inconsistent with emoji picker |
| N28 | Character Counter | `RoomInput.tsx` | 1159–1174 | Composer character counter rendered with `color: 'var(--tc-surface-low)'` and raw pixel padding — a CSS variable not used anywhere else in the codebase — **FIXED**: removed undefined var and raw opacity; now `<Text priority="300">` with `config.space.S100` padding | Use `color.*` folds tokens or `priority="300"` on a `Text` component |
| N29 | PollCreator Modal | `PollCreator.tsx` | 103–116 | Modal root is `<Box as="form" role="dialog" aria-modal="true">` with manually assembled surface styles instead of folds `<Dialog variant="Surface">` — **FIXED**: shell is now `<Dialog as="form" variant="Surface">`; removed inline surface styles | `MessageDeleteItem` and `MessageReportItem` in `Message.tsx:506,635` use `<Dialog variant="Surface">` inside `OverlayCenter > FocusTrap` |
| N30 | Playback Speed Chip | `AudioContent.tsx` | 163–189 | Speed chip uses `variant="SurfaceVariant" radii="Pill"` while adjacent Play/Pause chip uses `variant="Secondary" radii="300"` — mismatched shape and variant within the same `leftControl` row — **FIXED**: changed speed chip to `variant="Secondary" radii="300"` | Controls grouped in the same row should share variant and radii |
| N31 | Collapsible Message Toggle | `MsgTypeRenderers.tsx` | 97–105 | "Read more ↓" / "Show less ↑" uses `<Button size="300" variant="Secondary" fill="None">` — visually a padded form button — **FIXED**: replaced with the native flush inline-button pattern (`background:none;border:none;padding:0`) + `<Text size="T200">` tinted `color.Primary.Main`, matching `(edited)` in FallbackContent | Inline text toggles in message content (e.g. `(edited)` in `FallbackContent.tsx:74`) use bare `<button>` with `background: none; border: none; padding: 0` to stay flush with text |
| N32 | ReadReceiptAvatars Pill | `ReadReceiptAvatars.tsx` | 95–103 | Pill border is `'1px solid rgba(0,212,255,0.30)'` hardcoded raw rgba string; `borderRadius: '999px'` not a folds radii token; padding in raw pixels — **FIXED**: replaced with `config.borderWidth.B300`, `config.radii.Pill`, `config.space.S100/S200` | Use `color.*` folds tokens and `config.radii.Pill` / `config.space.S*` |
| ~~N33~~ | ~~ReadReceiptAvatars Class~~ | ~~`ReadReceiptAvatars.tsx`~~ | ~~67~~ | ~~`className="receipt-pill-btn"` references a class never defined~~ — **FIXED**: removed dead className | All custom CSS goes through co-located vanilla-extract `*.css.ts` files |
| N34 | EventReaders Header Size | `EventReaders.tsx` | 70 | `Header size="600"` (56px tall) while all peer message-action modals use `size="500"` (48px) — **FIXED**: changed to `size="500"` | `EditHistoryModal`, `LeaveRoomPrompt`, `MessageDeleteItem`, `MessageReportItem` all use `size="500"`; `size="600"` is reserved for full-page panel headers |
| N35 | EventReaders Close Button | `EventReaders.tsx` | 96 | Close `IconButton` missing explicit `radii="300"` prop — **FIXED**: added `radii="300"` | Every peer modal close button explicitly sets `radii="300"` (EditHistoryModal:184, LeaveRoomPrompt:75, MessageDeleteItem:517) |
| N36 | EventReaders Header Border | `EventReaders.tsx` | 72–77 | Lotus-mode header sets `borderBottom: '1px solid var(--lt-border-color)'` as a CSS shorthand string — **FIXED**: changed to `borderBottomWidth: config.borderWidth.B300` | Native modals use `borderBottomWidth: config.borderWidth.B300` to avoid overriding the border-color set by the folds variant system |
| N37 | EventReaders Timestamp | `EventReaders.tsx` | 143–151 | Lotus path sets `fontSize: '0.72rem'` inline — a raw relative unit between folds `T200` and `T100` scale steps — **FIXED**: removed raw `fontSize`, added `priority="300"` | Use folds `Text size="T200" priority="300"` for subdued secondary text |
| N38 | BookmarksPanel Header | `BookmarksPanel.tsx` | 155–196 | Header uses `variant="Surface"` and close button uses `size="300" radii="300"`; also has a SurfaceVariant search bar strip with no equivalent in any native drawer — **FIXED (full redesign)**: rebuilt the whole "Saved Messages" panel to match the canonical `MembersDrawer` — co-located `BookmarksPanel.css.ts` (`toRem(266)` + `max-width:750px` full-screen media query, replacing the old `position:absolute; zIndex:100` mobile "modal" that had no backdrop/escape), `variant="Background"` header, room **avatars** on each item (was a generic hash icon), `priority` tokens replacing all raw `opacity` hacks, the `borderLeft:3px` accent removed, and Escape-to-close added. | `MembersDrawer` header uses `variant="Background"` and default-size close button; the extra search+count strip creates a structurally different component family |
| N39 | Forward Menu Icon | `Message.tsx` | 1150 | Forward context menu item's `after` icon has no `size="100"` prop — **FIXED**: added `size="100"` to the `ArrowRight` icon | Every other after-icon in the same menu block explicitly uses `size="100"` (Reply, Reaction, Edit, Remind Me, Bookmark); missing size causes the Forward icon to render larger |
| N40 | ProfileDecoration Remove Button | `ProfileDecoration.tsx` | 185 | "Remove" link is a raw `<button>` with `background: 'none'; color: 'var(--tc-surface-low-contrast)'` — an undefined CSS variable — **FIXED**: replaced with `<Button variant="Critical" fill="None" size="300" radii="300">` | Use folds `<Button variant="Critical" fill="None">` or a `Text`-styled inline link |
| N41 | PresenceBadge / UserNotes Saving | `UserRoomProfile.tsx` | 240–244 | "Saving…" indicator is `<Text opacity={0.5}>` without a spinner — **FIXED**: now shows a folds `<Spinner variant="Success" fill="Solid" size="100">` beside the "Saving…" text | Every other save operation in `Profile.tsx` shows a folds `<Spinner variant="Success" fill="Solid" size="300">` alongside the save button |
| N42 | Character Counter Convention | `UserRoomProfile.tsx` vs `Profile.tsx` | 243 / 479–490 | `UserPrivateNotes` shows remaining count `"N left"`, appears only under 100; `ProfileStatus` shows `"current / 64"` always with color progression | Two Lotus features in the same settings flow use different counter conventions; neither matches a pre-existing Cinny pattern |
| N43 | Night Light Slider | `General.tsx` | 554–565 | Night Light intensity slider is a raw `<input type="range">` with no `accentColor` token — renders in browser-default blue on all themes — **FIXED**: added `accentColor: color.Primary.Main`; the intensity label `opacity` hack also replaced with `priority="300"` | The Gate Threshold slider at `General.tsx:1456` at minimum sets `accentColor: 'var(--accent-orange)'`; the Night Light slider does neither |
| N44 | Mention Highlight & Boot Button | `General.tsx` | 597–677 | `<input type="color">` for mention highlight uses raw pixel dimensions (`width: '36px'`, `height: '28px'`, `borderRadius: '4px'`); Reset and Boot buttons are bare `<button>` with Lotus CSS vars — **PARTIALLY FIXED**: the mention-highlight Reset button (renders on all themes) is now a folds `<Button variant="Secondary" fill="Soft">`, removing the undefined `--border-interactive-normal` var. The Boot button is **deliberately kept** as-is: it only renders when `lotusTerminal` is active, i.e. exactly when the `--accent-orange*` TDS vars are defined. The `<input type="color">` itself is tracked separately as N69. | Adjacent settings controls use folds `IconButton`/`Button`; there is no other `<input type="color">` in the Cinny settings UI |
| N45 | SettingsSelect vs SelectTheme | `General.tsx` | 126 vs 197 | `SettingsSelect` trigger uses `variant="Secondary"` while `SelectTheme` uses `variant="Primary" outlined fill="Soft"` for the same `Button`+`PopOut` dropdown pattern — adjacent rows in the same Appearance section have different visual weight — **FIXED**: `SelectTheme` trigger changed to `variant="Secondary"` to match `SettingsSelect` | Dropdown triggers should share the same variant within the same settings section |
| N46 | RoomInsights SectionHeader | `RoomInsights.tsx` | 24–37 | `SectionHeader` adds `textTransform: 'uppercase'`, `letterSpacing: '0.06em'`, `opacity: 0.6` to `Text size="L400"` — **FIXED**: simplified to `<Text size="L400" priority="300">` | Every other settings panel uses bare `<Text size="L400">Label</Text>` with no transforms (`General.tsx:52–72`, `ExportRoomHistory.tsx:220,246`) |
| N47 | RoomInsights Chart Radii | `RoomInsights.tsx` | 350–356 / 415–436 | Bar chart uses `borderRadius: 3` and histogram bars use `borderRadius: '2px 2px 0 0'` as raw pixel integers — **FIXED**: replaced with `config.radii.R300` | All other rounded corners use `config.radii.*` tokens |
| N48 | RoomInsights Font Size | `RoomInsights.tsx` | 448 | Hour-axis labels set `style={{ fontSize: 9 }}` as a raw pixel integer — overrides the folds `Text size="T200"` applied on the same element — **FIXED**: removed raw `style={{ fontSize: 9 }}` | Use only folds `Text` size props; never override with raw `fontSize` |
| N49 | RoomInsights Emoji Icons | `RoomInsights.tsx` | 41–65 / 292–295 | `StatTile` uses literal Unicode emoji (`🖼️ 🎬 🎵 📎`) in `<Text size="H4">` as icons — **FIXED**: `StatTile` now takes an `icon: IconSrc` and renders `<Icon>` using `Icons.Photo/VideoCamera/Headphone/File` | All other iconographic elements use `<Icon src={Icons.*} />` from folds — emoji rendering varies between Windows/macOS/Linux and cannot be tinted by the theme |
| N50 | RoomInsights Warning Banner | `RoomInsights.tsx` | 168–192 | Disclaimer banner uses raw `<Box style={{ border: color.Warning.Main, background: color.Warning.Container }}>` — **FIXED**: replaced with `<SequenceCard variant="SurfaceVariant">` with `<Icon>` colored via `color.Warning.Main` | Settings panel informational cards use `<SequenceCard variant="SurfaceVariant">` throughout RoomServerACL, ExportRoomHistory, PolicyListViewer |
| N51 | ExportRoomHistory Progress | `ExportRoomHistory.tsx` | 311–314 | Export progress shows as a plain `Text` string ("Exporting… N messages") — **WON'T FIX (deliberate)**: unlike `BackupRestore` (which has a known total to drive a determinate `ProgressBar`), export has no known total — it counts messages as they stream. The operation already shows a folds `Spinner` in the button plus a live count, which is the correct affordance for an indeterminate task. | `BackupRestore.tsx:72,90` uses a folds `<ProgressBar variant="Secondary" size="300">` for the same kind of long async operation |
| N52 | MessageQuickReactions Empty Return | `Message.tsx` | 160 | `if (recentEmojis.length === 0) return <span />;` — injects an invisible DOM node into the hover action bar flex container — **FIXED**: changed to `return null` | Universal convention for empty renders in Cinny is `return null`; 144+ instances across the codebase; the empty `<span>` can affect flex spacing |
---
### Round 2 — Additional Feature Areas
#### 🔴 Additional Major Findings
**N53 — PTT Badge (Lotus Terminal path): Raw `<div>` tree with `--lt-*` CSS vars instead of folds `<Chip>`**
- **Issue:** When `lotusTerminal` is true the PTT badge renders as a bare `<Box>` with inline styles referencing `--lt-accent-green-dim`, `--lt-accent-green-border`, `--lt-accent-green` — variables absent outside TDS mode — hardcoded rem padding, `borderRadius: '99px'` (non-token), a raw monospace `fontFamily` string, non-token `letterSpacing`, and a raw `animation:` CSS string for the live-pulse dot. The live `●` dot is a raw `<span>` with inline style.
- **Root Cause:** Two entirely separate component trees for the same badge depending on a theme boolean. The non-terminal path (lines 284–301) uses the correct `<Chip variant="Success"|"Warning" fill="Soft" radii="400" outlined>`.
- **Fix:** Remove the terminal branch. The standard `<Chip>` path already exists and TDS theming can be applied via the CSS variable layer without a separate component tree.
**N54 — PiP Mute Overlay Badges: Raw `<div>` instead of folds `<Badge>`/`<Chip>`**
- **Status:** **FIXED** — replaced hardcoded `borderRadius`/`padding`/`fontSize` with `config.radii.R300`, `config.space.S100/S200` tokens; replaced raw `<span>` text with folds `<Text size="T200">`; color now applied to the `Icon`/`Text` via `color.Critical/Warning.Main`. The dark translucent scrim (`rgba(0,0,0,0.65)`) is **deliberately retained**: these badges overlay arbitrary video, where a theme `Chip`/`Badge` surface token would not guarantee legibility. They are also non-interactive (`pointerEvents: 'none'`), so an interactive `Chip` (a `<button>`) is semantically wrong.
- **Issue:** Both the "You muted" (bottom-left) and "All muted" (top-right) PiP badges are raw `<div>` elements with hardcoded `background: 'rgba(0,0,0,0.65)'`, `backdropFilter: 'blur(4px)'`, `borderRadius: '6px'`, `padding: '3px 7px'`, `fontSize: '12px'`. Color is set as `color: color.Critical.Main` directly on the wrapper `<div>`, not via a folds `variant` prop. Text is `<span style={{ fontSize: '11px', fontWeight: 600 }}>`.
- **Root Cause:** `CallView.tsx` line 127 uses `<Badge variant="Critical" fill="Solid" size="400">` in the same file for the "N Live" indicator — the native pattern exists and is unused here.
- **File:** `src/app/features/settings/general/General.tsx`, lines 1660–1661 and 1726–1728
- **Status:** **FIXED** — replaced all 4 instances of `color.Critical.Main` with `color.Primary.Main` in `General.tsx`
- **Issue:** The selected-state border for both `ChatBgGrid` and `SeasonalBgGrid` is `border: \`2px solid ${color.Critical.Main}\``and the label color is also`color.Critical.Main`. `color.Critical.Main` is the semantic token for **destructive/error states** — it is used for "Leave Room", "Delete Message", "Report Room" in the same file. A normal selection indicator rendered in error red is semantically wrong and visually alarming.
- **Root Cause:** Wrong semantic token for an active/selected state.
- **Fix:** Replace `color.Critical.Main` with `color.Primary.Main` (or `color.Success.Main` to match how other settings selections are styled) for both the border and label color.
- **Status:** **FIXED** — extracted a shared `ReportCategorySelect` component (`src/app/features/room/ReportCategorySelect.tsx`) using the folds `Button` trigger + `PopOut` + `FocusTrap` + `Menu` + `MenuItem` pattern (with `escapeDeactivates`/arrow-key nav, matching `OrderButton`); both modals now use it instead of the native `<select>`.
- **Issue:** Both report modals render the "Category" field as `<Box as="select">` with hand-rolled inline styles (padding, border, background, color, fontSize, fontFamily). No other selector in the message-action modal context uses `<select>` — the established pattern for all dropdowns in both message modals and search filters is `Chip onClick → setMenuAnchor → PopOut → FocusTrap → Menu → MenuItem` (reference: `OrderButton` in `SearchFilters.tsx` lines 63–114).
| N57 | PiP Fullscreen Button | `CallEmbedProvider.tsx` | 929–951 | PiP fullscreen toggle is a raw `<button>` with `background: 'rgba(0,0,0,0.65)'`, `color: '#fff'`, `fontSize: '13px'`, Unicode ⛶/⊡ glyph — no focus ring, no tooltip — **FIXED (token discipline)**: `borderRadius`/`padding`/gap replaced with `config.radii.R300` + `config.space.*` tokens (also on the "Return to call" label). The dark scrim and `#fff` text are **deliberately kept** for legibility over arbitrary video; the glyph stays because folds has no fullscreen icon. `aria-label`/`title` tooltip already present. | `Controls.tsx` fullscreen button uses `<IconButton variant="Surface" fill="Soft" radii="400" size="400" outlined>` with `<TooltipProvider>`; hardcoded `#fff` fails on light themes |
| N58 | Screenshare Confirm Popup | `CallControls.tsx` | 303–360 | "Share your screen?" popup is a raw `<Box>` with `--bg-surface`/`--bg-surface-border` vars (undefined outside TDS), `borderRadius: '0.75rem'`, `boxShadow: '0 8px 32px rgba(...)'`, no `FocusTrap` | Cinny's confirmation dialogs use folds `<Menu>` + `<FocusTrap>` + `<PopOut>`; the non-FocusTrap popup is not keyboard-accessible |
| N59 | ML Noise Suppression Panel | `General.tsx` | 1303–1487 | Sub-panel uses `var(--border-color)`, `var(--bg-card)`, `var(--bg-input)` (undefined in folds default theme), raw `<details>`/`<summary>` (UA-styled), `accentColor: 'var(--accent-orange)'` (TDS-only) | All other settings sub-sections use `<SettingTile>` rows inside `<SequenceCard>`; no other settings component uses `<details>` |
| N60 | Knock Badge on Members Button | `RoomViewHeader.tsx` | 744–782 | Knock count badge wrapped in extra `<div style={{ position: 'relative' }}>` with hardcoded `fontSize: '9px'`, `minWidth: '14px'`, `height: '14px'`, `padding: '0 3px'` overriding folds `size="200"` — **FIXED**: removed wrapper div, put `position: 'relative'` directly on the `IconButton`, `<Badge size="400">` with `toRem(3)` insets and `<Text size="L400">` — now matches the Pinned Messages badge pattern exactly | Pinned Messages badge (same header, lines 651–677) uses `position: 'relative'` directly on `<IconButton>` + `toRem()` for inset; no extra wrapper div |
| N61 | Knock Member Rows | `MembersDrawer.tsx` | 441–487 | Knock requester rows use raw `<Box>` with manually duplicated padding; no `<MenuItem>` wrapper → no hover/focus/active states — **WON'T FIX (deliberate)**: unlike a `MemberItem` (a clickable navigation row), a knock row contains two action buttons (Approve / Deny) and is **not itself clickable**. Wrapping it in `<MenuItem>` (a `<button>`) would nest interactive controls inside a button — invalid HTML/ARIA. The row has no interactive state to express. | Every joined/invited member uses `<MemberItem>` which wraps `<MenuItem variant="Background" radii="400">` with baked-in spacing and all interactive states |
| N62 | Unverified Device Banner | `RoomInput.tsx` | 860–883 | Warning callout above composer uses inline `background: color.Warning.Container`, `borderLeft: '3px solid color.Warning.Main'` — a custom left-border accent pattern not present anywhere else in the folds system — **FIXED**: replaced the `borderLeft: '3px'` accent with a standard full `border` using `color.Warning.ContainerLine` + `config.borderWidth.B300`; removed the `opacity` hacks (folds `OnContainer` already meets contrast) | Warning indicators in the same codebase use `<Chip variant="Warning">` or `<Badge variant="Warning">`; the 3px left-border card pattern has no folds equivalent |
| N63 | Report Modals — Box Instead of Dialog | `ReportRoomModal.tsx` / `ReportUserModal.tsx` | 97–110 / 103–116 | Both modals render as `<Box as="form" role="dialog">` with inline `background`/`borderRadius`/`boxShadow`; use `config.radii.R400` (rounder) vs native `Dialog` which uses `R300` — **FIXED**: both shells are now `<Dialog as="form" variant="Surface">`; removed inline surface styles (Dialog provides background/radius/shadow) | Native `MessageReportItem` at `Message.tsx:634` and all other Cinny message-action modals use `<Dialog variant="Surface">` |
| N64 | EditHistoryModal — `<Modal>` vs `<Dialog>` | `EditHistoryModal.tsx` | 166 | Uses `<Modal variant="Surface" size="500">` while sibling message-action modals (`DeleteMessageItem:505`, `MessageReportItem:634`) all use `<Dialog variant="Surface">` — different widths and internal padding | `<Dialog variant="Surface">` is the established modal shell for all message-triggered dialogs |
| N65 | EditHistoryModal — No "Load More" | `EditHistoryModal.tsx` | 253–259 | When `hasMore` is true the modal shows passive `<Text>"Showing the 50 most recent edits"</Text>` with no action; older edits are inaccessible — **FIXED**: implemented real pagination — edits accumulate across `next_batch` fetches (de-duped by event id, re-sorted by ts), with a folds `<Button>Load more</Button>` (spinner while loading) replacing the passive text | `RoomActivityLog.tsx:425` and `MessageSearch.tsx:129` both render a folds `<Button size="300" variant="Secondary">Load more</Button>` to fetch the next page |
| N66 | DateRangeButton — Native `<input type="date">` | `SearchFilters.tsx` | 558–589 | "From" and "To" date fields are raw `<input type="date">` with inline style overrides including `fontSize: '0.82rem'` — **FIXED**: replaced both with folds `<Input type="date" variant="SurfaceVariant" size="300" radii="300">`; removed now-unused `color` import | `SelectRoomButton` (same file, line 224) and `SelectSenderButton` (line 424) both use folds `<Input size="300" radii="300">`; the date inputs are the only native browser inputs in the search filter row |
| N67 | SeasonalEffect / NightLight Z-Index Order | `SeasonalEffect.tsx` / `App.tsx` | 759 / 62–77 | `SeasonalEffect` mounts at `zIndex: 9999`; `NightLightOverlay` at `zIndex: 9998`. Seasonal particles render **above** Night Light so they are never tinted. `SeasonalEffect` also shares `z-index: 9999` with the skip-to-content link in `ClientLayout.tsx` — **FIXED**: lowered `SeasonalEffect` overlay to `zIndex: 9997` (below Night Light at 9998 and modals at 9999), so Night Light now tints the particles and dialogs are never obscured | Expected UX: Night Light tints all visible content including effects; requires either a higher Night Light z-index or a lower SeasonalEffect z-index |
| N68 | Syntax Highlighting — `--lt-accent-*` Vars in Non-TDS Themes | `syntaxHighlight.ts` | 313–323 | `tokenStyle()` returns `var(--lt-accent-cyan/green/orange/purple, hardcoded-fallback)` — `--lt-*` vars only exist in TDS mode; fallbacks are Monokai dark colors that have poor contrast on light themes and no relationship to the existing `--prism-*` variables in `ReactPrism.css` — **FIXED**: `tokenStyle()` now maps to the `--prism-*` family (keyword/selector/boolean/atrule/comment) which has proper light/dark/TDS palettes; comment uses `--prism-comment` instead of an opacity hack | `ReactPrism.css` uses `--prism-keyword`, `--prism-selector` etc. which switch correctly between light and dark palettes; syntax highlighting should use the same variable family |
| N69 | Mention Highlight — `<input type="color">` Instead of `HexColorPickerPopOut` | `General.tsx` | 644–675 | Raw `<input type="color">` with hardcoded pixel dimensions; OS-native color picker chrome renders completely differently from the rest of settings UI — **FIXED**: replaced with `<HexColorPickerPopOut>` + `<HexColorPicker>` (react-colorful) behind a folds `<Button>` trigger showing a color swatch; the picker's built-in `onRemove` replaces the separate Reset button | `PowersEditor.tsx:125–143` establishes `<HexColorPickerPopOut picker={<HexColorPicker ...>}>` as the codebase's color-picking pattern; Reset button should be `<Button size="300" variant="Secondary" radii="300">` |
| N70 | ChatBgGrid / SeasonalBgGrid — Raw `<button>` Elements | `General.tsx` | 1648–1689 / 1711–1742 | Both pickers use raw HTML `<button>` elements with hardcoded `width: toRem(76)`, `height: toRem(50/56)`, `borderRadius: toRem(8)`, `border: 2px solid rgba(...)` — no focus ring via folds, no `variant` prop, no hover state from the design system — **FIXED**: chrome (radius, border, hover, **keyboard `:focus-visible` ring**, selected state via `data-selected`) moved to a shared `BgSwatch.css.ts` using `config`/`color` tokens; only the per-swatch size + live preview background remain inline (these are inherently custom preview tiles, not folds `MenuItem`/`Chip` candidates) | Native Cinny theme pickers use folds `<MenuItem>` or `<Chip>` which respond to theme and provide focus/hover states automatically |
| N71 | Call Prescreen Text | `CallView.tsx` | 63–85 | `ChannelFullMessage` and `AlreadyInCallMessage` use `<Text style={{ color: color.Critical/Warning.Main }}>` inline instead of folds `<Badge variant="Critical/Warning">` — **WON'T FIX (deliberate)**: these are full, centered explanatory **sentences** ("Channel Full (N/M) — Wait for someone to leave…"), not short labels. A `Badge` is for compact chips like "N Live"; wrapping a sentence in one is visually wrong. They already use folds `color.*` tokens. The sibling `LivekitServerMissingMessage`/`NoPermissionMessage` use the same (un-flagged) pattern. | The "N Live" badge directly above (line 127) correctly uses `<Badge variant="Critical" fill="Solid" size="400">` |
| N72 | Mute MenuItem Icon | `RoomNavItem.tsx` | 454–466 | "Mute" `<MenuItem>` places bell-mute icon as a raw child node instead of using the `before` prop — **FIXED**: moved `Icons.BellMute` to `before` prop | Every other `<MenuItem>` in both `RoomNavItemMenu` and `RoomMenu` places its leading icon in the `before` prop |
| N73 | Pending Requests Header | `MembersDrawer.tsx` | 415–422 | "Pending Requests" section header is bare `<Text>` with inline padding instead of `className={css.MembersGroupLabel}` — **FIXED**: now uses `className={css.MembersGroupLabel}` like every other section header | Power-level group labels at lines 506–519 use `className={css.MembersGroupLabel}` for all other section headers in the same virtualizer list |
| N74 | Emoji Prefix Span | `RoomNavItem.tsx` | 730–736 | Emoji prefix rendered as raw `<span style={{ fontSize: '1.15em', lineHeight: 1 }}>` inside a `<Text>` node — **FIXED**: removed the emoji-splitting span; the room name (including any leading emoji) now renders directly inside `<Text>` | All other nav item text uses folds `<Text size="Inherit">` or similar — no raw `<span>` with em-based font-size override exists elsewhere in the sidebar |
| N75 | Room Name Override / Star Indicators | `RoomNavItem.tsx` | 741–757 | Pencil and star indicator icons are embedded inside the name `<Box as="span">`, giving them the same visual baseline as the room name text — **WON'T FIX (deliberate)**: an inline favorite-star / local-name marker adjacent to the name is a deliberate, common design (cf. Element/Slack pinned-name markers). Moving them to the far right would collide with the unread/notification indicators already there and risks layout regressions. Low value, real regression risk. | Native sidebar status indicators (unread count, notification mode icon) are placed to the far right of the item, never inside the name text span group |
| N76 | Report Modals — Extra Cancel Button | `ReportRoomModal.tsx` / `ReportUserModal.tsx` | 189–191 / 195–197 | Both custom report modals include a "Cancel" `<Button>` in the footer row — **FIXED**: removed the Cancel button; dismissal is via the header `×` / click-outside, matching `MessageReportItem` | Native `MessageReportItem` (`Message.tsx:675–691`) has no Cancel button — dismissal is via `×` header button or click-outside only |
| N77 | Search Filter Inline Lambdas | `SearchFilters.tsx` | 480, 625 | `SelectSenderButton` and `DateRangeButton` trigger chips use inline `onClick` arrow functions — **WON'T FIX (deliberate)**: purely a code-style nit with zero user-facing or behavioural impact. Inline arrow handlers are idiomatic React and used throughout this very file; extracting them yields no functional benefit. | `OrderButton` (line 58) and `SelectRoomButton` (line 195) both extract a named `const handleOpenMenu: MouseEventHandler<HTMLButtonElement>` handler — bypassing the type annotation in the inline form |
| N78 | HasLink Chip Active Color | `SearchFilters.tsx` | 755 | `HasLink` active state uses `variant="Primary"` (blue); all boolean scope-toggle chips in the same bar use `variant="Success"` (green) with `outlined` — **FIXED**: changed to `variant={containsUrl ? 'Success' : 'SurfaceVariant'} outlined={!!containsUrl}` | `variant="Success" outlined` is the established active-state pattern for boolean toggles in the filter bar |
| N79 | Server Notice Chip Radii | `RoomViewHeader.tsx` | 570 | `<Chip size="400" radii="Pill">` — `Pill` radii on a room-type label — **FIXED**: changed to `radii="300"` | Room/space type labels in lobby (`RoomItem.tsx:83`, `SpaceItem.tsx:63`) use `radii="300"`; `radii="Pill"` is for filter/tag chips only |
| N80 | Server Support Contact Layout | `About.tsx` | 172–239 | Homeserver support contacts rendered as raw `<Box direction="Column">` with `<Text as="a">` pairs — custom label/link layout — **WON'T FIX (deliberate)**: a contact is `role → {matrix_id?, email?, …}` (one-to-many links per role), which doesn't map onto `SettingTile`'s single `title`/`description`/`after` slots without contortion. The current layout already uses folds `Box`/`Text`/`SequenceCard` + tokens and `Text as="a"` (a valid folds pattern); no undefined vars or raw HTML chrome. | All other `<SequenceCard>` content in `About.tsx` and `General.tsx` uses `<SettingTile title="..." description="..." after={...}>` as the content unit |
| N81 | Background Picker Grid — No Responsive Layout | `General.tsx` | 1707–1742 | Fixed `width: toRem(76)` flex-wrap cells with no `minWidth` floor or CSS grid `auto-fill` — SeasonalBgGrid's 13 items produce a visually lopsided orphan last row at any viewport width | Cinny's native grids use `grid-template-columns: repeat(auto-fill, minmax(N, 1fr))` or equivalent for responsive fill |
| N82 | Join/Leave Sounds Auto-Preview | `General.tsx` | 1592–1609 | Selecting a sound in the dropdown immediately plays a preview, but no UI affordance (button label, description text, or "▶ Preview" button) communicates this to the user | Settings tiles with side effects on selection (theme picker, chat background) show a live visual preview or a dedicated control explaining the side effect |
- **Status:** **FIXED** — replaced raw `<button>` elements with `<Button size="300" radii="300" variant="Secondary" fill="Soft">` with styled `<Text>` children for B/I/S/code labels
- **Issue:** The four formatting buttons (B, I, S, `` ` ``) in the room topic editor are plain HTML `<button>` elements with entirely inline styles: manual `border`, `borderRadius`, `background`, `color`, `cursor`, `fontSize`, `fontWeight`, `fontStyle`, `fontFamily`, `lineHeight`. They bypass the folds design token system completely — no `variant`, `size`, or `radii` props, no theme-reactive hover/focus states.
- **Root Cause:** Custom addition without referencing folds primitives.
- **Fix:** Replace with `<IconButton type="button" size="300" radii="300" variant="Surface" fill="Soft">` matching the emoji-picker trigger immediately above them at line 285, which already uses the correct pattern.
**N84 — Topic Preview in Room Settings Renders Plain Text Instead of `formatted_body`**
- **Status:** **FIXED** — read-mode topic now checks `topic.format === 'org.matrix.custom.html'` and renders `parse(sanitizeCustomHtml(topic.formatted_body))`, matching `RoomTopicViewer` and all other display sites
- **Issue:** The read-mode topic display wraps `topic.topic` (the plain-text field) in `<Linkify>` and never reads `formatted_body`. However `buildTopicContent()` (lines 82–89) intentionally stores both `topic` and `formatted_body` under `org.matrix.custom.html`. After the user saves a formatted topic, the preview panel immediately shows the stripped plain-text version — the formatting appears to disappear within the same settings panel.
- **Root Cause:** The existing `RoomTopicViewer` component (`src/app/components/room-topic-viewer/RoomTopicViewer.tsx:24–51`) already checks `topic.format === 'org.matrix.custom.html'` and pipes `formatted_body` through `sanitizeCustomHtml`. This component is used everywhere else (`RoomIntro`, `LobbyHero`, `RoomItem`, `Invites`, etc.) but not in Room Settings.
- **Fix:** Replace the inline plain-text render with `<RoomTopicViewer topic={roomTopic}>` to match all other display sites.
| N85 | RemindMe Dialog Shell | `RemindMeDialog.tsx` | 69–81 | Dialog shell is `<Box role="dialog">` with `background`, `borderRadius`, `boxShadow`, `overflow` all set as inline styles using token lookups. Corner radius is `config.radii.R400` which differs from the `R300` embedded in `<Dialog variant="Surface">` — **FIXED**: shell replaced with `<Dialog variant="Surface" style={modalStyle}>`; removed the inline `background`/`borderRadius`/`boxShadow`/`overflow` and the now-unused `color` import | All small message-action dialogs (`LeaveRoomPrompt`, `LogoutDialog`, `JoinAddressPrompt`, `PowerChip`, `DeleteMessageItem`) use `<Dialog variant="Surface" style={modalStyle}>` as the shell |
| N86 | RemindMe Preset Buttons | `RemindMeDialog.tsx` | 111–117 | The four preset time choices (20 min, 1 hr, 3 hr, tomorrow) use `<MenuItem size="300" radii="300">` — `MenuItem` is a navigation primitive tied to `menu`/`menubar` ARIA roles; placing it inside `role="dialog"` is an invalid ARIA combination — **FIXED**: each preset is now a folds `<Button variant="Secondary" fill="Soft" radii="300">`, resolving the invalid `menuitem`-in-`dialog` ARIA | Dialog action choices use `<Button>` (delete/leave/logout dialogs) or `<Chip>` (selection choices). No other dialog in the codebase uses `MenuItem` for action items |
| N87 | Composer Toolbar Toggle Pattern | `General.tsx` | 1100–1114 | Per-button toolbar toggles (Format, Emoji, Sticker, GIF, Location, Poll, Voice, Schedule) use `<Chip variant="Primary"/"Secondary" radii="Pill">` in a wrap grid — a compact chip-toggle grid inside a `SettingTile`, different from every adjacent row | The three sibling tiles in the same `Editor()` function (ENTER for Newline, Markdown, Formatting Toolbar) all use `<SettingTile after={<Switch variant="Primary">}>`. 15+ other binary settings in the file use the Switch pattern |
| N88 | Voice Recorder Recording State | `VoiceMessageRecorder.tsx` | 195, 206, 240, 276 | Recording container background is `var(--bg-surface-variant)`, the live pulse dot is `var(--tc-danger-normal)`, waveform bars are `var(--tc-primary-normal)` — custom Lotus CSS vars that may not exist in folds themes, falling back to transparent/black — **FIXED**: replaced with `color.SurfaceVariant.Container`, `color.Critical.Main`, `color.Primary.Main` | Native message components use JS-accessible `color.*` tokens that are always populated regardless of theme class |
| N89 | Voice Recorder Preview Audio | `VoiceMessageRecorder.tsx` | 282–283 | Preview state renders bare `<audio src={previewUrl} controls>` — native browser element with inconsistent cross-browser chrome — **FIXED**: replaced with `<audio ref>` + folds `<IconButton>` play/pause toggle; `onEnded` resets playing state | Native audio messages use folds `Attachment`/`AttachmentContent` layout wrappers; pre-send preview should use `<IconButton>` play/pause controls |
| N90 | Mention Highlight Contrast Formula | `App.tsx` | 36–40 | Auto-computed text color (black/white) uses simplified luma `(0.299r + 0.587g + 0.114b)/255 > 0.5` — not WCAG 2.1 relative luminance (which requires gamma linearization) — **FIXED**: replaced with WCAG 2.1 relative luminance formula using `((c+0.055)/1.055)^2.4` gamma linearization; threshold moved from 0.5 to 0.179 | Folds `color.*.OnContainer` tokens are manually curated to pass WCAG AA 4.5:1 contrast ratios; custom computation must match this guarantee |
| N91 | Upload Card Caption Input | `UploadCardRenderer.tsx` | 356–376 | Caption input is raw `<input type="text">` with hardcoded inline CSS using Lotus-specific vars not in folds — **FIXED**: replaced with folds `<Input variant="Secondary" size="300" radii="300">` | Other text inputs in the UI use folds `<Input size="300" radii="300">` with folds-token props for all sizing and color |
| N93 | Location Coordinates Text | `MsgTypeRenderers.tsx` | 532 | `<Text size="T300" style={{ opacity: 0.65 }}>` — hardcoded non-standard opacity — **FIXED**: replaced with `<Text size="T300" priority="300">` | Secondary text uses folds `priority` prop; `0.65` is outside the token scale |
| N94 | Mention Highlight Border Invisible | `App.tsx` | 41 | `--mention-highlight-border` is set to the same value as `--mention-highlight-bg` — the border is invisible — **FIXED**: border is now `rgba(r,g,b,0.5)` — same hue as the background at 50% opacity, always visible | In folds, `color.*.ContainerLine` is always a lighter/muted sibling of `color.*.Container`, providing the 1px outline that gives mention chips visual definition |
- Matrix-style boot messages on the welcome page; press Escape to skip
- Implemented in `src/lotus-boot.ts`
@@ -88,6 +94,7 @@ A full light-palette counterpart to the dark TDS theme.
| `--lt-text` | `#111827` | Body text |
**Differences from dark mode:**
- CRT effects (scanlines, vignette, phosphor glow) are disabled
- Scoped to `html[data-theme="light"] body.lotusTerminalBodyClass` to avoid bleed into non-TDS themes
-`ThemeManager.tsx` is responsible for setting the `data-theme` attribute on the `<html>` element when theme changes
@@ -143,6 +150,16 @@ Strips all `animation` properties from the returned style object when either `pa
A "Pause Background Animations" toggle is exposed in **Settings → Appearance**. The preference is persisted and read by `getChatBg()` at render time.
### Animation Improvements (June 2026)
All five animated backgrounds were rewritten for smoother, more organic motion:
- **Digital Rain** — added a phosphor glow flicker (`animRainGlowKeyframe`, 2.1 s) layered on top of the column scroll; stripe opacity increased for better visibility
- **Star Drift** — each of the three dot layers now moves by exactly its own tile width/height per cycle (`−130 px`, `−190 px`, `−260 px`), eliminating the visible seam on loop
- **Grid Pulse** — independent brightness oscillation (`animGridBrightnessKeyframe`, 3.3 s) runs alongside the size breathe (4 s) at a prime period ratio so they never synchronise
- **Aurora Flow** — four gradient layers now have individual `backgroundSize` values (`200%`, `250%`, `300%`, `220%`); the keyframe drives each layer through a distinct 5-stop path, replacing the robotic single back-and-forth
- **Fireflies** — glow pulse (`animFirefliesGlowKeyframe`, 2.3 s `filter: brightness`) and opacity blink (`animFirefliesBlinkKeyframe`, 1.7 s) added on top of the position drift; prime periods create unsynchronised bioluminescence
Animated APNG overlay frames that float around user avatars, inspired by Discord's Avatar Decorations feature. Each decoration extends 8px beyond the avatar border on all sides, with a transparent center hole that reveals the avatar beneath. Other Lotus Chat users see your selected decoration in real time — stored in the Matrix profile via MSC4133.
### Decoration Library
99 hand-curated, original-IP decorations (no licensed character artwork) organized into 9 categories:
| Cozy | 11 | Cozy Cat, Fox Hat (3 colors), Cat Ears, Frog Hat |
All decoration files are 256×256 APNGs. They animate natively in all modern browsers via `<img>` elements.
### Architecture
**Profile storage — MSC4133:**
Decoration preference is stored in the public Matrix profile field `io.lotus.avatar_decoration` (a slug string, e.g. `lotus_flower`). Any Lotus Chat user viewing your profile sees your current decoration.
**CDN:**
Files are self-hosted on the Lotus Nextcloud instance. Direct access: `https://drive.lotusguild.org/public.php/dav/files/{token}/cinny-decorations/{slug}.png`. `<img>` elements load cross-origin freely — no CORS headers needed.
**Module-level cache with in-flight deduplication:**
`useAvatarDecoration(userId)` fetches the profile field once per user per session. A `Map<userId, slug|null>` cache prevents redundant requests; a second `pending` waiters map ensures multiple components requesting the same userId simultaneously share one HTTP request rather than firing duplicates.
**Wrapping pattern:**
`AvatarDecoration` renders a `position: relative; display: inline-flex` wrapper div. The decoration `<img>` is `position: absolute` with `top/left/right/bottom: -8px`, extending equally on all sides while the `z-index: 10` keeps it above the avatar. `onError` hides the image if the CDN file is absent. This wrapper sits outside `PresenceRingAvatar` so the presence ring and decoration layer are fully independent.
**Settings → Account → Avatar Decoration** shows a scrollable grid of all decorations, grouped by category. Each cell is a 52×52px button with a live preview of the APNG. The currently selected decoration gets a 2px cyan border. "No Decoration" clears the field. Changes are saved only when the "Save" button is clicked (visible only when a change is pending). After save, `invalidateDecorationCache(userId)` forces other components to re-fetch.
### Catalog Sync Script
After deleting decoration files from the Nextcloud share, run:
```bash
npm run sync:decorations
```
The script (`scripts/syncDecorations.mjs`) sends HTTP HEAD requests to the CDN URL for every slug in `avatarDecorations.ts` and automatically removes entries for files that returned 404. Empty categories are pruned automatically. Review with `git diff`.
### Files
-`src/app/features/lotus/avatarDecorations.ts` — full catalog (`DECORATION_CATEGORIES`, `ALL_DECORATIONS`, `decorationUrl()`, `DECORATION_CDN`)
-`src/app/components/avatar-decoration/AvatarDecoration.tsx` — wrapper component with APNG overlay
-`src/app/features/settings/account/ProfileDecoration.tsx` — settings UI (picker grid, save button)
-`scripts/syncDecorations.mjs` — CDN sync script to prune deleted decorations from the catalog
---
## Glassmorphism Sidebar (P5-3)
An optional frosted-glass sidebar style toggled in **Settings → Appearance**.
**Implementation:**
-`SidebarGlass` vanilla-extract class applies `background: rgba(3, 5, 8, 0.55)` and `backdropFilter: blur(12px)` to the sidebar element
-`SidebarNav.tsx` uses a `useEffect` to mirror the active chat background onto `document.body` when the glassmorphism setting is enabled, so the blur filter has meaningful content to work through
- Degrades gracefully on browsers without `backdrop-filter` support (falls back to the semi-transparent background)
@@ -166,6 +287,7 @@ An optional frosted-glass sidebar style toggled in **Settings → Appearance**.
A warm orange overlay rendered over the entire UI to reduce blue light emission.
**Implementation:**
-`NightLightOverlay` component mounted directly in `App.tsx`
@@ -225,9 +347,101 @@ Camera starts disabled on join. The `cameraOnJoin` setting is explicitly opt-in
`M` key triggers `toggleSound()` in `CallControls.tsx`, toggling the deafen state without requiring a mouse click.
### Noise Suppression Toggle
### AFK Auto-Mute in Voice (P5-11)
A`noiseSuppression` URL parameter is passed to the Element Call widget URL, allowing the noise suppression feature to be toggled from within Lotus settings.
Automatically mutes the microphone after a configurable period of microphone-on silence.
**Implementation:**
-`useAfkAutoMute(callEmbed)` hook opens a separate monitoring-only `getUserMedia` stream (independent of Element Call's stream) and analyzes it via `AudioContext` + `AnalyserNode`
- RMS level is sampled every 500ms; if it stays below threshold while the mic is on, the silence timer starts
- After the configured timeout (`afkTimeoutMinutes` setting), `callEmbed.control.setMicrophone(false)` mutes the mic and an in-app toast is shown
- Monitoring stream and `AudioContext` are fully cleaned up on unmount (no resource leak)
- Activated inside `CallControls` via `useAfkAutoMute(callEmbed)` — no changes required to `CallEmbed` or Element Call
Room admins can cap the number of participants allowed in a room's voice call. The cap is a **hard, server-side limit enforced for every Matrix client** (Element, FluffyChat, …), backed by a client-side UX layer in Lotus Chat.
**Client (this repo):**
- Limit is stored in the `io.lotus.voice_limit` room state event with content `{ max_users: N }` (0 / absent = no limit)
-`RoomVoiceLimit` component in Room Settings → General → **Voice** lets admins set the cap with a number input. Editing is gated by `permissions.stateEvent(StateEvent.LotusVoiceLimit, …)`, so only users with `state_default` power (or above) can change it
-`CallPrescreen` (`CallView.tsx`) reads the limit reactively via `useStateEvent` and compares it against the live `useCallMembers` count; at capacity the **Join** button is disabled and a "Channel Full (N/N)" message is shown
- A user already in the session (rejoining) is never blocked — only new joiners are gated
Files: `src/app/features/common-settings/general/RoomVoiceLimit.tsx`, `src/app/features/call/CallView.tsx`, `StateEvent.LotusVoiceLimit` in `src/types/matrix/room.ts`
**Server (the hard backstop — `matrix` repo `livekit/voice-limit-guard.py`):**
- Every client must fetch a LiveKit JWT from `lk-jwt-service` before joining a call. A fail-open guard sidecar sits in front of it (guard on `:8070`, lk-jwt-service moved to `:8071`)
- On each token request the guard reads the room's `io.lotus.voice_limit` (Synapse admin API), and if the room is at capacity it returns `403` so the client cannot obtain a token and therefore cannot join — regardless of which client they use
- Distinct Matrix users are counted via LiveKit `ListParticipants`; rejoins / extra devices are allowed. Any failure fails open so calls never break
> The client-side "Channel Full" check is UX/early-feedback; the server guard is the actual enforcement.
### Custom Join / Leave Sound Effects (P5-16)
A local sound plays when another participant joins or leaves a call you're in.
**Implementation:**
-`useCallJoinLeaveSounds(embed)` hook (wired in `CallUtils` inside `CallEmbedProvider`) listens to `MatrixRTCSession` membership changes via `useCallMembersChange`
- Membership identity is tracked by `sender|deviceId`; a snapshot is taken when the session (re)starts so participants already present never trigger a sound
- Your own membership is filtered out (`mx.getSafeUserId()` prefix), and sounds fire only while you are actually joined (`useCallJoined`)
- Sounds are synthesized in-browser with the Web Audio API (`OscillatorNode` + envelope) — no audio assets to bundle. Join uses a rising motif, leave a falling one
- Three styles: **Chime** (sine), **Soft** (triangle), **Retro** (square arpeggio), plus **Off**
**Settings (Settings → Calls):**
- **Join & Leave Sounds** dropdown — Off / Chime / Soft / Retro (default: Chime). Selecting a style previews the join sound immediately
| **Browser-native** | Google NSNet2 (WebRTC built-in). Best general performance/CPU balance. |
| **ML (Advanced)** | Custom ML pipeline supporting multiple models, series suppression, and gates. |
**Advanced Features & Test Options:**
- **Multiple ML Models:** Toggle between **RNNoise** (standard hybrid) and **Speex** (legacy DSP-based) to compare artifact levels and suppression strength.
- **Series Suppression (Combination):** Optional toggle to run the browser's native stationary noise filter _before_ the ML model. This allows testing the individual performance of the ML model vs the combined effectiveness at removing fan hum.
- **Noise Gate:** Configurable hardware-style gate with a dB threshold. Hard-cuts all audio when input is below the threshold, ensuring absolute silence between sentences.
- **Live Microphone Meter:** A real-time volume visualizer in the settings panel to help users accurately tune their Noise Gate threshold.
- **High-Fidelity Capture:** Captures at hardware native rates (supporting high-end gear like **Scarlett Solo + PodMic**) and handles high-quality resampling via Web Audio to prevent the "static" artifacts caused by low-quality browser pre-resamplers.
- **Performance:** Automatic WASM SIMD detection with transparent fallback to standard binaries.
- **Support Detection:** UI now detects `AudioWorklet` / `AudioContext` support and disables ML options in unsupported environments.
- **Status Reporting:** The ML shim notifies the host app via `postMessage`. If initialization fails, a system toast alerts the user of the fallback to the raw microphone.
**Open-Source Model Roadmap:**
| Model | Transients (Clicks) | Voice Quality | CPU Usage (WASM) |
The indicator is hidden once the server confirms the event (when the internal status transitions to `null`), keeping the timeline clean for settled messages.
@@ -316,7 +531,7 @@ The indicator is hidden once the server confirms the event (when the internal st
- Topic `formatted_body` is rendered via `sanitizeCustomHtml` + `html-react-parser`, supporting bold, italic, links, and other inline HTML
- The room header shows a plain-text preview of the topic
- Clicking the topic preview opens a full modal with the formatted body
- The room settings topic editor includes a formatting toolbar with **B**, *I*, ~~S~~, and `code` buttons
- The room settings topic editor includes a formatting toolbar with **B**, _I_, ~~S~~, and `code` buttons
### Edit History Viewer
@@ -395,21 +610,21 @@ Redacted events display "This message has been deleted" along with the redaction
Generic (non-domain-specific) cards display a Google S2 favicon. Empty or unparseable preview responses are suppressed entirely rather than showing a blank card.
@@ -436,13 +651,13 @@ Generic (non-domain-specific) cards display a Google S2 favicon. Empty or unpars
A presence status selector in the user panel offering five modes:
| Do Not Disturb | `unavailable` + `status_msg: 'dnd'` |
| Invisible | `offline` |
| Auto | Standard Matrix presence lifecycle |
| Invisible | `offline` |
| Auto | Standard Matrix presence lifecycle |
- Selection persists via the `presenceStatus` setting
-`usePresenceUpdater` short-circuits its automatic presence updates when a manual mode (anything other than Auto) is selected
@@ -457,6 +672,7 @@ A presence status selector in the user panel offering five modes:
### Presence Badges
`PresenceBadge` component displays a colored dot indicating presence state. Used in:
- Members drawer
- User settings panel
@@ -465,14 +681,22 @@ A presence status selector in the user panel offering five modes:
`PresenceRingAvatar` wraps any avatar component using `React.cloneElement` to inject an `outline: 2px solid` ring whose color maps to the user's presence state. `outlineOffset: 2px` ensures the ring sits cleanly outside the avatar regardless of the avatar's `border-radius`.
Applied in:
- Message timeline
- Members drawer
-`@mention` autocomplete dropdown
- Inbox / notifications panel
### Status Revert Bug Fix (June 2026)
`usePresenceUpdater` previously captured the user's custom status message once via `localStorage.getItem` at effect initialization. When the user changed their status message in Profile Settings, subsequent automatic transitions back to `online` (e.g., returning from idle) would silently broadcast the old status message, reverting the custom status.
Fixed by replacing the single read with a `readStatus()` function called inside every `setOnline` and `setUnavailable` invocation, so the current localStorage value is always used.
### Document Title Unread Count
The browser tab title updates to reflect unread state:
-`(N) Lotus Chat` — N unread messages
-`· Lotus Chat` — unread activity without a specific count
-`Lotus Chat` — no unread items
@@ -480,6 +704,7 @@ The browser tab title updates to reflect unread state:
### Extended Profile Fields
Supports MSC4133 custom profile fields via `PUT /_matrix/client/unstable/uk.tcpip.msc4133/{userId}/{field}`:
@@ -531,6 +770,7 @@ Messages exceeding a configurable line threshold are truncated with a "Show more
### Message Send Animation
A subtle animation plays on the sender's own messages as they appear in the timeline:
-`transform: scale(0.97) → scale(1)` combined with `opacity: 0.4 → 1`
- Duration: 0.15s, ease-out
- Only applied to the current user's outgoing messages
@@ -539,6 +779,7 @@ A subtle animation plays on the sender's own messages as they appear in the time
### Right-Click Room Context Menu
Right-clicking a room in the sidebar opens a context menu with:
- **Mute** with a duration submenu: 15 minutes, 1 hour, 8 hours, 24 hours, Indefinite
- **Copy Room Link** — copies the `matrix.to` URI to clipboard
- **Mark as Read** — marks all events in the room as read
@@ -558,6 +799,7 @@ A text input at the top of the room list filters rooms by display name in real t
### DM Last Message Preview
Direct message entries in the sidebar show:
- A 48-character truncated preview of the last message body
- A relative timestamp (e.g., "2m ago")
- Reactivity via `useRoomLatestRenderedEvent`
@@ -566,6 +808,7 @@ Direct message entries in the sidebar show:
### Room Sort Order
The room list sort order can be configured in **Settings → Appearance**:
- Recent Activity (default)
- A → Z (alphabetical)
- Unread First
@@ -582,6 +825,7 @@ Persists via the `homeRoomSort` setting.
### Invite Link + QR Code
`RoomShareInvite.tsx` provides a shareable invite UI:
- 160×160px QR code generated via `api.qrserver.com`
- "Copy Link" button to copy the `matrix.to` URI
- Also accessible via a toggle button (⊞) in the Invite modal
@@ -605,6 +849,17 @@ A toggle in **Settings → Privacy** switches between sending `m.read` (public r
- Clicking sends `mx.knockRoom(roomId)` with an optional reason
- The members drawer shows a "Pending Requests" section for room admins, listing users who have knocked
### Knock-to-Join Notifications for Admins (P4-3)
Room and space admins are notified in real time when users knock on a restricted room.
-`usePendingKnocks(room)` hook listens to `RoomMemberEvent.Membership` events and returns all members currently in the `knock` state
- Power level check: only shown to users with sufficient invite-level permissions (`usePowerLevelsContext()`)
- **Members button badge:** when knocks are pending, a `Warning`-variant solid `Badge` overlays the Members button in the room header showing the pending count
- Badge is `aria-hidden`; the Members button `aria-label` is updated to announce the count for screen readers
Hook: `src/app/hooks/usePendingKnocks.ts`
### Code Syntax Highlighting (TDS)
`syntaxHighlight.ts` provides TDS-aware syntax highlighting using inline styles derived from `--lt-accent-*` CSS variables. Supported languages: JavaScript, TypeScript, JSX, TSX, Python, Rust. Falls back to ReactPrism for unsupported languages.
@@ -643,6 +898,7 @@ Users can individually show or hide each composer toolbar button in **Settings
- **HTML** — styled, self-contained page
Features:
- Optional date range filter
- Progress indicator during export
- Uses `mx.paginateEventTimeline()` to retrieve history in chunks
@@ -747,6 +1003,7 @@ Three one-tap presets at the top of **Settings → Notifications** that apply a
### Server Notices
`m.server_notice` rooms receive special treatment:
- A `Chip variant="Warning"` badge reading "Server Notice" is shown in the room header
- The composer is read-only (no message input)
- Invite, Report Room, and Room Settings menu items are hidden
@@ -760,7 +1017,7 @@ Three one-tap presets at the top of **Settings → Notifications** that apply a
`mxcUrlToHttp()` calls now use the correct argument order for MSC3916 authenticated media:
The `useAuthentication` parameter was previously mispositioned, causing unauthenticated requests to be sent for media in rooms that required authentication.
@@ -787,32 +1044,37 @@ The `encUrlPreview` setting defaults to `true` rather than `false`. A security a
| `src/app/hooks/useAvatarDecoration.ts` | Profile field fetch with module-level cache and in-flight deduplication |
| `src/app/components/avatar-decoration/AvatarDecoration.tsx` | APNG overlay wrapper rendered around avatars in timeline, members drawer, autocomplete |
- [x] **Upgrade Synapse to v1.155.0** ✅ Done 2026-06-18
- **Context:** 1.155.0 is the last version supporting Debian 12 Bookworm. LXC 151 is already on Debian 13 Trixie — OS migration was completed prior to this upgrade.
- **What changed (1.154→1.155):** No breaking changes, no config changes, no DB migrations. Bugfixes: to-device EDU size limiting, restricted room joins, sliding sync subscription response timing. Rust port of more internal classes (perf only).
- **MSC4452** (Preview URL capabilities) shipped in 1.154 — opt-in via `msc4452_enabled`, not enabled.
---
## 📱 Quick Feature Additions
- [x] **Full-Screen Camera Broadcasts** ⚠️ UNTESTED — verify in a real call
- **Context:** Element Call currently supports full-screening screenshares. We need to parity this functionality for camera broadcasts.
- **Goal:** Users should be able to toggle any camera feed to full-screen mode, similar to the existing screenshare full-screen implementation.
- **Implemented 2026-06-18:**
1. **Fullscreen button always shows** — removed `screenshare &&` gate in `CallControls.tsx`. The fullscreen button is now available in camera-only calls, not just during screenshares.
2. **Per-participant camera focus** — `CallControl.focusCameraParticipant(userId)` added. Finds the participant's video tile via `[data-testid="videoTile"]` / `[data-video-fit]` + `[aria-label="${userId}"]`, enables spotlight mode, then clicks the tile to focus them.
3. **MemberGlance "Focus camera" action** — clicking a participant avatar in the call status bar now opens a mini popup with "Focus camera" (triggers focusCameraParticipant) and "View profile" options, rather than immediately opening the profile.
4. **PiP fullscreen button** — a small fullscreen toggle button (⛶/⊡) is shown in the PiP overlay top-right, allowing users to go fullscreen directly from PiP mode without navigating back to the call room.
---
## ⚠️ 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.**
| **MSC flags ON:**`msc4140` · `msc3771` · `msc3440.stable` · `msc4133.stable` · `simplified_msc3575`· `msc4222` · `msc3266` · `msc3401_matrix_rtc` | All safe to use now |
| **MSC flags OFF:**`msc4306` (thread subscriptions) · `msc3882` · `msc3912` · `msc4155` | These features are BLOCKED |
| **MSC3266** room summary: flag `msc3266_enabled: true` set but `GET /v1/rooms/{id}/summary` still returns 404 (M_UNRECOGNIZED) | Room Preview BLOCKED — endpoint not implemented in Synapse 1.155 |
| **MSC3892** relation redaction: not in flags | Reaction Redaction feature BLOCKED |
| **MSC4260** report user: `POST /_matrix/client/v3/users/{userId}/report` returns **200** ✅ | **Report User UNBLOCKED** — endpoint live since Synapse 1.133; ready to build |
| **MSC4151** report room: HTTP 405 on GET = endpoint exists (POST only) | Report Room live ✅ |
| `folds AvatarImage` does NOT accept children | Add frame/overlay inside `UserAvatar.tsx` itself — optional `frameName` prop |
| No in-app toast system exists (was) | Built `ToastProvider` + Jotai queue; at `App.tsx:65` |
**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).
---
## Priority 3 — Higher complexity / lower daily frequency
- 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).
- 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).
### [x] P3-6 · Configurable Composer Toolbar
**Investigation Findings:**
**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.
- **Root Cause:** Inconsistent focus management, missing `aria-live` regions for dynamic timeline updates, and sparse global keyboard shortcuts.
- **Approach:** Standardize `focus-trap-react` usage (reference `RoomNavItem.tsx`). Add `aria-live` regions to the timeline. Expand `useKeyDown.ts` for section navigation shortcuts.
- **Complexity:** Medium-High (audit is the main work).
---
### [ ] 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.
**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
@@ -151,20 +161,56 @@ Features:
- 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:**
- 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.
- 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).
**Investigation Findings:**
- **Root Cause:** Current `m.thread` events are treated as standard `m.room.message` events and rendered in the main timeline.
- **Approach:** Introduce new Jotai atom `activeThreadEventId`. Create `ThreadPanel.tsx`. Update `RoomTimeline.tsx` to filter out thread relations (`m.relates_to`). Implement aggregation fetch using `GET /rooms/{roomId}/relations/{eventId}/m.thread`. Use `thread.timelineSet` directly for the most accurate thread view.
- **Complexity:** High.
---
## Priority 4 — Specialized, high complexity, or low priority
**Spec:** MSC3771 (stable). Depends on Thread Panel (#P3-8).
@@ -183,20 +229,12 @@ Features:
---
### [ ] P4-3 · Knock-to-join Notifications for Admins
**Note:** The basic knock-to-join UX is covered in P1-11 (completed). 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.
**[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. (Confirmed: sanitizer STRIPS `<math>` tags — must be patched alongside the renderer.)
**Complexity:** Low-Medium.
---
@@ -228,77 +266,44 @@ Features:
**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.
**[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. (Confirmed: folds uses vanilla-extract, NOT CSS custom properties — must create a new vanilla-extract theme variant dynamically.)
**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.
**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:
1. **Cyberpunk** — deep navy bg (`#0a0015`), electric purple (`#bf5fff`) + hot pink (`#ff2d9b`) accents, neon glow
2. **Ocean** — deep sea blue bg (`#020b18`), teal (`#00c9b1`) + aqua (`#0096d6`) accents, soft feel
3. **Blood Red** — near-black bg (`#0d0203`), deep crimson (`#7a0010`) + bright red (`#ff2233`) accents
4. **Classic Matrix** — pure black bg (`#000000`), phosphor green (`#00ff41`) text + accents
**[AUDIT REQUIRED]** Study `src/lotus-terminal.css.ts` for the full token list before designing themes. All tokens must be covered (~50 CSS custom properties each).
**Complexity:** Medium (design effort is the main cost).
---
### [] 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.
**Decision:** Implemented as`!lfg`in LotusBot rather than a client slash command. Bot-side rendering works consistently across all Matrix clients; client-side enhanced cards would only be visible to Lotus Chat users and require sanitizer auditing. The bot can also support richer flows (list active LFGs, DM interested players, auto-expire posts).
---
### [] P5-10 · Voice Channel User Limit
### [x] P5-5 · Intersection-Based Lazy Loading ⚠️ UNTESTED — needs verification in timeline with many images
**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.
**What:** Use `IntersectionObserver` to trigger media decryption and loading only when components approach the viewport.
**Approach:** Reduce initial memory footprint and improve timeline load times by deferring decryption of images/videos until they are visible.
**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:
**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.
**What:** Enhance thumbnail rendering in the timeline for consistent, polished aesthetics.
**Approach:** Use CSS `object-fit: cover` with improved focal-point centering within `ThumbnailContent` to prevent media stretching or awkward aspect-ratio cropping.
**Fix Applied:** Added `objectPosition: 'center top'` to: (1) `media.css.ts` → `Image` component (timeline images), (2) video thumbnail inline style in `RenderMessageContent.tsx`, (3) `GalleryTile``<img>` in `MediaGallery.tsx`. Full-size viewers retain `objectFit: 'contain'` — no change. `objectPosition: 'center top'` prevents face/subject cropping on tall portrait images capped at 600px by `AttachmentBox`.
---
@@ -310,41 +315,152 @@ Themes:
---
### [] 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.
---
### [ ] P5-20 · Quick Reply from Browser Notification
### [~] 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.
**[AUDIT REQUIRED]** (1) Verify browser Notification Actions API support in target browsers. (2) Confirmed: service worker EXISTS at `src/sw.ts` — add `notificationclick` handler there.
**Complexity:** Medium-High.
**Partial Fix Applied ⚠️ UNTESTED:** Notifications now (a) show the real message body (`username: message` instead of "New inbox notification from..."), (b) click navigates directly to the room at the specific event (not the inbox), (c) `window.focus()` called on click so the tab comes to front, (d) reminder toasts also link to the specific event. Full inline-reply via Notification Actions API still needs the SW `push`+`notificationclick` pipeline (requires switching from `new Notification()` to `showNotification()` through the SW).
---
### [x] P5-21 · Custom @Mention Highlight Color
### [x] P5-30 · Advanced ML Noise Suppression (Krisp-style)
**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.
**What:** High-end background noise cancellation using a pre-trained ML model (RNNoise) running in the browser. Removes dogs, fans, and keyboard clicks from the mic stream.
**Shipped:** 3-tier setting (Off / Browser-native / ML) in Settings → General → Calls. ML tier injects a same-origin pre-init shim into the vendored Element Call `index.html` that monkeypatches `getUserMedia` and routes the captured mic through an RNNoise `AudioWorklet` before LiveKit publishes — no EC fork required. See LOTUS_FEATURES.md → "Noise Suppression (Advanced Multi-Tier)".
**Key decision:** LiveKit's Krisp filter is LiveKit-Cloud-only (we self-host the SFU); EC's own RNNoise PR #3892 is unmerged. The shim is the same post-capture pipeline #3892 uses, executed from the realm we control, so it survives EC version bumps.
**AEC note (resolved-as-accepted):** WebAudio capture routing can weaken browser AEC — same tradeoff as EC's upstream feature; mitigated by keeping `echoCancellation`/`autoGainControl` on the raw capture and labeling the tier "beta".
**Model Roadmap (priority order):**
- [ ] **Verify DTLN** (16 kHz narrowband fix) in a real call before investing further — wired but unverified.
- [ ] **DeepFilterNet 3** — best self-hostable upgrade: Rust→WASM, CPU real-time, 48 kHz fullband. Effort: self-host `df_bg.wasm` + DFN3 ONNX model, wire a 48 kHz worklet.
- [ ] **Desktop-only / HW-gated:** FRCRN or NVIDIA Maxine (RTX/Tensor only) — impossible in-browser; would run in Tauri Rust backend + bridge a virtual mic into the webview. Must detect capability and only offer on supported hardware; web falls back to RNNoise.
- **Excluded:** Krisp (LiveKit Cloud only); FRCRN/Maxine on web (GPU/server-bound).
**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.
**What:** Let users (or room admins via room settings) adjust audio bitrates (e.g., 64kbps to 512kbps) and screenshare quality (resolution: 720p/1080p/Source, framerate: 15/30/60fps).
**Note:** Requires tight integration with the LiveKit SFU and custom state events for per-room quality caps.
**[AUDIT REQUIRED]** Must verify if current `lk-jwt-service` can be extended with custom bitrate/resolution claims or if a new sidecar (similar to `voice-limit-guard`) is needed for server-side enforcement.
**What:** Clicking a system tray notification navigates to the relevant room. Quick-reply from the notification toast would send the reply without opening the window.
**Status:** Deferred — `tauri-plugin-notification` has no Rust click/action callback API. Quick-reply would need a custom WinRT toast activator + COM registration, which can't be compile-tested without a Windows build environment.
**Note:** Tray icon and `matrix:` deep links already bring the window forward on most interactions. Revisit when tauri-plugin-notification gains click handler support upstream.
**Complexity:** High (platform-specific native code required).
---
### [ ] P5-36 · Desktop — Windows Jump List (DEFERRED)
**What:** Right-clicking the taskbar icon shows a jump list with recent/favorite rooms for quick navigation.
**Status:** Deferred — implementing the Windows COM jump list API in Tauri requires iterating on C++/COM code that can only be compile-checked on Windows, making blind CI iteration impractical.
**Action when unblocked:** Revisit when a Tauri plugin abstracts the Windows Shell `ICustomDestinationList` interface, or when a Windows build environment is available for local iteration.
**What:** Automatically check for app updates on launch and periodically during long sessions. If an update is available, show an in-app toast or badge (e.g., on the Settings icon) to alert the user without requiring a manual check in settings.
**Mechanism:** Use the `useTauriUpdater` hook in a global component like `ClientNonUIFeatures.tsx`.
**Note:** Ensure the check is throttled (e.g., once every 12 hours) to avoid redundant Tauri commands.
**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.
**What:** Replace emulated notifications with native WinRT Toast notifications.
**Approach:** Implement native WinRT Toast integration using `windows-rs` to enable full Action Center integration, including native Quick Reply functionality.
**What:** Maintain light connection to homeserver when WebView2 is suspended.
**Approach:** Implement a headless Rust sidecar to fetch unread counts/notifications while the webview is suspended to ensure instant notification delivery.
### [ ] P5-43 · Desktop — System Media Transport Controls (SMTC)
**What:** Integrate with Windows SMTC for volume flyout call/media control.
**Approach:** Use Windows SMTC API to expose call status, mic mute/unmute, and media controls to the Windows volume flyout/media overlay.
**What:** Proactively detect Windows network connectivity changes.
**Approach:** Integrate with the Windows Network Connectivity Status Indicator (NCSI) API to improve offline mode transition latency and network recovery.
### [ ] P5-50 · Desktop — Windows Hardware-Accelerated Media Pipeline
**What:** Replace standard browser decoding with native Windows Media Foundation.
**Approach:** Leverage DirectShow/Media Foundation to offload video/audio decoding from the CPU to the GPU, significantly reducing power consumption and latency during calls.
**What:** Compartmentalize sessions, local databases, and caches into isolated "Contexts."
**Approach:** Implement a zero-leak boundary for personas (e.g., Work vs. Personal) by isolating `IndexedDB`, filesystem caches, and session persistence per context.
**What:** Granular sync tuning for individual rooms.
**Approach:** Allow per-room overrides for sync frequency and event type filtering (e.g., disable read receipts/typing in heavy rooms) to optimize performance. Implementation requires careful UX to prevent complexity fatigue.
**What:** A sandboxed environment for local execution of user scripts on Matrix events.
**Approach:** Implement a WASM-based execution engine that allows users to write local-only, client-side scripts to interact with incoming Matrix events, trigger sounds/notifications, or inject custom UI elements based on event payload rules. Designed for privacy — all logic runs exclusively on the local machine.
**What:** Allow users to reorder toolbar icons via drag-and-drop.
**Approach:** Extend the current settings-based toolbar toggle system to include a drag-and-drop UI mode in the composer settings, allowing users to personalize their icon order.
**What:** Automatically toggle notification state based on Windows Focus Assist.
**Approach:** Integrate with the Windows `NotificationCenter` / `Focus` state via Tauri/Rust to automatically enable/disable Lotus Chat's internal notification suppression mode when Windows Focus Assist is toggled.
- [ ] **Mobile Audit:** Comprehensive audit of all features in LOTUS_FEATURES.md for mobile PWA usability and layout responsiveness.
- [x] **Remind Me Later:** Slack-style reminders for messages — fully implemented ⚠️ UNTESTED end-to-end
- **Storage:**`useReminders.ts` — persists to `io.lotus.reminders` account data with `addReminder` / `removeReminder` / `getReminders`
- **UI:**`RemindMeDialog.tsx` — 4 presets (20 min, 1 hr, 3 hr, tomorrow 9am); wired into `Message.tsx` context menu via `remindOpen` state; `useModalStyle(320)` for mobile fullscreen
- **Monitor:**`ReminderMonitor` in `ClientNonUIFeatures.tsx` — polls every 30s + on tab visibility; fires Lotus toast when due and calls `removeReminder`
- [x] **Mobile Bookmarks:** Fixed ⚠️ UNTESTED — bookmarks now accessible from within any room on mobile
- **Root Cause:**`BookmarksPanel` renders correctly on mobile but `BookmarksTab` lives in `SidebarNav`, which is hidden when inside a room on mobile (`MobileFriendlyClientNav` returns `null`). No trigger existed.
- **Fix:** Added "Saved Messages" `MenuItem` to the `RoomMenu` (···More Options) in `RoomViewHeader.tsx`. Toggles `bookmarksPanelAtom` and closes the menu. Works on all screen sizes — desktop users see it as a duplicate of the sidebar star, mobile users now have their only in-room access point.
---
@@ -368,9 +484,9 @@ Check back after each Synapse upgrade — re-run `/matrix/client/versions` and `
### [BLOCKED] · Room Preview Before Joining (MSC3266)
**Blocked by:** `GET /v1/rooms/{id}/summary` returns 404 — endpoint not available on this server
**Blocked by:** `GET /_matrix/client/v1/rooms/{roomId}/summary` returns `M_UNRECOGNIZED` 404 — endpoint not implemented in Synapse 1.155. Config flag `msc3266_enabled: true` is set but has no effect; Synapse appears not to have shipped a stable implementation at the v1 path. Verified 2026-06-18.
**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.
**Action when unblocked:** Re-test after each future Synapse upgrade.
### [BLOCKED] · Thread Subscriptions (MSC4306)
@@ -378,12 +494,12 @@ Check back after each Synapse upgrade — re-run `/matrix/client/versions` and `
**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 #P3-8 Thread Panel).
### [BLOCKED] · Report User (MSC4260)
### [DONE] · 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.
**Previously blocked by:** Server spec v1.12, but `POST /_matrix/client/v3/users/{userId}/report` was confirmed **200** on 2026-06-18 (live since Synapse 1.133.0).
**What it does:** Reports a specific user to homeserver admins (separate from reporting a message).
**Note:** Report Message already exists in upstream Cinny. This adds Report User to the profile panel.
**Implemented 2026-06-18:** `ReportUserModal.tsx` added at `src/app/features/room/ReportUserModal.tsx`. Button wired into `UserRoomProfile.tsx` between UserModeration and UserDeviceSessions (hidden for own profile). Category dropdown + reason text, inline success/error feedback, auto-close 1500ms after success.
---
@@ -395,6 +511,205 @@ Research whether Matrix spec or MSC4133 (v1.16) defines a standard profile banne
---
## 📚 Implementation Reference
Exhaustive, low-level implementation details for backlog items. Follow these patterns to ensure code is "Lotus-perfect" (idiomatic, performant, and TDS-compliant).
### P3-8 · Thread Panel (Full Side Drawer)
**Architecture:** Mirror the `MembersDrawer` pattern but with a specialized timeline.
- **Component (`src/app/features/room/thread/ThreadPanel.tsx`):** Use `room.getThread(threadId)` from the SDK. Render a `Header` with a "Close" button that sets `activeThreadIdAtom` to `null`. Reuse `RoomTimeline` but pass a filtered `EventTimelineSet`. Use `thread.timelineSet` directly for the most accurate thread view.
---
### P4-4 · Math / LaTeX Rendering
**Mechanism:** KaTeX injection into the HTML parser.
- **Sanitizer (`src/app/utils/sanitize.ts`):** Allow KaTeX-specific tags and classes (e.g., `span`, `annotation`, `math`). Use a specialized allowed list for math blocks.
- **Parser (`src/app/plugins/react-custom-html-parser.tsx`):** Detect `$ ... $` and `$$ ... $$` patterns in text nodes:
```tsx
if (node.type === 'text') {
const parts = node.data.split(/(\$\$.*?\$\$|\$.*?\$)/g);
return parts.map((p) => {
if (p.startsWith('$')) return <KaTeX math={p.replace(/\$/g, '')} />;
return p;
});
}
```
- **CSS (`src/app/styles/CustomHtml.css.ts`):** Import `katex/dist/katex.min.css` only when a math block is rendered to save initial bundle size.
---
### P4-6 · OIDC / SSO Next-Gen Auth (MSC3861)
**Mechanism:** Matrix Authentication Service (MAS) Integration.
- **Architecture:** Shift from password-based `/login` to OAuth2 `authorization_code` flow.
- **Key Files:**`src/app/pages/auth/Login.tsx` and `src/app/hooks/useAuth.ts`.
- **Implementation:** Use `oidc-client-ts` or a similar lightweight OIDC library. Check for `m.authentication` in `/.well-known/matrix/client`. Redirect to the MAS authorization endpoint. Handle the callback in a new `OidcCallback` route and store the OIDC `refresh_token`.
---
### P5-1 · Custom Accent Color Picker (Non-TDS only)
- **DTLN** (@workadventure, 16 kHz) — 🟡 wired; sample-rate fix applied (was robotic at 48 kHz). **TODO: verify in a real call.** Narrowband (16 kHz) = slightly telephone-y even when correct.
**Constraints:** client-side AudioWorklet, fully self-hosted, no GPU, self-hosted SFU (no LiveKit Cloud).
**Roadmap:**
- [ ] Verify DTLN 16 kHz fix in a real call.
- [ ] **DeepFilterNet 3** — best self-hostable upgrade: Rust→WASM, CPU real-time, 48 kHz fullband. Self-host `df_bg.wasm` + DFN3 ONNX model; wire a 48 kHz worklet. Audio quality unverifiable without a real-call test.
- [ ] **Desktop-only / HW-gated:** FRCRN (Alibaba) or NVIDIA Maxine (RTX/Tensor only). Runs in Tauri Rust backend + bridges a virtual mic into the webview. Must detect capability; web + weak HW falls back to RNNoise/DTLN.
- **Backend Sidecar:** Extend `voice-limit-guard.py` (LXC 151) to fetch `io.lotus.room_quality` and inject limits into the LiveKit JWT or return them as an authorized config packet.
1. Create a `TauriUpdateFeature` component. Use `useTauriUpdater()` to get the `check` function and `status`.
2. In a `useEffect`, call `check()` on mount and then on a `setInterval` (every 12 hours).
3. When status transitions to `{ state: 'available', version: '...' }`, fire a Lotus Toast: "Lotus Chat v[version] is available!" with an "Update" button that calls `install()`.
4. Store `lastCheck` timestamp in `localStorage` to prevent redundant checks on refresh.
---
### Mobile Bookmarks Visibility Fix
**Issue:** `ClientLayout.tsx` explicitly restricts `BookmarksPanel` to `ScreenSize.Desktop` (lines 51-56).
```tsx
// ClientLayout.tsx
{
bookmarksOpen && (
<BookmarksPanel
onClose={() => setBookmarksOpen(false)}
isMobile={screenSize !== ScreenSize.Desktop}
/>
);
}
```
`BookmarksPanel.tsx` already supports the `isMobile` prop (line 127) to enable full-screen absolute positioning. No other changes required.
---
### Remind Me Later (Slack-style)
**Mechanism:** Account Data + Timer/Service Worker.
- **Storage (`src/app/hooks/useReminders.ts`):** Store in account data `io.lotus.reminders` as `Array<{ id: string, roomId: string, eventId: string, timestamp: number }>`.
- **Context Menu (`src/app/features/room/message/MessageContextMenu.tsx`):** Add "Remind me" option → opens date/time picker modal (reuse `JumpToTime.tsx` logic).
- **Trigger (foreground):**`setTimeout` in a hook inside `ReminderMonitor` in `ClientNonUIFeatures.tsx` → pushes to `toastQueueAtom` in `state/toast.ts` when due.
- **Trigger (background):** Use Service Worker — `setTimeout` in the main thread will not fire when the PWA is suspended.
---
### Mobile Usability Audit — Methodology
1. **Viewport & Touch:** All interactive elements must have at least `44px × 44px` touch targets. Audit for horizontal overflow (horizontal scrolling must be disabled).
2. **Modal Responsiveness:** All modals (Settings, Profile, etc.) MUST cover the full screen on mobile, not float as overlays.
3. **Sidebar / Panels:** On mobile, sidebar panels (Members, Bookmarks, Media) must become full-screen overlays (using a `Drawer` or `Modal` pattern) rather than side-by-side flexbox panels.
4. **Input & Composer:** Ensure the composer doesn't get obscured by the mobile keyboard. Test focus trap and blur behaviors.
---
## Implementation Notes
### ⚠️ TDS DESIGN LAW (repeated here for emphasis)
# Lotus Chat — Implementation Reference for Backlog
**Date:** June 2026
This document provides technical guidance, file paths, and architectural notes for unimplemented items in `LOTUS_TODO.md` to assist engineers during development.
---
## 🧵 Priority 3 — Higher Complexity
### P3-8 · Thread Panel (Full Side Drawer)
**⚠️ Largest Feature**
* **Objective:** Add a right-side drawer to view and reply to threads (`m.thread` relations).
* **Key Files to Reference:**
* `src/app/features/room/RoomView.tsx`: Main layout. Needs to render the new `ThreadPanel` component conditionally.
* `src/app/features/room/MembersDrawer.tsx`: Use this as a pattern for side drawers (fixed width, toggleable).
* `src/app/features/room/message/Message.tsx`: Check `isThreadedMessage` logic and the `onReplyClick(ev, true)` handler.
* **Architecture:**
* Create `activeThreadEventIdAtom` in a new state file.
* `ThreadPanel` should reuse `Timeline` components but filter for events where `m.relates_to.event_id === activeThreadEventId` and `rel_type === 'm.thread'`.
***SDK API:** Use `mx.getThread(eventId)` or the aggregations API: `GET /rooms/{roomId}/relations/{eventId}/m.thread`.
* **Note:**`RoomTimeline.tsx` currently has `handleReplyClick` (Line 978) which already supports starting threads.
---
## 🛠️ Priority 4 — Specialized Features
### P4-3 · Knock-to-join Notifications for Admins
* **Objective:** Alert admins when users are knocking and provide an easy way to approve/deny.
* **Key Files:**
* `src/app/features/room/MembersDrawer.tsx`: Already contains logic to show "Pending Requests" (Line 412).
* `src/app/hooks/useRoomsNotificationPreferences.ts`: Add logic to detect `Membership.Knock` events in joined rooms where the user has invite permissions.
* **Implementation:**
* Create a hook `usePendingKnocks(room)` that returns `room.getMembersWithMembership(Membership.Knock)`.
* Add a notification badge to the "Members" icon in the room header if knocks > 0.
### P4-4 · Math / LaTeX Rendering
* **Objective:** Render `$...$` and `$$...$$` blocks using KaTeX.
* **Key Files:**
* `src/app/utils/sanitize.ts`: **Critical.** The sanitizer currently strips many tags. You must allow specific KaTeX/MathML outputs.
* `src/app/plugins/react-custom-html-parser.ts`: Add a custom rule to detect LaTeX patterns in plain text or handle the specific HTML from the server.
* Add an optional `frameName` prop to the `UserAvatar` component.
* Since `folds` components like `AvatarImage` are restrictive, wrap the entire return value (both fallback and image paths) in a new `Box` container that applies the frame/glow effects via CSS.
### P5-21 · Custom @Mention Highlight Color
* **Objective:** Persistent background highlight for messages that mention the user.
* In `layout.css.ts`, add a `mention` variant to the `MessageBase` recipe that sets a static `backgroundColor`.
* In `Message.tsx`, pass the `isMentioned` boolean (Line 800) into the `MessageBase` component as a new prop to trigger the highlight variant.
### P5-20 · Quick Reply from Browser Notification
* **Objective:** Inline reply in OS notifications.
* **Key Files:**
* `src/sw.ts`: Handle the `notificationclick` event.
* **Implementation:**
* Check for `event.reply` in the service worker.
* Use the `accessToken` and `baseUrl` stored in the `sessions` map (already implemented in `sw.ts`) to send a Matrix message via `fetch` directly from the Service Worker.
***Crucial:** Ensure the message is sent as a relation if the notification was for a thread.
---
## 🧪 Pending Audits Guidance
### Audit-3 · Profile Banner Image
* **Task:** Check if MSC4133 or Matrix v1.16 defines a banner field.
* **Update:** Matrix spec does not currently have a stable `m.banner` field. Most clients use `org.matrix.msc4133.banner_url` (unstable).
* **Recommendation:** Use `mx.http.authedRequest` to experiment with this field on `matrix.lotusguild.org`.
@@ -49,13 +49,18 @@ The Lotus Chat logo (`lotus_chat.png`) is a derivative work based on the origina
- Your chat background shows through the call view
- Dark/light mode inside calls matches your Lotus Chat theme
- Calls are available in DMs and private groups only — no accidental mass rings
- AFK auto-mute: mic is automatically silenced after a configurable idle timeout (1–30 min); a toast confirms the action
- Voice channel user limit: admins can cap how many people can be in a room's call — enforced server-side for every Matrix client (not just Lotus Chat); others see "Channel Full" until a spot opens
- Custom join/leave sound effects when someone enters or leaves your call — choose Chime, Soft, Retro, or off
### Customization & Appearance
- LotusGuild Terminal Design System (TDS) — a CRT terminal-inspired dark theme
- TDS light mode variant for daytime use
- 20+ static chat background patterns
- 5 animated chat backgrounds: Digital Rain, Star Drift, Grid Pulse, Aurora Flow, Fireflies
- 5 animated chat backgrounds: Digital Rain, Star Drift, Grid Pulse, Aurora Flow, Fireflies (with improved per-layer looping, phosphor-flicker rain, fluid aurora sweep, and organic firefly bioluminescence)
- 11 seasonal & holiday theme overlays — Halloween, Christmas, New Year, Autumn, Valentine's Day, St. Patrick's Day, Earth Day, Lunar New Year, April Fools', Deep Space, and Retro Arcade; auto-selected by date with a manual override in Settings → Appearance
- Avatar decorations — 99 animated APNG overlays (Gaming, Cyber, Space, Fantasy, Nature, Spooky, Cozy, and more) that frame your avatar across the timeline, members list, and @mention autocomplete; visible to all Lotus Chat users; select in Settings → Account → Avatar Decoration
- Toggle to pause background animations
- Glassmorphism sidebar — frosted glass effect that lets the background show through
- Night Light / blue light filter with an adjustable intensity slider
@@ -66,10 +71,11 @@ The Lotus Chat logo (`lotus_chat.png`) is a derivative work based on the origina
### Presence & Profile
- Discord-style presence selector: Online, Idle, Do Not Disturb, Invisible, or Auto
- Custom status message with emoji and an optional auto-clear timer
- Custom status message with emoji and an optional auto-clear timer (changing your status is never silently overwritten by activity events)
- Colored presence ring on member avatars (green / yellow / red)
- Profile fields for pronouns and timezone
- When a user's timezone is set, their current local time appears in their profile
- Private notes on any user's profile — freeform text visible only to you, auto-saves and syncs across devices
- Unread count shown in the browser tab title
### Moderation & Privacy
@@ -102,7 +108,7 @@ The Lotus Chat logo (`lotus_chat.png`) is a derivative work based on the origina
- Knock-to-join: request access to a room; admins approve or deny from the members list
- Media gallery drawer: browse all images, videos, and files shared in a room
- Invite link and QR code in room settings
- Pending knock requests shown in the members list for room admins
- Pending knock requests shown in the members list for room admins with a live badge count on the Members button
- Homeserver support contact displayed in Help & About (MSC1929)
- Server notice rooms are visually distinct from regular DMs
<p>The requested URL <code>/s/jetbrainsmono/v18/tDbY2o-flEEny0FZhsfKu5WU4xD-IQ.woff2</code> was not found on this server. <ins>That’s all we know.</ins>
<p>The requested URL <code>/s/jetbrainsmono/v18/tDbY2o-flEEny0FZhsfKu5WU4xD-IQ.woff2</code> was not found on this server. <ins>That’s all we know.</ins>
<p>The requested URL <code>/s/jetbrainsmono/v18/tDbY2o-flEEny0FZhsfKu5WU4xD-IQ.woff2</code> was not found on this server. <ins>That’s all we know.</ins>
description="Set the maximum number of participants allowed in this room's voice call. Set to 0 for no limit. Enforced on the server for all Matrix clients."
?`Showing locally cached messages from this user across all rooms. Open more rooms or load history below to extend coverage.`
:localResult.groups.length>0
?`Showing locally cached messages from ${localResult.searchedRoomsCount} encrypted room${localResult.searchedRoomsCount!==1?'s':''}. Load more history below to extend coverage.`
:`No matches in your local cache. Load messages below to search further back.`}
</Text>
<Linesize="300"variant="Surface"/>
</Box>
<Textsize="T300"priority="300">
{localResult.groups.length>0
?`Showing locally cached messages from ${localResult.searchedRoomsCount} encrypted room${localResult.searchedRoomsCount!==1?'s':''}. Load more history below to extend coverage.`
:`No matches in your local cache. Load messages below to search further back.`}
Some files were not shown because too many files have changed in this diff
Show More
Reference in New Issue
Block a user
Blocking a user prevents them from interacting with repositories, such as opening or commenting on pull requests or issues. Learn more about blocking a user.