Compare commits
141
Commits
df64b9ca56
..
lotus
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
2bed70d335 | ||
|
|
c7aa4b9b19 | ||
|
|
81777ddfe1 | ||
|
|
eb4b88a028 | ||
|
|
e3883e0fce | ||
|
|
98c80f36cb | ||
|
|
ad1cbcf792 | ||
|
|
492b57c60d | ||
|
|
0c45bde832 | ||
|
|
082b8fc879 | ||
|
|
c6c2e88df5 | ||
|
|
dc0d524989 | ||
|
|
22d46a7922 | ||
|
|
be2c202543 | ||
|
|
6363939654 | ||
|
|
af244bba75 | ||
|
|
af1c0ee184 | ||
|
|
96a97a2f86 | ||
|
|
6aa77552b8 | ||
|
|
52e0cfaa83 | ||
|
|
bd8c79e0e6 | ||
|
|
4d4a76214a | ||
|
|
8d11a62e14 | ||
|
|
bf05751eca | ||
|
|
2bdb2eb4cb | ||
|
|
4fe9c87010 | ||
|
|
b69099a862 | ||
|
|
dea1f7afc0 | ||
|
|
7da91bd803 | ||
|
|
2a0c409180 | ||
|
|
9363629ea2 | ||
|
|
74d8e3119b | ||
|
|
73b1d1e3a7 | ||
|
|
ef5d06eea3 | ||
|
|
7f17940d34 | ||
|
|
f5e7fb4746 | ||
|
|
bbe91a24d8 | ||
|
|
f7d40460f5 | ||
|
|
d2f56817b3 | ||
|
|
33e16e85b3 | ||
|
|
f23b215efa | ||
|
|
821760131c | ||
|
|
edb4624796 | ||
|
|
d4420905e6 | ||
|
|
53a80adb57 | ||
|
|
e078a2cc10 | ||
|
|
c921f11521 | ||
|
|
0e2671891f | ||
|
|
6f25035341 | ||
|
|
f111b3c9af | ||
|
|
8b1c9fa610 | ||
|
|
8658ec05c3 | ||
|
|
2e7915d086 | ||
|
|
84c906fe33 | ||
|
|
464951edf4 | ||
|
|
6df160a7bf | ||
|
|
60076a48d0 | ||
|
|
a475531b2b | ||
|
|
34574178a9 | ||
|
|
070a1ea012 | ||
|
|
bbcbdad55a | ||
|
|
a9e0b893be | ||
|
|
68ce13f081 | ||
|
|
70620d4b43 | ||
|
|
4e455ae42e | ||
|
|
30fd22a5c5 | ||
|
|
da2d7a7d4f | ||
|
|
50b4e2c16c | ||
|
|
230d147ec1 | ||
|
|
9fefd14944 | ||
|
|
53823f5466 | ||
|
|
f2f498425b | ||
|
|
5fc90feef9 | ||
|
|
6460d0569c | ||
|
|
b38621861b | ||
|
|
1a8fa5cd4c | ||
|
|
2e8244dc67 | ||
|
|
e9d419f84c | ||
|
|
e0b1c50155 | ||
|
|
14b6849f6e | ||
|
|
22371f8156 | ||
|
|
58a716c734 | ||
|
|
6d63c34b2c | ||
|
|
4c671fbf3a | ||
|
|
9d84f9153a | ||
|
|
f528e5e440 | ||
|
|
d929143f7d | ||
|
|
c5082a78ef | ||
|
|
9d7875ea80 | ||
|
|
00584d7809 | ||
|
|
bd1e61e8cd | ||
|
|
1ff28820f3 | ||
|
|
5b0d355417 | ||
|
|
470b5217ae | ||
|
|
61dfdea9e9 | ||
|
|
3dead4b3e1 | ||
|
|
4cdd221eff | ||
|
|
908e735933 | ||
|
|
ceada3e113 | ||
|
|
9c1c29f4fc | ||
|
|
9e566807b3 | ||
|
|
e0861849b7 | ||
|
|
bec248b228 | ||
|
|
62595ef066 | ||
|
|
e9d07513d2 | ||
|
|
8967c13878 | ||
|
|
6578bdf949 | ||
|
|
fcca7c21fb | ||
|
|
614eb4d246 | ||
|
|
c143b30060 | ||
|
|
9a49bf4661 | ||
|
|
5794a88a96 | ||
|
|
22c6f3c1b7 | ||
|
|
61e8f080e4 | ||
|
|
cfe186efd5 | ||
|
|
02a1c44c09 | ||
|
|
e9680fe10c | ||
|
|
cff50dc104 | ||
|
|
9a02e5ce67 | ||
|
|
e046757d1b | ||
|
|
49785dbf23 | ||
|
|
3327011ea9 | ||
|
|
3f9bca3d9d | ||
|
|
c434e0dda3 | ||
|
|
33f4ba3674 | ||
|
|
90837f7230 | ||
|
|
730a748aca | ||
|
|
ce9ae93212 | ||
|
|
2193d258d0 | ||
|
|
c46fe6826c | ||
|
|
6dbbea8304 | ||
|
|
cb858da188 | ||
|
|
a9245c8f46 | ||
|
|
ba742d4f4e | ||
|
|
5e00d517eb | ||
|
|
126e3860c2 | ||
|
|
8db07e9324 | ||
|
|
b4338d1cca | ||
|
|
e00625b8f8 | ||
|
|
b0b1ac6413 | ||
|
|
6280dfa522 |
+43
-3
@@ -132,11 +132,27 @@ jobs:
|
||||
if: ${{ github.event_name == 'push' && github.ref == 'refs/heads/lotus' }}
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
# [matrix #9] Debounce: a Tauri build takes ~30 min on the shared runner,
|
||||
# so at most one bump per DEBOUNCE_MIN. Commits that land inside the
|
||||
# window are picked up by cinny-desktop's nightly catch-up workflow (or a
|
||||
# manual dispatch of it) — the desktop cadence no longer tracks every web
|
||||
# commit. The bump is also skipped when nothing changed.
|
||||
- name: Bump cinny submodule
|
||||
env:
|
||||
TOKEN: ${{ secrets.RELEASE_TOKEN }}
|
||||
DEBOUNCE_MIN: '60'
|
||||
run: |
|
||||
CINNY_SHA="${{ github.sha }}"
|
||||
LAST=$(curl -fsSL -H "Authorization: token $TOKEN" \
|
||||
"https://code.lotusguild.org/api/v1/repos/LotusGuild/cinny-desktop/commits?sha=main&limit=1&stat=false&verification=false&files=false" \
|
||||
| python3 -c 'import sys,json; c=json.load(sys.stdin); print(c[0]["commit"]["committer"]["date"] if c else "")' 2>/dev/null || true)
|
||||
if [ -n "$LAST" ]; then
|
||||
AGE=$(python3 -c "import sys,datetime; d=datetime.datetime.fromisoformat(sys.argv[1].replace('Z','+00:00')); print(int((datetime.datetime.now(datetime.timezone.utc)-d).total_seconds()//60))" "$LAST")
|
||||
if [ "$AGE" -lt "$DEBOUNCE_MIN" ]; then
|
||||
echo "Last desktop bump was ${AGE} min ago (< ${DEBOUNCE_MIN}); skipping — the nightly catch-up will pick this up."
|
||||
exit 0
|
||||
fi
|
||||
fi
|
||||
git clone "https://x-access-token:$TOKEN@code.lotusguild.org/LotusGuild/cinny-desktop.git" desktop
|
||||
cd desktop
|
||||
git config user.email "ci@lotusguild.org"
|
||||
@@ -238,8 +254,10 @@ jobs:
|
||||
# as m.room.encrypted. Skips itself unless the E2E_* secrets
|
||||
# below are set (create them under repo → Settings → Actions
|
||||
# → Secrets; they are empty until then).
|
||||
# local tier — (#220) regression suite against a Synapse this job starts
|
||||
# itself; skips itself if that homeserver isn't reachable.
|
||||
# dist/ is rebuilt in-job because actions/upload-artifact@v4 does not work
|
||||
# on this Gitea runner (LOTUS_TODO), so `needs: build` only gates on the
|
||||
# on this Gitea runner (see LOTUS_REFERENCE.md → CI/CD), so `needs: build` only gates on the
|
||||
# main job having passed, not on its artifact.
|
||||
# Hard gate: proven green on the runner in run #1880 (chromium + deps
|
||||
# install fine there). The E2EE tier self-skips without the E2E_* secrets.
|
||||
@@ -273,8 +291,11 @@ jobs:
|
||||
sleep $((attempt * 15))
|
||||
done
|
||||
|
||||
- name: Install Playwright Chromium
|
||||
run: npx playwright install --with-deps chromium
|
||||
# [Gitea #221] WebKit too — Playwright's Safari/iOS proxy for the tagged
|
||||
# subset (see playwright.config.ts projects). `--with-deps` pulls the
|
||||
# GTK/GStreamer libraries WebKit needs on the runner.
|
||||
- name: Install Playwright browsers
|
||||
run: npx playwright install --with-deps chromium webkit
|
||||
|
||||
- name: Build
|
||||
run: npm run build
|
||||
@@ -282,6 +303,21 @@ jobs:
|
||||
NODE_OPTIONS: '--max_old_space_size=6144'
|
||||
VITE_APP_VERSION: ${{ github.sha }}
|
||||
|
||||
# ── #220 — tier 3: a throwaway Synapse the job starts itself (SQLite,
|
||||
# open registration, no rate limits; scripts/dev-homeserver.sh). The
|
||||
# regression spec (e2e/local-homeserver.spec.ts) registers its own users
|
||||
# and rooms through the CS API and drives the built client against it —
|
||||
# no prod secrets involved. If the homeserver fails to come up the spec
|
||||
# skips itself and the step below still reports why.
|
||||
- name: Start local homeserver
|
||||
id: local_hs
|
||||
continue-on-error: true
|
||||
run: |
|
||||
python3 -m venv --help >/dev/null 2>&1 || { (command -v sudo >/dev/null && sudo -n true 2>/dev/null && sudo apt-get update -qq && sudo apt-get install -y -qq python3-venv) || (apt-get update -qq && apt-get install -y -qq python3-venv); }
|
||||
scripts/dev-homeserver.sh start
|
||||
python3 scripts/dev-seed.py 20 > .dev-homeserver/seed.json
|
||||
echo "E2E_LOCAL_HS=http://localhost:8008" >> "$GITHUB_ENV"
|
||||
|
||||
- name: Playwright smoke test
|
||||
run: npm run test:e2e
|
||||
env:
|
||||
@@ -289,3 +325,7 @@ jobs:
|
||||
E2E_HOMESERVER: ${{ secrets.E2E_HOMESERVER }}
|
||||
E2E_USER: ${{ secrets.E2E_USER }}
|
||||
E2E_PASSWORD: ${{ secrets.E2E_PASSWORD }}
|
||||
|
||||
- name: Stop local homeserver
|
||||
if: always()
|
||||
run: scripts/dev-homeserver.sh stop || true
|
||||
|
||||
@@ -57,7 +57,7 @@ body:
|
||||
required: true
|
||||
- type: textarea
|
||||
attributes:
|
||||
label: Environement
|
||||
label: Environment
|
||||
description: |
|
||||
Please provide information about your environment. Include the following:
|
||||
- OS:
|
||||
|
||||
@@ -0,0 +1,9 @@
|
||||
### Description
|
||||
|
||||
<!-- Please include a summary of the change. -->
|
||||
|
||||
Fixes #
|
||||
|
||||
### Checklist:
|
||||
|
||||
- [ ] I have read and understood the [Contribution policy](https://github.com/ajbura/cinny/blob/dev/CONTRIBUTING.md).
|
||||
@@ -10,3 +10,7 @@ public/decorations/
|
||||
# Playwright (npm run test:e2e)
|
||||
playwright-report/
|
||||
test-results/
|
||||
|
||||
# local dev homeserver (scripts/dev-homeserver.sh)
|
||||
.dev-homeserver/
|
||||
__pycache__/
|
||||
|
||||
+1
-2
@@ -2,5 +2,4 @@ dist
|
||||
node_modules
|
||||
package.json
|
||||
package-lock.json
|
||||
LICENSE
|
||||
README.md
|
||||
LICENSE
|
||||
+1
-1
@@ -11,7 +11,7 @@ RUN npm run build
|
||||
|
||||
|
||||
## App
|
||||
FROM nginx:1.29.8-alpine
|
||||
FROM nginx:1.31.5-alpine
|
||||
|
||||
COPY --from=builder /src/dist /app
|
||||
COPY --from=builder /src/docker-nginx.conf /etc/nginx/conf.d/default.conf
|
||||
|
||||
+60
@@ -0,0 +1,60 @@
|
||||
# Developing Cinny
|
||||
|
||||
> [!TIP]
|
||||
> We recommend using a version manager as versions change very quickly.
|
||||
> You will likely need to switch between multiple Node.js versions based
|
||||
> on the needs of different projects you're working on. [NVM-windows]
|
||||
> on Windows and [nvm] on Linux/macOS are pretty good choices. Recommended
|
||||
> nodejs version is Krypton LTS (v24.13.1).
|
||||
|
||||
[nvm-windows]: https://github.com/coreybutler/nvm-windows#installation--upgrades
|
||||
[nvm]: https://github.com/nvm-sh/nvm
|
||||
|
||||
Execute the following commands to start a development server:
|
||||
|
||||
```sh
|
||||
npm ci # Installs all dependencies
|
||||
npm start # Serve a development version
|
||||
```
|
||||
|
||||
To build the app:
|
||||
|
||||
```sh
|
||||
npm run build # Compiles the app into the dist/ directory
|
||||
```
|
||||
|
||||
To commit changes:
|
||||
|
||||
```sh
|
||||
npm run commit
|
||||
```
|
||||
|
||||
## Running with Docker
|
||||
|
||||
This repository includes a Dockerfile, which builds the application from
|
||||
source and serves it with Nginx on port 80. To use this locally, you can
|
||||
build the container like so:
|
||||
|
||||
```
|
||||
docker build -t cinny:latest .
|
||||
```
|
||||
|
||||
You can then run the container you've built with a command similar to this:
|
||||
|
||||
```
|
||||
docker run -p 8080:80 cinny:latest
|
||||
```
|
||||
|
||||
This will forward your `localhost` port 8080 to the container's port 80.
|
||||
You can visit the app in your browser by navigating to `http://localhost:8080`.
|
||||
|
||||
## Code formatting
|
||||
|
||||
We use [ESLint](https://eslint.org/) for clean and stylistically
|
||||
consistent code syntax, so make sure your pull request follow it.
|
||||
|
||||
## Helpful links
|
||||
|
||||
- [BEM methodology](http://getbem.com/introduction/)
|
||||
- [Atomic design](https://bradfrost.com/blog/post/atomic-web-design/)
|
||||
- [Matrix JavaScript SDK documentation](https://matrix-org.github.io/matrix-js-sdk/index.html)
|
||||
+43
-12
@@ -332,7 +332,7 @@ Users can set a custom background color for `@mention` chips that highlight thei
|
||||
> pre-built npm bundle. Several in-call behaviors below are now first-class
|
||||
> source changes rather than DOM/widget hacks. Background, plan, and the Phase-2
|
||||
> work list are in
|
||||
> the Element Call fork reference in [`LOTUS_TODO.md`](./LOTUS_TODO.md).
|
||||
> the Element Call fork reference in [`LOTUS_REFERENCE.md`](./LOTUS_REFERENCE.md).
|
||||
|
||||
### Element Call — Self-Built Fork (`0.20.1-lotus.1`)
|
||||
|
||||
@@ -349,15 +349,16 @@ so a stock EC config is byte-for-byte upstream behavior.
|
||||
|
||||
**Active (cinny drives them today):**
|
||||
|
||||
| # | Feature | Mechanism | Replaces (old hack) |
|
||||
| --- | --------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------- |
|
||||
| A7 | **Denoise in-source** | ML noise suppression runs inside EC as a LiveKit `TrackProcessor<Audio>` (flag `lotusDenoiseSource=1`); re-applied on every (re)publish | the build-time `getUserMedia` monkeypatch injected into `index.html` — **removed**. Fixes mic-dead-after-reconnect. |
|
||||
| #2 | **Speaking / mute events** | EC emits `io.lotus.call_state` (throttled); cinny reads speaker + mute state from it (flag `lotusCallState=1`) | scraping EC's DOM for `[data-lk-speaking]` (kept only as fallback) |
|
||||
| A5 | **Focus participant** | host sends `io.lotus.focus_participant` to pin a tile, coexisting with / overriding the screenshare spotlight | the `.click()`-the-tile DOM hack in `CallControl.ts` — **removed** |
|
||||
| #6 | **In-call avatar decorations** | host pushes `io.lotus.decorations` (per-user APNG URLs); the fork renders them on EC's video-tile avatars | previously impossible — decorations only showed on our pre-join lobby roster |
|
||||
| #5 | **Native transparent background** | flag `lotusTransparent=1` makes EC's surface transparent so the host wallpaper shows through | the injected `background:none !important` CSS |
|
||||
| # | Feature | Mechanism | Replaces (old hack) |
|
||||
| ---- | ----------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
||||
| A7 | **Denoise in-source** | ML noise suppression runs inside EC as a LiveKit `TrackProcessor<Audio>` (flag `lotusDenoiseSource=1`); re-applied on every (re)publish | the build-time `getUserMedia` monkeypatch injected into `index.html` — **removed**. Fixes mic-dead-after-reconnect. |
|
||||
| #2 | **Speaking / mute events** | EC emits `io.lotus.call_state` (throttled); cinny reads speaker + mute state from it (flag `lotusCallState=1`) | scraping EC's DOM for `[data-lk-speaking]` (kept only as fallback) |
|
||||
| A5 | **Focus participant** | host sends `io.lotus.focus_participant` to pin a tile, coexisting with / overriding the screenshare spotlight | the `.click()`-the-tile DOM hack in `CallControl.ts` — **removed** |
|
||||
| #6 | **In-call avatar decorations** | host pushes `io.lotus.decorations` (per-user APNG URLs); the fork renders them on EC's video-tile avatars | previously impossible — decorations only showed on our pre-join lobby roster |
|
||||
| #5 | **Native transparent background** | flag `lotusTransparent=1` makes EC's surface transparent so the host wallpaper shows through | the injected `background:none !important` CSS |
|
||||
| P6-2 | **Deafen / screenshare-audio mute** | host sends `io.lotus.set_deafen {deafened, screenshareAudioMuted}`; both become the `muted` prop of EC's audio elements (server stops sending), so they hold across re-renders, late joiners and a sharer stopping + re-sharing (fixed in `0.25.0-lotus.4`) | the iframe-DOM `.muted` hack (kept only as a transitional fallback) and `setVolume(0, ScreenShareAudio)`, which EC's own volume controls reset on every new share |
|
||||
|
||||
**Now wired (cinny drives them — ⚠️ awaiting live verification):**
|
||||
**Now wired (cinny drives them — verified end-to-end on the local calls stack, 2026-09-18):**
|
||||
|
||||
| # | Capability | Widget action | cinny surface |
|
||||
| ----- | -------------------- | ------------------------------------------------------------------------------------ | ------------------------------------------------------------------- |
|
||||
@@ -365,7 +366,9 @@ so a stock EC config is byte-for-byte upstream behavior.
|
||||
| P5-31 | **Quality controls** | `io.lotus.set_quality` — sets audio/screenshare encoding bitrate/framerate | Call Quality Controls (user settings + room-admin caps) — see below |
|
||||
|
||||
> Both were dormant capabilities; cinny now drives them (armed via
|
||||
> `lotusAudioInject=1`). The **only** EC item still open is the P5-31
|
||||
> `lotusAudioInject=1`). Verified headless with two clients: a clip publishes as
|
||||
> an extra `AUDIO/UNKNOWN` track on the SFU and is refused while muted; a room
|
||||
> cap set mid-call re-sends `io.lotus.set_quality` with the clamped values. The **only** EC item still open is the P5-31
|
||||
> **server-side** quality guard (a `voice-limit-guard`-style sidecar reading
|
||||
> `io.lotus.room_quality`) for hard enforcement across all Matrix clients — the
|
||||
> client cap is best-effort.
|
||||
@@ -1171,6 +1174,30 @@ Persists via the `homeRoomSort` setting.
|
||||
|
||||
A toggle in **Settings → Privacy** switches between sending `m.read` (public receipts) and `m.read.private` (private receipts visible only to the sender and the server).
|
||||
|
||||
### Tracking-Parameter Stripping (Gitea #103)
|
||||
|
||||
Links you paste, send, edit, or merely _see_ lose ad/analytics identifiers — `utm_*`, `fbclid`, `gclid`, YouTube `si=`, Amazon `ref=`/`tag=`, X `s=`/`t=`, TikTok `_r`/`_t`, and ~40 more, plus host-scoped rules so e.g. `si` is only removed on YouTube/Spotify. Runs entirely on the device (`src/app/utils/urlTracking.ts`, unit-tested). Wired at paste (re-inserted through Slate so multi-line pastes still split into paragraphs), at send/schedule/edit on both `body` and `formatted_body`, and at render (linkify + explicit `<a href>` in formatted HTML), so links from other clients are cleaned locally too. `matrix.to` and non-http(s) schemes are never touched; Amazon's `th`/`psc` variant selectors are kept. Toggle in **Settings → Privacy → Strip Tracking Parameters from Links** (default on).
|
||||
|
||||
### Settings Sync Across Devices (Gitea #104)
|
||||
|
||||
The syncable subset of Lotus settings (theme, composer toolbar order, notification/quiet-hour preferences, call keys, privacy toggles, …) is mirrored to the `io.lotus.settings` account-data event on the user's own homeserver and applied on every other device. Device-bound keys stay local (`DEVICE_LOCAL_KEYS` in `src/app/utils/settingsSync.ts`: page zoom, media auto-load, animation pause, glassmorphism, noise-suppression tier/model, bitrates, volumes, notification permission, developer tools, PTT mode, camera-on-join, drawer state). Conflicts are last-write-wins on an `updatedAt` stamp forced monotonic per device; a per-account `lastSyncedAt` marker in localStorage stops a device from echoing a snapshot it just applied. **Settings → General → Sync** has the toggle (itself device-local), **Push now** (make this device win everywhere) and **Clear synced copy**. Hook: `src/app/hooks/useSettingsSync.ts`, mounted from `ClientNonUIFeatures`.
|
||||
|
||||
### Push to Deafen: off switch + typing-safe
|
||||
|
||||
**Settings → Calls → Push to Deafen** now has a switch (off = no key toggles deafen; the call-bar headphone button remains). Root cause of the "I went deaf while typing" reports: Cinny's type-anywhere-to-focus-the-composer and the deafen key both listen on `window`, so with the default `M` the first letter of a message typed after clicking the timeline toggled deafen and was swallowed (`mom` → `om`). Rules now: a typable key (letter/digit/Space/…) only toggles deafen in the call view — on any screen with a composer, typing wins; and such keys are never bound system-wide on desktop (`isSafeGlobalToggleKey`: F-keys, numpad, lock/navigation cluster qualify), so the letter `m` typed in Discord or a game can't deafen you either. The tile explains this and suggests an F-key/Numpad key for an everywhere binding.
|
||||
|
||||
### Forwarded messages show their provenance
|
||||
|
||||
A forwarded message used to arrive as if the forwarder had written it. `buildForwardContent` now stamps `io.lotus.forwarded` (`sender`, `origin_server_ts`, `room_id`, `event_id`; forwarding a forward keeps the _original_ stamp) and the timeline (main + threads) renders a reply-style line above the message — **↪ Forwarded from bob in Other Room · 9:05 PM** — which is a button that jumps to the original when you are in the source room; if you are not, it shows only the sender and time (the source room's name is deliberately not shared). Other Matrix clients ignore the key and see the plain content. Component: `src/app/components/message/ForwardedHeader.tsx`.
|
||||
|
||||
### Copy Lotus Link — direct permalinks (Gitea #130)
|
||||
|
||||
`matrix.to` cannot be pointed at this deployment (its Cinny adapter is hard-coded to `app.cinny.in`; `web-instance[]` only works for Element), so every **Copy Link** (message ⋯ menu, space header menu, sidebar space-tab menu) has a **Copy Lotus Link** beside it that yields `https://chat.lotusguild.org/home/<room>/<event>?viaServers=…` (spaces: `/<space>/`). Helpers in `src/app/plugins/lotus-permalink.ts` (unit-tested). Lotus links pasted into a room render and click like matrix.to links (`toMatrixToHref` in the HTML parser rewrites them into the existing mention pipeline). Supporting fixes: `/home/<room>` for a room you are already in but that lives under a space or in Direct now redirects to its own route instead of a preview card (this is also the form matrix.to → "Continue in Cinny" produces); `?via=a,b` is accepted as an alias of `?viaServers=` (the matrix.to Cinny adapter emits `via`); and a deep link opened while logged out is honoured after an **OIDC/SSO** login too — the OIDC callback reloads at the app root, which previously discarded the stored path (`takeAfterLoginPath` is now consumed by the index route as well as the password flow). matrix.to stays the default, interoperable link and the Share Room QR is unchanged.
|
||||
|
||||
### PWA App-Icon Badge (Gitea #154)
|
||||
|
||||
When Lotus Chat is installed as a PWA (Android Chrome, desktop Chrome/Edge), the app icon carries a numeric badge via the Badging API (`navigator.setAppBadge`). The number is the same highlight count (mentions/DMs, leaf rooms only) that the tab title shows, so the two can never disagree; it clears when the count reaches zero. Lives in `FaviconUpdater` (`ClientNonUIFeatures.tsx`) next to the title/favicon logic. No-op in a plain browser tab (the API is absent) and under Tauri, where the native `set_badge_count` already owns the badge.
|
||||
|
||||
### Media Gallery
|
||||
|
||||
`MediaGallery.tsx` — a right-side drawer for browsing room media.
|
||||
@@ -1181,7 +1208,7 @@ A toggle in **Settings → Privacy** switches between sending `m.read` (public r
|
||||
- **Files** — name/size/sender rows with download
|
||||
- **Jump to message** — a "Go to message" action on file rows, audio rows, and in the lightbox navigates the timeline to the source event (`useRoomNavigate`) and closes the drawer
|
||||
- Encrypted media is decrypted client-side on demand (no lock placeholder); download works for all types
|
||||
- **Auto-pagination** — an `IntersectionObserver` sentinel calls `mx.paginateEventTimeline()` to pull older media as you scroll (manual retry on error)
|
||||
- **Auto-pagination** — an `IntersectionObserver` sentinel pulls older media as you scroll (manual retry on error). Since Gitea #163 this pages through the gallery's **own timeline set** (`useRoomMediaTimeline` → `utils/detachedTimeline.ts`), never the room's live timeline: unencrypted rooms use a server-side `contains_url` filter (a page is 100 media events, not 100 events), encrypted rooms page raw history into a private set and filter after decrypting. The message list behind the drawer no longer jumps into the past; the Activity log and history Export use the same helper.
|
||||
|
||||
### Knock-to-Join
|
||||
|
||||
@@ -1405,7 +1432,7 @@ The session persists as ONE atomic `cinny_session_v1` JSON write (previously ~10
|
||||
|
||||
### Crypto Diagnostics (E2EE investigation kit)
|
||||
|
||||
**Settings → Developer Tools → Crypto Diagnostics**: a capture-only ring buffer (max 200) hooks `console.warn/error` for E2EE failure signatures (OTK upload conflicts, missing call media keys, decryption errors, delayed-event timeouts) and downloads a JSON report — the evidence input for the KE-1→4 investigation. Companion diagnosis: the Encryption / E2EE section of [`LOTUS_TODO.md`](./LOTUS_TODO.md). `utils/cryptoDiagLog.ts`, `features/settings/developer/CryptoDiagnostics.tsx`.
|
||||
**Settings → Developer Tools → Crypto Diagnostics**: a capture-only ring buffer (max 200) hooks `console.warn/error` for E2EE failure signatures (OTK upload conflicts, missing call media keys, decryption errors, delayed-event timeouts) and downloads a JSON report — the evidence input for the KE-1→4 investigation. Companion diagnosis: the Encryption / E2EE section of [`LOTUS_REFERENCE.md`](./LOTUS_REFERENCE.md). `utils/cryptoDiagLog.ts`, `features/settings/developer/CryptoDiagnostics.tsx`.
|
||||
|
||||
---
|
||||
|
||||
@@ -1470,6 +1497,10 @@ Rounds out the native app beyond Windows (macOS out of scope):
|
||||
- **Launch on login** — `tauri-plugin-autostart` + a **Settings → General "Launch on login"** toggle (desktop-only).
|
||||
- **Tray "Do Not Disturb"** — a tray checkbox that silences Lotus notifications (feeds `manualDndAtom` into the same quiet-gate as Focus Assist). `useTauriDnd`.
|
||||
|
||||
### System-Wide Voice Hotkeys (cinny-desktop #2)
|
||||
|
||||
Push to Talk and Push to Deafen keep working while a game or any other app has focus. The desktop does **not** register a global shortcut (that would swallow the key from every app — a bare `Space` PTT would stop other apps typing spaces); instead, only while a call is joined, a native thread polls `GetAsyncKeyState` for the two configured keys every ~8 ms and emits a `lotus-global-hotkey` DOM event on each press/release transition (`src-tauri/src/native/hotkeys.rs`). `useCallHotkeys` ignores those events while the Lotus window itself has focus (the DOM handlers own that case with their editable-field checks), so nothing double-fires. Windows only — Linux/Wayland has no non-consuming path; `global_hotkeys_supported` reports it and the toggle is hidden outside Tauri. Toggle: **Settings → Calls → Hotkeys Work Outside the Window** (device-local, default on).
|
||||
|
||||
### Custom Window Chrome (P5-47)
|
||||
|
||||
Opt-in (Settings → General → **Custom Window Chrome**): replaces the OS title bar with a TDS-styled titlebar (min / max / close + drag region), runtime-reversible via `set_decorations`. `features/desktop/TitleBar.tsx` + `useTauriWindowChrome` ↔ `native/chrome.rs`.
|
||||
|
||||
@@ -0,0 +1,115 @@
|
||||
# Lotus Chat — Engineering Reference
|
||||
|
||||
**Repo:** `lotus` branch at `https://code.lotusguild.org/LotusGuild/cinny`
|
||||
**Deploy:** push to `lotus` → CI → auto-deploy to `chat.lotusguild.org` (~11 min)
|
||||
|
||||
> **There is no backlog in this file.** All open work lives in Gitea issues — [cinny](https://code.lotusguild.org/LotusGuild/cinny/issues), [element-call](https://code.lotusguild.org/LotusGuild/element-call/issues), [cinny-desktop](https://code.lotusguild.org/LotusGuild/cinny-desktop/issues), [matrix](https://code.lotusguild.org/LotusGuild/matrix/issues) (infra/CI) — grouped by milestone (`Features 2026-Q4`, `Desktop 2026-Q4`, `Manual QA backlog`, `Desktop QA backlog`, the `Audit 2026-09 · *` set). Shipped features are documented in [LOTUS_FEATURES.md](./LOTUS_FEATURES.md); how to run the automated tests is in [LOTUS_TESTING.md](./LOTUS_TESTING.md). The former `LOTUS_TODO.md` backlog was migrated to issues on 2026-09-17 (full history in git).
|
||||
|
||||
This file keeps only what a contributor needs to have open while working: the two design laws, decisions already made, what the server blocks, and the operational reference.
|
||||
|
||||
---
|
||||
|
||||
## ⚠️ TDS DESIGN LAW — READ BEFORE TOUCHING ANY UI
|
||||
|
||||
> **ALL Lotus Terminal Design System (TDS) styling — colors, animations, glows, borders, fonts, spacing — MUST come exclusively from `/root/code/web_template/base.css` CSS variables.**
|
||||
> Do NOT hardcode hex values. Do NOT invent new variable names. Canonical tokens: `--lt-accent-orange`, `--lt-accent-cyan`, `--lt-accent-green`, `--lt-glow-*`, `--lt-box-glow-*`, `--lt-border-color`, `--lt-font-mono`. Syntax-highlight token classes: `.tok-kw .tok-str .tok-num .tok-cmt .tok-fn`.
|
||||
> Reference patterns: `/root/code/tinker_tickets/` (markdown.js, base.js, ticket.css). Applies to every task without exception.
|
||||
> New components must respect both TDS dark (`LotusTerminalTheme`) and TDS light (`LotusTerminalLightTheme`); non-TDS theme work uses vanilla-extract (match `src/lotus-terminal.css.ts`).
|
||||
|
||||
## 🧩 NATIVE-CINNY LAW — EVERY FEATURE MUST FEEL LIKE STOCK CINNY
|
||||
|
||||
> **Every feature must feel native to upstream Cinny — indistinguishable from what the Cinny team would ship.** Reference: <https://github.com/cinnyapp/cinny>.
|
||||
>
|
||||
> - **Use the `folds` design system, not bespoke UI** (`Button`, `Chip`, `IconButton`, `Menu`, `MenuItem`, `Dialog`, `Modal`, `Input`, `Switch`, `Badge`, `SettingTile`, `SequenceCard`, …) and folds tokens (`color.*`, `config.space.*`, `config.radii.*`). **Use folds `Icon`/`Icons`, never literal emoji, in UI chrome.** No hardcoded hex/`rgba()`, no invented CSS variables.
|
||||
> - **Match Cinny's existing patterns** — find the closest existing component/flow and mirror it before adding UI.
|
||||
> - **The ONE exception:** explicit **TDS** features, which follow the TDS Design Law above (opt-in, only in Lotus Terminal mode).
|
||||
|
||||
---
|
||||
|
||||
## Deferred / dropped (decided — kept for context)
|
||||
|
||||
- **[DEFERRED] P5-51** Federated "Identity Contexts" (session isolation) — multi-sprint, touches auth/crypto/storage core; smaller intermediate step = plain multi-account switch. **[DROPPED] P5-52** per-room sync governor — js-sdk can't truly per-room filter `/sync`; only a cosmetic hide. **[DEFERRED] P5-53** local scripting plugin — prefer a declarative automation-rules feature (no arbitrary code). **[DEFERRED] Audit-3** profile banner — MSC4427 open/unmerged; revisit on merge. **[WON'T FIX] P5-50** Windows HW media pipeline (WebRTC decode lives in WebView2; not injectable). **[MOVED] P5-9** LFG → LotusBot `!lfg`.
|
||||
|
||||
---
|
||||
|
||||
## 🚫 Blocked Features (server / upstream gated)
|
||||
|
||||
Re-run `/_matrix/client/versions` + `unstable_features` after each Synapse upgrade. **Re-checked on 1.157.1 (2026-07-23): no change — all four below are still `false`.** The 1.156.0→1.157.1 delta unblocked nothing (it's a bugfix release; the only feature-bearing release in the gap was 1.156.0, which we were already running).
|
||||
|
||||
- **[BLOCKED] Live Location Sharing** (MSC3489 + MSC3672 both `false`) — real-time GPS beacons over the existing static share.
|
||||
- **[BLOCKED] Reaction/Relation Redaction** (MSC3892 `false`) — remove a reaction without redacting the parent; current full-redaction fallback is acceptable.
|
||||
- **[DONE 2026-07] Room Preview before joining** (MSC3266) — the client was always built (`JoinBeforeNavigate` → `RoomCard` via `mx.getRoomSummary`). The earlier "blocked" flag was a **misdiagnosis**: it tested `/v1/rooms/{id}/summary` (404), but the SDK calls the _unstable_ `im.nheko.summary/summary/{id}` path, which returns **200** with name/topic/members/join_rule. Verified live after the 1.156 upgrade; also added a join-rule/encryption chip + Request-to-join for knock rooms to the preview card.
|
||||
- **[BLOCKED] Thread Subscriptions** (MSC4306 `false`) — "Follow thread" button (depends on the shipped Thread Panel).
|
||||
|
||||
---
|
||||
|
||||
## 📖 Reference
|
||||
|
||||
### Server Capabilities (as of 2026-07)
|
||||
|
||||
- **Homeserver** `matrix.lotusguild.org` · **Synapse** `1.157.1+trixie1` (upgraded 2026-07-23 from **1.156.0** — note the host was found on 1.156.0 while the docs claimed 1.155.0, so **always verify with `dpkg-query -W matrix-synapse-py3`**, don't trust the docs; apt package on Debian 13, LXC 151) · **Matrix spec** up to `v1.12` (Synapse still advertises v1.12; MSC features via `unstable_features`).
|
||||
- **MSC ON** (re-dumped live from `/_matrix/client/versions` on 1.157.1): `msc4140` · `msc3771` · `msc3440.stable` · `msc4133.stable` · `simplified_msc3575` · `msc4222` · `msc3266` (room summary live at unstable `im.nheko.summary/summary/{id}` — 200; the `/v1/rooms/{id}/summary` path is still 404) · `msc3401_matrix_rtc` · `msc2285.stable` · `msc3827.stable` · `msc3981` · `msc4380.stable` · `msc4445` · `msc2659.stable` · `msc2666` · `msc2432` · `e2e_cross_signing` · `label_based_filtering`. **OFF/blocked:** `msc4306` · `msc3882` · `msc3912` · `msc4155` · `msc3489`/`msc3672` · `msc3892` · `msc4028` · `msc4069` · `msc4108` · `msc3391` · `msc4354` (sticky events — **deliberately off**, see the Matrix 2.0 section above) · `msc4143` (RTC foci — **not a gap**: LiveKit is discovered via `.well-known` `org.matrix.msc4143.rtc_foci`, confirmed live, not this flag).
|
||||
- **Dead client code:** Synapse 1.157.0 **removed** `msc3861` (MAS auth delegation) entirely — the ~6 `msc3861`/`msc2965` references in `src/` can never activate against this homeserver (we auth via Authelia `oidc_providers`). Harmless, but cleanup material.
|
||||
- **Live endpoints:** Report User (MSC4260) **200** ✅ · Report Room (MSC4151) ✅.
|
||||
- **Homeserver access (audits):** Synapse = LXC 151 (`pct exec 151 -- bash`), config `/etc/matrix-synapse/homeserver.yaml`. Web deploy = LXC 106. Voice guard = `voice-limit-guard.py` on LXC 151.
|
||||
- **SDK notes:** no arbitrary profile-field methods (use `mx.http.authedRequest()` for MSC4133); js-sdk can't per-room filter `/sync`; sanitizer strips `<math>`/MathML; SW exists at `src/sw.ts`; `getMatrixToRoom()` builds invite URLs; EC audio-inject unblocked via the fork's `io.lotus.inject_audio`.
|
||||
|
||||
### Key File Reference
|
||||
|
||||
| What | File | Lines |
|
||||
| ------------------------------ | ------------------------------------------------------------------- | ------------------- |
|
||||
| Global keydown / room nav | `hooks/useKeyDown.ts` · `hooks/useRoomNavigate.ts` | whole / 19-72 |
|
||||
| Room unread counts atom | `state/room/roomToUnread.ts` | `roomToUnreadAtom` |
|
||||
| Overlay portal provider | `pages/App.tsx` · `index.html` | 65 / 101 |
|
||||
| Room settings tabs | `features/room-settings/RoomSettings.tsx` | 27-56 |
|
||||
| State event read/write pattern | `features/common-settings/general/RoomEncryption.tsx` | 42-52 |
|
||||
| Power levels | `hooks/usePowerLevels.ts` | whole |
|
||||
| Slash commands | `hooks/useCommands.ts` | 140-537 |
|
||||
| Chat background picker/defs | `features/settings/general/General.tsx` · `lotus/chatBackground.ts` | 945-981 / whole |
|
||||
| Matrix.to URL builder | `plugins/matrix-to.ts` | `getMatrixToRoom()` |
|
||||
| Media URL conversion | `utils/matrix.ts` | `mxcUrlToHttp()` |
|
||||
| Search pagination / virtual | `features/message-search/{useMessageSearch,MessageSearch}.tsx` | 74-121 / 234-365 |
|
||||
| Call mic control | `plugins/call/CallControl.ts` | 206-212 |
|
||||
| Knock support check | `utils/matrix.ts` | 376-391 |
|
||||
| Notification mute push rules | `hooks/useRoomsNotificationPreferences.ts` | 110-150 |
|
||||
|
||||
### Element Call fork — operational reference
|
||||
|
||||
Fork = `LotusGuild/element-call` (branch `lotus`, upstream base **v0.25.0** since the 2026-09 sync — was v0.20.1); cinny consumes the npm package `@lotusguild/element-call-embedded` (built bundle copied into `public/element-call/`).
|
||||
|
||||
**Toolchain (upstream-driven, accepted 2026-09):** Node ≥ 22.13 (`.node-version` = 24) and **pnpm 11**, installed directly (`npm i -g pnpm@<packageManager version>`, currently 11.21.0) — **not** via `corepack enable`: `matrix-js-sdk` is a git dependency pnpm builds from source, and its own devEngines pins pnpm 11.9.0; a corepack-shimmed pnpm refuses to switch for that nested install and `pnpm install` fails (fork CI run #1854). pnpm 10 rejects the lockfile and Node 20 cannot build. Lint is **oxlint + oxfmt** (upstream dropped eslint/prettier in v0.25.0): `pnpm lint` (tsc + oxlint + knip) and `pnpm format:check` / `pnpm format`. `matrix-js-sdk` is pinned to a `matrix-org/matrix-js-sdk#develop` commit in the lockfile, as upstream ships it. Fork CI (`.gitea/workflows/ci.yml`) hard-gates lint + format + `pnpm test:unit` before build, with `concurrency: cancel-in-progress`.
|
||||
|
||||
**Publish a new version (CI on tag push; needs the `NPM_PUBLISH_TOKEN` org secret):** the published version is derived from the git tag — bump `embedded/web/package.json` (currently `0.25.0-lotus.11`, published by CI; the secret is `NPM_PUBLISH_TOKEN`, names starting `GITEA_` are reserved), push `lotus`, then `git push lotus v0.25.0-lotus.1`; the `publish` job builds and publishes to the Gitea registry. Always push (never delete) the annotated `vX.Y.Z-lotus.N` tag for every published version. Then in cinny bump the `@lotusguild/element-call-embedded` pin (currently `0.25.0-lotus.11`) → `npm install` → build. Manual fallback: `pnpm run build:embedded && cd embedded/web && npm version <ver> --no-git-tag-version && npm publish`.
|
||||
|
||||
**`io.lotus.*` widget actions** (add new toWidget actions to the enum + `LOTUS_TO_WIDGET_ACTIONS` in `src/lotus/lotusActions.ts`; only send AFTER call-join or a 10s timeout fires):
|
||||
|
||||
| Action | Dir | Purpose | Module |
|
||||
| :--------------------------- | :------ | :----------------------------------------------------- | :-------------------- |
|
||||
| `io.lotus.call_state` | EC→host | speaker/mute/camera stream (`lotusCallState=1`) | `lotusCallState.ts` |
|
||||
| `io.lotus.focus_participant` | host→EC | spotlight (works during screenshare) | `lotusFocus.ts` |
|
||||
| `io.lotus.inject_audio` | host→EC | soundboard clip mixed into call (`lotusAudioInject=1`) | `lotusAudioInject.ts` |
|
||||
| `io.lotus.set_quality` | host→EC | audio/screenshare bitrate/fps caps | `lotusQuality.ts` |
|
||||
| `io.lotus.decorations` | host→EC | in-call avatar decorations | `lotusDecorations.ts` |
|
||||
| `io.lotus.set_deafen` | host→EC | LiveKit-source deafen (P6-2) | `lotusDeafen.ts` |
|
||||
|
||||
Also flag-gated: `lotusTransparent`/`lotusTheme`, `lotusDenoiseSource=1` (in-source ML denoise).
|
||||
|
||||
### CI/CD + per-feature checklist
|
||||
|
||||
```
|
||||
edit → commit → git push origin lotus
|
||||
→ Gitea Actions (.gitea/workflows/ci.yml): npm ci → build + npm test + tsc + eslint + prettier (ALL hard gates) → audit + bundle-size (informational)
|
||||
→ lotus_deploy.sh on LXC 106 polls the "Build & Quality Checks" status → npm ci && npm run build → rsync → live (~11 min)
|
||||
(a push that lands while a deploy is mid-build is queued and deployed right after — matrix@b6ea4a3; before that it was dropped)
|
||||
```
|
||||
|
||||
Before marking a feature complete: `npx tsc --noEmit` (0 errors) · `npx eslint src/` (0 new) · `npx prettier --check src/` · `npm test` (Node runner via tsx, hard CI gate — colocated `*.test.ts`) · update `README.md`/`landing/index.html` for Lotus-custom features · visually verify on `chat.lotusguild.org`.
|
||||
|
||||
**CI hardening (2026-07, reviewed):**
|
||||
|
||||
- [x] **Concurrency** — `cancel-in-progress` on cinny `ci.yml` and cinny-desktop `release.yml` (`386a2979` / `c5461ce`): a superseded lotus push cancels its in-flight web CI and collapses queued ~30-min Tauri desktop builds to just the newest. Safe for deploys because `lotus_deploy.sh` now **follows origin/lotus HEAD** each poll iteration + resets to the gated SHA (`matrix` `c15a489`) — closes the latched-SHA freeze race.
|
||||
- [x] **Hard quality gates** — typecheck/eslint/prettier promoted from `continue-on-error` to blocking (tree held clean). eslint gates on errors only; `no-explicit-any` warnings stay informational.
|
||||
|
||||
**CI follow-ups (open):**
|
||||
|
||||
**CI follow-ups** are tracked in the `matrix` repo: [#8](https://code.lotusguild.org/LotusGuild/matrix/issues/8) dedicated `desktop-linux` runner, [#9](https://code.lotusguild.org/LotusGuild/matrix/issues/9) debounce the desktop trigger, [#10](https://code.lotusguild.org/LotusGuild/matrix/issues/10) verify Gitea `concurrency`. Build-once/deploy-the-artifact was considered and deferred (noted on #8).
|
||||
+27
-803
@@ -1,38 +1,33 @@
|
||||
# Lotus Chat — Manual Testing Guide
|
||||
# Lotus Chat — Testing
|
||||
|
||||
**Generated:** June 2026 · **Updated:** July 2026 (added §O — threads, per-thread notifications, math, search cache, session hardening, audit wave, desktop CSP; added the **Automated coverage map** below — logic now pinned by unit tests, so manual QA can focus on the human-only surface)
|
||||
**Scope:** Everything landed on the `lotus` branch since the v4.12.3 merge that I (Claude) could **not** verify statically and that needs a human in a real environment to confirm. Work through it top-to-bottom; the highest-risk / hardest-to-reproduce items are first.
|
||||
> **Manual QA checklists no longer live here.** Every shipped-but-unverified behaviour is a Gitea issue labelled **`qa`** — cinny milestone [Manual QA backlog](https://code.lotusguild.org/LotusGuild/cinny/milestones), cinny-desktop milestone [Desktop QA backlog](https://code.lotusguild.org/LotusGuild/cinny-desktop/milestones). Each issue carries the full steps + expected results; tick items as they pass, comment on FAIL (what you saw vs expected, browser/OS, web vs desktop, theme, console errors), close when green. Migrated from this file on 2026-09-17 (full text in git history).
|
||||
|
||||
> **How to report back:** For each numbered check, tell me **PASS** / **FAIL** (or **partial**). On any FAIL, include: what you saw vs. expected, the browser/OS (and whether web LXC 106 or the desktop/Tauri build), the theme you were on, and any **browser console** errors (F12 → Console). Screenshots help for anything visual.
|
||||
This file keeps what a contributor needs to run and extend the **automated** coverage, plus the ops tip at the bottom.
|
||||
|
||||
## Environment notes
|
||||
|
||||
- You push from your own machine; these commits are local on `lotus` until you do.
|
||||
- Test the **web** build (LXC 106 / `code.lotusguild.org`) first; re-run the **call** + **poll** sections on the **desktop (Tauri)** build too, since CSP and the EC iframe behave differently there.
|
||||
- Several call features need a **second participant** (second account on another device/browser, or a colleague). Items that need this are marked **👥 2 people**.
|
||||
- A couple of call items need a **third room/call** in parallel — marked **👥👥**.
|
||||
- Test the **web** build (`chat.lotusguild.org`, LXC 106) first; re-run call + poll items on the **desktop (Tauri)** build too, since CSP and the EC iframe behave differently there.
|
||||
- Several call checks need a **second participant** (marked **👥 2 people** in the issues); a couple need a third room/call in parallel (**👥👥**).
|
||||
|
||||
---
|
||||
|
||||
## Commits covered
|
||||
## Local dev environment — drive the real UI against a throwaway homeserver
|
||||
|
||||
| Commit | Area |
|
||||
| :--------- | :--------------------------------------------------------------------------- |
|
||||
| `caf6318a` | Poll vote buttons → folds tokens (N4) |
|
||||
| `c67aed01` | In-call incoming-call banner (#4b) |
|
||||
| `4a875884` | Selectable ringtone (#4a) |
|
||||
| `0394fce9` | EC iframe load watchdog + recovery UI; avatar decorations on call tiles (#3) |
|
||||
| `d2946c00` | Upload retry/backoff, presence-on-unload, typed m.direct |
|
||||
| `b7e1f89c` | Timeline/composer/emoji perf memoization |
|
||||
| `c0f98672` | Upstream **Element Call 0.20.1** merge (regression sweep) |
|
||||
```
|
||||
scripts/dev-homeserver.sh start # Synapse in .dev-homeserver/ (venv, SQLite), open registration, no rate limits, :8008
|
||||
python3 scripts/dev-seed.py 400 # alice + bob, "Busy Room": 400 messages, an image every 10th
|
||||
npm start # Vite on :5173
|
||||
```
|
||||
|
||||
---
|
||||
**Calls too:** `scripts/dev-homeserver.sh calls` adds a LiveKit SFU, a JWT issuer, the real `voice-limit-guard` from the `matrix` checkout and an https well-known — real two-party calls in headless Chromium with fake mic/camera (`--use-fake-device-for-media-stream`, `--use-file-for-fake-audio-capture=<tone.wav>` to trigger speaking detection, `--auto-select-desktop-capture-source="Entire screen"` for screenshare; `ignoreHTTPSErrors: true`). This is how #29, #161, #173/#174 and the guard's live-revoke bug were found and fixed on 2026-09-18.
|
||||
|
||||
Log in at `http://127.0.0.1:5173/login/http%3A%2F%2Flocalhost%3A8008/` as `alice` / `password123` (bob is the second participant; both can also be driven over the client API with their tokens). Playwright is installed (`npm run test:e2e:install`), so a scripted reproduction is `node` + `chromium.launch()` against `:5173` — this is how Gitea #163 was reproduced and its fix verified in both plain and encrypted rooms. `scripts/dev-homeserver.sh reset` wipes the database; `stop` shuts it down.
|
||||
|
||||
## Automated coverage map — what the unit tests already pin (2026-07)
|
||||
|
||||
**Read this before working the guide.** Much of the _logic_ these manual checks were written to catch is now locked by deterministic unit tests (`npm test`, 920+ cases, green in CI). Unit tests do **not** prove visual rendering, real-call behavior, the desktop build, E2EE, or cross-device sync — those still need a human. But where a decision is pure logic, you can **trust the test and spend your manual time on the human-only part**. For each row below, the middle column is "don't bother re-deriving this by hand"; the right column is "this is what your manual pass is actually for."
|
||||
**Read this before working a `qa` issue.** Much of the _logic_ the manual checks were written to catch is now locked by deterministic unit tests (`npm test`, 920+ cases, green in CI). Unit tests do **not** prove visual rendering, real-call behavior, the desktop build, E2EE, or cross-device sync — those still need a human. But where a decision is pure logic, you can **trust the test and spend your manual time on the human-only part**. For each row below, the middle column is "don't bother re-deriving this by hand"; the right column is "this is what your manual pass is actually for."
|
||||
|
||||
| Guide item | Logic **pinned by a unit test** (trust it) | What still needs **you** (manual) |
|
||||
| QA item | Logic **pinned by a unit test** (trust it) | What still needs **you** (manual) |
|
||||
| :----------------------------------------- | :------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | :------------------------------------------------------------------------------------------------------------------------- |
|
||||
| **A1** ringtone previews | `callSounds.test.ts` — each style's synthesized melody (chime/soft/retro), click-free gain ramps, context unlock/reuse, unknown = no-op | that it's actually **audible** + the WebAudio first-gesture caveat |
|
||||
| **A2** ringtone persist/fallback | `settings.test.ts` — unknown `ringtoneId` → default, malformed JSON → defaults, merge-over-defaults (this **is** A2 step 3) | the dropdown shows the persisted value after reload (trivial glance) |
|
||||
@@ -48,18 +43,23 @@
|
||||
| **Q1/Q2** embeds (URL→player) | `videoEmbed.test.ts` (26) — every provider's URL→`{provider, kind, embedUrl, height}` parse (incl. Mixcloud/Deezer, TikTok, reserved-path guards) | the click-to-play **facade**, no-network-until-Play, the **CSP** (esp. desktop), visuals |
|
||||
| **Seasonal theme resolution** (part of F2) | `seasonSchedule.test.ts` — `resolveSeasonTheme` (off→none, auto→active season, pinned→that) + `getActiveSeason` priority/boundary days. **NB: this pins _which_ theme shows for a date, NOT F2's background↔seasonal mutual exclusion** — that write-side logic is untested | all of **F2**: the picker actually clearing the _other_ setting live, and the overlay suppression when a background is set |
|
||||
|
||||
Everything else in the guide (calls, screen readers, desktop/Tauri, chat backgrounds, animated visuals, PWA install, real E2EE) is genuinely manual — no unit test substitutes for it. Items already **verified live** are listed at the very bottom ("Verified working in live testing").
|
||||
Everything else in the guide (calls, screen readers, desktop/Tauri, chat backgrounds, animated visuals, PWA install, real E2EE) is genuinely manual — no unit test substitutes for it. Items already verified live were dropped when the checklists moved to issues.
|
||||
|
||||
---
|
||||
|
||||
## Playwright smoke test (Gitea #90) — `npm run test:e2e`
|
||||
|
||||
Browser-level smoke tests under `e2e/` (config: `playwright.config.ts`). They boot the **built** `dist/` through `vite preview` on port 4173, so run `npm run build` first (one-time: `npm run test:e2e:install` downloads the pinned Chromium). Two tiers:
|
||||
Browser-level smoke tests under `e2e/` (config: `playwright.config.ts`). They boot the **built** `dist/` through `vite preview` on port 4173, so run `npm run build` first (one-time: `npm run test:e2e:install` downloads the pinned Chromium). Three tiers:
|
||||
|
||||
| Tier | File | When it runs | What it proves |
|
||||
| :------------------------ | :-------------------------- | :----------------------------------------------------------------- | :--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
||||
| **Boot** (always) | `e2e/boot.spec.ts` | every CI run (`e2e` job in `.gitea/workflows/ci.yml`) and locally | login page renders with `#root` populated and **no** `pageerror` / unexpected `console.error` (allowlist in `e2e/helpers.ts`: the README's avatar-thumbnail 404, the login page's `POST /register` 401 probe, offline discovery), `sw.js` is served and registers, bundled Element Call mounts in a frame with every `/public/element-call/` asset returning 200 |
|
||||
| **E2EE composer** (gated) | `e2e/e2ee-composer.spec.ts` | only when `E2E_HOMESERVER`, `E2E_USER`, `E2E_PASSWORD` are all set | password login → `/home/create/` with the End-to-End Encryption switch on (asserts `createRoom` carries `m.room.encryption`) → text message renders → attach a generated JPEG with "Compress image before uploading" ticked, image renders → every `PUT …/rooms/*/send/*` was `m.room.encrypted` with `ciphertext` and no plaintext `body` / `url` / `file` / `mxc://` |
|
||||
| Tier | File | When it runs | What it proves |
|
||||
| :-------------------------------- | :----------------------------- | :------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | :------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
||||
| **Boot** (always) | `e2e/boot.spec.ts` | every CI run (`e2e` job in `.gitea/workflows/ci.yml`) and locally | login page renders with `#root` populated and **no** `pageerror` / unexpected `console.error` (allowlist in `e2e/helpers.ts`: the README's avatar-thumbnail 404, the login page's `POST /register` 401 probe, offline discovery), `sw.js` is served and registers, bundled Element Call mounts in a frame with every `/public/element-call/` asset returning 200 |
|
||||
| **E2EE composer** (gated) | `e2e/e2ee-composer.spec.ts` | only when `E2E_HOMESERVER`, `E2E_USER`, `E2E_PASSWORD` are all set | password login → `/home/create/` with the End-to-End Encryption switch on (asserts `createRoom` carries `m.room.encryption`) → text message renders → attach a generated JPEG with "Compress image before uploading" ticked, image renders → every `PUT …/rooms/*/send/*` was `m.room.encrypted` with `ciphertext` and no plaintext `body` / `url` / `file` / `mxc://` |
|
||||
| **Local homeserver** (Gitea #220) | `e2e/local-homeserver.spec.ts` | when a Synapse answers at `E2E_LOCAL_HS` (default `http://localhost:8008`); the CI `e2e` job starts one with `scripts/dev-homeserver.sh start` + `dev-seed.py`, locally run the same two commands | registers its own `e2e_alice_*`/`e2e_bob_*` users and rooms over the CS API, then drives the built client: login + send/receive, own message scrolls into view (#212), `/kick` failure toast (#216), upload 413 sentence (#213), forward provenance header, thread panel + drawer at 1400 px (#218), timeline image → gallery lightbox (#219), clock-skew banner via `page.clock` (#158), status save under the presence rate limit (#226), long-press action sheet on a Pixel 7 emulation (#166). Helpers in `e2e/localHs.ts`; add a test here whenever a fix was reproduced with a scratch Playwright script |
|
||||
|
||||
**Accessibility gate** (Gitea #222): `e2e/a11y.spec.ts` runs `@axe-core/playwright` (WCAG 2.x A/AA tags) over the login page, room timeline + composer, message options menu, thread panel, user settings and room settings, and fails on any **critical/serious** finding except `color-contrast` (reported in the log, not gated — generated avatar colours and portal false positives). It also keeps accessibility-tree snapshots (`e2e/a11y.spec.ts-snapshots/*.aria.yml`) of the composer, message menu, thread panel and settings nav, so a lost name/role/live-region shows as a diff; update them deliberately with `npx playwright test e2e/a11y --update-snapshots` and keep dynamic bits as regexes. A real NVDA/VoiceOver pass is still manual.
|
||||
|
||||
**Browsers** (Gitea #221): everything runs under Chromium; the tests tagged `@webkit` (boot, login + send/receive, thread panel, lightbox) also run under Playwright's WebKit as desktop Safari, and those tagged `@ios` under the `iPhone 14` descriptor — the closest CI gets to Safari/iOS. It catches WebKit-only breakage (CSS, `dvh`, IndexedDB, media decode) but does not emulate the on-screen keyboard or Home-Screen install; a real iPhone pass (#166/#199) stays manual. Locally: `npx playwright install --with-deps webkit` once, then `npx playwright test --project=webkit --project=iphone`. WebKit words handled fetch failures as page errors (`TypeError: Load failed`, `due to access control checks`), so the allowlist in `e2e/helpers.ts` applies to page errors too.
|
||||
|
||||
**CI secrets** (Gitea → repo → Settings → Actions → Secrets; the `e2e` job forwards them via `env:`; until they exist the E2EE tier reports `skipped`, the boot tier still runs):
|
||||
|
||||
@@ -70,782 +70,6 @@ The `e2e` job is `continue-on-error: true` for now because `playwright install -
|
||||
|
||||
---
|
||||
|
||||
## A. Calls — new ringtone + notification work (highest priority)
|
||||
|
||||
### A1. Ringtone selection — preview in Settings
|
||||
|
||||
**Steps**
|
||||
|
||||
1. Open **Settings → General**, scroll to the **Calls** section.
|
||||
2. Find the new **Ringtone** dropdown (just above **Ringtone Volume**).
|
||||
3. Select each option in turn: **Classic, Chime, Soft, Retro, Silent**.
|
||||
|
||||
**Expected**
|
||||
|
||||
- Selecting **Classic** plays the existing `call.ogg` clip (cut off after a few seconds).
|
||||
- **Chime / Soft / Retro** each play a short, distinct synthesized preview.
|
||||
- **Silent** plays nothing.
|
||||
- Changing **Ringtone Volume** then re-selecting a ringtone previews at the new volume.
|
||||
- No console errors.
|
||||
|
||||
> ⚠️ **Known browser limitation:** the synthesized tones use WebAudio. If a preview is ever silent, click anywhere on the page once (a "user gesture") and retry — browsers suspend audio until the page has been interacted with. The Settings preview is _after_ a click so it should always sound; this note matters more for A3.
|
||||
|
||||
### A2. Ringtone selection persists
|
||||
|
||||
1. Set Ringtone to **Retro**, reload the app.
|
||||
2. **Expected:** the dropdown still shows **Retro** (setting persisted).
|
||||
3. Bonus: in devtools, set `localStorage.settings` to a bogus `ringtoneId` and reload → it should fall back to **Classic**, not break.
|
||||
|
||||
### A3. Incoming call uses the selected ringtone — 👥 2 people
|
||||
|
||||
**Setup:** Account A (you) and Account B in a **DM** or a **private (invite-only) group** room.
|
||||
|
||||
1. As A, pick a non-silent ringtone (e.g. **Chime**).
|
||||
2. From B, **start a call** in that DM/room. Do **not** answer on A.
|
||||
|
||||
**Expected on A**
|
||||
|
||||
- The full-screen **Incoming Call** dialog appears (caller name, room avatar, Answer / Reject).
|
||||
- The **selected ringtone loops** until you answer/reject/ignore (at the set volume).
|
||||
- Answer → joins the call. Reject (DM) / Ignore (group) → dialog dismisses and ring stops.
|
||||
- Set ringtone to **Silent** and repeat → dialog still appears, **no sound**.
|
||||
|
||||
### A4. In-call banner for a second incoming call — 👥👥 (the trickiest one)
|
||||
|
||||
**Setup:** You (A) already **in a call** in Room 1. Account B can call you in a **different** Room 2 (a DM or private group you share). Ideally a third account C, or B leaves Room 1's call first.
|
||||
|
||||
1. While A is **actively in Room 1's call**, trigger an incoming call to A from **Room 2**.
|
||||
|
||||
**Expected on A**
|
||||
|
||||
- **No** full-screen takeover. Instead a **compact banner appears in the top-right corner** with the caller's avatar, room name, "Incoming voice/video call", and **Answer / Reject (or Ignore)** buttons.
|
||||
- It plays a **single soft ping**, _not_ a looping ring (so it doesn't talk over your active call).
|
||||
- The banner does **not** cover your active call's controls/PiP in a way that blocks them.
|
||||
- **Answer** → switches you into Room 2's call. **Reject/Ignore** → banner disappears.
|
||||
- The banner auto-dismisses if the caller hangs up / the call times out.
|
||||
|
||||
**Also verify the no-op case:** while in Room 1's call, if a notification for **Room 1 itself** arrives, **nothing** should pop up (no banner, no dialog).
|
||||
|
||||
### A5. Camera focus during screenshare (#1) — 👥 2 people
|
||||
|
||||
**Setup:** You (A) and B in a call; B (or another participant) **sharing their screen**, and at least one person with **camera on**.
|
||||
|
||||
1. As A, open the **participant glance** (the stacked avatars / member list for the call) and click a participant who has their **camera on**.
|
||||
2. In the menu, click **"Focus camera"**.
|
||||
|
||||
**Expected**
|
||||
|
||||
- The view switches to **spotlight** and **pins that person's camera tile**, overriding the auto-spotlighted screenshare.
|
||||
- It **stays** on that camera (doesn't immediately snap back to the screenshare).
|
||||
- If you pick someone with their camera **off**, it should at worst just toggle spotlight (graceful fallback), not error.
|
||||
|
||||
### A6. Avatar decorations on call tiles (#3) — 👥 2 people
|
||||
|
||||
**Setup:** A participant in the call has an **avatar decoration** set (Settings → Profile decoration).
|
||||
|
||||
1. Join a call with that participant.
|
||||
2. Look at **our** participant roster / prescreen tiles (not the avatars rendered inside the Element Call video grid — those are EC's and out of scope).
|
||||
|
||||
**Expected:** the decoration ring/overlay renders around that participant's avatar on the call tile, the same way it does in member lists.
|
||||
|
||||
### A7. EC iframe load watchdog + recovery UI (#EC, N96)
|
||||
|
||||
This guards against a permanently-stuck "Loading…" call. Also covers the N96 button-label fix (the old "Retry" and "Leave" buttons were identical — now there is a single **"Back"** button).
|
||||
|
||||
1. Normal case: **join a call** → it should connect within a few seconds as usual (the watchdog stays invisible).
|
||||
2. Failure case (best-effort to reproduce): throttle your network hard (devtools → Network → Offline) **right as** you click join, or block the Element Call origin, so the iframe can't finish loading.
|
||||
|
||||
**Expected**
|
||||
|
||||
- On a genuine failure/timeout (~25s), instead of an endless spinner you get a **visible error overlay with a single "Back" button** (the old "Retry" + "Leave" pair is gone — they did the same thing and "Retry" was misleading).
|
||||
- Clicking **Back** returns you to the call prescreen, where you can manually click Join to try again.
|
||||
- Normal joins must **not** trigger the error overlay (no false positives) — this is the important part to confirm.
|
||||
- **Self-heal:** if the error overlay appears on a slow network but EC then finishes loading anyway, the overlay should **dismiss itself** and drop you into the live call. Worth confirming on a deliberately throttled-but-not-blocked connection.
|
||||
|
||||
---
|
||||
|
||||
## B. Polls (N4) — render correctly on non-TDS themes
|
||||
|
||||
This was the actual bug: poll buttons used undefined CSS variables, so on the **default (non-Lotus-Terminal) themes** they rendered with invisible borders / no selected state.
|
||||
|
||||
### B1. Poll renders on a default theme — ✅ PASS
|
||||
|
||||
1. Switch to a **default Cinny theme** (Settings → Appearance — **not** Lotus Terminal / TDS). Test both a **dark** and a **light** theme.
|
||||
2. In any room, create a poll (composer → poll button): a **single-choice** poll with 3 options.
|
||||
|
||||
**Expected**
|
||||
|
||||
- Each option is a clearly **bordered** button with visible rounded corners.
|
||||
- A **radio circle** indicator is visible on the left of each option.
|
||||
- Text, and (after votes) the percentage, are legible.
|
||||
|
||||
### B2. Voting + selected/progress state
|
||||
|
||||
1. **Vote** on an option.
|
||||
**Expected**
|
||||
|
||||
- The selected option shows a **filled accent border + filled radio**, and an **accent progress-bar fill** grows behind it proportional to the vote %.
|
||||
- The percentage and total vote count update.
|
||||
- Click again / pick another option → selection moves correctly (single-choice replaces; the bar redraws).
|
||||
|
||||
### B3. Multiple-choice poll
|
||||
|
||||
1. Create a poll allowing **multiple selections**.
|
||||
**Expected**
|
||||
|
||||
- Indicators are **square checkboxes** (not circles); selected ones show a **✓** that's legible against the filled box.
|
||||
- You can select **several** options; each shows its own progress fill.
|
||||
|
||||
### B4. Lotus Terminal theme regression — ✅ PASS
|
||||
|
||||
1. Switch to **Lotus Terminal / TDS** theme and re-open a poll.
|
||||
**Expected:** still looks correct (the fix uses theme tokens, so the TDS accent should now drive it) — no worse than before.
|
||||
|
||||
---
|
||||
|
||||
## C. Robustness / background behavior
|
||||
|
||||
### C1. Presence updates on tab close
|
||||
|
||||
1. Open the app, then **close the tab** (or quit the browser).
|
||||
2. From another session/device, check your **presence** shortly after.
|
||||
**Expected:** you go **offline/away** reliably (the unload now uses `fetch({keepalive})`). Previously this could be missed.
|
||||
|
||||
### C2. Upload retry on flaky network (best-effort)
|
||||
|
||||
1. In devtools → Network, set a throttle that drops/slows requests, or toggle Offline briefly **during** a file upload.
|
||||
**Expected**
|
||||
|
||||
- A transient failure **retries** (up to 3×, with backoff) and the upload can still succeed once the network recovers.
|
||||
- A genuine, permanent rejection (e.g. file too large / 4xx) still **fails fast** with the usual error — it should **not** spin retrying.
|
||||
|
||||
### C3. General timeline/composer perf (no functional regression)
|
||||
|
||||
The memoization changes are invisible if correct. Just confirm **nothing broke**:
|
||||
|
||||
- Open a busy room; scrolling, jump-to-latest, mark-as-read all still work.
|
||||
- Composer: send a message, upload a file, share a location, pick an emoji and a sticker — all still work.
|
||||
|
||||
---
|
||||
|
||||
## D. Element Call 0.20.1 merge — regression sweep (👥 2 people)
|
||||
|
||||
The upstream bump changed EC's internals and DOM selectors; our call controls drive that iframe, so sweep them. In a live call with 2 people, confirm **each** of our control-bar buttons works:
|
||||
|
||||
- [ ] **Mic** mute/unmute (icon + actual audio)
|
||||
- [ ] **Camera** on/off
|
||||
- [ ] **Deafen / Sound** toggle (your deafen key too)
|
||||
- [ ] **Screenshare** start/stop (and the "Share your screen?" confirm)
|
||||
- [ ] **Screenshare audio** mute toggle
|
||||
- [ ] **Fullscreen** toggle
|
||||
- [ ] **⋮ More** menu → **Spotlight/Grid**, **Reactions**, **Settings** each open the right EC panel
|
||||
- [ ] **End** call leaves cleanly
|
||||
- [ ] **PTT** (push-to-talk) if enabled: hold key = transmit, release = mute; releasing on blur works
|
||||
- [ ] **AFK auto-mute** if enabled: goes muted after the timeout
|
||||
- [ ] **PiP** (picture-in-picture) mini window: drag, resize, fullscreen button, return-to-call; the "You muted" / "All muted" badges show on the right person
|
||||
- [ ] **Denoise** (if ML noise suppression enabled): call audio still flows, no silence
|
||||
|
||||
If any control does nothing, that usually means an EC DOM selector changed — capture the console and tell me which button.
|
||||
|
||||
---
|
||||
|
||||
## D2. Element Call **fork** — Phase 2 feature sweep (👥 2 people) — `0.20.1-lotus.1`
|
||||
|
||||
> The whole EC iframe is now our **self-built fork** (`@lotusguild/element-call-embedded@0.20.1-lotus.1`).
|
||||
> Five features are **active** (the host sets their flags / sends their actions); two ship **dormant**.
|
||||
> **Confirm you're on the fork first:** EC iframe console prints `Element Call embedded-v0.20.1-lotus.1`
|
||||
> (the old build prints `embedded-v0.20.1`). If it says the old version, the web deploy hasn't landed —
|
||||
> the fork features won't be present, so don't test D2 yet.
|
||||
> For non-dev testers, each item below also states the plain "✅ good if / ❌ tell us if" outcome.
|
||||
|
||||
### D2-1. Denoise **in-source** — survives reconnect (fixes A7) ⭐ highest risk (everyone's mic)
|
||||
|
||||
Flag: cinny sets `lotusDenoiseSource=1` when ML denoise is selected (the old build-time getUserMedia
|
||||
shim is **removed**). This is the single change with the widest blast radius — test deliberately.
|
||||
|
||||
- [ ] **Audio flows, no silence** with ML denoise on (baseline, also §D line 204).
|
||||
- [ ] **Reconnect (the A7 fix):** in a call with ML denoise on, kill network ~10 s (devtools → Offline)
|
||||
so EC shows "Connection lost / Reconnect", then restore. **Mic still works AND still denoised**
|
||||
afterward, **without** End+rejoin. _(This is the exact bug that was reintroduced then fixed; if it
|
||||
regresses, mic dies on every reconnect.)_
|
||||
- [ ] **Mic device switch mid-call** (Settings → change microphone): audio keeps working (same
|
||||
`restart()` path as reconnect).
|
||||
- [ ] **Mute → unmute** a few times: audio returns each time.
|
||||
- [ ] **Each model** if the picker offers them: `rnnoise` (default), `speex`, `dtln`, `deepfilternet` —
|
||||
each loads + denoises, no silence. (All four are in-source now; DTLN runs at 16 kHz, others 48 kHz.)
|
||||
- [ ] **No double-processing:** audio isn't over-suppressed/artifacted (would mean the old shim is still
|
||||
injected alongside the in-source engine).
|
||||
- **Rollback if bad for everyone:** revert the cinny deploy commit (restores the shim + `@element-hq` parity).
|
||||
|
||||
### D2-2. Speaking + mute indicators from widget **events** (#2)
|
||||
|
||||
Flag: `lotusCallState=1`. cinny now reads speaker/mute state from `io.lotus.call_state` events instead of
|
||||
scraping EC's DOM (DOM fallback retained). Overlaps **G1**.
|
||||
|
||||
- [ ] **Speaking glow** lights the **correct** person when they talk (you, then your friend).
|
||||
- [ ] **PiP "All muted" / "You muted" badge** points at the right person and updates on mute/unmute.
|
||||
|
||||
### D2-3. Focus camera **during a screenshare** (#4 / A5)
|
||||
|
||||
Action: cinny sends `io.lotus.focus_participant` (the DOM `.click()` hack is gone). Overlaps **A5 / G2**.
|
||||
|
||||
- [ ] Person A screenshares; Person B camera on; **MemberGlance → Focus camera** on B → B's camera is
|
||||
spotlighted **alongside/over** the shared screen (not ignored).
|
||||
- [ ] Camera-**off** target = graceful (no error, no kick out of the screenshare).
|
||||
|
||||
### D2-4. In-call avatar decorations (#6) — **NEW, beyond A6**
|
||||
|
||||
Action: cinny pushes `io.lotus.decorations`. **A6 only covered the lobby roster** and called in-call EC
|
||||
tiles out of scope — that's now in scope.
|
||||
|
||||
- [ ] A participant with a **Profile decoration** joins **camera off** → the decoration ring renders on
|
||||
their **in-call video-tile avatar** (inside EC, not just the lobby), correctly sized/positioned.
|
||||
- [ ] Decoration tracks the right person across grid/spotlight layout changes; disappears when they leave.
|
||||
|
||||
### D2-5. Native transparent background (#5)
|
||||
|
||||
Flag: `lotusTransparent=1` (native, replacing the injected `background:none !important`).
|
||||
|
||||
- [ ] Call background looks right — host wallpaper/surface shows through; **no** black box, bad
|
||||
see-through, or layout breakage (also covered loosely by §D2 "looks right").
|
||||
|
||||
### D2-7. In-Call Soundboard (#3 / P5-15) — 👥 2 people — **NEW**
|
||||
|
||||
Flag: `lotusAudioInject=1`. A 🔔 **Soundboard** button now sits in the call controls bar (left group,
|
||||
next to the chat button). Clips are user-uploadable and sync across your devices like emoji packs.
|
||||
_Prereq:_ Settings → General → Calls → **Soundboard** must be ON (default on).
|
||||
|
||||
- [ ] **Upload:** open the soundboard popout → **Upload** → pick a short audio file (mp3/ogg/wav, ≤ 1 MB).
|
||||
It appears as a clip tile. (Too-big / too-many shows an error, doesn't crash.)
|
||||
- [ ] **Plays into the call:** with a second person in the call, click a clip. **They hear it**, and
|
||||
**you hear it locally** too. ✅ good if both hear it; ❌ tell us if only one side does.
|
||||
- [ ] **Sync:** the uploaded clip shows up on your **other device**/session (account-data sync).
|
||||
- [ ] **Delete:** the ✕ on a tile removes it (everywhere, after sync).
|
||||
- [ ] **Off switch:** turn Settings → Calls → **Soundboard** off → the call-bar button disappears.
|
||||
- [ ] Injecting a clip does **not** mute/interrupt your mic or anyone else's audio.
|
||||
|
||||
### D2-8. Call Quality Controls (#7 / P5-31) — 👥 2 people — **NEW**
|
||||
|
||||
Action: `io.lotus.set_quality`. User settings in **Settings → General → Calls** (Microphone Bitrate,
|
||||
Screenshare Bitrate, Screenshare Framerate; all default **Auto**). Admin caps in **Room Settings →
|
||||
General → Voice → Call Quality Caps**.
|
||||
|
||||
- [ ] **No regression at Auto:** with everything on **Auto**, calls/screenshare work exactly as before.
|
||||
- [ ] **User cap takes effect:** set Microphone Bitrate to **32 kbps**, rejoin/continue a call — audio
|
||||
still flows (thinner is fine). Set Screenshare Framerate to **15 fps** and share your screen — it
|
||||
still shares. ❌ tell us if any setting kills audio/screenshare.
|
||||
- [ ] **Applies mid-call:** changing a setting **during** a call takes effect without End+rejoin.
|
||||
- [ ] **Room-admin cap (admin needed):** as a room admin, set **Max Microphone Bitrate = 64 kbps** in
|
||||
Room Settings → Voice. A member whose user setting is higher (e.g. 256) should be **clamped to 64**
|
||||
(best-effort/UX — this is client-side; hard server enforcement is a separate follow-up).
|
||||
- [ ] Resetting a setting back to **Auto** removes the cap for the rest of the call.
|
||||
|
||||
> Soundboard + quality are no longer "dormant" — if either does nothing, grab the **EC iframe console**
|
||||
> and check for `io.lotus.inject_audio` / `io.lotus.set_quality` rejections.
|
||||
|
||||
### D2-9. Call Permissions — HARD server-side, cross-client (👥 2 people, admin) — **NEW**
|
||||
|
||||
This is enforced by the `voice-limit-guard` on the server (re-signs the LiveKit JWT), so it applies to
|
||||
**every** client, not just Lotus Chat. Set in **Room Settings → General → Voice → Call Permissions**.
|
||||
_(Requires the guard deployed on LXC 151 — auto-deploys on a `matrix` repo push.)_
|
||||
|
||||
- [ ] **Disable screenshare:** as admin, turn **Allow Screen Sharing** off. In a call, the
|
||||
**screenshare button disappears** in Lotus Chat. ✅ good if no one can screenshare.
|
||||
- [ ] **Cross-client (the important one):** have someone join the **same room from stock Element / Element
|
||||
X** and try to screenshare → the server **refuses** the track (it won't publish). This proves it's
|
||||
not just our client hiding a button.
|
||||
- [ ] **Audio-only room:** turn **Allow Camera** off too → the camera button disappears and cameras are
|
||||
server-blocked for all clients; **microphones still work**.
|
||||
- [ ] **⭐ Live kill (mid-call):** while someone is **actively screensharing**, an admin turns **Allow
|
||||
Screen Sharing** off. Within a few seconds their screenshare should **stop for everyone** on its own
|
||||
(no rejoin needed) — this is the server reconcile loop revoking it live. Works even if the sharer is
|
||||
on stock Element. ✅ good if the share drops within ~3–5 s; ❌ tell us if it keeps going.
|
||||
- [ ] **Turning it back on** restores the ability to screenshare/camera (start a new share).
|
||||
- [ ] **No policy = no change:** a room with Call Permissions left on defaults behaves exactly as before.
|
||||
|
||||
> If any D2 item fails, grab the **EC iframe console** (right-click the call → inspect the iframe) — a
|
||||
> widget-action/payload mismatch shows up there as a `io.lotus.*` rejection or a `MissingKey`/transport log.
|
||||
|
||||
---
|
||||
|
||||
# Backlog of previously-fixed-but-unverified items
|
||||
|
||||
> Sections A–D above are **this session's** work. Everything below was fixed in earlier waves and is still flagged **⚠️ UNTESTED** (see the outstanding-verification backlog below / `LOTUS_TODO.md`). They're grouped by what kind of environment you need (mobile, desktop, screen reader, etc.) so you can knock out a whole category at once. None of these are urgent the way A–D are; do them as you have the right device handy.
|
||||
|
||||
## E. Mobile / responsive (needs a real phone, or devtools device emulation)
|
||||
|
||||
### E1. Composer toolbar touch targets (#7)
|
||||
|
||||
On a phone, open a room and the composer toolbar. Tap each button (attach, format, sticker, emoji, GIF, location, poll, schedule, send).
|
||||
**Expected:** every button is comfortably tappable (≥44×44px), no mis-taps hitting the wrong icon.
|
||||
|
||||
### E2. Room Settings — no horizontal overflow (#8)
|
||||
|
||||
On a narrow phone screen, open **Room Settings**.
|
||||
**Expected:** the settings nav panel fills the full width; **no** horizontal scrollbar / sideways scrolling anywhere in the panel.
|
||||
|
||||
### E3. Modals go fullscreen on mobile (#9)
|
||||
|
||||
On a phone, open several dialogs: Leave Room, Create Room, Create Space, Invite User, Report (room/user/message), Edit History, Forward Message, Remind Me, Schedule Message, Device Verification, Poll Creator.
|
||||
**Expected:** each opens **fullscreen** (no floating box, no rounded corners / max-width margins). On desktop the same modals should still be the normal centered boxes.
|
||||
|
||||
### E4. Composer not hidden by the keyboard (#10) — iOS Safari especially
|
||||
|
||||
On a phone (priority: **iOS Safari**), tap into the composer so the on-screen keyboard appears.
|
||||
**Expected:** the composer input stays **visible above** the keyboard; the layout shrinks rather than the composer sliding under the keyboard.
|
||||
|
||||
### E5. Mobile "Saved Messages" access (Mobile Bookmarks)
|
||||
|
||||
On a phone, **inside a room**, open the room header **··· More Options** menu.
|
||||
**Expected:** a **"Saved Messages"** item is present; tapping it opens the bookmarks panel. (This was the only in-room access point missing on mobile.)
|
||||
|
||||
---
|
||||
|
||||
## F. Visual / theming
|
||||
|
||||
### F1. Animated chat background — no flicker (#2)
|
||||
|
||||
Settings → set an **animated** chat background (e.g. anim-rain / anim-aurora / anim-stars). Watch the message text and composer while it animates.
|
||||
**Expected:** smooth animation, **no flickering / shimmering** on message text or the composer, especially after scrolling. Note your GPU/browser if you see artifacts.
|
||||
|
||||
### F2. Background vs. Seasonal theme are mutually exclusive (#6)
|
||||
|
||||
In Settings → Appearance:
|
||||
|
||||
1. Pick a **chat background** → confirm any **seasonal theme** auto-switches off.
|
||||
2. Pick a **seasonal theme** → confirm the **chat background** auto-clears to none.
|
||||
3. (Edge) If you have old data with both set, after reload only one should visibly apply (no double-overlay clutter).
|
||||
|
||||
### F3. Background / seasonal picker grid layout (N81)
|
||||
|
||||
In Settings → Appearance, look at the **Chat Background** and **Seasonal Theme** swatch grids; resize the window narrow→wide.
|
||||
**Expected:** swatches reflow to fill each row evenly (responsive grid), with no lopsided/orphaned last row at any width.
|
||||
|
||||
---
|
||||
|
||||
## G. Calls — additional unverified (👥 2 people)
|
||||
|
||||
### G1. PiP mute badges point at the right person (#12)
|
||||
|
||||
In a call with at least one other person, pop out the **Picture-in-Picture** mini window.
|
||||
|
||||
- **You** mute your own mic → a **"You"/muted badge appears bottom-left** (your status).
|
||||
- A **remote** participant (or all of them) mutes → an **"All muted"** badge appears **top-right** (clearly about other people).
|
||||
**Expected:** the bottom-left badge is **never** triggered by someone else muting — that was the original bug (it looked like your own mic was muted when it wasn't).
|
||||
|
||||
### G2. Full-screen camera broadcasts
|
||||
|
||||
1. In a **camera-only** call (no screenshare), confirm the **Fullscreen** button is available (previously only showed during screenshare).
|
||||
2. Use **MemberGlance → Focus camera** to full-screen/spotlight a specific person's camera. (Overlaps **A5**; if you've done A5 you can skip.)
|
||||
|
||||
### G3. PTT badge renders on all themes (N53)
|
||||
|
||||
Enable **Push-to-talk** (Settings → Calls) and join a call. Hold the PTT key.
|
||||
**Expected:** the floating PTT badge above the controls shows "PTT — Hold KEY" when idle and "● Live" (green) while held — on **both** a default theme and Lotus Terminal (it's now a single folds Chip; the old terminal-only variant was removed).
|
||||
|
||||
---
|
||||
|
||||
## H. Media / performance (needs a room with many images)
|
||||
|
||||
### H1. Lazy image decryption (P5-5 / MediaGallery)
|
||||
|
||||
Open a room / media gallery with **many images** (ideally encrypted). Scroll down through them.
|
||||
**Expected:** images decrypt/load as they **approach the viewport**, not all at once on open; scrolling stays smooth and memory doesn't balloon. Off-screen images shouldn't all decode up front.
|
||||
|
||||
### H2. Thumbnail framing (P5-6)
|
||||
|
||||
Look at **tall portrait** images in the timeline and in the media gallery.
|
||||
**Expected:** thumbnails are framed **center-top** (so faces/subjects at the top aren't cropped out); no awkward stretching. Opening the full-size viewer still shows the **whole** image (contain, not cropped).
|
||||
|
||||
---
|
||||
|
||||
## I. Accessibility (needs a screen reader: VoiceOver / NVDA / TalkBack)
|
||||
|
||||
With a screen reader on, navigate message hover-actions and content and confirm each control **announces a meaningful label** (not "button" / blank):
|
||||
|
||||
- [ ] **Reaction** buttons announce the emoji + count (e.g. "thumbsup reaction, 3 people").
|
||||
- [ ] **Edit history** button announces "View edit history".
|
||||
- [ ] **Thread indicator** announces "View thread".
|
||||
- [ ] **Reply** (jump to original) announces "Jump to original message".
|
||||
|
||||
---
|
||||
|
||||
## J. Desktop / Tauri build only
|
||||
|
||||
### J1. Proactive update notifications (P5-40)
|
||||
|
||||
In the **desktop (Tauri)** build, with an update available, launch the app (and/or leave it running ~12h).
|
||||
**Expected:** an in-app toast/badge alerts you that an update is available, without manually checking Settings. (Needs an actual newer release to point at.)
|
||||
|
||||
### J2. DTLN noise suppression sanity
|
||||
|
||||
In Settings → Calls, enable **ML noise suppression** with the **DTLN** model, then join a call.
|
||||
**Expected:** your mic audio still flows (no silence/robotic dropouts) and background noise is reduced. Confirmed working earlier but flagged for a final real-call check; verify on **both** web and desktop.
|
||||
|
||||
---
|
||||
|
||||
## K. Features — end-to-end unverified
|
||||
|
||||
### K1. Remind Me Later
|
||||
|
||||
On a message, **··· → Remind Me**, pick a short preset (the 20-min one, or wait one out).
|
||||
**Expected:** when due, a Lotus toast fires linking to that message; the reminder then clears itself. Survives a reload while pending (stored in account data).
|
||||
|
||||
### K2. Advanced search filters (P4-9)
|
||||
|
||||
In message search: use the **sender picker** (instead of typing `from:@user`), the **date-range** quick presets (Today / Last week / Last month / Last year), and the **Has link** toggle.
|
||||
**Expected:** each narrows results correctly and reflects in the search.
|
||||
|
||||
### K3. Notification content + click target (P5-20 partial)
|
||||
|
||||
Trigger a desktop/browser notification for a new message.
|
||||
**Expected:** it shows the **real message body** (`username: message`, not "New inbox notification from…"); **clicking it** brings the window to front and navigates **directly to that message** (not just the inbox).
|
||||
|
||||
---
|
||||
|
||||
## L. Fixed — verify
|
||||
|
||||
### L1. AFK auto-mute releases the OS microphone indicator on mute (N95) — 👥 live call
|
||||
|
||||
**Context (now FIXED):** `useAfkAutoMute.ts` opened its own `getUserMedia` level-monitor capture for the whole call, so the OS recording indicator (green dot on macOS, mic icon on Windows/Linux) stayed lit even when muted. The capture is now gated on the reactive mic-on state — it runs only while unmuted, so muting releases the stream.
|
||||
|
||||
**To verify:**
|
||||
|
||||
1. Enable **AFK auto-mute** in Settings → Calls and **join a call**.
|
||||
2. Manually **mute your mic** using the call controls → the **OS recording indicator should clear** within ~a second.
|
||||
3. **Unmute** → the indicator should re-appear (capture re-acquired).
|
||||
4. Also confirm AFK still works end-to-end: stay unmuted and silent past the configured timeout → mic auto-mutes with the "muted after inactivity" toast, and the indicator clears.
|
||||
|
||||
### L2. Maskable PWA icon (N108) — Android install
|
||||
|
||||
1. On **Android Chrome**, install Lotus Chat as a PWA (Add to Home Screen).
|
||||
2. Look at the **home-screen icon**.
|
||||
|
||||
**Expected:** the icon fills the adaptive-icon shape cleanly (the logo centered with safe-zone padding on the dark background), **not** clipped at the corners or floating in an odd box. Also worth a quick check in Chrome DevTools → Application → Manifest that the two `purpose: maskable` icons load without a 404 (this also validates the manifest's icon paths resolve in production — a pre-existing path convention I couldn't verify statically).
|
||||
|
||||
---
|
||||
|
||||
## M. New features (this round)
|
||||
|
||||
### M1. Search: `has:image` / `has:file` / `has:video` filters
|
||||
|
||||
1. Open message search (in a room with shared images/files/videos in history).
|
||||
2. Run a broad search, then toggle the **Images**, **Files**, **Video** chips (in the filter bar, next to "Has link").
|
||||
|
||||
**Expected:**
|
||||
|
||||
- Each chip narrows the visible results to that message type; multiple active chips = union (any of them).
|
||||
- Toggling them off restores the full results. The existing room/sender/date/has-link filters still work alongside.
|
||||
- **Known limitation (by design):** filtering is client-side over already-fetched results, so the visible count can be lower than the server's total for that query — paginating/loading more pulls in more to filter. Confirm this reads acceptably.
|
||||
|
||||
### M2. Search: recent searches
|
||||
|
||||
1. Run a few different searches, then **clear the search box** and focus it.
|
||||
|
||||
**Expected:** your last (up to 10) distinct searches appear as clickable chips; clicking one re-runs it. A **Clear** affordance wipes the list. The list **persists across a page refresh** (localStorage).
|
||||
|
||||
### M3. Custom accent color (non-TDS themes) — ⚠️ needs your visual judgment
|
||||
|
||||
1. Make sure **Lotus Terminal (TDS)** is **off**. Settings → Appearance → **Custom Accent Color** → pick a color.
|
||||
|
||||
**Expected:**
|
||||
|
||||
- The app's accent (buttons, selected/active states, links, primary chips) recolors to your choice **live**.
|
||||
- **Look critically at quality** (this is the part I can't verify): button **text legibility** (OnMain contrast) on the accent buttons; **hover/active** shades; and **selected-row / chip** backgrounds (the translucent "Container" tints). Try a **light** color and a **dark** color and a **saturated** one.
|
||||
- If a dark accent makes selected-row text (OnContainer) hard to read, tell me — that's the one spot in the auto-derived palette most likely to need tuning.
|
||||
- **Reset** clears it back to the theme default.
|
||||
- Turn **Lotus Terminal ON** → the custom accent should be **ignored** (TDS fixed palette wins) and the picker shows a "non-TDS only" note; turn it back off → custom accent returns.
|
||||
- Reload → the chosen accent **persists**.
|
||||
|
||||
---
|
||||
|
||||
### M4. Search: "Pinned only" filter
|
||||
|
||||
In message search, toggle the **Pinned** chip.
|
||||
**Expected:** results narrow to messages currently pinned in their room; composes with the Images/Files/Video chips and room/sender/date filters; toggling off restores results. It also narrows the **encrypted/local-cache** results section (not just server results). Needs a room with actually pinned messages.
|
||||
|
||||
### M5. New theme presets (Cyberpunk / Ocean / Blood Red / Classic Matrix / Midnight) — ⚠️ visual judgment
|
||||
|
||||
Settings → Appearance → theme picker → try each of the 5 new themes.
|
||||
**Expected:** each applies a complete, legible dark palette. Code review computed WCAG contrast and all pass AA, but **eyeball these specifically**: **Midnight** (lowest-contrast accent `#6b7ca8` — selected/focus states), **Classic Matrix** (green accents, light-green body text on near-black), **Blood Red** (white-ish text on bright-red buttons). Confirm Success/Warning/Critical (save/leave/delete) still look correctly green/amber/red, not recolored. Switching back to a stock theme should fully revert.
|
||||
|
||||
---
|
||||
|
||||
## N. OIDC / Next-Gen Auth login (MSC3861) — P4-6
|
||||
|
||||
The Lotus client can now sign into OIDC-native homeservers (ones that delegate
|
||||
auth to a Matrix Authentication Service / MAS), e.g. mozilla.org. lotusguild's
|
||||
own server is **not** MSC3861, so test EITHER against a **local MAS dev loop**
|
||||
(full setup in `dev/oidc-test/README.md` — docker-compose + Synapse `msc3861`
|
||||
delta + a `config.json` override) OR against **mozilla.org** with a real account.
|
||||
|
||||
### N1. OIDC login flow (the core test) — needs a MAS homeserver
|
||||
|
||||
1. On the login screen, select the OIDC homeserver (local `localhost:8008`, or `mozilla.org`).
|
||||
2. **Expected:** instead of the username/password form, a single **"Continue with single sign-on"** button appears (password + legacy-SSO are suppressed for that server).
|
||||
3. Click it → redirected to the provider's login page (MAS / `chat.mozilla.org`).
|
||||
4. Authenticate there → redirected back to `…/auth/oidc/callback` → a brief "Signing you in…" spinner → you land in the app, logged in.
|
||||
|
||||
**Expected:** no console CSP violations; you reach the room list as the OIDC user.
|
||||
|
||||
### N2. Session persists across reload (token storage)
|
||||
|
||||
After N1, hard-refresh the page.
|
||||
**Expected:** you stay logged in — the OIDC session (access + refresh token + issuer/clientId/claims) was persisted (`cinny_refresh_token`, `cinny_oidc_*` keys in localStorage).
|
||||
|
||||
### N3. Token refresh (long-lived session)
|
||||
|
||||
Leave the session past the access-token lifetime (MAS default is short — or revoke the access token in the MAS admin UI to force a 401).
|
||||
**Expected:** the client refreshes transparently (no logout); the stored access token rotates (reactive 401 refresh via the wired `OidcTokenRefresher`).
|
||||
|
||||
### N4. Logout revokes at the issuer
|
||||
|
||||
Log out from Settings.
|
||||
**Expected:** back to login; OIDC tokens are revoked at the issuer's `revocation_endpoint` (best-effort) and all `cinny_*` / `cinny_oidc_*` keys are cleared. Logging back in works.
|
||||
|
||||
### N5. Account-management deep-link
|
||||
|
||||
Settings → Account.
|
||||
**Expected:** on an OIDC server a **"Manage account"** card appears (opens the provider's account page in a new tab). On a non-OIDC server (lotusguild) the card is **absent**.
|
||||
|
||||
### N6. Non-OIDC regression — password login unchanged
|
||||
|
||||
Log into **matrix.lotusguild.org** (password) and **matrix.org**.
|
||||
**Expected:** identical to before — username/password form (+ SSO button where offered). The OIDC path only activates when discovery advertises an issuer, so nothing changes for these servers.
|
||||
|
||||
---
|
||||
|
||||
## O. July 2026 batch — threads, notifications, math, search cache, audit wave
|
||||
|
||||
Everything landed after the OIDC work. These mirror the checklists in `LOTUS_TODO.md` (§P3-8, §P4-1) and the outstanding-verification backlog below (P3-8/P4-1/P4-4/P4-8/N97a/AW-1…4). **⚠️ Threads change the main timeline** — thread replies no longer render inline; that's intended (see O1).
|
||||
|
||||
### O1. Thread Panel (P3-8) — 👥 2 people help for live replies
|
||||
|
||||
1. Hover a message → **Reply in Thread** (message menu). The right-side **thread panel** opens with that message as the root.
|
||||
2. Send text, an emoji, and a file upload into the thread; have the second person reply too.
|
||||
3. Reply to a reply _inside_ the panel.
|
||||
|
||||
**Expected:** the panel shows the root at top + an "N replies" divider + the reply timeline (own composer at the bottom). Your sends appear immediately (pending → confirmed). A reply-to-a-reply is a proper thread reply. In the **main** timeline the replies do **not** appear inline — the root message instead shows a **"N replies · time"** chip. Clicking the chip (or a reply's thread indicator) opens the panel. **×** or **Escape** closes it; on mobile the panel is fullscreen. Scrolled up in a long thread → a **Jump to Latest** chip appears. Reload the page → the root/reply split persists; in an **encrypted** room the thread replies decrypt (not "Unable to decrypt").
|
||||
|
||||
### O2. Per-thread notifications (P4-1, Slack-style) — 👥 2 people
|
||||
|
||||
1. Have the second person reply in a thread **you have posted in** → expect a notification + sound.
|
||||
2. Have them reply in a thread **you have never touched** and don't @mention you → expect **silence** (only the chip's unread badge updates).
|
||||
3. Have them **@mention** you in any thread → expect a notification regardless of participation.
|
||||
4. Open the panel's **bell menu** (header) → set the thread to **Mute** → expect no notifications, the chip's unread badge gone (bell-mute glyph shown), and the room's **sidebar badge drops** by that thread's count. Try **All** (every reply notifies) and **Mentions only** (only @mentions).
|
||||
5. On a **second device**, confirm the same per-thread modes are set (they sync via account data).
|
||||
6. Room-level **Mute** (room context menu) still silences everything, including thread overrides.
|
||||
|
||||
**Known caveat:** Mentions-only can under-notify in E2EE rooms (the decision runs before decryption). Muted-thread badge subtraction is Lotus-only.
|
||||
|
||||
### O3. Math / LaTeX (P4-4)
|
||||
|
||||
Send each and confirm rendering: `$x^2 + y^2$` (inline), `$$\int_0^1 f(x)\,dx$$` (block, centered), `$5 and $10 for lunch` (**stays plain text** — currency guard), and a code block containing `$x$` (**stays literal** inside the code block). **Expected:** the first two render as math (KaTeX); the last two are untouched. First math of the session may show the raw `$…$` for a beat while the KaTeX chunk lazy-loads, then renders.
|
||||
|
||||
### O4. Encrypted search cache (P4-8) — opt-in
|
||||
|
||||
In an **encrypted** room's message search, enable **"Persist search index on this device"** (Encrypted Rooms panel). Search, then **reload** and search the same term. **Expected:** coverage survives the reload (results without re-paginating everything). **Clear cached index** empties it. **Log out** → the cache is wiped (privacy). Toggling the setting OFF does **not** wipe (only Clear/logout do).
|
||||
|
||||
### O5. Session hardening (N97a) — cross-tab
|
||||
|
||||
1. Log in on a build that predates the change, then load this build → you stay logged in (legacy keys migrate to the `cinny_session_v1` blob; check DevTools → Application → Local Storage).
|
||||
2. Open the app in **two tabs**; **log out** in tab A → tab B reloads to the auth screen within a moment. Log in again in one tab → the other reloads too.
|
||||
|
||||
### O6. Audit-wave correctness fixes (AW-1)
|
||||
|
||||
- **Scheduled-message cancel:** schedule a message, then cancel it **with the network cut** (DevTools offline) → the item **stays** with an inline error (it does **not** silently disappear and still send). Restore network, retry → cancels cleanly.
|
||||
- **Escape coordination:** in a thread panel, open the mention autocomplete or set a reply draft, press **Escape** → it dismisses the autocomplete/reply **without** closing the panel. A bare Escape (nothing to dismiss) still marks the room read / closes the panel as before.
|
||||
- **Panel exclusivity:** on mobile, opening a thread while the media gallery (or members drawer) is open shows only **one** right panel (thread wins), not stacked fullscreen overlays.
|
||||
- **Emoji board (AW-2):** the **first** time you open the emoji board / autocomplete in a session, the grid **and search** populate with unicode emoji (they don't stay empty). Reactions still show a label.
|
||||
|
||||
### O7. Desktop (Tauri) — CSP tighten + native stack (AW-4) — 🖥️ desktop build only
|
||||
|
||||
The webview CSP was tightened and the full native module set now compiles. Smoke-test the desktop build:
|
||||
|
||||
1. App **boots**, avatars + media thumbnails load, the **VT323** terminal font renders (Lotus Terminal theme), a **location message** embeds its OpenStreetMap map, **calls** connect (EC iframe), **deep links** (`matrix:` / clicking a room link) navigate.
|
||||
2. **Native features:** minimize to tray (notifications still arrive), a message notification is a **rich toast** (click opens the room; reply box sends), the taskbar **Jump List** lists recent rooms, in a call the taskbar thumbnail shows **Mute/Deafen/End**, Windows **Focus Assist** silences Lotus.
|
||||
3. **Console** (desktop devtools) shows **no CSP violations** during normal use. If something visual/media is blocked, that's the CSP to loosen — note exactly what and where.
|
||||
|
||||
### O8. E2EE / call-key cluster (KE-1→4) — 👥 2 people, during a real call
|
||||
|
||||
We shipped the diagnostics kit + a **Crypto Diagnostics** card (**Settings → Developer Tools**). During your next call that glitches (audio cutouts, "Unable to decrypt"), open it and **Download report**, and note whether the symptoms even still occur now that we're on **matrix-js-sdk 41.7.0** (crypto-wasm 18.3.1). Send me the report; the KE-1..4 diagnosis + capture guidance is in `LOTUS_TODO.md` (Encryption / E2EE), with the full original runbook in git history.
|
||||
|
||||
---
|
||||
|
||||
## P. Accessibility (P3-4) — needs a browser + a screen reader
|
||||
|
||||
The compliance fixes are gate-verified in code; these confirm the runtime a11y behavior only a human + AT can check. Tools: browser DevTools "axe" extension / Lighthouse a11y, plus **VoiceOver** (macOS ⌘F5) or **NVDA** (Windows).
|
||||
|
||||
### P1. Keyboard-only golden path (no mouse)
|
||||
|
||||
Tab from page load: **skip-to-content** link appears first (Enter jumps to the timeline). Tab reaches the room list (rooms are focusable, active room announced), open a room (Enter), type a character → focus lands in the composer, send with Enter (or Shift+Enter per your `enterForNewline` setting). No keyboard trap; visible focus ring throughout.
|
||||
|
||||
### P2. `?` shortcuts dialog
|
||||
|
||||
Press **?** (Shift+/) with focus NOT in a text field → the keyboard-shortcuts dialog opens, is focus-trapped, Escape closes it and focus returns to where you were. Pressing `?` while typing in the composer/search inserts a literal `?` (does NOT open the dialog).
|
||||
|
||||
### P3. Screen-reader: reading messages
|
||||
|
||||
With VoiceOver/NVDA on, arrow through the timeline: each message is announced as an article with **sender name + time** — critically, this includes **collapsed messages** (consecutive messages from the same person), which previously announced only the body with no sender. Reactions, "edited", replies, and delivery status are announced with labels.
|
||||
|
||||
### P4. Screen-reader: live announcements
|
||||
|
||||
- **New message** arrives while you're reading → announced (polite).
|
||||
- **Someone starts typing** → "X is typing" announced once (not spammed per keystroke).
|
||||
- **Editing a message** → the edit box announces "Editing message from X".
|
||||
|
||||
### P5. Focus return from dialogs
|
||||
|
||||
Open then close (Escape or ×): the **room topic viewer**, a **reaction viewer** (click a reaction count), and **Search** → focus returns to the button/element you opened them from (not lost to `<body>`). Inline popouts (emoji picker, autocomplete, hover menus) intentionally keep focus in context — that's expected, not a bug.
|
||||
|
||||
### P6. axe / Lighthouse scan
|
||||
|
||||
Run the axe DevTools extension (or Lighthouse → Accessibility) on a room view, Settings, and the login screen. Expect **no critical/serious** "missing accessible name" or "ARIA" violations on the golden path. Report any that appear (note: far-scrolled timeline history being virtualized out is a known, accepted limitation — not a finding).
|
||||
|
||||
---
|
||||
|
||||
## Q. Inline Media Embeds — video / audio / post players (needs the web deploy live)
|
||||
|
||||
The whole feature is behind **Settings → General → "Inline Media Players"** (default **on**). Everything loads from the homeserver's cached thumbnail first; the third-party player only mounts on **Play**. Test on the **web** build first, then re-check the video ones on **desktop (Tauri)** since the CSP differs. On any failure, grab the **browser console** (F12) — a blocked embed shows as a CSP `frame-src` violation naming the host.
|
||||
|
||||
### Q1. Facade + one of each kind plays in place
|
||||
|
||||
Paste each of these into a room and confirm a media tile (not a plain link) with a thumbnail + play button, and that clicking Play mounts the player **inline**:
|
||||
|
||||
- **16:9 video:** a YouTube `watch` link, a Vimeo link, a Dailymotion link, a Streamable link, a Twitch VOD/clip, a Loom `share` link.
|
||||
- **9:16 portrait:** a YouTube **Shorts** link (renders tall, not letterboxed).
|
||||
- **Audio player:** a Spotify track, a SoundCloud track, an Apple Music album, a Tidal album/track.
|
||||
- **Post embed:** an X/Twitter post, an Instagram post, a Reddit post.
|
||||
|
||||
**Expected:** ✅ tile shows the thumbnail; **no** request to the third party until you press Play (check DevTools → Network); the player then plays inline. ❌ tell me any that stay a plain link, show a blank frame, or hit the network before you click.
|
||||
|
||||
### Q2. TikTok (the tricky one) + portrait fill
|
||||
|
||||
1. Paste a **full** TikTok URL and a **short** copy-link (`vm.tiktok.com/…` or `tiktok.com/t/…`).
|
||||
2. Press Play on each.
|
||||
|
||||
**Expected:** both resolve to a clean **9:16** player that **fills the box** (no big empty band on the right). The short link shows a brief spinner while it resolves via oEmbed, then plays. ❌ tell me if a short link shows only the TikTok logo/♫ and never a play button, or if the player has dead space beside it.
|
||||
|
||||
### Q3. Post self-resize + Close / Fullscreen controls
|
||||
|
||||
1. Play a **Reddit**, **Instagram**, and **X/Twitter** post embed.
|
||||
2. Watch the card height as the embed loads.
|
||||
|
||||
**Expected:** the card **grows to fit** the post (no clipped/scrollbarless content, no giant empty box). A **Close** button (✕) collapses the player back to the thumbnail; video players also show a **⛶ Fullscreen** control that works. Keyboard: Tab to the play button → it shows a visible **focus ring**.
|
||||
|
||||
### Q4. New providers (unverified) + the toggle + the cap
|
||||
|
||||
- **Bluesky / Loom / Kick** — these are freshly added and unverified live. Paste a `bsky.app/profile/…/post/…`, a `loom.com/share/…`, and a live `kick.com/{channel}` link. ✅ good if each plays/renders inline; ❌ if any is a broken frame (for **Bluesky** especially, note whether a **handle** URL resolves or only a DID one does — grab the console).
|
||||
- **Toggle off:** Settings → General → **Inline Media Players** off → every media link reverts to a plain link tile (no player).
|
||||
- **Cap:** paste a message with **8+** media links → at most **6** preview cards render (the rest are suppressed), and the page stays responsive.
|
||||
|
||||
---
|
||||
|
||||
## R. Discovery-pass fixes (DP1–DP18, 2026-07)
|
||||
|
||||
Agent-surveyed + TPVR-verified low/med issues, now fixed (commits `8eb961b6` `db864326` `6cf18c3b` `165714e1` `8c0e2b42` `e545706c` `b1ee3ada` `4fc3f7a3` `101e4116` `4fa4327a` `c2598d21`). Behavioral items have concrete checks; the refactors just need a "still works" regression pass.
|
||||
|
||||
### Correctness
|
||||
|
||||
- [ ] **DP1 — slash-command errors are visible.** Run a slash command that must fail — e.g. `/kick @nobody:server` in a room where you lack permission, or `/join` a bad alias. **Expected:** an error toast appears (not a silent no-op); a successful command still clears the composer normally.
|
||||
- [ ] **DP2 — no invite re-notify on reload.** With ≥1 pending invite, hard-reload (Ctrl+F5). **Expected:** NO "you have N new invitation" toast/sound on load. Then have someone invite you while the app is open → you DO get one notification for the new invite. (👥 2 accounts)
|
||||
- [ ] **DP3 — status clear syncs across devices.** Set a status message on device A, confirm it shows on B; clear it on A. **Expected:** B clears too and does NOT re-publish the old status on its next presence heartbeat. Toggling Invisible must not wipe a real saved status. (👥 2 sessions)
|
||||
- [ ] **DP4 — tag-toggle failure surfaced once.** With the network offline, toggle a room's Favourite/Low-priority. **Expected:** a single error toast (not two) on failure; on success the tag updates as before.
|
||||
- [ ] **DP5 — soundboard packs update on room switch.** Open a soundboard in room A, then switch to room B (different pack) in the same mounted view. **Expected:** B's packs show without needing an unrelated event.
|
||||
- [ ] **DP6 — declining a call still dismisses.** Decline an incoming call. **Expected:** the ringing UI dismisses even if the decline send fails (best-effort). (👥 2 accounts)
|
||||
|
||||
### a11y / UX (needs a screen reader + a narrow viewport)
|
||||
|
||||
- [ ] **DP7 / DP8 — call-control buttons announce correctly.** In a call with a screen reader: the deafen button announces "Deafen" when sound is on (not "Undeafen"); Sound / Video / Screenshare announce a consistent pressed/unpressed state like Mic.
|
||||
- [ ] **DP9 — GIF picker focus + width.** Open the GIF picker, close it (Esc / click-out) → focus returns to the GIF button. On a ~320px viewport the picker doesn't overflow the page.
|
||||
- [ ] **DP10 — search-filter clears by keyboard.** In message search, toggle a filter chip (Has link / msg-type / pinned) off with Enter; the date-range clears via its menu's Clear. No mouse-only clear needed.
|
||||
- [ ] **DP11 — voice recorder fits + announces.** On a ~360px viewport, start a voice message → the recorder row doesn't overflow the composer; a screen reader can query the duration (role="timer") without being spammed.
|
||||
- [ ] **DP12 — live-call count announced.** With a screen reader, when someone joins/leaves an active call, the "{n} Live" change is announced (polite status region).
|
||||
|
||||
### TDS colors (Lotus Terminal theme)
|
||||
|
||||
- [ ] **DP14 — send-status + receipt colors follow the theme.** In **TDS light** mode: the message send-status "failed" icon and the read-receipt pill use the theme's darker red/blue (from `--lt-*` tokens), NOT bright dark-mode cyan/red. TDS dark still looks right; non-TDS themes unchanged.
|
||||
|
||||
### Refactor regression pass (no behavior change intended)
|
||||
|
||||
- [ ] **DP13 — bookmarks / reminders / notes still work** (they now share one store engine). Add/remove a bookmark, set/clear a reminder, write/clear a user note; each persists across reload; rapid consecutive writes don't clobber each other.
|
||||
- [ ] **DP15 / DP16 — state-event + account-data writes still work.** Edit room name/topic/avatar, join-rules, power levels, an emoji/soundboard pack (state events); toggle a setting stored in account data. All save + reflect correctly.
|
||||
- [ ] **DP17 — link previews render.** Open a TikTok / Spotify / Steam / Reddit link preview; provider icons render (folds icons, not raw glyphs) and brand colors look right.
|
||||
- [ ] **DP18 — member avatars/names live-update.** Read receipts + the "seen by" reader list show correct avatars/names and update live when a member changes their avatar or display name (no reload).
|
||||
|
||||
---
|
||||
|
||||
## Priority if you're short on time
|
||||
|
||||
1. **O1 + O2** (threads + per-thread notifications) — the largest new surface; the main-timeline change is user-visible.
|
||||
2. **O7** (desktop CSP smoke) — CI can't catch CSP breakage; a wrong directive silently breaks media/fonts/maps.
|
||||
3. **O5** (session cross-tab) + **O6** (scheduled-cancel ghost-send) — auth-critical + a real data-loss-class fix.
|
||||
4. **A4** (in-call banner) + **A3** (ringtone) — newest call logic, hardest to reproduce.
|
||||
5. **D** (EC control sweep) — guards against the fork breaking calls.
|
||||
6. Everything else.
|
||||
|
||||
---
|
||||
|
||||
## Outstanding verification backlog
|
||||
|
||||
**Room Widgets (MSC1236, 2026-07 — needs the CSP `frame-src` widening + `nginx -s reload` first):** In a room, the header **Widgets** button (grid icon, desktop) opens a right-side panel. As an admin (PL to modify widgets): **Add Widget** with a name + an https URL (e.g. an Etherpad `https://…` or any embeddable page) → it appears in the list; click it → it renders in a sandboxed iframe in the panel; **Remove** clears it. A non-admin sees the list + can open widgets but has no Add/Remove. Check: a non-https or same-origin URL is rejected on Add with a clear message; the panel is a full-screen overlay on mobile and is mutually exclusive with the Thread/Gallery/Members panels; if a widget stays blank, the prod CSP `frame-src` still needs widening. Widgets get only benign display capabilities (they can't send/read room events in v1).
|
||||
|
||||
**QR Device Verification (2026-07):** With two logged-in Lotus sessions (or Lotus + Element), start a device verification. On the **Ready** step you now see your own QR code plus a **"Scan their QR code"** button and a **"Verify with emoji instead"** fallback. Have one device **scan** the other's code (grant camera permission) → the showing device asks you to **Confirm**, and both reach **verified**. Check: emoji-SAS still works unchanged; denying camera shows a graceful "verify with emojis instead" message; a deliberately-wrong scan cancels cleanly. Desktop (WebView2) auto-grants the camera; web needs the Permissions-Policy camera allowance (already set).
|
||||
|
||||
**Disappearing Messages (MSC1763 `m.room.retention`, 2026-07):** In Room Settings → General → **Message Retention**, an admin picks Off / 1 Day / 1 Week / 1 Month (non-admins see the buttons disabled). After setting e.g. 1 Day, messages older than a day **vanish from the timeline** for everyone in Lotus (toggle Settings → General → **Show Hidden Events** to reveal them again). Setting back to **Off** restores them. Separately, each user can enable Settings → General → **Enforce Message Retention** (default OFF) → their OWN expired messages then get **permanently redacted** within ~30 s (verify: OTHER people's messages are NEVER redacted by this; only your own). Note true server-side purge also needs Synapse `retention:` configured.
|
||||
|
||||
**Mark as Unread + Low Priority (MSC2867 / m.lowpriority, 2026-07):** Right-click a room in the sidebar → **Mark as Unread** puts a dot on the row (bold name) even with no new messages; opening/reading the room clears it, and it syncs to another device. **Mark as Read** on a marked room clears it too. Right-click → **Add to Low Priority** moves the room into a collapsed "Low Priority" category at the bottom of the room list (and removes it from Favorites if it was there, and vice-versa); **Remove from Low Priority** returns it to Rooms.
|
||||
|
||||
**Windows rich toast (D6, 2026-07 — desktop/Windows build only):** get a message notification while the desktop app is backgrounded → the toast is attributed to **Lotus Chat** (not "PowerShell"/generic) and shows an inline **reply box + Send**; typing a reply + Send **posts it to that room**; clicking the toast body **opens the room**. Previously these silently fell back to a plain toast (no reply/click). If it still falls back, check that a `Lotus Chat.lnk` exists in the Start-Menu Programs folder.
|
||||
|
||||
**Invite QR is now generated LOCALLY (2026-07):** Room settings → Share Room → the QR code renders (a black-on-white SVG in a white box) with **no network request** to `api.qrserver.com` (check DevTools Network — there should be no external QR fetch, and it should work offline / behind strict CSP). **Scan it** with a phone camera / Matrix app → it opens the correct `matrix.to` room-invite link. (`api.qrserver.com` was removed from the prod CSP img-src, so a regression would make the QR blank rather than silently phone home.)
|
||||
|
||||
**Unread dot on federated rooms + avatar-decoration console storm (2026-07):**
|
||||
|
||||
- **Read receipts (regression guard — highest priority):** open several rooms and open the Home/Direct tabs (which mark all orphan rooms read on mount) → rooms **stay read**, unread dots clear and don't come back. (A prior attempt sent a receipt for the thread _root_ when a thread's replies weren't loaded, which the SDK treats as a main receipt at an old event and re-unread every room on every mark-read. Fixed + locked by `notifications.test.ts`.)
|
||||
- **Thread dot:** a room with an unread reply in a thread whose replies are loaded → its dot clears on read; for a thread not yet loaded, the dot clears once you open/load the thread. (mark-as-read now sends a threaded receipt only for a genuine loaded reply, never the root.)
|
||||
- With DevTools console open on federated rooms, the `io.lotus.avatar_decoration` `403`/`502` (and federated media) errors should **not** repeat on every scroll/mount — each failing user is now requested at most ~twice per session, so the storm (and its homeserver load) is gone.
|
||||
|
||||
**Custom Window Chrome (Beta) fix (2026-07):** on the desktop build, Settings → General → toggle **Custom Window Chrome** — it should reload and come up with the Lotus title bar and a normal, stable feed (no screen-expand / auto-scroll-into-the-past). Toggle back off → reloads to the native frame.
|
||||
|
||||
_Ported from the retired `LOTUS_BUGS.md` (2026-07). Compact index of shipped-but-not-live-tested items; the detailed steps are in the lettered sections above._
|
||||
|
||||
Implemented and gate-green; confirm each per `LOTUS_TESTING.md`, then delete the row.
|
||||
|
||||
| ID | Item | File / area | Test |
|
||||
| :--- | :-------------------------------------------------------------------------------------------------------------------------------------- | :------------------------------------------------------------------------- | :---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
||||
| #2 | Chat-background animation flicker (`contain:paint`) | `lotus/chatBackground.ts` | F1 |
|
||||
| #4 | Ringtone re-fixes: classic loudness + caller decline notice (A2 ✓ live) | `CallEmbedProvider.tsx`, `ringtones.ts` | A1,A3,A4 |
|
||||
| #6 | Background vs. seasonal theme mutual exclusion | `state/settings.ts`, `General.tsx` | F2 |
|
||||
| #7 | Composer toolbar touch targets (≥44px) | `room/RoomInput.tsx` | E1 |
|
||||
| #8 | Room Settings horizontal overflow (mobile) | `components/page/style.css.ts` | E2 |
|
||||
| #9 | Modal fullscreen on mobile (`useModalStyle`) | 22+ modal files | E3 |
|
||||
| #10 | Composer not hidden by keyboard (`100dvh`) | `src/index.css` | E4 |
|
||||
| #12 | PiP "All muted" badge re-fixed (was firing on any single mute) | `hooks/useCallSpeakers.ts` | G1 |
|
||||
| N96 | Call-recovery overlay single "Back" button | `call/CallView.tsx` | A7 |
|
||||
| N95 | AFK-monitor mic released on mute (OS indicator clears) | `hooks/useAfkAutoMute.ts` | L1 |
|
||||
| N108 | Maskable PWA icons (Android adaptive) | `public/manifest.json` + `res/android/maskable-*` | L2 |
|
||||
| EC | EC iframe load watchdog + self-heal + recovery UI | `plugins/call/CallEmbed.ts`, `CallView.tsx` | A7 |
|
||||
| N105 | Notification clicks work after tab close (SW `notificationclick` + `showNotification`) | `sw.ts`, `utils/dom.ts`, `ClientNonUIFeatures.tsx` | get a msg notif, close the tab, click it → app focuses/opens + routes to the room |
|
||||
| Gal | MediaGallery lazy-decrypt (true virtualization deferred) | `room/MediaGallery.tsx` | H1 |
|
||||
| a11y | aria-labels: edit-history / reaction / thread / reply | `message/*` (`FallbackContent`, `Reaction`, `Reply`) | I |
|
||||
| P3-8 | Thread Panel (side drawer, chips, threaded receipts, thread composer) | `features/room/thread/*`, `RoomTimeline/RoomInput` | 6-step checklist in LOTUS_TODO §P3-8 |
|
||||
| P4-4 | KaTeX math (`$…$`, `$$…$$`, data-mx-maths; lazy chunk) | `utils/mathParse.ts`, `components/math/` | send `$x^2$`, `$$\int f$$`, `$5 and $10` (stays text), math inside code block (stays text) |
|
||||
| P4-8 | Encrypted-search cache (opt-in toggle, clear button, logout wipe) | `utils/searchCache.ts`, message-search | enable in search panel → search → reload → coverage persists; logout wipes |
|
||||
| N97a | Session blob migration + cross-tab logout sync | `state/sessions.ts`, `useSessionSync` | login on old build → new build migrates; logout in tab A → tab B drops to auth |
|
||||
| P4-1 | Slack-style thread notifications (participating default, All/Mentions/Mute, badge math) | `utils/threadNotifications.ts`, `ClientNonUIFeatures`, `roomToUnread` | 6-step checklist in LOTUS_TODO §P4-1 |
|
||||
| AW-1 | Scheduled-message cancel no longer ghost-sends (error row on failure) | `ScheduledMessagesTray.tsx` | schedule → cancel with network cut → item stays + error; retry works |
|
||||
| AW-2 | Emoji lazy-load (search/autocomplete/recents fill in; board opens fast) | `plugins/emoji.ts` + consumers | first emoji-board open of a session: grid+search populate; reactions still label |
|
||||
| AW-3 | SW precache (repeat-visit near-instant; deploys still picked up immediately) | `sw.ts`, `vite.config.js` | load app twice (2nd = cached assets); deploy → reload picks new version |
|
||||
| AW-4 | Desktop CSP tighten + Escape/panel fixes + thread Jump to Latest | `tauri.conf.json`, Room/ThreadPanel | desktop: boots, avatars/media load, VT323 font renders, location maps embed, calls connect, deep links work |
|
||||
| P3-4 | Accessibility compliance pass (collapsed-msg SR sender, form/overlay labels, typing announce, focus-return, `?` help, jsx-a11y CI gate) | `message/*`, `RoomViewTyping`, `features/shortcuts/*`, `eslint.config.mjs` | LOTUS_TESTING §P — axe-core + VoiceOver/NVDA on the golden path |
|
||||
| P6-1 | Desktop Linux parity (no-sleep in calls, launcher badge), autostart toggle, tray Do-Not-Disturb | `native/power.rs`, `lib.rs`, `useTauriDnd`, `General.tsx` | Linux desktop: no display sleep during a call; tray DND silences notifications; launch-on-login persists; Unity badge (Ubuntu); DND toggle polarity |
|
||||
| P6-2 | EC deafen/screenshare-audio-mute via `io.lotus.set_deafen` (retires the `<audio>.muted` iframe hack) | fork `lotusDeafen.ts`, cinny `CallControl.ts` | AFTER publish+pin-bump: deafen silences remote audio + survives a reconnect / new screenshare / late joiner (the cases the DOM hack failed); screenshare-audio-mute toggles independently |
|
||||
| P6-3 | Forward-to-multiple-rooms (multi-select + partial-failure summary) + live bookmark previews (edits/redactions, snapshot fallback) | `ForwardMessageDialog.tsx`+`forwardContent.ts`, `BookmarksPanel.tsx` | forward one msg to 3 rooms (incl. 1 you cannot post to = partial summary); bookmark then edit shows edited; redact shows deleted; leave room shows snapshot |
|
||||
| P6-4 | HSTS + Permissions-Policy on prod nginx (+ contrib examples) | `matrix/cinny/nginx.conf`, `contrib/nginx`, `contrib/caddy` | after `nginx -s reload`: `curl -sI https://chat.lotusguild.org` shows HSTS + Permissions-Policy; a call (cam/mic/screenshare) + location share still work |
|
||||
|
||||
**Verified working in live testing (2026-06):** A2, B1–B4, C1, C3, D (mic/camera/deafen/screenshare/fullscreen/more-menu/PiP). Denoise quality in D is still poor — tracked under the denoise project, not a regression.
|
||||
|
||||
---
|
||||
|
||||
### Green CI but the fix isn't live?
|
||||
|
||||
-416
@@ -1,416 +0,0 @@
|
||||
# Lotus Chat — Work Backlog
|
||||
|
||||
**Repo:** `lotus` branch at `https://code.lotusguild.org/LotusGuild/cinny`
|
||||
**Deploy:** push to `lotus` → CI → auto-deploy to `chat.lotusguild.org` (~11 min)
|
||||
|
||||
> Completed features are documented in [LOTUS_FEATURES.md](./LOTUS_FEATURES.md). Manual test steps live in [LOTUS_TESTING.md](./LOTUS_TESTING.md). This file is **open work only** — resolved audit findings and shipped-feature write-ups were removed 2026-07 (full history in git).
|
||||
|
||||
Status legend: `[ ]` pending · `[~]` in progress / shipped-awaiting-QA · `[x]` done · `[BLOCKED]` server/upstream-gated · `[DEFERRED]`/`[DROPPED]`/`[WON'T FIX]` decided.
|
||||
|
||||
---
|
||||
|
||||
## ⚠️ TDS DESIGN LAW — READ BEFORE TOUCHING ANY UI
|
||||
|
||||
> **ALL Lotus Terminal Design System (TDS) styling — colors, animations, glows, borders, fonts, spacing — MUST come exclusively from `/root/code/web_template/base.css` CSS variables.**
|
||||
> Do NOT hardcode hex values. Do NOT invent new variable names. Canonical tokens: `--lt-accent-orange`, `--lt-accent-cyan`, `--lt-accent-green`, `--lt-glow-*`, `--lt-box-glow-*`, `--lt-border-color`, `--lt-font-mono`. Syntax-highlight token classes: `.tok-kw .tok-str .tok-num .tok-cmt .tok-fn`.
|
||||
> Reference patterns: `/root/code/tinker_tickets/` (markdown.js, base.js, ticket.css). Applies to every task without exception.
|
||||
> New components must respect both TDS dark (`LotusTerminalTheme`) and TDS light (`LotusTerminalLightTheme`); non-TDS theme work uses vanilla-extract (match `src/lotus-terminal.css.ts`).
|
||||
|
||||
## 🧩 NATIVE-CINNY LAW — EVERY FEATURE MUST FEEL LIKE STOCK CINNY
|
||||
|
||||
> **Every feature must feel native to upstream Cinny — indistinguishable from what the Cinny team would ship.** Reference: <https://github.com/cinnyapp/cinny>.
|
||||
>
|
||||
> - **Use the `folds` design system, not bespoke UI** (`Button`, `Chip`, `IconButton`, `Menu`, `MenuItem`, `Dialog`, `Modal`, `Input`, `Switch`, `Badge`, `SettingTile`, `SequenceCard`, …) and folds tokens (`color.*`, `config.space.*`, `config.radii.*`). **Use folds `Icon`/`Icons`, never literal emoji, in UI chrome.** No hardcoded hex/`rgba()`, no invented CSS variables.
|
||||
> - **Match Cinny's existing patterns** — find the closest existing component/flow and mirror it before adding UI.
|
||||
> - **The ONE exception:** explicit **TDS** features, which follow the TDS Design Law above (opt-in, only in Lotus Terminal mode).
|
||||
|
||||
---
|
||||
|
||||
## ✅ Audit (2026-07) — closed out
|
||||
|
||||
A three-wave feature bug-hunt (~15 parallel agents, each batch independently reviewed) plus a low-tail cleanup. All confirmed 🔴/🟠 and the clean 🟡 tail are **fixed, reviewed, and gate-green**; details in git history + LOTUS_FEATURES. Only the minor items below remain open.
|
||||
|
||||
**Still open (low tail — all 🟡 minor):**
|
||||
|
||||
- ✅ **Low-tail batch FIXED** (`a267e9e9`, 2-agent-reviewed, gate-green): **T5** (`participated` now also scans the local thread timeline, not just the server bundle → no under-notify), **T6** (room "Mentions & Keywords" honored for Default thread replies via a new `roomMentionsOnly` gate → no over-notify; +4 tests), **T7** (thread-mode account-data writes serialized with content carried forward → no lost update), **C-L2** (a real incoming ring cancels a lingering Settings preview), **C-L3** (ringtone AudioContext primed on first page gesture → first ring after cold load not silent), **C-L5** (`useCallSpeakers` depends on a stable boolean → no observer churn on membership change), **F5** (OIDC refresher forwards the refreshed token `expiry` as `expiresInMs` → `expiresAt` no longer stale across reloads). **Verified already-handled, no change:** **N6** (`useMemberAvatar` already subscribes via `useRoomMemberChange`), **H10** (`RoomProfile` already has `maxLength={255}` + surfaces the submit error).
|
||||
- **Calls host (still open):** C-M1 deafen DOM-fallback leaks late-added `<audio>` tracks; C-M2 `.click()`-by-testid toggles no-op if EC renames — **both retire via EC-fork P6-2**. C-L1 AFK mic not released if EC elides the echo; C-L7 all-muted DOM miscount if EC label format differs; C-L8 PiP sw/nw resize anchor jitter at min size. **All four are EC-DOM/echo-behavior or visual-jitter items — need a real call + the EC iframe to verify; deferred.**
|
||||
- **Native/desktop:** D7 Unity badge `application://cinny.desktop` id may not match the installed `.desktop` basename — **runtime-verify** on the `.deb`/AppImage.
|
||||
- **EC fork (EC1–EC6 fixed on `element-call:lotus`, needs a republish):** re-apply `setTimeout` cleanup, remote-gated subscription → `allConnections$`, per-call decoration state leak, re-subscribe-every-render, focus-clear on missing `userId`. Rides with **P6-2 phase 2**.
|
||||
|
||||
---
|
||||
|
||||
## ✅ Shipped — Awaiting Live Verification
|
||||
|
||||
Built and gate-green; verify per [LOTUS_TESTING.md](./LOTUS_TESTING.md), then graduate to LOTUS_FEATURES.md. Includes the **desktop/native Tier A/B stack** (P5-35/36/41/42/43/44/46/47/48/49/55/56/57, P6-1 Linux parity) — all **CI-compile-verified, runtime-verify on Windows/Linux** — plus:
|
||||
|
||||
| Area | Test guide |
|
||||
| :-------------------------------------------------------------------------- | :-------------------- |
|
||||
| Full-Screen Camera Broadcasts (per-participant focus) | A5 / G2 |
|
||||
| Advanced search filters + virtualized infinite scroll | K2 / M1 / M2 / M4 |
|
||||
| Custom Accent Color Picker (non-TDS) · 5 Color Theme Presets | M3 / M5 |
|
||||
| Intersection lazy media loading · context-aware thumbnails | H1 / H2 |
|
||||
| Thread Panel (side drawer) + per-thread notification modes (P4-1) | (thread QA) |
|
||||
| Encrypted message search indexing/caching (opt-in, default OFF) | search backlog |
|
||||
| Remind Me Later · Mobile Bookmarks access | K1 / E5 |
|
||||
| In-Call Soundboard (P5-15) · Quality Controls (P5-31) · Permissions (P5-31) | D2-7 / D2-8 / D2-9 |
|
||||
| Desktop proactive update notifications (P5-40) | J1 |
|
||||
| OIDC/SSO login (P4-6, needs an MSC3861 server — pick mozilla.org on login) | OIDC |
|
||||
| Windows native WinRT toast quick-reply / click-to-open (D6, AUMID) | rich-toast (§backlog) |
|
||||
| Inline media embeds (16 providers: video/audio/post + click-to-play facade) | Q1 / Q2 / Q3 / Q4 |
|
||||
|
||||
---
|
||||
|
||||
## 🔴 Open — Actionable
|
||||
|
||||
### ✅ Discovery pass (2026-07) — DP1–DP18 DONE
|
||||
|
||||
Agent-surveyed + TPVR-verified correctness / a11y / tech-debt fixes (DP1–DP18) are implemented, review-fixed, and gate-green (tsc + eslint + 737 tests + build). Verify per [LOTUS_TESTING.md](./LOTUS_TESTING.md) §R, then remove this note. Full detail in git history — commits `8eb961b6` `db864326` `6cf18c3b` `165714e1` `8c0e2b42` `e545706c` `b1ee3ada` `4fc3f7a3` `101e4116` `4fa4327a` `c2598d21`.
|
||||
|
||||
### ✅ Discovery pass 2 (2026-07) — perf / security / correctness — DONE
|
||||
|
||||
Agent-surveyed findings, each **verified against the code before fixing**, then implemented and gate-green (tsc + eslint + prettier + 857 tests + build), with **two review agents on every staged diff before commit**. Verify per [LOTUS_TESTING.md](./LOTUS_TESTING.md), then remove this note.
|
||||
|
||||
- [x] **PERF-1 — presence: 3 client listeners PER avatar → one shared presence store** (3 listeners total). `8a154051`.
|
||||
- [x] **PERF-2 — `#`-mention autocomplete mutated + re-sorted the shared `allRoomsAtom` every keystroke** → copy + `useMemo` (also fixed a real shared-array mutation hitting ~27 consumers). `4708a179`.
|
||||
- [x] **PERF-3 — read-receipt rows: ~6 global `Members` listeners per row → one shared member-change store** (`useRoomMemberChange`). `1b8f5545`.
|
||||
- [x] **PERF-4 — message-search room filter re-sorted every render** → `useMemo`. `4708a179`.
|
||||
- [x] **PERF-5 — DM-preview `Decrypted` listener ran for every nav item** → gated on `direct`. `4708a179`.
|
||||
- [x] **SEC-1 / SEC-2 — scheduled-message plaintext + recent searches survived logout** → `clearPlaintextCaches()` on both logout paths, extended to the whole `recent_*` family + nav-paths. `726cefb5`.
|
||||
- [x] **SEC-3 — `window.open(_blank)` without `noopener`** → `noopener,noreferrer` at 5 sites (SSOStage excluded — needs the handle). `3e1106b2`.
|
||||
- [x] **SEC-4 — `/acl` self-lockout footgun** → shared `serverAcl.ts` validation, no-brick allow default, fail-closed self-ban guard. `3e1106b2`.
|
||||
- [x] **COR-1 — space-child UNLINK over-deleted** → targeted `UNLINK` reducer action. `fd3b8b42`.
|
||||
- [x] **COR-2 — `useCallJoined` stuck true on 2nd-call embed swap** → re-seed on `[embed]`. `1f80d1d1`.
|
||||
- [x] **COR-3 — incoming-call lifetime guard only corrected future clock-skew** → `Math.abs(...)` (±20s). `ab01d27a`.
|
||||
- [x] **COR-4 — shared notify-dedupe slot double-notified** → key by `roomId|threadId`. `1f80d1d1`.
|
||||
- [x] **COR-5 — upload cancel ignored during retry back-off** → `AbortSignal` threaded into the retry loop. `ab01d27a`.
|
||||
- [x] **COR-6 — `CallControl.forceState` dropped `screenshareAudioMuted`** → passes it. `ab01d27a`.
|
||||
|
||||
**Deferred / decided (not built):**
|
||||
|
||||
- [DEFERRED] **PERF-6 — avatar-decoration `/profile` fetch** — well-guarded (module cache + in-flight dedupe + backoff); a network/HS-load note only. Batch/skip only if it proves costly.
|
||||
- [DEFERRED] **SEC-5 — embeds' `allow-popups-to-escape-sandbox`** — informational; main-app hijack already prevented (no `allow-top-navigation`), and popups are arguably needed for "open in provider." Revisit with per-provider verification if dropped.
|
||||
- **KE-1 preventive (`navigator.storage.persist()`)** is **already implemented** (`initClient` → `requestPersistentStorage()` + `src/index.tsx` boot). The rest of the KE cluster stays under **Encryption / E2EE** below (needs live capture).
|
||||
|
||||
### 🔍 Feature bug hunt (2026-07, 5-agent, LOTUS_FEATURES surface) — open findings
|
||||
|
||||
Per-slice bug hunt (5 agents: theming · calls · messaging · threads/presence/UX · rooms/mod/notif/infra/desktop), each **verified against current code** (already-fixed items not re-flagged; the heavily-audited hot paths came back clean). Residual findings below. `[live]` / `[desktop]` = needs a real call / the desktop app to confirm.
|
||||
|
||||
**Embeds / URL previews**
|
||||
|
||||
- [x] **[Med] Desktop (Tauri) CSP `frame-src` was missing `store.steampowered.com`, `www.mixcloud.com`, `widget.deezer.com`** → the Steam widget (shipped) + new Mixcloud/Deezer embeds were silently blocked (blank iframe) **in the desktop app**. **FIXED** (`cinny-desktop` `daba59b`): all three added to `frame-src` (no `connect-src` — these don't do a client oEmbed fetch). Web was always fine (`frame-src 'self' https:`). Needs desktop-app QA to confirm the widgets render.
|
||||
- [x] **[Low]** `searchCache.ts` encrypted-search index has no size/count cap — unbounded on-disk growth (mitigated by the manual "Clear cached index" + logout wipe). **FIXED** (`fff811cb`): per-room cap of 5000 rows, oldest-by-ts evicted on write via a self-chaining IDB cursor + pure unit-tested `evictCount`. IDB-spec correctness (cursor delete/continue, tx liveness, range bracketing) confirmed by 2 review agents since CI can't run IndexedDB.
|
||||
- [x] **[Low]** `MsgTypeRenderers.tsx` `MLocation` OSM permalink uses raw `geo:` lat/lon substrings, not the validated floats — harmless (URL context, malformed input only). **FIXED** (`8a461610`): permalink uses the `parseFloat`+`isFinite` validated `lat`/`lon` (as the map iframe already did).
|
||||
|
||||
**Voice / video calls**
|
||||
|
||||
- [x] **[Med]** `DenoiseTester.play()` (Settings → Calls A/B model test) leaks the denoise model node — calls `ctx.close()` but never `denoise.dispose()` (inconsistent with `stopLive`, which disposes) → leaks the DeepFilterNet/DTLN worker/WASM per press. **FIXED** (`c9d9d914`): `stopPlayback` now mirrors `stopLive` (dispose model + gate), and a generation token also closes the rapid-click / stop-during-load / unmount-during-load leak windows (3 review passes, all 6 interleavings traced).
|
||||
- [x] **[Med] [live]** PiP auto-spotlight never released on return to the call room — the release branch sits inside the `if (!pipMode) return` guard, so screenshare→PiP→back leaves spotlight forced on and `pipAutoSpotlightRef` stuck `true`. `CallEmbedProvider.tsx:733-744`. **FIXED** (`08e19100`, code-level; still wants live QA): effect guards only on `!callEmbed`, releases whenever `pipMode && pipScreenshare` is false; + ref-reset on embed teardown + deps comment (2-agent reviewed).
|
||||
- [x] **[Low]** DenoiseTester async paths (`getUserMedia`) have no mounted-guard → ctx/stream leak + setState-after-unmount if Settings closes during the mic prompt. **FIXED** (`c9d9d914`): a `mountedRef` guards `startLive`/`startRecord` after the `getUserMedia` await (and `play()` after its model load); the ref is set on mount, not only cleared on unmount, so it survives a StrictMode/Activity remount.
|
||||
- [x] **[Low]** Soundboard 30s safety timeout never cleared on natural clip end (`CallSoundboard.tsx:115`); `PrescreenControls` `PermissionStatus.onchange` not removed on unmount (`PrescreenControls.tsx:22-28`). **FIXED** (`56561627`): per-play timer token cleared on end/unmount (identity-guarded so a stale clip can't disarm a newer one); permission `onchange` detached + `cancelled`-guarded setState.
|
||||
- [ ] **[Low] [live]** Call-to-call switch disposes the embed without an explicit `HangupCall` → possible transient ghost RTC membership until EC's unload-leave fires.
|
||||
|
||||
**Theming / visuals**
|
||||
|
||||
- [x] **[Med]** `invalidateDecorationCache` clears the module cache but has no pub/sub → changing **your own** avatar decoration doesn't update live in already-mounted avatars (timeline/members) until remount. Add a listener set / bump counter. `useAvatarDecoration.ts:67`. **FIXED** (`29ff1654`): per-user listener set notified on invalidation (+ clears the give-up counter); concurrent re-fetches de-dupe via the existing `pending` map.
|
||||
- [x] **[Med/Low]** Decoration picker grid thumbnails use the raw `DECORATION_CDN` constant instead of `decorationUrl()`, ignoring the `VITE_DECORATION_CDN` override → broken thumbnails if decorations are repointed. `ProfileDecoration.tsx:51`. **FIXED** (`29ff1654`): grid uses `decorationUrl(slug)`.
|
||||
- [x] **[Low]** Seasonal "Auto" is computed once at mount (no ticker, unlike NightLight) → won't flip across a holiday-window boundary in a long-lived session. `SeasonalEffect.tsx:100`. **FIXED** (`d416c62b`): hourly re-eval ticker (auto only) + refresh on entering auto; decision extracted to pure `resolveSeasonTheme` + tested.
|
||||
- [x] **[Low]** Selecting seasonal "Auto" while a chat background is set is a silent no-op (asymmetric mutual exclusion — SeasonalEffect early-returns when `chatBackground !== 'none'`). `General.tsx:550`. **FIXED** (`d416c62b`): any active seasonal mode (incl. auto) now clears the chat background; only "off" leaves it (symmetric with the bg picker).
|
||||
- [x] **[Low]** Decoration settings fetch the `/{field}` sub-resource → console 404 for users with no decoration set. `ProfileDecoration.tsx:79`. **FIXED** (`29ff1654`): reads the full `/profile/{userId}` (matching `useAvatarDecoration`); PUT/save path unchanged.
|
||||
|
||||
**Threads / presence / UX**
|
||||
|
||||
- [x] **[Med]** `PresenceBadge` renders DND (`unavailable` + `status_msg:'dnd'`) as a **yellow "Idle"** badge + label, while `PresenceRingAvatar` correctly shows **red** — inconsistent. Give the badge the same `status === 'dnd' → Critical` + "Do Not Disturb" branch. `Presence.tsx:17-59`. **FIXED** (`29ff1654`): badge now matches the ring + settings picker (Critical / "Do Not Disturb", `'dnd'` sentinel line suppressed).
|
||||
- [x] **[Med]** Collapsible-message threshold is hardcoded (`COLLAPSE_MAX_HEIGHT = 320`), but the docs claim it's "configurable in Settings → Appearance (default 20 lines)" — unimplemented. Add the setting + control, or fix the doc. `MsgTypeRenderers.tsx:38`. **FIXED** (doc): LOTUS_FEATURES now describes the fixed 320px (≈20-line) threshold; the full 320px is sensible and a per-user setting wasn't worth the surface — reconciled the doc rather than build a marginal setting.
|
||||
- [x] **[Med/Low]** In-app toast container has no visible cap / scroll — a burst of messages across rooms while focused stacks toasts unbounded and can cover the viewport. Cap visible N or `overflow-y:auto` + max-height. `LotusToastContainer.tsx:223-247`. **FIXED** (`1963222d`): queue capped at 5 in the atom writer (drops oldest non-sticky, never the newest or a sticky action toast) + container maxHeight/overflow + scroll-to-newest; +4 tests. (3 review passes — the 2nd caught a newest-dropped edge when the cap is full of stickies.)
|
||||
- [x] **[Low]** "Unread First" room sort leaves the (larger) read portion unordered — no activity fallback for the equal-unread case. `Home.tsx:213-222`. **FIXED** (`1963222d`): `factoryRoomIdByUnread` breaks ties by recent activity; relocated to `utils/sort.ts` (pure) + unit-tested.
|
||||
- [x] **[Low]** Tab title "(N)" counts mentions, not unread messages (doc says unread) — reconcile doc vs. code. `ClientNonUIFeatures.tsx:120-123`. **FIXED** (doc): the mention-count + unread-dot behavior is intentional (mirrors the favicon); LOTUS_FEATURES now describes it accurately (N = highlights, `·` = other unread).
|
||||
|
||||
**Rooms / moderation / notifications / infra / desktop**
|
||||
|
||||
- [ ] **[Med] [desktop]** `useTauriFocusAssist` never queries the initial OS Focus-Assist state on mount (unlike `useTauriDnd`, which rehydrates via `get_tray_dnd`) → if Focus Assist is already ON at launch, notifications/sounds leak through until the OS state next flips. Add a `get_focus_assist` mount query (confirm whether the native poll emits an initial reading). `useTauriFocusAssist.ts:18-24`.
|
||||
- [x] **[Low]** Push-rule enable toggle holds stale local `useState` after an external rule change (toggled on another device) — sync from the `pushRule.enabled` prop. `PushRuleEditor.tsx:55-79`. **FIXED** (`2c0cd0d2`): `useEffect` resyncs on `pushRule.enabled` change (prop flows from live `useAccountData(m.push_rules)`; no optimistic conflict).
|
||||
- [x] **[Low]** Server-support `.well-known/matrix/support` is fetched from `mx.getHomeserverUrl()` (client-API host) instead of the MXID **server-name** host → silently missing on delegated/split-domain servers. `About.tsx:45-47`. **FIXED** (`2c0cd0d2`): fetched from `https://{mx.getDomain()}` (MSC1929-correct); identical for non-delegated, graceful catch otherwise.
|
||||
- [x] **[Low]** Cleared/partial quiet-hours `time` input (`''` → window inactive) silently disables the window while the toggle still reads "on" — no feedback. `SystemNotification.tsx:364-382`. **FIXED** (`5175c095`): inline Critical hint when the toggle is on but a time field is empty.
|
||||
- [~] **[Low] [desktop]** Native quick-reply swallows send errors (`.catch(() => undefined)`); the `show_rich_toast` trigger has no verified web-side caller. `useTauriToastActions.ts:35-38`. **ROOT CAUSE FOUND + web fix shipped** (`0ddf86c6`): `show_rich_toast` was dead because `showOsNotification` preferred the service worker (WebView2 has one), shadowing the injected `window.Notification` shim. Now skips the SW path under Tauri → notifications route to the rich toast, whose click navigates to the message.
|
||||
|
||||
### 🖥️ Desktop notification rich-toast — follow-ups (activated by `0ddf86c6`, need a Windows build)
|
||||
|
||||
The web-side nav fix (`0ddf86c6`) makes the native rich-toast path live for the first time. It fixes click→navigate, but exposes latent behaviors in the **cinny-desktop Rust** that need a Windows build to fix + verify:
|
||||
|
||||
- [ ] **[Med] [desktop]** **Tag-coalescing lost.** The web SW notification used `tag` to _replace_ prior notifications for the same room; `show_rich_toast` (`cinny-desktop/src-tauri/src/native/toast.rs`) ignores `tag` and shows a new WinRT toast every time → rapid same-room messages stack instead of collapsing. Fix: dedupe/replace by room in the toast store (`toast.rs:226-230`).
|
||||
- [ ] **[Med] [desktop]** **Thread / invite quick-reply misroutes.** The reply target is the coalescing `tag` — `${roomId}:${threadId}` for thread replies, `'lotus-invites'` for invites (`ClientNonUIFeatures.tsx:471,192`) — not a real room id, so `mx.sendMessage(tag, …)` fails silently (`useTauriToastActions.ts:37`). Body-click navigation is correct (uses `path`). Fix: pass the real `roomId` separately (e.g. `data.roomId`) and have the shim (`lib.rs` `NOTIFICATION_BRIDGE`) + `toast.rs` use it for the reply target; keep `tag` for coalescing. Invite toasts should also drop the reply box (nothing to reply to).
|
||||
- [ ] **[desktop QA] Windows notification checklist** (verify `0ddf86c6` + the above): (1) confirm the pre-fix symptom was focus-without-navigate; (2) message toast → click navigates to the message, quick-reply sends to the room; (3) thread toast → navigates, reply currently misroutes (until fixed above); (4) invite toast → navigates to invites; (5) rapid same-room messages → stacking until coalescing restored; (6) AUMID-missing/dev build → plain-notification fallback still shows; (7) web PWA unaffected.
|
||||
- [x] **[Low]** Export-history date-range early-break can over-paginate + mislabel "truncated" in E2EE rooms (`oldestRawTs` only advances on decrypted `m.room.message`, so undecryptable old events never move it). `ExportRoomHistory.tsx:104,136`. **FIXED** (`3ff8fb8e`): boundary now advances on every event (getTs is envelope metadata), above the type/decryption filters; guarded `ts > 0` so a bogus 0-ts can't cause the opposite (silent under-pagination). 2-agent reviewed.
|
||||
- [x] **[Info/doc]** `PolicyListViewer` is a manual room-ID/alias viewer with **no** subscribe/unsubscribe controls and no subscribed-lists listing — `LOTUS_FEATURES.md:1287` describes both. Docs oversell; not a runtime bug. **FIXED** (`8a461610`, doc): LOTUS_FEATURES corrected to describe the read-only room-ID/alias viewer (no subscribe controls).
|
||||
|
||||
### ✅ Composer autocomplete-insert crash (reported 2026-07) — FIXED (`477df4ae`)
|
||||
|
||||
Picking an autocomplete item (mention/emoji/command) occasionally tripped the composer error boundary ("encountered an error" → forced refresh) even though the element inserted. Root-caused (3 agents, incl. a headless slate simulation) to `moveCursor` deferring its cursor work to `setTimeout`, leaving the caret on the just-inserted inline-void's zero-width edge; slate-react's commit-phase `setBaseAndExtent(voidEdge, 1)` then threw `IndexSizeError` mid-render → boundary. **Fix:** do `Transforms.move` (escape the void) + `insertText(' ')` synchronously in the same commit as the insert, so the caret is a resolvable text point when the selection sync runs. Plus a recoverable boundary ("Reload composer" + `onReset` deselect) so any residual composer crash no longer needs a page refresh. (A first "sync insertText without move" attempt was caught in review — the void guard drops the space + traps the caret; `move` is required.)
|
||||
|
||||
### ✅ Unread/read-receipt flakiness (reported 2026-07) — FIXED (pending prod QA)
|
||||
|
||||
Room unread dots were inconsistent: reading a message sometimes cleared the dot, sometimes left it stuck, sometimes it resurrected. Root cause (confirmed by tracing + diffing upstream cinny `dev`): **our own "N4" change.** `handleReceipt` recomputed via `getUnreadInfo`, which reads `room.getUnreadNotificationCount()` — server-computed and **stale on the synchronous synthetic receipt echo** (SDK only zeroes it immediately when the last event is your own message) → it PUT the stale non-zero count back → stuck/resurrecting. Compounded by `hasUnread = !!unread` lighting the dot on any present map entry, incl. phantom `{0,0}` PUTs from our `UnreadNotifications` listener. Plus a Mark-as-Unread (MSC2867) flag that never cleared on opening an already-read room (no receipt → no auto-clear).
|
||||
|
||||
**Fix:** `roomToUnread.ts` — `handleReceipt` reverts to upstream's optimistic `DELETE` on own receipt; reducer collapses `{0,0}` PUT → DELETE. `notifications.ts markAsRead` clears the marked-unread flag directly. `markedUnread.ts onReceipt` gated to main/unthreaded receipts (`myMainReceiptPresent`). Unit tests added; 700/700 pass, typecheck + build clean. Deploy + manual QA (read → dot clears & stays; thread read; mark-unread → open → clears; reconnect no resurrect).
|
||||
|
||||
### 🧨 Encryption / E2EE — ⚠️ EXTREME COMPLEXITY · 🧠 PLANNING SESSION REQUIRED
|
||||
|
||||
Observed live in prod 2026-06-30 during a 2-person **Element Call** (E2EE). These span client rust-crypto (`matrix-js-sdk@41.7.0`) ↔ Synapse ↔ EC MatrixRTC E2EE and are **interrelated** — do NOT spot-fix. **Capture first:** run **Settings → Developer Tools → Crypto Diagnostics** during the next affected call + a synapse-side trace before any fix. (Full runbook was in `LOTUS_E2EE_INVESTIGATION.md`, now in git history.) None are caused by the EC fork work.
|
||||
|
||||
- **KE-1 — OTK upload conflict storm (CRITICAL, root-cause candidate).** `POST /keys/upload` returns `400 M_UNKNOWN: One time key … already exists` continuously — the rust-crypto store and Synapse have **diverged OTK state** (upstream `matrix-rust-sdk#5200`, OPEN: on the 400 the SDK never marks the request sent → re-uploads forever; **not** fixed in 41.7.0). Leading web trigger: cinny never calls **`navigator.storage.persist()`**, so the IndexedDB crypto store is evictable while the `localStorage` session survives → device resurrects with a blank store. **Buildable preventive fix (no call needed):** request persistent storage on login (+ optional multi-tab guard + a 400-loop→recovery prompt). Healing an already-diverged device still needs a clean logout+login.
|
||||
- **KE-2 — EC media keys not arriving/decrypting → audio/video cut out (CRITICAL).** `MissingKey … for participant`, unexpected encrypted to-device `io.element.call.encryption_keys`. Almost certainly downstream of KE-1 (broken Olm sessions). This is the "friend's audio cuts out" symptom.
|
||||
- **KE-3 — Timeline decrypt error: missing `algorithm` field (HIGH).** rust-crypto can't parse a malformed/legacy encrypted event — capture the offending event id + raw content.
|
||||
- **KE-4 — MatrixRTC delayed-event / membership timeouts (MEDIUM-HIGH).** `Restart delayed event timed out`, repeated `msc4157.update_delayed_event` — may be partly HS responsiveness; correlate with synapse latency. Same planning session (shares the call-reliability surface).
|
||||
|
||||
### Security & Privacy
|
||||
|
||||
- **N97 — Access token + device id in plaintext `localStorage`** (`state/sessions.ts`), XSS-exposed. Architectural — needs a token-protection / session-storage redesign.
|
||||
- **Persisted PII without encryption:** user status message + expiry (`Profile.tsx`), unsent composer drafts (`RoomInput.tsx`). Leak risk on shared devices.
|
||||
|
||||
### PWA / Offline / Web Push
|
||||
|
||||
- **N107 — Web Push is non-functional:** `src/sw.ts` has no `push` handler. Needs a `push` listener + Matrix push-gateway integration. **The one substantive remaining feature** (session/crypto groundwork it waited on has landed).
|
||||
- **No app-asset caching strategy** in `src/sw.ts` — no offline capability.
|
||||
|
||||
### Dependencies / Build / Hygiene
|
||||
|
||||
- Build-time: `lotusDenoise` does heavy sequential `fs` in `closeBundle`; `viteStaticCopy` has redundant renames — could be streamlined.
|
||||
- `patch-folds.mjs` edits `node_modules` directly (robust today; `patch-package` considered but more brittle to folds restructuring — WON'T-DO unless it breaks).
|
||||
- `types/matrix/` mirrors SDK types instead of importing them — drift risk; spot-fix highest-risk only.
|
||||
- `contrib/nginx`/`contrib/caddy` examples: headers + `try_files` already synced with prod; the prod nginx `add_header` isn't inherited by cache `location` blocks (pre-existing; SPA entry `/` still gets all headers).
|
||||
- `as any` casts across `src/` — gradual typing cleanup. Keep commits scoped (bisect-friendly). Keep README fork-sync version/logo current.
|
||||
|
||||
---
|
||||
|
||||
## 🌐 Matrix Protocol Gaps
|
||||
|
||||
Genuine Matrix client-spec / MSC features Lotus does **not** yet implement (audited 2026-07 against the codebase — almost everything else is built: pinning, stickers+picker, room directory, mutual rooms MSC2666, blurhash, key backup/recovery/SSSS, SAS verification, ignore list, invite spam-filter, voice messages, polls, threads, spaces, OIDC, extended profiles, delayed events, authed media). Build each **fully** — spec-correct events, native-Cinny folds UI, tests. Order = clean wins first.
|
||||
|
||||
**Phase A ✅ (2026-07, gate-green 683 tests):**
|
||||
|
||||
- [x] **Mark as Unread — MSC2867 `m.marked_unread`.** Room account data `{ unread: true }` (+ unstable `com.famedly.marked_unread`) via `mx.setRoomAccountData`; clear on read. Context-menu item in `RoomNavItem` + light the existing unread dot; integrate `state/room/roomToUnread.ts`.
|
||||
- [x] **Low Priority rooms — `m.lowpriority` tag.** Mirror the favourite impl (`RoomNavItem.tsx:331-337` `setRoomTag/deleteRoomTag` + the favourites category in `home/Home.tsx`): context-menu toggle + a collapsed "Low Priority" category sorted to the bottom, excluded from normal unread nudging.
|
||||
|
||||
**Phase B ✅ (2026-07, gate-green 688 tests):**
|
||||
|
||||
- [x] **Disappearing Messages — MSC1763 `m.room.retention`.** PL-gated room-settings `SettingTile` to set `{ max_lifetime }`; retention badge; a client-side sweep hides/self-redacts own expired events (pattern like the mute-timer restore in `ClientNonUIFeatures.tsx`). True server deletion also wants Synapse `retention:` (LXC 151).
|
||||
- [x] **QR Device Verification — reciprocate QR.** Add the QR path beside emoji-SAS in `components/DeviceVerification.tsx`: render with `qrcode.react` (already a dep), scan via `BarcodeDetector` (fallback `jsQR`); uses the SDK `VerificationRequest` QR/reciprocate support.
|
||||
|
||||
**Phase C (Room Widgets ✅ 2026-07; Sliding Sync ❌ evaluated — parked):**
|
||||
|
||||
- [x] **Room Widgets — MSC1236 + widget API.** No general widget UI exists (only the PL entry `im.vector.modular.widgets`; the EC call widget is hardcoded). Read `im.vector.modular.widgets`/`m.widget` state, add an Add/Manage panel + sandboxed iframe renderer via `matrix-widget-api` — **extend the existing EC widget plumbing** (`plugins/call/CallEmbed.ts`). Enables Etherpad/notes/dashboards/integrations.
|
||||
- **[PARKED] Sliding Sync — MSC3575 / simplified MSC4186** (evaluated 2026-07, 3 research passes). Server side is GA (`simplified_msc3575`), but the **client** side is not viable for a safe rollout: matrix-js-sdk's `SlidingSync`/`SlidingSyncSdk` are `_internal_`/`@experimental` (Element shipped labs-only, never GA in ~2 yrs, moved to the Rust SDK); **presence isn't delivered over sliding sync** (regresses Lotus presence badges/rings/status); **no upstream Cinny impl** to follow; and Cinny's whole nav (sidebar/spaces/DM/unread) is derived from the **full local room set** (`allRoomsAtom` ← `mx.getRooms()`), so ~14 subsystems (4 core) need re-architecting to a server-windowed list. ~10% confidence a full rollout wouldn't break/regress (missing rooms/messages/unread = worst failure class). **Revisit only if we adopt the Rust SDK or accounts grow large enough that startup latency is a real complaint; an off-by-default experimental spike is possible but not recommended.** Full assessment: git plan history.
|
||||
|
||||
**Room Widgets v1 follow-ups:** capability-approval consent prompt (let widgets request send/read room events); Jitsi/stickerpicker special types; account-data (user/sticker) widgets; per-widget popout / always-on-screen. Requires the prod CSP `frame-src` widening (done in `matrix/cinny/nginx.conf` → **`nginx -s reload`**) or external widgets are blocked.
|
||||
|
||||
**Server-gated / advanced (capture, don't build yet):** QR sign-in for a new device (**MSC4108** rendezvous — needs an HS-side endpoint); dehydrated devices (**MSC3814** — offline key delivery, also helps the E2EE KE cluster); E2EE history key sharing on invite (**MSC3061** `shared_history`, niche); voice broadcast (Element MSC3888, low value — skip).
|
||||
|
||||
### [PARKED] Matrix 2.0 call membership — MSC4354 Sticky Events (investigated 2026-07, 3 agents + live infra check)
|
||||
|
||||
Move MatrixRTC/Element Call call-membership from state events (MSC3401) to **sticky events** — the "Matrix 2.0" path. **Not a flag flip; a coordinated rollout. Parked deliberately.**
|
||||
|
||||
Findings:
|
||||
|
||||
- **Server (Synapse 1.157.1, LXC 151):** `msc4354_enabled` defaults `false`. Enabling is **low-risk, additive, reversible** — schema (`sticky_events` table) already ships unconditionally, no migration/backfill, all runtime paths flag-gated, residual rows self-expire ≤1h. The one historical `/sync` EDU-filter bug (#19787) was fixed in 1.155.0; SQLite guard N/A (we're Postgres).
|
||||
- **The flag alone is a no-op for behavior.** Our EC fork (upstream **v0.20.1** base, `@lotusguild/element-call-embedded`, bundled into Cinny at build → fleet upgrades atomically) gates sticky mode behind BOTH server support AND a per-device **developer-settings** radio (`matrix-rtc-mode`, defaults `Legacy`). Enabling the flag only un-greys that radio; no client changes what it sends until a human toggles it.
|
||||
- **Matrix-layer mixed-mode = safe:** js-sdk (v41.6.0) reads + merges sticky and state membership, so cross-mode participants see each other.
|
||||
- **Open risk before any real rollout:** media layer. Sticky mode drops `livekit_alias` + uses lk-jwt-service `/get_token` (slot `m.call#ROOM`); legacy uses `/sfu/get` (`room=roomId`). Both endpoints are **live** on our lk-jwt-service, but whether they resolve to the **same LiveKit room** is unverified — must confirm with a **two-account cross-mode test call** (one device `Matrix_2_0`, one `Legacy`) before changing the default, else split-at-media.
|
||||
|
||||
To actually adopt (future): (1) enable `msc4354_enabled: true` + restart; (2) two-account media-interop test; (3) if unified, flip EC default mode `Legacy`→`Compatibility`/`Matrix_2_0` in the fork + redeploy; (4) keep legacy fallback during transition. **No user benefit until step 3.**
|
||||
|
||||
### [ ] Matrix 2.0 call membership — MSC4354 sticky events (INVESTIGATED 2026-07, deliberately NOT enabled)
|
||||
|
||||
3-agent investigation after the 1.157.1 upgrade (EC-fork behavior · Synapse/upstream readiness · client-fleet composition). **Conclusion: leave `msc4354_enabled` OFF for now** — enabling it is safe but delivers **zero user-visible benefit on its own**, and introduces a latent footgun.
|
||||
|
||||
**Why it's a no-op alone:** the EC fork's `doesServerSupportUnstableFeature(MSC4354)` probe feeds **exactly one thing** — whether the "Matrix 2.0" radio in **Developer Settings** is greyed out (`DeveloperSettingsTab.tsx:349-353`). The real switch is the per-device `matrixRTCMode` setting (`settings.ts:149-152`), which **defaults to `Legacy`** and never auto-enables. Sticky sending is gated at `LocalMember.ts:862` (`unstableSendStickyEvents: mode === Matrix_2_0`). So flipping the server flag changes nothing any client sends.
|
||||
|
||||
**Verified safe:** Synapse-side is **additive and cleanly reversible** — the `sticky_events` schema ships unconditionally (no migration/backfill on enable), every write/read/serialize/replication path is flag-gated, disabling stops it instantly and residual rows self-expire ≤1h. The one relevant bug (#19787 `/sync` EDU-filter) was fixed in 1.155.0; the SQLite<3.40 guard doesn't apply (we're on PG 17.10). Matrix-layer **mixed-mode visibility is safe**: js-sdk `collectMembersEvents` reads **both** sticky and state membership and merges them, so sticky-mode and legacy-mode participants see each other. Our `lk-jwt-service` already serves **both** JWT endpoints (legacy `/sfu/get` **and** the sticky-mode `/get_token` — both probed live, 400-with-validation-error = present). EC is bundled into cinny's build (`@lotusguild/element-call-embedded`), so the fleet upgrades **atomically** — the "all EC clients ≥ v0.17.0" precondition is structurally guaranteed for our own users.
|
||||
|
||||
**The one unresolved risk (blocks a real rollout, not the flag):** sticky mode drops `livekit_alias` and uses `/get_token` (slot `m.call#ROOM`) while legacy uses `/sfu/get` (`room=roomId`). **Whether both resolve to the same LiveKit room is a property of lk-jwt-service, not the client** — unverified. If they diverge, cross-mode participants appear in each other's member list but are **split at the media layer** (silent, no error). Requires a **two-account test call** (one device on Legacy, one on Matrix 2.0) to confirm before anyone relies on it.
|
||||
|
||||
**If we ever do this:** (1) run the two-account media-interop test; (2) only then consider enabling `msc4354_enabled: true` in `/etc/matrix-synapse/homeserver.yaml` (LXC 151) + restart; (3) treat a default-mode change as a separate coordinated EC rollout. MSC4354 is still **OPEN upstream** (not in FCP, `needs-implementation`), so this stays experimental regardless.
|
||||
|
||||
### Remaining spec/MSC gaps (2026-07 full-surface survey)
|
||||
|
||||
After Phases A–C the client spec is ~complete. What's left, flagged by **what unblocks it**:
|
||||
|
||||
**✅ Buildable NOW (client-only, no server/infra change):**
|
||||
|
||||
- [ ] **Custom room tags / sections** — user-defined room categories in the sidebar via standard `u.*` room tags (beyond the built-in Favourite / Low-Priority). Mirrors the favourite/low-priority category pattern (`RoomNavItem` context-menu + `Home.tsx` categories). _Medium._ The only substantive client-only feature left.
|
||||
|
||||
**🔧 Needs INFRASTRUCTURE (NOT a Synapse-flag flip — you'd have to stand it up):**
|
||||
|
||||
- **Invite by email / 3PID invite** — we invite by Matrix user-ID only (`mx.invite` is user-ID-only). Email invites need an **identity server** (lotusguild runs none). Build only if an identity server is deployed.
|
||||
- QR sign-in for a new device (**MSC4108**) — needs a **rendezvous** endpoint. Dehydrated devices (**MSC3814**) — needs server support. (Also listed above.)
|
||||
|
||||
**🚫 BLOCKED until a Synapse upgrade enables the flag** — re-run `/_matrix/client/versions` `unstable_features` after each upgrade; client work is ready the moment the flag flips. See the **Blocked Features** section below:
|
||||
|
||||
- Live Location Sharing (**MSC3489** + **MSC3672** — both `false`)
|
||||
- Reaction / relation redaction (**MSC3892** — `false`)
|
||||
- ~~Room preview before joining (MSC3266)~~ — **DONE** (client was always built; unstable `im.nheko.summary` endpoint returns 200 — verified on 1.156)
|
||||
- Thread subscriptions (**MSC4306** — `false`)
|
||||
|
||||
**Niche / low-value (noted, not planned):** E2EE history-key-on-invite (MSC3061), voice broadcast (MSC3888), a native account-deactivation flow (currently delegated to the OIDC provider for OIDC accounts).
|
||||
|
||||
**Already implemented (verified, not gaps):** space reordering (drag — confirmed working in the desktop client), pinning, stickers + picker, room directory, mutual rooms (MSC2666), blurhash, key backup / recovery / SSSS / cross-signing / key export-import, SAS **and** QR verification, ignore list, invite spam-filter, voice messages, polls, threads + per-thread notifs, spaces, OIDC, extended profiles, delayed/scheduled events, authed media, report user/room/message, 3PID contact-info display, disappearing messages, mark-unread, low-priority, room widgets.
|
||||
|
||||
---
|
||||
|
||||
## 📋 Open Feature Backlog
|
||||
|
||||
### [ ] Basic in-app audio editor / video→audio extractor (LARGE PROJECT)
|
||||
|
||||
A minimal audio editor for soundboard clips and voice content. Scope: (1) **trim/clip** an audio file to a chosen start/end (waveform scrubber, in/out handles); (2) **upload a video file → strip and discard the video track, keep only the audio** (extract audio, then the source video is dropped — never uploaded/stored); (3) minimal edits only (trim, maybe gain/normalize, fade in/out) — not a full DAW. Likely Web Audio API (`AudioContext.decodeAudioData` → trim `AudioBuffer` → re-encode) + `MediaRecorder`/an encoder for output; video demux via a `<video>`+`MediaElementSource` capture or ffmpeg.wasm (weigh bundle cost). Feeds the soundboard uploader (`utils/soundboardClips.ts`, `SoundboardPackEditor`) and attachments. Design under TDS + native-cinny law. Big build — plan a dedicated session; evaluate ffmpeg.wasm size/CSP (wasm) before committing.
|
||||
|
||||
### [x] P4-4 · Math / LaTeX Rendering — DONE
|
||||
|
||||
Rendering shipped (KaTeX, `$…$`/`$$…$$` + spec `data-mx-maths`, lazy-loaded,
|
||||
`<pre>/<code>`-guarded) — see LOTUS_FEATURES.md. **Outgoing cross-client interop
|
||||
added (2026-07):** the composer now emits spec `data-mx-maths` HTML on send
|
||||
(`editor/output.ts`, reusing `splitMathSegments`), so math a Lotus user types
|
||||
renders on Element and every other client, not just Lotus. Deferred: multi-line
|
||||
block `$$…$$` (spans editor paragraph nodes) still renders on Lotus via the
|
||||
plain-body `$…$` path only.
|
||||
|
||||
### [~] P5-20 · Quick Reply from Browser Notification (partial)
|
||||
|
||||
Done: notifications show the real body, click navigates to the specific event + focuses the tab. **Remaining:** inline reply via Notification Actions API needs the SW `push`+`notificationclick` pipeline (switch `new Notification()` → `serviceWorkerRegistration.showNotification()` so the SW receives `notificationclick`; on `event.action==='reply'` POST `m.room.message` with the stored `{roomId, threadId}`). Ties into N107.
|
||||
|
||||
### [~] P5-30 · Advanced ML Noise Suppression — open verification
|
||||
|
||||
Shipped in the EC fork (DeepFilterNet3 default-capable / DTLN / RNNoise / Speex; AEC on, AGC off for ML tier; never-silent watchdog). **Open:** real-call by-ear **A/B** — model choice, `lotusDenoiseFloor`, AGC on/off (LOTUS_TESTING §D2-1 / J2). **GTCRN (deferred):** tiny MIT 16 kHz model beating RNNoise, but no drop-in browser package — needs `onnxruntime-web` in a Web Worker behind a custom AudioWorklet ring-buffer (ORT can't run in an AudioWorklet, issue #13072); ~1-week build. Revisit only if low-power quality proves insufficient. HW-gated (FRCRN/Maxine) = desktop-Rust-only future.
|
||||
|
||||
### [~] P6-2 · Element Call fork — retire remaining DOM hacks (Phase 2 needs publish)
|
||||
|
||||
Phase 1 shipped: `io.lotus.set_deafen` (LiveKit-source deafen/screenshare-audio-mute) replaces the brittle `<audio>.muted` iframe hack; cinny sends it join-gated alongside the transitional DOM fallback. **Phase 2 (blocked on user npm publish):** publish fork `0.20.1-lotus.2` → bump cinny pin `lotus.1`→`lotus.2` → delete the `CallControl.ts` `.muted` fallback + the EC1–EC6 fixes ship. **Deferred pieces (P6-2b):** the `useCallSpeakers` DOM-scrape is a dormant fallback behind `io.lotus.call_state`; `.click()`-by-`data-testid` UI toggles are low-value fork surface. Divergence to confirm: deafen doesn't silence soundboard/`Unknown`-source audio (setVolume type limit).
|
||||
|
||||
### [~] Mobile audit — code-level pass DONE (device QA + deferred items open)
|
||||
|
||||
Comprehensive **code-level** responsive audit of the LOTUS_FEATURES surface (12 survey agents — 6 area slices + 6 deep per-feature dives — each finding verified, fixed in reviewed batches, then a 5-agent all-files regression+efficacy gate; gate-green tsc/eslint/857 tests/build). Shipped `lotus` commits `d6159997` `836e4a66` `4c298a36` `09415f95` `36fdbdd3` `154e35ef` `09f37f89` (M1–M6 + N1–N2): message-table/composer/call-bar/url-preview/explore overflow fixes; full-screen media/file/avatar viewers + touch-pan for zoomed images; full-screen scrollable member profile (+close btn); native SettingsSelect + tile-body volume sliders + measured GifPicker; full-screen Report/"Seen by" dialogs + full-width toasts + popover clamps; **image/video aspect-ratio (no crop/letterbox on phones)**; 44px room-row + space-rail touch targets. The app was found **structurally sound** on mobile (thread panel, dialogs, drawers, settings shells, ACL/widgets/search/QR/auth all already responsive).
|
||||
|
||||
Intentional desktop deltas (disclosed, non-regressive): volume sliders below labels; Report dialog 380→480px & "Seen by" modals 460→360px (sibling-modal normalization); translate select → folds SettingsSelect.
|
||||
|
||||
**NOT done — needs a real device / product decisions (open):**
|
||||
|
||||
- [ ] **Runtime mobile QA** — none of the above is validated on an actual phone (static analysis only). Needs device/devtools walk-through per LOTUS_TESTING §E.
|
||||
- [x] **Element Call fork in-call mobile UI** — DONE (`element-call:lotus` `e36aef8a`, 3-agent survey + 2-agent review). Fixed the EC iframe's own phone UI: footer control row wraps so hangup can't clip (320–500px), portrait 1:1 self-PiP safe-area inset, 44px camera-flip + reaction-picker targets, settings-tab horizontal scroll, landscape spotlight filmstrip. All mobile-gated (EC is mobile-first CSS). Rides to users on the next fork republish (P6-2). Runtime on-device QA still pending (needs a phone).
|
||||
- [ ] **M2 — touch discoverability** — message quick-reactions/actions are hover-gated; long-press is the fallback but is **unreliable on iOS Safari** (deep audit). A visible touch affordance is needed but the naive fix hides unread badges / clutters messages (member-profile-style redesign).
|
||||
- [~] **Sub-44px touch-target sweep** — primary controls DONE via a shared `MobileTouchTarget` `@media` class (`P1`, `8a1168bc`): in-call bar ×7, call-status bar ×4, thread "N replies" chip, knock Approve/Deny, ACL remove. Secondary batch DONE (`r2`, `72e7447d`): image-viewer close/zoom±/zoom%/download, embed-player Close/Collapse/Fullscreen/View-post, read-receipt "seen by" pill. **Deferred (rationale, not built):** PiP fullscreen/resize handles — enlarging four 24px corners to 44px would swallow a ~160px mobile PiP and block "Return to call" (needs a design rethink, not a blunt bump); presence dot is a non-interactive status indicator (no target needed).
|
||||
- [x] **Avatar-decoration `prefers-reduced-motion`** — DONE (`P2`, `c3e1fbff`): renders just the avatar (no animated APNG overlay) under the preference; no static-frame asset to freeze to.
|
||||
- [x] **Twitch/Twitter/TikTok preview cards** — DONE (`r2`, `72e7447d`). These fragment cards render header/thumbnail beside content as direct children of the `UrlPreview` flex row; added `StackOnMobile` (mobile-only `@media (max-width:750px){ flex-direction:column }`) scoped to those variants via `cardClass`. folds `Box` has no default `direction` so the override wins uncontested; desktop unchanged (verified by 2 review agents). Pre-existing desktop quirk (header bar beside content on Twitter/TikTok at desktop width) left as-is — the fuller fix is wrapping each card body in a column `Box`; out of scope for a mobile pass.
|
||||
- [ ] **M2 — message action/quick-reaction touch discoverability** — hover-gated + iOS-long-press-unreliable; a visible touch affordance collides with unread-badge placement / per-message clutter → needs a design decision + device look.
|
||||
|
||||
### [ ] Inline media embeds — remaining providers (LOW PRIORITY)
|
||||
|
||||
The inline embed system (`videoEmbed.ts`) covers 18 providers (16 + Mixcloud/Deezer); three more were **deliberately deferred** (verified against 2026 docs by review agents):
|
||||
|
||||
- **Bandcamp** (highest-value audio add) — needs an **oEmbed** round-trip: the player URL requires numeric `album`/`track` item ids that aren't in the page URL (`bandcamp.com/oembed` is the resolver; mirror the `TikTokEmbedCard` on-click oEmbed pattern). CSP `frame-src`: `bandcamp.com`. Classify `kind: 'audio'`.
|
||||
- **SoundCloud `on.soundcloud.com` short links** — the `w.soundcloud` widget resolver does **not** follow the redirect; needs the same on-click oEmbed resolve (`soundcloud.com/oembed`, CORS-enabled) to get the canonical URL. (Canonical `soundcloud.com/{user}/{track}` links already work.)
|
||||
- **Vimeo `event/{id}` (live events) + `ondemand/…`** — event embed host is `vimeo.com` (**not** `player.vimeo.com`, so it needs a new CSP `frame-src` host); on-demand is paywalled and doesn't embed for non-purchasers. Low ROI — only do the event case if `vimeo.com` is widened for another reason.
|
||||
|
||||
Also open (from the quality review): a real `onError`/error-state fallback for iframes that fail to load (deleted post / region lock / X login-wall) — cross-origin frames don't fire `onError` reliably, so this needs a load-timeout heuristic; the Close button + badge link are the current escape hatch.
|
||||
|
||||
**✅ Steam detailed embed (2026-07, 2-agent review) — `ef82650c`.** `store.steampowered.com` content URLs get rich cards: **app** pages → OG capsule header + click-to-play facade → Steam's official `/widget/{id}` store iframe (live region-aware price / discount % / Buy on Steam, gated by `inlineMediaEmbeds`); **news/announcement** → banner + headline + body-preview card; **bundle/sub/dlc** → OG store card. `getSteamTarget`/`steamWidgetEmbedUrl` in `videoEmbed.ts` (+tests). Grounded in prod CSP (`frame-src https:` allows the widget with no infra change; images via homeserver `mxc`; NO client-side Steam API — `connect-src` + Steam CORS both block it, which is the honest ceiling: no review scores/genres/screenshots client-side). **Needs on-device QA:** the live widget iframe height/fit (can't render headlessly) — verify the price/Buy stay visible on desktop-wide and phone.
|
||||
|
||||
**✅ GIF previews now animate + Mixcloud/Deezer embeds (2026-07, 2-agent review) — `4154cae5`.** Reported live: a `media.giphy.com` link "shows the gif's image but doesn't play it." Root cause: **Synapse's `/thumbnail` endpoint flattens animated GIFs to a still first frame**, and every preview image went through it. `GifCard` (Giphy/Tenor) + the generic OG card now request the **original** via `/download` (`mxcUrlToHttp` with no width/height) when the preview is a GIF (`og:image:type === 'image/gif'` or a `.gif` pathname). Guarded: `shouldServeGifOriginal()` keeps the frozen thumbnail past a **10 MB** `matrix:image:size` cap, and the generic card's eager `<img>` gained the `loading="lazy"` it was the only preview image missing. Also added **Mixcloud + Deezer** audio embeds, and fixed Deezer podcasts (they live at `/show/<id>`, **not** `/podcast/<id>` — the latter 404s on Deezer's own oEmbed; verified against the live API). **Needs on-device QA:** confirm a large GIF still animates and doesn't stall the timeline.
|
||||
|
||||
**✅ Embed bug hunt (2026-07, 3 survey agents + 2-agent review) — `f2673eff`.** Core posture verified **sound** (iframe sandbox, `useIframeAutoHeight` postMessage origin+source trust, no XSS/`dangerouslySetInnerHTML`, `rel="noreferrer"` on all 21 links, oEmbed no-SSRF, the whole facade→iframe/abort/observer lifecycle). Fixed: Twitch/Kick/SoundCloud/Streamable reserved-path over-match (utility pages rendered as broken players), Vimeo hash over-capture (`[0-9a-f]{6,}`), Spotify/Steam/Discord/IMDb `og:image` now via `mxcUrlToHttp` (was a broken raw `mxc://` `<img>` + a pre-click 3p-request facade bypass), `wide` class follows the og:url-resolved embed, Twitter host alignment (`mobile.twitter.com`/`/statuses/`), URL de-dupe.
|
||||
|
||||
**Deferred / surfaced from the hunt (not fixed — decide before doing):**
|
||||
|
||||
- **Security-vs-functionality tradeoff (needs a call):** drop `allow-popups-to-escape-sandbox` and/or `clipboard-write` from `EMBED_SANDBOX`/`allow=` on embed iframes — real hardening against a _compromised_ provider (phishing popup / clipboard hijack), but risks breaking a legit provider popup/copy on the trusted major providers we embed. Low marginal value; not shipped blindly.
|
||||
- **Defense-in-depth:** `encodeURIComponent` the Bluesky authority + Apple Music path/search interpolated into the embed `src` (not currently exploitable — host is fixed and value comes from `URL.pathname`; React escapes the attribute).
|
||||
- **Out of embed scope (real, low-sev):** `LotusDenoiseFeature` (`ClientNonUIFeatures.tsx`) has a `window` `message` listener with **no origin/source check** → any frame/window can post `{type:'lotus-denoise-status', error}` and pop a forged **"System"** toast (text only, no XSS). Validate `event.source`.
|
||||
- **Lifecycle Lows (cosmetic/latent):** a re-fetch flips a playing embed back to the spinner (latent — url is keyed); auto-height retained across close→reopen; `extractEmbedHeight` generic `.height` fallback accepts any allowed-origin message; `TweetEmbed` theme is a one-time `matchMedia` snapshot (no live theme switch); host-normalization gaps (`vt.tiktok.com` misses `StackOnMobile`, `m.instagram.com`, `www.youtu.be`).
|
||||
|
||||
### Deferred / dropped (decided — kept for context)
|
||||
|
||||
- **[DEFERRED] P5-51** Federated "Identity Contexts" (session isolation) — multi-sprint, touches auth/crypto/storage core; smaller intermediate step = plain multi-account switch. **[DROPPED] P5-52** per-room sync governor — js-sdk can't truly per-room filter `/sync`; only a cosmetic hide. **[DEFERRED] P5-53** local scripting plugin — prefer a declarative automation-rules feature (no arbitrary code). **[DEFERRED] Audit-3** profile banner — MSC4427 open/unmerged; revisit on merge. **[WON'T FIX] P5-50** Windows HW media pipeline (WebRTC decode lives in WebView2; not injectable). **[MOVED] P5-9** LFG → LotusBot `!lfg`.
|
||||
|
||||
---
|
||||
|
||||
## 🚫 Blocked Features (server / upstream gated)
|
||||
|
||||
Re-run `/_matrix/client/versions` + `unstable_features` after each Synapse upgrade. **Re-checked on 1.157.1 (2026-07-23): no change — all four below are still `false`.** The 1.156.0→1.157.1 delta unblocked nothing (it's a bugfix release; the only feature-bearing release in the gap was 1.156.0, which we were already running).
|
||||
|
||||
- **[BLOCKED] Live Location Sharing** (MSC3489 + MSC3672 both `false`) — real-time GPS beacons over the existing static share.
|
||||
- **[BLOCKED] Reaction/Relation Redaction** (MSC3892 `false`) — remove a reaction without redacting the parent; current full-redaction fallback is acceptable.
|
||||
- **[DONE 2026-07] Room Preview before joining** (MSC3266) — the client was always built (`JoinBeforeNavigate` → `RoomCard` via `mx.getRoomSummary`). The earlier "blocked" flag was a **misdiagnosis**: it tested `/v1/rooms/{id}/summary` (404), but the SDK calls the _unstable_ `im.nheko.summary/summary/{id}` path, which returns **200** with name/topic/members/join_rule. Verified live after the 1.156 upgrade; also added a join-rule/encryption chip + Request-to-join for knock rooms to the preview card.
|
||||
- **[BLOCKED] Thread Subscriptions** (MSC4306 `false`) — "Follow thread" button (depends on the shipped Thread Panel).
|
||||
|
||||
---
|
||||
|
||||
## 📖 Reference
|
||||
|
||||
### Server Capabilities (as of 2026-07)
|
||||
|
||||
- **Homeserver** `matrix.lotusguild.org` · **Synapse** `1.157.1+trixie1` (upgraded 2026-07-23 from **1.156.0** — note the host was found on 1.156.0 while the docs claimed 1.155.0, so **always verify with `dpkg-query -W matrix-synapse-py3`**, don't trust the docs; apt package on Debian 13, LXC 151) · **Matrix spec** up to `v1.12` (Synapse still advertises v1.12; MSC features via `unstable_features`).
|
||||
- **MSC ON** (re-dumped live from `/_matrix/client/versions` on 1.157.1): `msc4140` · `msc3771` · `msc3440.stable` · `msc4133.stable` · `simplified_msc3575` · `msc4222` · `msc3266` (room summary live at unstable `im.nheko.summary/summary/{id}` — 200; the `/v1/rooms/{id}/summary` path is still 404) · `msc3401_matrix_rtc` · `msc2285.stable` · `msc3827.stable` · `msc3981` · `msc4380.stable` · `msc4445` · `msc2659.stable` · `msc2666` · `msc2432` · `e2e_cross_signing` · `label_based_filtering`. **OFF/blocked:** `msc4306` · `msc3882` · `msc3912` · `msc4155` · `msc3489`/`msc3672` · `msc3892` · `msc4028` · `msc4069` · `msc4108` · `msc3391` · `msc4354` (sticky events — **deliberately off**, see the Matrix 2.0 section above) · `msc4143` (RTC foci — **not a gap**: LiveKit is discovered via `.well-known` `org.matrix.msc4143.rtc_foci`, confirmed live, not this flag).
|
||||
- **Dead client code:** Synapse 1.157.0 **removed** `msc3861` (MAS auth delegation) entirely — the ~6 `msc3861`/`msc2965` references in `src/` can never activate against this homeserver (we auth via Authelia `oidc_providers`). Harmless, but cleanup material.
|
||||
- **Live endpoints:** Report User (MSC4260) **200** ✅ · Report Room (MSC4151) ✅.
|
||||
- **Homeserver access (audits):** Synapse = LXC 151 (`pct exec 151 -- bash`), config `/etc/matrix-synapse/homeserver.yaml`. Web deploy = LXC 106. Voice guard = `voice-limit-guard.py` on LXC 151.
|
||||
- **SDK notes:** no arbitrary profile-field methods (use `mx.http.authedRequest()` for MSC4133); js-sdk can't per-room filter `/sync`; sanitizer strips `<math>`/MathML; SW exists at `src/sw.ts`; `getMatrixToRoom()` builds invite URLs; EC audio-inject unblocked via the fork's `io.lotus.inject_audio`.
|
||||
|
||||
### Key File Reference
|
||||
|
||||
| What | File | Lines |
|
||||
| ------------------------------ | ------------------------------------------------------------------- | ------------------- |
|
||||
| Global keydown / room nav | `hooks/useKeyDown.ts` · `hooks/useRoomNavigate.ts` | whole / 19-72 |
|
||||
| Room unread counts atom | `state/room/roomToUnread.ts` | `roomToUnreadAtom` |
|
||||
| Overlay portal provider | `pages/App.tsx` · `index.html` | 65 / 101 |
|
||||
| Room settings tabs | `features/room-settings/RoomSettings.tsx` | 27-56 |
|
||||
| State event read/write pattern | `features/common-settings/general/RoomEncryption.tsx` | 42-52 |
|
||||
| Power levels | `hooks/usePowerLevels.ts` | whole |
|
||||
| Slash commands | `hooks/useCommands.ts` | 140-537 |
|
||||
| Chat background picker/defs | `features/settings/general/General.tsx` · `lotus/chatBackground.ts` | 945-981 / whole |
|
||||
| Matrix.to URL builder | `plugins/matrix-to.ts` | `getMatrixToRoom()` |
|
||||
| Media URL conversion | `utils/matrix.ts` | `mxcUrlToHttp()` |
|
||||
| Search pagination / virtual | `features/message-search/{useMessageSearch,MessageSearch}.tsx` | 74-121 / 234-365 |
|
||||
| Call mic control | `plugins/call/CallControl.ts` | 206-212 |
|
||||
| Knock support check | `utils/matrix.ts` | 376-391 |
|
||||
| Notification mute push rules | `hooks/useRoomsNotificationPreferences.ts` | 110-150 |
|
||||
|
||||
### Element Call fork — operational reference
|
||||
|
||||
Fork = `LotusGuild/element-call` (branch `lotus`, upstream base **v0.25.0** since the 2026-09 sync — was v0.20.1); cinny consumes the npm package `@lotusguild/element-call-embedded` (built bundle copied into `public/element-call/`).
|
||||
|
||||
**Toolchain (upstream-driven, accepted 2026-09):** Node ≥ 22.13 (`.node-version` = 24) and **pnpm 11**, installed directly (`npm i -g pnpm@<packageManager version>`, currently 11.21.0) — **not** via `corepack enable`: `matrix-js-sdk` is a git dependency pnpm builds from source, and its own devEngines pins pnpm 11.9.0; a corepack-shimmed pnpm refuses to switch for that nested install and `pnpm install` fails (fork CI run #1854). pnpm 10 rejects the lockfile and Node 20 cannot build. Lint is **oxlint + oxfmt** (upstream dropped eslint/prettier in v0.25.0): `pnpm lint` (tsc + oxlint + knip) and `pnpm format:check` / `pnpm format`. `matrix-js-sdk` is pinned to a `matrix-org/matrix-js-sdk#develop` commit in the lockfile, as upstream ships it. Fork CI (`.gitea/workflows/ci.yml`) hard-gates lint + format + `pnpm test:unit` before build, with `concurrency: cancel-in-progress`.
|
||||
|
||||
**Publish a new version (CI on tag push; needs the `NPM_PUBLISH_TOKEN` org secret):** the published version is derived from the git tag — bump `embedded/web/package.json` (currently `0.25.0-lotus.3`, published by CI; the secret is `NPM_PUBLISH_TOKEN`, names starting `GITEA_` are reserved), push `lotus`, then `git push lotus v0.25.0-lotus.1`; the `publish` job builds and publishes to the Gitea registry. Always push (never delete) the annotated `vX.Y.Z-lotus.N` tag for every published version. Then in cinny bump the `@lotusguild/element-call-embedded` pin (currently `0.25.0-lotus.3`) → `npm install` → build. Manual fallback: `pnpm run build:embedded && cd embedded/web && npm version <ver> --no-git-tag-version && npm publish`.
|
||||
|
||||
**`io.lotus.*` widget actions** (add new toWidget actions to the enum + `LOTUS_TO_WIDGET_ACTIONS` in `src/lotus/lotusActions.ts`; only send AFTER call-join or a 10s timeout fires):
|
||||
|
||||
| Action | Dir | Purpose | Module |
|
||||
| :--------------------------- | :------ | :----------------------------------------------------- | :-------------------- |
|
||||
| `io.lotus.call_state` | EC→host | speaker/mute/camera stream (`lotusCallState=1`) | `lotusCallState.ts` |
|
||||
| `io.lotus.focus_participant` | host→EC | spotlight (works during screenshare) | `lotusFocus.ts` |
|
||||
| `io.lotus.inject_audio` | host→EC | soundboard clip mixed into call (`lotusAudioInject=1`) | `lotusAudioInject.ts` |
|
||||
| `io.lotus.set_quality` | host→EC | audio/screenshare bitrate/fps caps | `lotusQuality.ts` |
|
||||
| `io.lotus.decorations` | host→EC | in-call avatar decorations | `lotusDecorations.ts` |
|
||||
| `io.lotus.set_deafen` | host→EC | LiveKit-source deafen (P6-2) | `lotusDeafen.ts` |
|
||||
|
||||
Also flag-gated: `lotusTransparent`/`lotusTheme`, `lotusDenoiseSource=1` (in-source ML denoise).
|
||||
|
||||
### CI/CD + per-feature checklist
|
||||
|
||||
```
|
||||
edit → commit → git push origin lotus
|
||||
→ Gitea Actions (.gitea/workflows/ci.yml): npm ci → build + npm test + tsc + eslint + prettier (ALL hard gates) → audit + bundle-size (informational)
|
||||
→ lotus_deploy.sh on LXC 106 polls the "Build & Quality Checks" status → npm ci && npm run build → rsync → live (~11 min)
|
||||
(a push that lands while a deploy is mid-build is queued and deployed right after — matrix@b6ea4a3; before that it was dropped)
|
||||
```
|
||||
|
||||
Before marking a feature complete: `npx tsc --noEmit` (0 errors) · `npx eslint src/` (0 new) · `npx prettier --check src/` · `npm test` (Node runner via tsx, hard CI gate — colocated `*.test.ts`) · update `README.md`/`landing/index.html` for Lotus-custom features · visually verify on `chat.lotusguild.org`.
|
||||
|
||||
**CI hardening (2026-07, reviewed):**
|
||||
|
||||
- [x] **Concurrency** — `cancel-in-progress` on cinny `ci.yml` and cinny-desktop `release.yml` (`386a2979` / `c5461ce`): a superseded lotus push cancels its in-flight web CI and collapses queued ~30-min Tauri desktop builds to just the newest. Safe for deploys because `lotus_deploy.sh` now **follows origin/lotus HEAD** each poll iteration + resets to the gated SHA (`matrix` `c15a489`) — closes the latched-SHA freeze race.
|
||||
- [x] **Hard quality gates** — typecheck/eslint/prettier promoted from `continue-on-error` to blocking (tree held clean). eslint gates on errors only; `no-explicit-any` warnings stay informational.
|
||||
|
||||
**CI follow-ups (open):**
|
||||
|
||||
- [ ] **Dedicated `desktop-linux` runner** (infra) — concurrency only collapses _burst_ stacking; a single in-flight `build-linux` (Tauri, `ubuntu-latest`) still shares the runner with web CI and can queue a web CI/deploy up to ~30 min. Fix = register a 2nd Linux act_runner labelled `desktop-linux` (root, network, RAM for a Tauri build; do NOT also label it `ubuntu-latest`) and point only `build-linux: runs-on` at it. Relabeling without a matching runner hangs the job forever.
|
||||
- [ ] **Debounce the desktop trigger** — `trigger-desktop` fires a full desktop build on _every_ lotus commit; consider tag/`workflow_dispatch`/schedule-gating to decouple desktop cadence from web commits (biggest remaining runner-load source).
|
||||
- [ ] **Verify Gitea ≥ 1.24** actually honors workflow `concurrency` (older silently ignores it → safe no-op, but the change is then inert — confirm on a test burst).
|
||||
- [ ] **Deferred (chosen-not-now):** build-once/deploy-the-artifact (kill the CI-then-deploy double build).
|
||||
- [x] **CI-gate the `lotus-build.sh` upstream-merge path** — DONE (matrix repo, cinny#98): the script now merges, runs the local gates (npm ci, typecheck, eslint, prettier, tests), and pushes; CI + `lotus_deploy.sh` deploy exactly like any other lotus commit. A failed gate leaves the merge local (not pushed).
|
||||
@@ -2,7 +2,7 @@
|
||||
|
||||
A Matrix chat client built for Lotus Guild — fast, private, and packed with the features you actually want.
|
||||
|
||||
**Deployed at [chat.lotusguild.org](https://chat.lotusguild.org)** | Forked from [Cinny](https://github.com/cinnyapp/cinny), synced through v4.12.3
|
||||
**Deployed at [chat.lotusguild.org](https://chat.lotusguild.org)** | Forked from [Cinny](https://github.com/cinnyapp/cinny), synced through v4.12.7
|
||||
|
||||
---
|
||||
|
||||
@@ -129,12 +129,12 @@ Lotus Chat has a desktop app for Windows, macOS, and Linux. It wraps the same we
|
||||
|
||||
### Download
|
||||
|
||||
Operating System | Download
|
||||
---|---
|
||||
Windows | [Get the installer (.exe)](https://code.lotusguild.org/LotusGuild/cinny-desktop/releases/download/latest/LotusChat-x86_64-setup.exe)
|
||||
Linux (AppImage, any distro) | [Get the AppImage](https://code.lotusguild.org/LotusGuild/cinny-desktop/releases/download/latest/LotusChat-x86_64.AppImage)
|
||||
Linux (Debian/Ubuntu) | [Get the .deb](https://code.lotusguild.org/LotusGuild/cinny-desktop/releases/download/latest/LotusChat-x86_64.deb)
|
||||
Linux (Arch/CachyOS/EndeavourOS) | [Get the .pkg.tar.zst](https://code.lotusguild.org/LotusGuild/cinny-desktop/releases/download/latest/LotusChat-x86_64.pkg.tar.zst) — install with `pacman -U LotusChat-x86_64.pkg.tar.zst`
|
||||
| Operating System | Download |
|
||||
| -------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
|
||||
| Windows | [Get the installer (.exe)](https://code.lotusguild.org/LotusGuild/cinny-desktop/releases/download/latest/LotusChat-x86_64-setup.exe) |
|
||||
| Linux (AppImage, any distro) | [Get the AppImage](https://code.lotusguild.org/LotusGuild/cinny-desktop/releases/download/latest/LotusChat-x86_64.AppImage) |
|
||||
| Linux (Debian/Ubuntu) | [Get the .deb](https://code.lotusguild.org/LotusGuild/cinny-desktop/releases/download/latest/LotusChat-x86_64.deb) |
|
||||
| Linux (Arch/CachyOS/EndeavourOS) | [Get the .pkg.tar.zst](https://code.lotusguild.org/LotusGuild/cinny-desktop/releases/download/latest/LotusChat-x86_64.pkg.tar.zst) — install with `pacman -U LotusChat-x86_64.pkg.tar.zst` |
|
||||
|
||||
All Linux builds need `webkit2gtk-4.1` and, for calls to work, GStreamer's `good`/`bad`/`ugly`/`libav` plugin sets (the pacman package pulls these in automatically; on the AppImage/.deb, install them via your package manager if joining a call shows "browser does not support WebRTC").
|
||||
|
||||
@@ -174,7 +174,7 @@ Beyond the web client, the desktop app adds native OS integration (Windows-focus
|
||||
|
||||
The source code lives in `/root/code/cinny`. All changes should be made on the `lotus` branch. Push to `origin/lotus` and CI will automatically build and deploy to [chat.lotusguild.org](https://chat.lotusguild.org) in approximately 11 minutes — no manual build or deploy steps required.
|
||||
|
||||
See [LOTUS_FEATURES.md](LOTUS_FEATURES.md) for the full feature changelog and [LOTUS_TODO.md](LOTUS_TODO.md) for the work backlog.
|
||||
See [LOTUS_FEATURES.md](LOTUS_FEATURES.md) for the full feature changelog and [LOTUS_REFERENCE.md](LOTUS_REFERENCE.md) for the design laws and operational reference (open work is in [Gitea issues](https://code.lotusguild.org/LotusGuild/cinny/issues)).
|
||||
|
||||
### Local Development
|
||||
|
||||
@@ -196,7 +196,7 @@ The dev server defaults to **port 8080** (`vite.config.js`); if 8080 is already
|
||||
### 🔱 Element Call fork ("Lotus Call") — LIVE
|
||||
|
||||
Voice/video channels embed **Element Call**, which is now our **self-built fork**
|
||||
(`@lotusguild/element-call-embedded` `0.25.0-lotus.3`, upstream base v0.25.0, source at
|
||||
(`@lotusguild/element-call-embedded` `0.25.0-lotus.11`, upstream base v0.25.0, source at
|
||||
`LotusGuild/element-call`), published to our private Gitea npm registry and served
|
||||
same-origin. We no longer depend on the upstream prebuilt bundle, so in-call
|
||||
behavior is editable source instead of fragile DOM/widget hacks.
|
||||
@@ -209,7 +209,7 @@ avatar decorations on EC video tiles, and a native transparent background.
|
||||
(`io.lotus.set_quality`).
|
||||
|
||||
The fork's `io.lotus.*` action catalog + the publish procedure are in
|
||||
**[`LOTUS_TODO.md`](LOTUS_TODO.md)** ("Element Call fork — operational reference");
|
||||
**[`LOTUS_REFERENCE.md`](LOTUS_REFERENCE.md)** ("Element Call fork — operational reference");
|
||||
infra/hosting + build-pipeline notes live in the `LotusGuild/matrix` repo README.
|
||||
Search the docs for the **`[EC-FORK]`** tag to find every related note.
|
||||
|
||||
|
||||
@@ -1,6 +1,10 @@
|
||||
# more info: https://caddyserver.com/docs/caddyfile/patterns#single-page-apps-spas
|
||||
cinny.domain.tld {
|
||||
root * /path/to/cinny/dist
|
||||
# [Gitea #155] PWA share target: the service worker answers this POST; if it
|
||||
# isn't controlling the page yet, land on /share instead of a 405.
|
||||
redir /share-target /share 303
|
||||
|
||||
try_files {path} /index.html
|
||||
file_server
|
||||
|
||||
|
||||
@@ -3,6 +3,7 @@
|
||||
## Insert wasm type into nginx mime.types file so they load correctly.
|
||||
|
||||
`/etc/nginx/mime.types`:
|
||||
|
||||
```
|
||||
types {
|
||||
..
|
||||
|
||||
@@ -26,6 +26,13 @@ server {
|
||||
add_header Strict-Transport-Security "max-age=63072000; includeSubDomains" always;
|
||||
add_header Permissions-Policy "accelerometer=(), autoplay=(self), camera=(self), display-capture=(self), encrypted-media=(self), fullscreen=(self), geolocation=(self), gyroscope=(), magnetometer=(), microphone=(self), midi=(), payment=(), usb=()" always;
|
||||
|
||||
# [Gitea #155] PWA share target. The service worker normally answers this
|
||||
# POST itself; if it isn't controlling the page yet, land on /share
|
||||
# (the shared files are lost, but nothing 405s).
|
||||
location = /share-target {
|
||||
return 303 /share;
|
||||
}
|
||||
|
||||
location / {
|
||||
root /opt/cinny/dist/;
|
||||
|
||||
|
||||
+13
-9
@@ -39,6 +39,7 @@ services:
|
||||
```
|
||||
|
||||
### 1a. MAS `config.yaml` — the parts that matter
|
||||
|
||||
After `config generate` (which fills in `secrets.keys` + `encryption`), set:
|
||||
|
||||
```yaml
|
||||
@@ -48,18 +49,19 @@ http:
|
||||
database:
|
||||
uri: postgresql://synapse:pw@postgres/synapse
|
||||
matrix:
|
||||
homeserver: localhost # the server_name
|
||||
homeserver: localhost # the server_name
|
||||
endpoint: http://synapse:8008/
|
||||
secret: "REPLACE_WITH_A_LONG_SHARED_ADMIN_TOKEN"
|
||||
secret: 'REPLACE_WITH_A_LONG_SHARED_ADMIN_TOKEN'
|
||||
clients:
|
||||
- client_id: "0000000000000000000SYNAPSE"
|
||||
- client_id: '0000000000000000000SYNAPSE'
|
||||
client_auth_method: client_secret_basic
|
||||
client_secret: "REPLACE_WITH_A_SHARED_CLIENT_SECRET"
|
||||
passwords: # so you can create a local test account in the MAS UI
|
||||
client_secret: 'REPLACE_WITH_A_SHARED_CLIENT_SECRET'
|
||||
passwords: # so you can create a local test account in the MAS UI
|
||||
enabled: true
|
||||
```
|
||||
|
||||
### 1b. Synapse `homeserver.yaml` — delegate auth to MAS
|
||||
|
||||
See `synapse-msc3861.yaml` in this folder; the key block is:
|
||||
|
||||
```yaml
|
||||
@@ -67,17 +69,18 @@ experimental_features:
|
||||
msc3861:
|
||||
enabled: true
|
||||
issuer: http://localhost:8090/
|
||||
client_id: "0000000000000000000SYNAPSE"
|
||||
client_id: '0000000000000000000SYNAPSE'
|
||||
client_auth_method: client_secret_basic
|
||||
client_secret: "REPLACE_WITH_A_SHARED_CLIENT_SECRET" # == MAS clients[].client_secret
|
||||
admin_token: "REPLACE_WITH_A_LONG_SHARED_ADMIN_TOKEN" # == MAS matrix.secret
|
||||
account_management_url: "http://localhost:8090/account"
|
||||
client_secret: 'REPLACE_WITH_A_SHARED_CLIENT_SECRET' # == MAS clients[].client_secret
|
||||
admin_token: 'REPLACE_WITH_A_LONG_SHARED_ADMIN_TOKEN' # == MAS matrix.secret
|
||||
account_management_url: 'http://localhost:8090/account'
|
||||
```
|
||||
|
||||
Create a test user via the MAS UI (`http://localhost:8090/`) or
|
||||
`docker compose exec mas mas-cli manage register-user`.
|
||||
|
||||
Sanity check discovery (the client relies on this):
|
||||
|
||||
```bash
|
||||
curl -s http://localhost:8008/.well-known/matrix/client | jq '."m.authentication"'
|
||||
# -> { "issuer": "http://localhost:8090/", "account": "http://localhost:8090/account" }
|
||||
@@ -108,5 +111,6 @@ See **section N** of `../../LOTUS_TESTING.md` for the actual pass/fail steps
|
||||
revocation, account-management link, and the non-OIDC-regression check).
|
||||
|
||||
## Files here
|
||||
|
||||
- `synapse-msc3861.yaml` — the Synapse experimental-features delta.
|
||||
- `config.local.json` — the Lotus `public/config.json` override.
|
||||
|
||||
@@ -0,0 +1,125 @@
|
||||
import { test, expect, Page } from '@playwright/test';
|
||||
import AxeBuilder from '@axe-core/playwright';
|
||||
import {
|
||||
createRoom,
|
||||
hsReachable,
|
||||
loginUI,
|
||||
openRoom,
|
||||
ensureUser,
|
||||
sendText,
|
||||
uniq,
|
||||
TestUser,
|
||||
} from './localHs';
|
||||
|
||||
// [Gitea #222] Machine-checkable accessibility on every push. Two parts:
|
||||
// 1. axe-core over the main surfaces, failing on critical/serious findings.
|
||||
// Colour-contrast is reported but not gated: several hits are generated
|
||||
// avatar colours and portal false positives (see the issue for the list).
|
||||
// 2. Accessibility-tree snapshots of the composer, message menu, thread
|
||||
// panel and settings nav, so a lost name/role/live-region shows up as a
|
||||
// diff. Update deliberately with `npx playwright test e2e/a11y --update-snapshots`.
|
||||
// A real screen-reader pass still needs a human.
|
||||
|
||||
const TAGS = ['wcag2a', 'wcag2aa', 'wcag21a', 'wcag21aa'];
|
||||
|
||||
async function auditPage(page: Page, label: string) {
|
||||
const results = await new AxeBuilder({ page }).withTags(TAGS).analyze();
|
||||
const describe = (v: (typeof results.violations)[number]) =>
|
||||
`[${v.impact}] ${v.id}: ${v.help}\n${v.nodes
|
||||
.slice(0, 5)
|
||||
.map((n) => ` ${n.html.replace(/\s+/g, ' ').slice(0, 140)}`)
|
||||
.join('\n')}`;
|
||||
const contrast = results.violations.filter((v) => v.id === 'color-contrast');
|
||||
if (contrast.length) {
|
||||
// eslint-disable-next-line no-console
|
||||
console.log(`axe ${label}: contrast (not gated)\n${contrast.map(describe).join('\n')}`);
|
||||
}
|
||||
const gated = results.violations.filter(
|
||||
(v) => v.id !== 'color-contrast' && (v.impact === 'critical' || v.impact === 'serious'),
|
||||
);
|
||||
expect(gated.map(describe), `axe ${label}: critical/serious findings`).toEqual([]);
|
||||
}
|
||||
|
||||
test.describe('accessibility', () => {
|
||||
test('login page passes axe @webkit', async ({ page }) => {
|
||||
await page.goto('/');
|
||||
await expect(page.getByLabel('Username or email')).toBeVisible();
|
||||
await auditPage(page, 'login');
|
||||
});
|
||||
|
||||
test.describe('signed in', () => {
|
||||
let alice: TestUser;
|
||||
let room: string;
|
||||
|
||||
test.beforeAll(async () => {
|
||||
test.skip(!(await hsReachable()), 'no local homeserver');
|
||||
alice = await ensureUser(uniq('e2e_a11y_'));
|
||||
room = await createRoom(alice, 'A11y Room');
|
||||
const root = await sendText(alice, room, 'thread root for a11y');
|
||||
await sendText(alice, room, 'a reply', {
|
||||
'm.relates_to': {
|
||||
rel_type: 'm.thread',
|
||||
event_id: root,
|
||||
is_falling_back: true,
|
||||
'm.in_reply_to': { event_id: root },
|
||||
},
|
||||
});
|
||||
});
|
||||
|
||||
test.beforeEach(async ({ page }) => {
|
||||
await page.setViewportSize({ width: 1400, height: 850 });
|
||||
await loginUI(page, alice);
|
||||
await openRoom(page, room);
|
||||
await expect(page.getByText('thread root for a11y')).toBeVisible();
|
||||
});
|
||||
|
||||
test('room timeline + composer', async ({ page }) => {
|
||||
await auditPage(page, 'room');
|
||||
await expect(page.locator('[data-slate-editor]').first()).toMatchAriaSnapshot({
|
||||
name: 'composer-editor.aria.yml',
|
||||
});
|
||||
await expect(page.getByRole('button', { name: 'Send message' })).toMatchAriaSnapshot({
|
||||
name: 'composer-send.aria.yml',
|
||||
});
|
||||
});
|
||||
|
||||
test('message options menu', async ({ page }) => {
|
||||
const msg = page.locator('[data-message-item]', { hasText: 'thread root for a11y' });
|
||||
await msg.hover();
|
||||
await msg.getByRole('button', { name: 'More options' }).click();
|
||||
const menu = page.locator('[data-message-menu]').first();
|
||||
await expect(menu).toBeVisible();
|
||||
await auditPage(page, 'message menu');
|
||||
await expect(menu).toMatchAriaSnapshot({ name: 'message-menu.aria.yml' });
|
||||
});
|
||||
|
||||
test('thread panel', async ({ page }) => {
|
||||
await page
|
||||
.locator('[data-message-item]', { hasText: 'thread root for a11y' })
|
||||
.getByText(/1 reply/)
|
||||
.click();
|
||||
await expect(page.locator('[data-slate-editor]')).toHaveCount(2);
|
||||
await auditPage(page, 'thread panel');
|
||||
await expect(page.getByRole('complementary').first()).toMatchAriaSnapshot({
|
||||
name: 'thread-panel.aria.yml',
|
||||
});
|
||||
});
|
||||
|
||||
test('user settings', async ({ page }) => {
|
||||
await page.getByRole('button', { name: 'User Settings' }).click();
|
||||
const dialog = page.getByRole('dialog').first();
|
||||
await expect(dialog).toBeVisible();
|
||||
await auditPage(page, 'settings');
|
||||
await expect(dialog.getByRole('navigation').first()).toMatchAriaSnapshot({
|
||||
name: 'settings-nav.aria.yml',
|
||||
});
|
||||
});
|
||||
|
||||
test('room settings', async ({ page }) => {
|
||||
await page.getByRole('button', { name: 'More Options' }).first().click();
|
||||
await page.getByText('Room Settings', { exact: true }).click();
|
||||
await expect(page.getByRole('dialog').first()).toBeVisible();
|
||||
await auditPage(page, 'room settings');
|
||||
});
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,2 @@
|
||||
- textbox "Send a message...":
|
||||
- paragraph: Send a message...
|
||||
@@ -0,0 +1,2 @@
|
||||
- button "Send message":
|
||||
- img
|
||||
@@ -0,0 +1,39 @@
|
||||
- button "Add Reaction":
|
||||
- text: ''
|
||||
- img
|
||||
- button "Reply":
|
||||
- text: ''
|
||||
- img
|
||||
- button "Forward":
|
||||
- text: ''
|
||||
- img
|
||||
- button "Bookmark Message":
|
||||
- text: ''
|
||||
- img
|
||||
- button "Remind Me":
|
||||
- text: ''
|
||||
- img
|
||||
- button "Edit Message":
|
||||
- text: ''
|
||||
- img
|
||||
- button "Read Receipts":
|
||||
- text: ''
|
||||
- img
|
||||
- button "Copy Text":
|
||||
- text: ''
|
||||
- img
|
||||
- button "Translate":
|
||||
- text: ''
|
||||
- img
|
||||
- button "Copy Link":
|
||||
- text: ''
|
||||
- img
|
||||
- button "Copy Lotus Link":
|
||||
- text: ''
|
||||
- img
|
||||
- button "Pin Message":
|
||||
- text: ''
|
||||
- img
|
||||
- button "Delete":
|
||||
- text: ''
|
||||
- img
|
||||
@@ -0,0 +1,22 @@
|
||||
- navigation "Settings sections":
|
||||
- button "General" [pressed]:
|
||||
- img
|
||||
- paragraph: General
|
||||
- button "Account":
|
||||
- img
|
||||
- paragraph: Account
|
||||
- button "Notifications":
|
||||
- img
|
||||
- paragraph: Notifications
|
||||
- button "Devices":
|
||||
- img
|
||||
- paragraph: Devices
|
||||
- button "Emojis & Stickers":
|
||||
- img
|
||||
- paragraph: Emojis & Stickers
|
||||
- button "Developer Tools":
|
||||
- img
|
||||
- paragraph: Developer Tools
|
||||
- button "About":
|
||||
- img
|
||||
- paragraph: About
|
||||
@@ -0,0 +1,31 @@
|
||||
- complementary "Thread":
|
||||
- paragraph: Thread
|
||||
- paragraph: A11y Room
|
||||
- button "Thread notifications":
|
||||
- img
|
||||
- button "Close thread":
|
||||
- img
|
||||
- log "Thread timeline":
|
||||
- article:
|
||||
- button /e2e_a11y_\w+, open profile/:
|
||||
- img
|
||||
- button /e2e_a11y_\w+/
|
||||
- time: /\d+:\d+ (AM|PM)/
|
||||
- text: thread root for a11y
|
||||
- paragraph: 1 reply
|
||||
- article:
|
||||
- button /e2e_a11y_\w+, open profile/:
|
||||
- img
|
||||
- button /e2e_a11y_\w+/
|
||||
- time: /\d+:\d+ (AM|PM)/
|
||||
- text: a reply
|
||||
- button "More actions":
|
||||
- img
|
||||
- textbox "Send a message...":
|
||||
- paragraph: Send a message...
|
||||
- button "Insert sticker":
|
||||
- img
|
||||
- button "Insert emoji":
|
||||
- img
|
||||
- button "Send message":
|
||||
- img
|
||||
+2
-2
@@ -5,7 +5,7 @@ import { collectConsole } from './helpers';
|
||||
// `vite preview` (see playwright.config.ts webServer). No homeserver needed.
|
||||
|
||||
test.describe('boot', () => {
|
||||
test('client boots to the login screen without errors', async ({ page }) => {
|
||||
test('client boots to the login screen without errors @webkit @ios', async ({ page }) => {
|
||||
const consoleLog = collectConsole(page);
|
||||
|
||||
await page.goto('/');
|
||||
@@ -24,7 +24,7 @@ test.describe('boot', () => {
|
||||
expect(consoleLog.unexpected(), 'unexpected console/page errors during boot').toEqual([]);
|
||||
});
|
||||
|
||||
test('service worker script is served and registers', async ({ page }) => {
|
||||
test('service worker script is served and registers @webkit @ios', async ({ page }) => {
|
||||
const swResponse = await page.request.get('/sw.js');
|
||||
expect(swResponse.status(), 'GET /sw.js').toBe(200);
|
||||
expect(swResponse.headers()['content-type'] ?? '').toMatch(/javascript/);
|
||||
|
||||
+14
-1
@@ -14,6 +14,15 @@ const BENIGN_CONSOLE_PATTERNS: RegExp[] = [
|
||||
// Homeserver discovery pings can fail on a runner with no outbound network.
|
||||
/\/\.well-known\/matrix\/client/i,
|
||||
/Failed to fetch|NetworkError|ERR_NAME_NOT_RESOLVED|ERR_INTERNET_DISCONNECTED/i,
|
||||
// Tier 3 (local homeserver named "localhost"): the client's well-known
|
||||
// autodiscovery probes https://localhost/, which is either not listening
|
||||
// (CI) or a self-signed dev server (local calls stack).
|
||||
/ERR_CONNECTION_REFUSED|ERR_CERT_AUTHORITY_INVALID|ERR_SSL_PROTOCOL_ERROR/i,
|
||||
// WebKit's spellings of the same discovery failures (#221).
|
||||
/Unacceptable TLS certificate|Could not connect to|Connection refused|TypeError: Load failed/i,
|
||||
// Also a fetch cut short by our own navigation (e.g. the crypto wasm while
|
||||
// the test moves from /home to a room) — WebKit words that the same way.
|
||||
/due to access control checks/i,
|
||||
// React devtools hint in production bundles.
|
||||
/Download the React DevTools/i,
|
||||
];
|
||||
@@ -41,8 +50,12 @@ export function collectConsole(page: Page): ConsoleCollector {
|
||||
return {
|
||||
errors,
|
||||
pageErrors,
|
||||
// WebKit surfaces handled fetch failures (well-known probes) as page
|
||||
// errors rather than console lines, so the allowlist applies to both.
|
||||
unexpected: () => [
|
||||
...pageErrors.map((m) => `pageerror: ${m}`),
|
||||
...pageErrors
|
||||
.filter((m) => !BENIGN_CONSOLE_PATTERNS.some((re) => re.test(m)))
|
||||
.map((m) => `pageerror: ${m}`),
|
||||
...errors.filter((m) => !BENIGN_CONSOLE_PATTERNS.some((re) => re.test(m))),
|
||||
],
|
||||
};
|
||||
|
||||
@@ -0,0 +1,285 @@
|
||||
import { test, expect, devices } from '@playwright/test';
|
||||
import {
|
||||
HS,
|
||||
api,
|
||||
createRoom,
|
||||
enc,
|
||||
ensureUser,
|
||||
hsReachable,
|
||||
joinRoom,
|
||||
loginUI,
|
||||
openRoom,
|
||||
sendText,
|
||||
uniq,
|
||||
TestUser,
|
||||
} from './localHs';
|
||||
import { collectConsole } from './helpers';
|
||||
|
||||
// Tier 3 — regression suite against the job's own Synapse (Gitea #220).
|
||||
// Each test seeds what it needs through the CS API and drives the built
|
||||
// client; nothing here touches a real deployment.
|
||||
test.describe('local homeserver regression', () => {
|
||||
let alice: TestUser;
|
||||
let bob: TestUser;
|
||||
|
||||
test.beforeAll(async () => {
|
||||
test.skip(!(await hsReachable()), `no local homeserver at ${HS} (set E2E_LOCAL_HS)`);
|
||||
alice = await ensureUser(uniq('e2e_alice_'));
|
||||
bob = await ensureUser(uniq('e2e_bob_'));
|
||||
});
|
||||
|
||||
test('logs in, opens a room, sends and receives @webkit @ios', async ({ page }) => {
|
||||
const console_ = collectConsole(page);
|
||||
const room = await createRoom(alice, 'Regression Room', { invite: [bob.userId] });
|
||||
await joinRoom(bob, room);
|
||||
await sendText(bob, room, 'hello from bob');
|
||||
await loginUI(page, alice);
|
||||
await openRoom(page, room);
|
||||
await expect(page.getByText('hello from bob')).toBeVisible();
|
||||
await page.locator('[data-slate-editor]').first().click();
|
||||
await page.keyboard.type('hello from alice');
|
||||
await page.keyboard.press('Enter');
|
||||
await expect(page.getByText('hello from alice')).toBeVisible();
|
||||
await expect
|
||||
.poll(
|
||||
async () =>
|
||||
(
|
||||
await api<{ chunk: { content: { body: string } }[] }>(
|
||||
'GET',
|
||||
`/_matrix/client/v3/rooms/${enc(room)}/messages?dir=b&limit=1`,
|
||||
bob.token,
|
||||
)
|
||||
).chunk[0]?.content.body,
|
||||
)
|
||||
.toBe('hello from alice');
|
||||
expect(console_.unexpected()).toEqual([]);
|
||||
});
|
||||
|
||||
test('your own message scrolls into view even after scrolling up (#212)', async ({ page }) => {
|
||||
const room = await createRoom(alice, 'Scroll Room');
|
||||
await Array.from({ length: 40 }).reduce<Promise<unknown>>(
|
||||
(chain, _, i) => chain.then(() => sendText(alice, room, `filler ${i}`)),
|
||||
Promise.resolve(),
|
||||
);
|
||||
await loginUI(page, alice);
|
||||
await openRoom(page, room);
|
||||
await page.mouse.move(600, 350);
|
||||
await page.mouse.wheel(0, -600);
|
||||
await expect(page.getByRole('button', { name: /Jump to Latest/ })).toBeVisible();
|
||||
await page.locator('[data-slate-editor]').first().click();
|
||||
await page.keyboard.type('sent while scrolled up');
|
||||
await page.keyboard.press('Enter');
|
||||
await expect(page.getByText('sent while scrolled up')).toBeInViewport();
|
||||
await expect(page.getByRole('button', { name: /Jump to Latest/ })).toHaveCount(0);
|
||||
});
|
||||
|
||||
test('/kick failure is reported, not swallowed (#216)', async ({ page }) => {
|
||||
const room = await createRoom(alice, 'Kick Room', { invite: [bob.userId] });
|
||||
await joinRoom(bob, room);
|
||||
await loginUI(page, bob);
|
||||
await openRoom(page, room);
|
||||
const editor = page.locator('[data-slate-editor]').first();
|
||||
await editor.click();
|
||||
await page.keyboard.type('/kick', { delay: 40 });
|
||||
await page.keyboard.press('Tab'); // accept the command chip
|
||||
await page.keyboard.type(` ${alice.userId}`, { delay: 20 });
|
||||
await page.keyboard.press('Enter');
|
||||
await expect(page.getByText(/Could not kick .*You cannot kick/)).toBeVisible();
|
||||
});
|
||||
|
||||
test('upload failure shows a plain sentence, never the raw MatrixError (#213)', async ({
|
||||
page,
|
||||
}) => {
|
||||
const room = await createRoom(alice, 'Upload Room');
|
||||
await loginUI(page, alice);
|
||||
await openRoom(page, room);
|
||||
await page.route(/\/_matrix\/media\/v3\/upload/, (route) =>
|
||||
route.fulfill({
|
||||
status: 413,
|
||||
contentType: 'application/json',
|
||||
body: JSON.stringify({ errcode: 'M_TOO_LARGE', error: 'nope' }),
|
||||
}),
|
||||
);
|
||||
const chooser = page.waitForEvent('filechooser');
|
||||
await page.getByRole('button', { name: 'Attach file' }).first().click();
|
||||
await (
|
||||
await chooser
|
||||
).setFiles({
|
||||
name: 'pic.png',
|
||||
mimeType: 'image/png',
|
||||
buffer: Buffer.from(
|
||||
'iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mNkYPhfDwAChwGA60e6kgAAAABJRU5ErkJggg==',
|
||||
'base64',
|
||||
),
|
||||
});
|
||||
const send = page.getByRole('button', { name: /^Send$/ });
|
||||
if (await send.count()) await send.first().click();
|
||||
else await page.getByRole('button', { name: 'Send message' }).click();
|
||||
await expect(page.getByText(/This file is larger than the server allows/)).toBeVisible();
|
||||
await expect(page.getByText(/MatrixError|_matrix\/media/)).toHaveCount(0);
|
||||
});
|
||||
|
||||
test('forwarded message carries its provenance header', async ({ page }) => {
|
||||
const src = await createRoom(bob, 'Source Room', { invite: [alice.userId] });
|
||||
const dst = await createRoom(alice, 'Destination Room');
|
||||
await joinRoom(alice, src);
|
||||
await sendText(bob, src, 'the original message');
|
||||
await loginUI(page, alice);
|
||||
await openRoom(page, src);
|
||||
const msg = page.locator('[data-message-item]', { hasText: 'the original message' }).first();
|
||||
await msg.hover();
|
||||
await msg.getByRole('button', { name: 'More options' }).click();
|
||||
await page.getByText('Forward', { exact: true }).click();
|
||||
const search = page.getByPlaceholder('Search rooms…');
|
||||
await search.fill('Destination Room');
|
||||
await page.locator('button', { hasText: 'Destination Room' }).first().click();
|
||||
await page.getByRole('button', { name: /^Send to 1 room/ }).click();
|
||||
await expect(page.getByText(/Forwarded to/)).toBeVisible();
|
||||
await openRoom(page, dst);
|
||||
await expect(page.getByText(/Forwarded from .* in Source Room/)).toBeVisible();
|
||||
await expect(page.getByText('the original message')).toBeVisible();
|
||||
});
|
||||
|
||||
test('thread panel: opens from the chip and yields the member drawer at 1400px (#218) @webkit', async ({
|
||||
browser,
|
||||
}) => {
|
||||
const ctx = await browser.newContext({ viewport: { width: 1400, height: 850 } });
|
||||
const page = await ctx.newPage();
|
||||
const room = await createRoom(alice, 'Thread Room');
|
||||
const root = await sendText(alice, room, 'thread root');
|
||||
await sendText(alice, room, 'a reply', {
|
||||
'm.relates_to': {
|
||||
rel_type: 'm.thread',
|
||||
event_id: root,
|
||||
is_falling_back: true,
|
||||
'm.in_reply_to': { event_id: root },
|
||||
},
|
||||
});
|
||||
await loginUI(page, alice);
|
||||
await openRoom(page, room);
|
||||
await page
|
||||
.locator('[data-message-item]', { hasText: 'thread root' })
|
||||
.getByText(/1 reply/)
|
||||
.click();
|
||||
await expect(page.locator('[data-slate-editor]')).toHaveCount(2);
|
||||
const widths = await page
|
||||
.locator('[data-slate-editor]')
|
||||
.evaluateAll((els) => els.map((e) => e.getBoundingClientRect().width));
|
||||
expect(Math.min(...widths)).toBeGreaterThan(120);
|
||||
await ctx.close();
|
||||
});
|
||||
|
||||
test('timeline image opens the gallery lightbox (#219) @webkit', async ({ page }) => {
|
||||
const room = await createRoom(alice, 'Lightbox Room');
|
||||
const png = Buffer.from(
|
||||
'iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mNkYPhfDwAChwGA60e6kgAAAABJRU5ErkJggg==',
|
||||
'base64',
|
||||
);
|
||||
const up = await fetch(`${HS}/_matrix/media/v3/upload?filename=a.png`, {
|
||||
method: 'POST',
|
||||
headers: { Authorization: `Bearer ${alice.token}`, 'Content-Type': 'image/png' },
|
||||
body: png,
|
||||
}).then((r) => r.json() as Promise<{ content_uri: string }>);
|
||||
await api(
|
||||
'PUT',
|
||||
`/_matrix/client/v3/rooms/${enc(room)}/send/m.room.message/img1`,
|
||||
alice.token,
|
||||
{
|
||||
msgtype: 'm.image',
|
||||
body: 'a.png',
|
||||
url: up.content_uri,
|
||||
info: { mimetype: 'image/png', size: png.length, w: 1, h: 1 },
|
||||
},
|
||||
);
|
||||
await loginUI(page, alice);
|
||||
await openRoom(page, room);
|
||||
await page.locator('[data-message-item] img[alt="a.png"]').click();
|
||||
const viewer = page.getByRole('dialog', { name: 'Media viewer' });
|
||||
await expect(viewer).toBeVisible();
|
||||
await expect(viewer.getByText('1 / 1')).toBeVisible();
|
||||
await page.keyboard.press('Escape');
|
||||
await expect(viewer).toHaveCount(0);
|
||||
});
|
||||
|
||||
test('warns when the local clock is far off the server (#158)', async ({ page }) => {
|
||||
const room = await createRoom(alice, 'Skew Room', { invite: [bob.userId] });
|
||||
await joinRoom(bob, room);
|
||||
await page.clock.install({ time: Date.now() + 14 * 60 * 1000 });
|
||||
await loginUI(page, alice);
|
||||
await openRoom(page, room);
|
||||
for (let i = 0; i < 4; i += 1) {
|
||||
// eslint-disable-next-line no-await-in-loop
|
||||
await sendText(bob, room, `tick ${i}`);
|
||||
// eslint-disable-next-line no-await-in-loop
|
||||
await page.waitForTimeout(500);
|
||||
}
|
||||
await expect(page.getByText(/clock is .*14 minutes ahead of the server/)).toBeVisible();
|
||||
await page.getByRole('button', { name: 'Dismiss for 24 h' }).click();
|
||||
await expect(page.getByText(/clock is .*ahead of the server/)).toHaveCount(0);
|
||||
});
|
||||
|
||||
test('status save survives the presence rate limit (#226)', async ({ page }) => {
|
||||
let lastOk = 0;
|
||||
await page.route(/\/presence\/[^/]+\/status/, (route) => {
|
||||
const now = Date.now();
|
||||
if (now - lastOk < 10_000) {
|
||||
return route.fulfill({
|
||||
status: 429,
|
||||
contentType: 'application/json',
|
||||
body: JSON.stringify({
|
||||
errcode: 'M_LIMIT_EXCEEDED',
|
||||
error: 'Too Many Requests',
|
||||
retry_after_ms: 10_000 - (now - lastOk),
|
||||
}),
|
||||
});
|
||||
}
|
||||
lastOk = now;
|
||||
return route.continue();
|
||||
});
|
||||
await loginUI(page, alice);
|
||||
await page
|
||||
.locator('button', { hasText: new RegExp(`^${alice.localpart[0]}$`) })
|
||||
.first()
|
||||
.click();
|
||||
await page.getByText('Account', { exact: true }).first().click();
|
||||
const input = page.getByLabel('Status message');
|
||||
const status = uniq('status ');
|
||||
await input.fill(status);
|
||||
await input.locator('xpath=ancestor::form[1]').getByRole('button', { name: 'Save' }).click();
|
||||
await expect(page.getByText(/Failed to save status/)).toHaveCount(0);
|
||||
await expect
|
||||
.poll(
|
||||
async () =>
|
||||
(
|
||||
await api<{ status_msg?: string }>(
|
||||
'GET',
|
||||
`/_matrix/client/v3/presence/${enc(alice.userId)}/status`,
|
||||
alice.token,
|
||||
)
|
||||
).status_msg,
|
||||
{ timeout: 30_000 },
|
||||
)
|
||||
.toBe(status);
|
||||
});
|
||||
|
||||
test('touch: long-press opens the message action sheet (#166)', async ({ browser }) => {
|
||||
const ctx = await browser.newContext({ ...devices['Pixel 7'] });
|
||||
const page = await ctx.newPage();
|
||||
const room = await createRoom(alice, 'Touch Room');
|
||||
await sendText(alice, room, 'press and hold me');
|
||||
await loginUI(page, alice);
|
||||
await openRoom(page, room);
|
||||
const msg = page.locator('[data-message-item]', { hasText: 'press and hold me' });
|
||||
const box = (await msg.boundingBox())!;
|
||||
const cdp = await ctx.newCDPSession(page);
|
||||
const x = box.x + 100;
|
||||
const y = box.y + box.height / 2;
|
||||
await cdp.send('Input.dispatchTouchEvent', { type: 'touchStart', touchPoints: [{ x, y }] });
|
||||
await page.waitForTimeout(700);
|
||||
await cdp.send('Input.dispatchTouchEvent', { type: 'touchEnd', touchPoints: [] });
|
||||
const sheet = page.getByRole('dialog', { name: 'Message actions' });
|
||||
await expect(sheet).toBeVisible();
|
||||
await expect(sheet.getByText('Reply', { exact: true })).toBeVisible();
|
||||
await ctx.close();
|
||||
});
|
||||
});
|
||||
+114
@@ -0,0 +1,114 @@
|
||||
import { Page, expect } from '@playwright/test';
|
||||
|
||||
/**
|
||||
* Tier 3 (Gitea #220): regression tests against a throwaway Synapse the job
|
||||
* starts itself (`scripts/dev-homeserver.sh start`). No prod secrets. Set
|
||||
* E2E_LOCAL_HS (default http://localhost:8008) — the spec skips when the
|
||||
* server isn't reachable.
|
||||
*/
|
||||
export const HS = process.env.E2E_LOCAL_HS || 'http://localhost:8008';
|
||||
export const PASSWORD = 'password123';
|
||||
export const enc = encodeURIComponent;
|
||||
|
||||
export async function hsReachable(): Promise<boolean> {
|
||||
try {
|
||||
const res = await fetch(`${HS}/_matrix/client/versions`);
|
||||
return res.ok;
|
||||
} catch {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
export async function api<T = Record<string, unknown>>(
|
||||
method: string,
|
||||
path: string,
|
||||
token?: string,
|
||||
body?: unknown,
|
||||
): Promise<T> {
|
||||
const res = await fetch(`${HS}${path}`, {
|
||||
method,
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
...(token ? { Authorization: `Bearer ${token}` } : {}),
|
||||
},
|
||||
body: body === undefined ? undefined : JSON.stringify(body),
|
||||
});
|
||||
return (await res.json()) as T;
|
||||
}
|
||||
|
||||
export type TestUser = { localpart: string; userId: string; token: string };
|
||||
|
||||
/** Registers (open registration) or logs in a test user. */
|
||||
export async function ensureUser(localpart: string): Promise<TestUser> {
|
||||
const reg = await api<{ user_id?: string; access_token?: string }>(
|
||||
'POST',
|
||||
'/_matrix/client/v3/register',
|
||||
undefined,
|
||||
{ username: localpart, password: PASSWORD, auth: { type: 'm.login.dummy' } },
|
||||
);
|
||||
if (reg.access_token && reg.user_id) {
|
||||
return { localpart, userId: reg.user_id, token: reg.access_token };
|
||||
}
|
||||
const login = await api<{ user_id: string; access_token: string }>(
|
||||
'POST',
|
||||
'/_matrix/client/v3/login',
|
||||
undefined,
|
||||
{
|
||||
type: 'm.login.password',
|
||||
identifier: { type: 'm.id.user', user: localpart },
|
||||
password: PASSWORD,
|
||||
},
|
||||
);
|
||||
return { localpart, userId: login.user_id, token: login.access_token };
|
||||
}
|
||||
|
||||
export async function createRoom(
|
||||
owner: TestUser,
|
||||
name: string,
|
||||
opts: { invite?: string[]; preset?: string } = {},
|
||||
): Promise<string> {
|
||||
const res = await api<{ room_id: string }>('POST', '/_matrix/client/v3/createRoom', owner.token, {
|
||||
name,
|
||||
preset: opts.preset ?? 'public_chat',
|
||||
invite: opts.invite,
|
||||
});
|
||||
return res.room_id;
|
||||
}
|
||||
|
||||
export async function joinRoom(user: TestUser, roomId: string): Promise<void> {
|
||||
await api('POST', `/_matrix/client/v3/rooms/${enc(roomId)}/join`, user.token, {});
|
||||
}
|
||||
|
||||
let txn = 0;
|
||||
export async function sendText(
|
||||
user: TestUser,
|
||||
roomId: string,
|
||||
body: string,
|
||||
extra: Record<string, unknown> = {},
|
||||
): Promise<string> {
|
||||
txn += 1;
|
||||
const res = await api<{ event_id: string }>(
|
||||
'PUT',
|
||||
`/_matrix/client/v3/rooms/${enc(roomId)}/send/m.room.message/e2e${Date.now()}_${txn}`,
|
||||
user.token,
|
||||
{ msgtype: 'm.text', body, ...extra },
|
||||
);
|
||||
return res.event_id;
|
||||
}
|
||||
|
||||
/** Password login through the UI against the local homeserver. */
|
||||
export async function loginUI(page: Page, user: TestUser): Promise<void> {
|
||||
await page.goto(`/login/${enc(HS)}/`);
|
||||
await page.getByLabel('Username or email').fill(user.localpart);
|
||||
await page.getByLabel('Password', { exact: true }).fill(PASSWORD);
|
||||
await page.getByRole('button', { name: 'Login' }).click();
|
||||
await page.waitForURL(/\/home/, { timeout: 60_000 });
|
||||
}
|
||||
|
||||
export async function openRoom(page: Page, roomId: string): Promise<void> {
|
||||
await page.goto(`/home/${enc(roomId)}`);
|
||||
await expect(page.locator('[data-slate-editor]').first()).toBeVisible({ timeout: 30_000 });
|
||||
}
|
||||
|
||||
export const uniq = (prefix: string): string =>
|
||||
`${prefix}${Date.now().toString(36)}${Math.random().toString(36).slice(2, 6)}`;
|
||||
@@ -27,9 +27,6 @@
|
||||
<meta name="theme-color" content="#000000" />
|
||||
<meta name="color-scheme" content="dark light" />
|
||||
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com" crossorigin />
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||
<link href="https://fonts.googleapis.com/css2?family=VT323&display=swap" rel="stylesheet" />
|
||||
<link rel="stylesheet" href="/fonts/custom-fonts.css" />
|
||||
<link id="favicon" rel="shortcut icon" href="./public/favicon.ico" />
|
||||
|
||||
|
||||
Generated
+24
-9
@@ -1,12 +1,12 @@
|
||||
{
|
||||
"name": "lotus-chat",
|
||||
"version": "4.12.3-lotus",
|
||||
"version": "4.12.7-lotus",
|
||||
"lockfileVersion": 3,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "lotus-chat",
|
||||
"version": "4.12.3-lotus",
|
||||
"version": "4.12.7-lotus",
|
||||
"hasInstallScript": true,
|
||||
"license": "AGPL-3.0-only",
|
||||
"dependencies": {
|
||||
@@ -80,7 +80,8 @@
|
||||
"workbox-precaching": "7.4.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@lotusguild/element-call-embedded": "0.25.0-lotus.3",
|
||||
"@axe-core/playwright": "4.13.0",
|
||||
"@lotusguild/element-call-embedded": "0.25.0-lotus.11",
|
||||
"@playwright/test": "1.63.0",
|
||||
"@rollup/plugin-inject": "5.0.5",
|
||||
"@rollup/plugin-wasm": "6.2.2",
|
||||
@@ -172,6 +173,19 @@
|
||||
"@babel/runtime": "^7.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@axe-core/playwright": {
|
||||
"version": "4.13.0",
|
||||
"resolved": "https://registry.npmjs.org/@axe-core/playwright/-/playwright-4.13.0.tgz",
|
||||
"integrity": "sha512-6YLx+kxXu5GJceG4ozFg+33a2EMTdjYwWGloJ3sb9Kta5pp+ZNS53uxGVog5JetIY8s++P5UrtX+cri+u0VAVg==",
|
||||
"dev": true,
|
||||
"license": "MPL-2.0",
|
||||
"dependencies": {
|
||||
"axe-core": "~4.13.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"playwright-core": ">= 1.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@babel/code-frame": {
|
||||
"version": "7.29.0",
|
||||
"resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.29.0.tgz",
|
||||
@@ -2681,9 +2695,9 @@
|
||||
"integrity": "sha512-dfLbk+PwWvFzSxwk3n5ySL0hfBog779o8h68wK/7/APo/7cgyWp5jcXockbxdk5kFRkbeXWm4Fbi9FrdN381sA=="
|
||||
},
|
||||
"node_modules/@lotusguild/element-call-embedded": {
|
||||
"version": "0.25.0-lotus.3",
|
||||
"resolved": "https://code.lotusguild.org/api/packages/LotusGuild/npm/%40lotusguild%2Felement-call-embedded/-/0.25.0-lotus.3/element-call-embedded-0.25.0-lotus.3.tgz",
|
||||
"integrity": "sha512-UjOi8DXosVjBeVb5SiPNFApJSI9gggpU67xAUn0EWevD3oj9wQFhtjdMkxGbhnQ7B9r6QEUivDGWsBpsfKe0/w==",
|
||||
"version": "0.25.0-lotus.11",
|
||||
"resolved": "https://code.lotusguild.org/api/packages/LotusGuild/npm/%40lotusguild%2Felement-call-embedded/-/0.25.0-lotus.11/element-call-embedded-0.25.0-lotus.11.tgz",
|
||||
"integrity": "sha512-wLsVsEBLZ4UjhAdLhhk5BmAap1kZ4x8KKirOm2Ie+DbtM34GCv30oUFmQnUmVdO4by3EQAmNK+v+vYyIwq4DOg==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/@matrix-org/matrix-sdk-crypto-wasm": {
|
||||
@@ -4847,10 +4861,11 @@
|
||||
}
|
||||
},
|
||||
"node_modules/axe-core": {
|
||||
"version": "4.10.2",
|
||||
"resolved": "https://registry.npmjs.org/axe-core/-/axe-core-4.10.2.tgz",
|
||||
"integrity": "sha512-RE3mdQ7P3FRSe7eqCWoeQ/Z9QXrtniSjp1wUjt5nRC3WIpz5rSCve6o3fsZ2aCpJtrZjSZgjwXAoTO5k4tEI0w==",
|
||||
"version": "4.13.0",
|
||||
"resolved": "https://registry.npmjs.org/axe-core/-/axe-core-4.13.0.tgz",
|
||||
"integrity": "sha512-UzGt8zg7Ny8djbYMhxl2zuEevVa7r2gJjYY5Lwr1xM7+XU2nd6CkIWFTVcCIbAP63vSz71NaVyyuSk9lHKcy0A==",
|
||||
"dev": true,
|
||||
"license": "MPL-2.0",
|
||||
"engines": {
|
||||
"node": ">=4"
|
||||
}
|
||||
|
||||
+5
-4
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "lotus-chat",
|
||||
"version": "4.12.3-lotus",
|
||||
"version": "4.12.7-lotus",
|
||||
"description": "Lotus Chat — Matrix client for Lotus Guild",
|
||||
"main": "index.js",
|
||||
"type": "module",
|
||||
@@ -12,13 +12,13 @@
|
||||
"build": "vite build",
|
||||
"preview": "vite preview",
|
||||
"lint": "npm run check:eslint && npm run check:prettier",
|
||||
"check:eslint": "eslint src/* --max-warnings 68",
|
||||
"check:eslint": "eslint src/* --max-warnings 49",
|
||||
"check:prettier": "prettier --check .",
|
||||
"fix:prettier": "prettier --write .",
|
||||
"typecheck": "tsc --noEmit",
|
||||
"test": "node --import tsx --test $(find src -name '*.test.ts')",
|
||||
"test:e2e": "playwright test",
|
||||
"test:e2e:install": "playwright install chromium",
|
||||
"test:e2e:install": "playwright install chromium webkit",
|
||||
"prepare": "husky",
|
||||
"commit": "git-cz",
|
||||
"postinstall": "node scripts/patch-folds.mjs",
|
||||
@@ -107,7 +107,8 @@
|
||||
"workbox-precaching": "7.4.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@lotusguild/element-call-embedded": "0.25.0-lotus.3",
|
||||
"@axe-core/playwright": "4.13.0",
|
||||
"@lotusguild/element-call-embedded": "0.25.0-lotus.11",
|
||||
"@playwright/test": "1.63.0",
|
||||
"@rollup/plugin-inject": "5.0.5",
|
||||
"@rollup/plugin-wasm": "6.2.2",
|
||||
|
||||
+10
-1
@@ -25,7 +25,16 @@ export default defineConfig({
|
||||
trace: 'retain-on-failure',
|
||||
...devices['Desktop Chrome'],
|
||||
},
|
||||
projects: [{ name: 'chromium', use: { ...devices['Desktop Chrome'] } }],
|
||||
projects: [
|
||||
{ name: 'chromium', use: { ...devices['Desktop Chrome'] } },
|
||||
// [Gitea #221] WebKit as the Safari/iOS proxy. It runs the subset tagged
|
||||
// @webkit / @ios (boot, composer round-trip, thread panel, lightbox): it
|
||||
// catches WebKit-only breakage (CSS, dvh, IndexedDB, media decode) that
|
||||
// Chromium emulation can't, but does not emulate the iOS keyboard or the
|
||||
// Home-Screen install flow.
|
||||
{ name: 'webkit', use: { ...devices['Desktop Safari'] }, grep: /@webkit/ },
|
||||
{ name: 'iphone', use: { ...devices['iPhone 14'] }, grep: /@ios/ },
|
||||
],
|
||||
webServer: {
|
||||
command: `npx vite preview --port ${PORT} --strictPort`,
|
||||
url: BASE_URL,
|
||||
|
||||
@@ -1,11 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang=en>
|
||||
<meta charset=utf-8>
|
||||
<meta name=viewport content="initial-scale=1, minimum-scale=1, width=device-width">
|
||||
<title>Error 404 (Not Found)!!1</title>
|
||||
<style>
|
||||
*{margin:0;padding:0}html,code{font:15px/22px arial,sans-serif}html{background:#fff;color:#222;padding:15px}body{margin:7% auto 0;max-width:390px;min-height:180px;padding:30px 0 15px}* > body{background:url(//www.google.com/images/errors/robot.png) 100% 5px no-repeat;padding-right:205px}p{margin:11px 0 22px;overflow:hidden}ins{color:#777;text-decoration:none}a img{border:0}@media screen and (max-width:772px){body{background:none;margin-top:0;max-width:none;padding-right:0}}#logo{background:url(//www.google.com/images/branding/googlelogo/1x/googlelogo_color_150x54dp.png) no-repeat;margin-left:-5px}@media only screen and (min-resolution:192dpi){#logo{background:url(//www.google.com/images/branding/googlelogo/2x/googlelogo_color_150x54dp.png) no-repeat 0% 0%/100% 100%;-moz-border-image:url(//www.google.com/images/branding/googlelogo/2x/googlelogo_color_150x54dp.png) 0}}@media only screen and (-webkit-min-device-pixel-ratio:2){#logo{background:url(//www.google.com/images/branding/googlelogo/2x/googlelogo_color_150x54dp.png) no-repeat;-webkit-background-size:100% 100%}}#logo{display:inline-block;height:54px;width:150px}
|
||||
</style>
|
||||
<a href=//www.google.com/><span id=logo aria-label=Google></span></a>
|
||||
<p><b>404.</b> <ins>That’s an error.</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>
|
||||
@@ -1,11 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang=en>
|
||||
<meta charset=utf-8>
|
||||
<meta name=viewport content="initial-scale=1, minimum-scale=1, width=device-width">
|
||||
<title>Error 404 (Not Found)!!1</title>
|
||||
<style>
|
||||
*{margin:0;padding:0}html,code{font:15px/22px arial,sans-serif}html{background:#fff;color:#222;padding:15px}body{margin:7% auto 0;max-width:390px;min-height:180px;padding:30px 0 15px}* > body{background:url(//www.google.com/images/errors/robot.png) 100% 5px no-repeat;padding-right:205px}p{margin:11px 0 22px;overflow:hidden}ins{color:#777;text-decoration:none}a img{border:0}@media screen and (max-width:772px){body{background:none;margin-top:0;max-width:none;padding-right:0}}#logo{background:url(//www.google.com/images/branding/googlelogo/1x/googlelogo_color_150x54dp.png) no-repeat;margin-left:-5px}@media only screen and (min-resolution:192dpi){#logo{background:url(//www.google.com/images/branding/googlelogo/2x/googlelogo_color_150x54dp.png) no-repeat 0% 0%/100% 100%;-moz-border-image:url(//www.google.com/images/branding/googlelogo/2x/googlelogo_color_150x54dp.png) 0}}@media only screen and (-webkit-min-device-pixel-ratio:2){#logo{background:url(//www.google.com/images/branding/googlelogo/2x/googlelogo_color_150x54dp.png) no-repeat;-webkit-background-size:100% 100%}}#logo{display:inline-block;height:54px;width:150px}
|
||||
</style>
|
||||
<a href=//www.google.com/><span id=logo aria-label=Google></span></a>
|
||||
<p><b>404.</b> <ins>That’s an error.</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>
|
||||
@@ -1,11 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang=en>
|
||||
<meta charset=utf-8>
|
||||
<meta name=viewport content="initial-scale=1, minimum-scale=1, width=device-width">
|
||||
<title>Error 404 (Not Found)!!1</title>
|
||||
<style>
|
||||
*{margin:0;padding:0}html,code{font:15px/22px arial,sans-serif}html{background:#fff;color:#222;padding:15px}body{margin:7% auto 0;max-width:390px;min-height:180px;padding:30px 0 15px}* > body{background:url(//www.google.com/images/errors/robot.png) 100% 5px no-repeat;padding-right:205px}p{margin:11px 0 22px;overflow:hidden}ins{color:#777;text-decoration:none}a img{border:0}@media screen and (max-width:772px){body{background:none;margin-top:0;max-width:none;padding-right:0}}#logo{background:url(//www.google.com/images/branding/googlelogo/1x/googlelogo_color_150x54dp.png) no-repeat;margin-left:-5px}@media only screen and (min-resolution:192dpi){#logo{background:url(//www.google.com/images/branding/googlelogo/2x/googlelogo_color_150x54dp.png) no-repeat 0% 0%/100% 100%;-moz-border-image:url(//www.google.com/images/branding/googlelogo/2x/googlelogo_color_150x54dp.png) 0}}@media only screen and (-webkit-min-device-pixel-ratio:2){#logo{background:url(//www.google.com/images/branding/googlelogo/2x/googlelogo_color_150x54dp.png) no-repeat;-webkit-background-size:100% 100%}}#logo{display:inline-block;height:54px;width:150px}
|
||||
</style>
|
||||
<a href=//www.google.com/><span id=logo aria-label=Google></span></a>
|
||||
<p><b>404.</b> <ins>That’s an error.</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>
|
||||
Binary file not shown.
Binary file not shown.
@@ -49,3 +49,25 @@
|
||||
U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329,
|
||||
U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||
}
|
||||
/* VT323 (OFL) for the Lotus Terminal theme — was Google Fonts (Gitea #214) */
|
||||
@font-face {
|
||||
font-family: 'VT323';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-display: swap;
|
||||
src: url('/fonts/VT323-latin-ext.woff2') format('woff2');
|
||||
unicode-range:
|
||||
U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329,
|
||||
U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F,
|
||||
U+A720-A7FF;
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'VT323';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-display: swap;
|
||||
src: url('/fonts/VT323-latin.woff2') format('woff2');
|
||||
unicode-range:
|
||||
U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329,
|
||||
U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||
}
|
||||
|
||||
@@ -69,6 +69,22 @@
|
||||
}
|
||||
],
|
||||
"categories": ["social", "communication", "productivity"],
|
||||
"share_target": {
|
||||
"action": "./share-target",
|
||||
"method": "POST",
|
||||
"enctype": "multipart/form-data",
|
||||
"params": {
|
||||
"title": "title",
|
||||
"text": "text",
|
||||
"url": "url",
|
||||
"files": [
|
||||
{
|
||||
"name": "files",
|
||||
"accept": ["image/*", "video/*", "audio/*", "application/pdf", "text/plain"]
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
"shortcuts": [
|
||||
{
|
||||
"name": "New Message",
|
||||
|
||||
Executable
+139
@@ -0,0 +1,139 @@
|
||||
#!/usr/bin/env bash
|
||||
# Local throwaway Synapse for driving the real UI (Playwright / a browser)
|
||||
# against a homeserver you control — open registration, no rate limits,
|
||||
# SQLite, media served. Everything lives in .dev-homeserver/ (gitignored).
|
||||
#
|
||||
# scripts/dev-homeserver.sh start # install (first run) + start on :8008
|
||||
# scripts/dev-homeserver.sh calls # + LiveKit SFU, JWT issuer, voice-limit guard, https well-known
|
||||
# scripts/dev-homeserver.sh stop
|
||||
# scripts/dev-homeserver.sh reset # wipe the database and media
|
||||
# python3 scripts/dev-seed.py 400 # alice/bob + "Busy Room" with images (+ "Voice Lounge" call room)
|
||||
#
|
||||
# Calls: `calls` downloads livekit-server (v1.13.7 release binary) into
|
||||
# .dev-homeserver/, runs it on :7880 with key devkey, a minimal lk-jwt-service
|
||||
# clone (scripts/dev-lk-jwt.py, :8071), the real voice-limit-guard from the
|
||||
# sibling matrix repo in front of it (:8070, needs ../matrix checked out and an
|
||||
# admin user — dev-seed makes alice one), and a self-signed https server on
|
||||
# :443 serving /.well-known/matrix/client with the LiveKit focus (the client
|
||||
# autodiscovers the server NAME, not :8008). Drive it with Playwright using
|
||||
# --use-fake-device-for-media-stream and ignoreHTTPSErrors.
|
||||
#
|
||||
# Then `npm start` and log in at http://127.0.0.1:5173/login/http%3A%2F%2Flocalhost%3A8008/
|
||||
# as alice / password123.
|
||||
set -euo pipefail
|
||||
ROOT="$(cd "$(dirname "$0")/.." && pwd)"
|
||||
DIR="$ROOT/.dev-homeserver"
|
||||
VENV="$DIR/venv"
|
||||
CFG="$DIR/homeserver.yaml"
|
||||
PIDFILE="$DIR/synapse.pid"
|
||||
|
||||
install() {
|
||||
mkdir -p "$DIR"
|
||||
if [ ! -x "$VENV/bin/python" ]; then
|
||||
python3 -m venv --without-pip "$VENV"
|
||||
curl -sS https://bootstrap.pypa.io/get-pip.py -o "$DIR/get-pip.py"
|
||||
"$VENV/bin/python" "$DIR/get-pip.py" -q
|
||||
"$VENV/bin/pip" install -q "matrix-synapse[url-preview]"
|
||||
fi
|
||||
if [ ! -f "$CFG" ]; then
|
||||
(cd "$DIR" && "$VENV/bin/python" -m synapse.app.homeserver \
|
||||
--server-name localhost --config-path homeserver.yaml --generate-config --report-stats=no >/dev/null)
|
||||
# the generated listener only serves `client`; add media + open the door
|
||||
python3 - "$CFG" <<'PY'
|
||||
import sys, re
|
||||
p = sys.argv[1]; s = open(p).read()
|
||||
s = s.replace(" - client\n", " - client\n - media\n - federation\n", 1)
|
||||
s += """
|
||||
enable_registration: true
|
||||
enable_registration_without_verification: true
|
||||
rc_message: { per_second: 1000, burst_count: 10000 }
|
||||
rc_registration: { per_second: 1000, burst_count: 10000 }
|
||||
rc_login: { address: { per_second: 1000, burst_count: 10000 }, account: { per_second: 1000, burst_count: 10000 }, failed_attempts: { per_second: 1000, burst_count: 10000 } }
|
||||
rc_joins: { local: { per_second: 1000, burst_count: 10000 }, remote: { per_second: 1000, burst_count: 10000 } }
|
||||
rc_presence: { per_user: { per_second: 1000, burst_count: 10000 } }
|
||||
max_upload_size: 50M
|
||||
suppress_key_server_warning: true
|
||||
# URL previews (embed facades use the homeserver's cached thumbnail)
|
||||
url_preview_enabled: true
|
||||
url_preview_ip_range_blacklist: ['127.0.0.0/8', '10.0.0.0/8', '172.16.0.0/12', '192.168.0.0/16', '100.64.0.0/10', '169.254.0.0/16', '::1/128', 'fe80::/10', 'fc00::/7']
|
||||
# scheduled messages (MSC4140 delayed events) + MatrixRTC transports (MSC4143) + room summaries (MSC3266)
|
||||
max_event_delay_duration: 24h
|
||||
experimental_features:
|
||||
msc4140_enabled: true
|
||||
msc4143_enabled: true
|
||||
msc3266_enabled: true
|
||||
msc4133_enabled: true
|
||||
matrix_rtc:
|
||||
transports:
|
||||
- type: livekit
|
||||
livekit_service_url: http://127.0.0.1:8070
|
||||
"""
|
||||
open(p, "w").write(s)
|
||||
PY
|
||||
fi
|
||||
}
|
||||
|
||||
start() {
|
||||
install
|
||||
if [ -f "$PIDFILE" ] && kill -0 "$(cat "$PIDFILE")" 2>/dev/null; then
|
||||
echo "already running (pid $(cat "$PIDFILE"))"; return
|
||||
fi
|
||||
(cd "$DIR" && setsid nohup "$VENV/bin/python" -m synapse.app.homeserver --config-path homeserver.yaml \
|
||||
> synapse.log 2>&1 < /dev/null & echo $! > "$PIDFILE")
|
||||
for _ in $(seq 1 40); do
|
||||
sleep 1
|
||||
curl -sf http://127.0.0.1:8008/_matrix/client/versions >/dev/null && { echo "synapse up on http://localhost:8008"; return; }
|
||||
done
|
||||
echo "synapse did not come up — see $DIR/synapse.log" >&2; exit 1
|
||||
}
|
||||
|
||||
stop() {
|
||||
if [ -f "$PIDFILE" ]; then kill "$(cat "$PIDFILE")" 2>/dev/null || true; rm -f "$PIDFILE"; echo stopped; fi
|
||||
for f in "$DIR"/calls-*.pid; do [ -f "$f" ] && { kill "$(cat "$f")" 2>/dev/null || true; rm -f "$f"; }; done
|
||||
}
|
||||
|
||||
calls() {
|
||||
start
|
||||
local LK="$DIR/livekit-server"
|
||||
if [ ! -x "$LK" ]; then
|
||||
curl -sL "https://github.com/livekit/livekit/releases/download/v1.13.7/livekit_1.13.7_linux_amd64.tar.gz" | tar xz -C "$DIR" livekit-server
|
||||
fi
|
||||
cat > "$DIR/livekit.yaml" <<'YAML'
|
||||
port: 7880
|
||||
bind_addresses: ["127.0.0.1"]
|
||||
rtc:
|
||||
tcp_port: 7881
|
||||
port_range_start: 50000
|
||||
port_range_end: 50100
|
||||
use_external_ip: false
|
||||
node_ip: 127.0.0.1
|
||||
keys:
|
||||
devkey: devsecretdevsecretdevsecretdevsecret
|
||||
room:
|
||||
auto_create: true
|
||||
YAML
|
||||
local bg
|
||||
bg() { local name="$1"; shift; ( setsid nohup "$@" > "$DIR/calls-$name.log" 2>&1 < /dev/null & echo $! > "$DIR/calls-$name.pid" ); }
|
||||
bg livekit "$LK" --config "$DIR/livekit.yaml"
|
||||
bg jwt env PORT=8071 LIVEKIT_KEY=devkey LIVEKIT_SECRET=devsecretdevsecretdevsecretdevsecret LIVEKIT_URL=ws://127.0.0.1:7880 SYNAPSE_API=http://127.0.0.1:8008 python3 "$ROOT/scripts/dev-lk-jwt.py"
|
||||
if [ ! -f "$DIR/wk.crt" ]; then openssl req -x509 -newkey rsa:2048 -nodes -keyout "$DIR/wk.key" -out "$DIR/wk.crt" -days 365 -subj "/CN=localhost" 2>/dev/null; fi
|
||||
bg wellknown env CERT="$DIR/wk.crt" KEY="$DIR/wk.key" python3 "$ROOT/scripts/dev-wellknown.py"
|
||||
local GUARD="$ROOT/../matrix/livekit/voice-limit-guard.py"
|
||||
local TOKEN_FILE="$DIR/admin.token"
|
||||
if [ -f "$GUARD" ] && [ -f "$TOKEN_FILE" ]; then
|
||||
bg guard env GUARD_BIND_HOST=127.0.0.1 GUARD_BIND_PORT=8070 GUARD_UPSTREAM=http://127.0.0.1:8071 LIVEKIT_API=http://127.0.0.1:7880 LIVEKIT_KEY=devkey LIVEKIT_SECRET=devsecretdevsecretdevsecretdevsecret SYNAPSE_API=http://127.0.0.1:8008 MATRIX_TOKEN="$(cat "$TOKEN_FILE")" python3 "$GUARD"
|
||||
else
|
||||
echo "voice-limit-guard not started (need ../matrix checkout and $TOKEN_FILE from dev-seed.py); pointing the focus straight at the issuer"
|
||||
bg guard env PORT=8070 LIVEKIT_KEY=devkey LIVEKIT_SECRET=devsecretdevsecretdevsecretdevsecret LIVEKIT_URL=ws://127.0.0.1:7880 SYNAPSE_API=http://127.0.0.1:8008 python3 "$ROOT/scripts/dev-lk-jwt.py"
|
||||
fi
|
||||
sleep 2
|
||||
echo "calls stack up: livekit :7880, jwt :8071, guard :8070, well-known https://localhost/.well-known/matrix/client"
|
||||
}
|
||||
|
||||
case "${1:-}" in
|
||||
start) start ;;
|
||||
calls) calls ;;
|
||||
stop) stop ;;
|
||||
reset) stop; rm -f "$DIR"/homeserver.db* ; rm -rf "$DIR/media_store"; echo "database wiped"; ;;
|
||||
*) echo "usage: $0 start|stop|reset" >&2; exit 2 ;;
|
||||
esac
|
||||
@@ -0,0 +1,52 @@
|
||||
#!/usr/bin/env python3
|
||||
"""Minimal lk-jwt-service clone for local testing.
|
||||
POST /sfu/get {room, openid_token{access_token, matrix_server_name}, device_id}
|
||||
-> validates the OpenID token against Synapse (federation openid/userinfo),
|
||||
mints a LiveKit JWT for identity "<user_id>:<device_id>" and returns {url, jwt}.
|
||||
"""
|
||||
import base64, hashlib, hmac, json, os, time, urllib.parse, urllib.request
|
||||
from http.server import BaseHTTPRequestHandler, ThreadingHTTPServer
|
||||
|
||||
PORT = int(os.environ.get("PORT", "8071"))
|
||||
LK_KEY = os.environ.get("LIVEKIT_KEY", "devkey")
|
||||
LK_SECRET = os.environ.get("LIVEKIT_SECRET", "devsecretdevsecretdevsecretdevsecret")
|
||||
LK_URL = os.environ.get("LIVEKIT_URL", "ws://127.0.0.1:7880")
|
||||
SYNAPSE = os.environ.get("SYNAPSE_API", "http://127.0.0.1:8008")
|
||||
|
||||
def b64(b): return base64.urlsafe_b64encode(b).rstrip(b"=").decode()
|
||||
def jwt(payload):
|
||||
h = b64(json.dumps({"alg": "HS256", "typ": "JWT"}).encode()); p = b64(json.dumps(payload).encode())
|
||||
sig = b64(hmac.new(LK_SECRET.encode(), f"{h}.{p}".encode(), hashlib.sha256).digest())
|
||||
return f"{h}.{p}.{sig}"
|
||||
|
||||
def userinfo(access_token):
|
||||
q = urllib.parse.urlencode({"access_token": access_token})
|
||||
with urllib.request.urlopen(f"{SYNAPSE}/_matrix/federation/v1/openid/userinfo?{q}", timeout=5) as r:
|
||||
return json.load(r)["sub"]
|
||||
|
||||
class H(BaseHTTPRequestHandler):
|
||||
def _cors(self):
|
||||
self.send_header("Access-Control-Allow-Origin", "*")
|
||||
self.send_header("Access-Control-Allow-Headers", "*")
|
||||
self.send_header("Access-Control-Allow-Methods", "POST, OPTIONS")
|
||||
def do_OPTIONS(self):
|
||||
self.send_response(204); self._cors(); self.end_headers()
|
||||
def do_POST(self):
|
||||
n = int(self.headers.get("Content-Length") or 0)
|
||||
data = json.loads(self.rfile.read(n) or b"{}")
|
||||
room = data.get("room") or data.get("room_id") or ""
|
||||
oid = data.get("openid_token") or {}
|
||||
try:
|
||||
user = userinfo(oid.get("access_token", ""))
|
||||
except Exception as e: # noqa
|
||||
self.send_response(401); self._cors(); self.end_headers(); self.wfile.write(json.dumps({"errcode": "M_LOOKUP_FAILED", "error": str(e)}).encode()); return
|
||||
identity = f"{user}:{data.get('device_id', '')}"
|
||||
now = int(time.time())
|
||||
token = jwt({"iss": LK_KEY, "sub": identity, "name": user, "nbf": now - 10, "exp": now + 3600,
|
||||
"video": {"room": room, "roomJoin": True, "roomCreate": True, "canPublish": True, "canSubscribe": True, "canPublishData": True}})
|
||||
body = json.dumps({"url": LK_URL, "jwt": token}).encode()
|
||||
self.send_response(200); self._cors(); self.send_header("Content-Type", "application/json"); self.send_header("Content-Length", str(len(body))); self.end_headers(); self.wfile.write(body)
|
||||
print(f"issued {identity} room={room}", flush=True)
|
||||
def log_message(self, *a): pass
|
||||
|
||||
ThreadingHTTPServer(("127.0.0.1", PORT), H).serve_forever()
|
||||
Executable
+82
@@ -0,0 +1,82 @@
|
||||
#!/usr/bin/env python3
|
||||
"""Seed the local dev homeserver (scripts/dev-homeserver.sh) with two users,
|
||||
a busy unencrypted room and a voice room: alice + bob, "Busy Room" (N
|
||||
messages, one image every 10th), "Voice Lounge" (org.matrix.msc3417.call with
|
||||
the call-member power level Lotus applies). Makes alice a server admin (the
|
||||
voice-limit guard reads room state through the admin API) and writes her
|
||||
token to .dev-homeserver/admin.token for `dev-homeserver.sh calls`.
|
||||
Idempotent for the users; every run creates new rooms.
|
||||
|
||||
python3 scripts/dev-seed.py [N=400]
|
||||
"""
|
||||
import json, os, sqlite3, struct, sys, time, urllib.error, urllib.parse, urllib.request, zlib
|
||||
|
||||
HS = "http://127.0.0.1:8008"
|
||||
PASSWORD = "password123"
|
||||
|
||||
|
||||
def req(method, path, data=None, token=None, raw=None, ctype="application/json"):
|
||||
headers = {"Content-Type": ctype}
|
||||
if token:
|
||||
headers["Authorization"] = f"Bearer {token}"
|
||||
body = raw if raw is not None else (json.dumps(data).encode() if data is not None else None)
|
||||
r = urllib.request.Request(HS + path, data=body, headers=headers, method=method)
|
||||
return json.load(urllib.request.urlopen(r))
|
||||
|
||||
|
||||
def register_or_login(user):
|
||||
try:
|
||||
return req("POST", "/_matrix/client/v3/register",
|
||||
{"username": user, "password": PASSWORD, "auth": {"type": "m.login.dummy"}})
|
||||
except urllib.error.HTTPError:
|
||||
return req("POST", "/_matrix/client/v3/login",
|
||||
{"type": "m.login.password", "identifier": {"type": "m.id.user", "user": user}, "password": PASSWORD})
|
||||
|
||||
|
||||
def png(w, h, rgb):
|
||||
raw = b"".join(b"\x00" + bytes(rgb) * w for _ in range(h))
|
||||
def chunk(t, d):
|
||||
return struct.pack(">I", len(d)) + t + d + struct.pack(">I", zlib.crc32(t + d) & 0xFFFFFFFF)
|
||||
return (b"\x89PNG\r\n\x1a\n" + chunk(b"IHDR", struct.pack(">IIBBBBB", w, h, 8, 2, 0, 0, 0))
|
||||
+ chunk(b"IDAT", zlib.compress(raw)) + chunk(b"IEND", b""))
|
||||
|
||||
|
||||
def main():
|
||||
n = int(sys.argv[1]) if len(sys.argv) > 1 else 400
|
||||
alice, bob = register_or_login("alice"), register_or_login("bob")
|
||||
ta, tb = alice["access_token"], bob["access_token"]
|
||||
room = req("POST", "/_matrix/client/v3/createRoom",
|
||||
{"name": "Busy Room", "preset": "public_chat", "visibility": "public"}, ta)["room_id"]
|
||||
req("POST", f"/_matrix/client/v3/join/{urllib.parse.quote(room)}", {}, tb)
|
||||
txn = int(time.time() * 1000)
|
||||
for i in range(n):
|
||||
tok = ta if i % 2 == 0 else tb
|
||||
if i % 10 == 0:
|
||||
data = png(64, 48, ((i * 37) % 256, (i * 91) % 256, (i * 17) % 256))
|
||||
up = req("POST", f"/_matrix/media/v3/upload?filename=img{i}.png", token=tok, raw=data, ctype="image/png")
|
||||
content = {"msgtype": "m.image", "body": f"img{i}.png", "url": up["content_uri"],
|
||||
"info": {"mimetype": "image/png", "w": 64, "h": 48, "size": len(data)}}
|
||||
else:
|
||||
content = {"msgtype": "m.text", "body": f"message #{i}"}
|
||||
txn += 1
|
||||
req("PUT", f"/_matrix/client/v3/rooms/{urllib.parse.quote(room)}/send/m.room.message/{txn}", content, tok)
|
||||
voice = req("POST", "/_matrix/client/v3/createRoom", {
|
||||
"name": "Voice Lounge", "preset": "public_chat",
|
||||
"creation_content": {"type": "org.matrix.msc3417.call"},
|
||||
"initial_state": [{"type": "org.matrix.msc3401.call", "state_key": "", "content": {}}],
|
||||
"power_level_content_override": {"events": {"org.matrix.msc3401.call.member": 0}},
|
||||
}, ta)["room_id"]
|
||||
req("POST", f"/_matrix/client/v3/join/{urllib.parse.quote(voice)}", {}, tb)
|
||||
# admin flag for the guard (takes effect for tokens issued after a Synapse restart-free
|
||||
# cache miss; the guard only needs it for the admin state API)
|
||||
here = os.path.dirname(os.path.abspath(__file__))
|
||||
db = os.path.join(here, "..", ".dev-homeserver", "homeserver.db")
|
||||
if os.path.exists(db):
|
||||
c = sqlite3.connect(db); c.execute("UPDATE users SET admin=1 WHERE name=?", (alice["user_id"],)); c.commit(); c.close()
|
||||
with open(os.path.join(here, "..", ".dev-homeserver", "admin.token"), "w") as f:
|
||||
f.write(ta)
|
||||
print(json.dumps({"room": room, "voice_room": voice, "alice": alice["user_id"], "bob": bob["user_id"], "count": n}))
|
||||
|
||||
|
||||
if __name__ == "__main__":
|
||||
main()
|
||||
@@ -0,0 +1,15 @@
|
||||
#!/usr/bin/env python3
|
||||
"""Self-signed https server on :443 serving the client well-known with the
|
||||
LiveKit focus for the local calls stack (see scripts/dev-homeserver.sh calls)."""
|
||||
import http.server, os, ssl, json
|
||||
BODY = json.dumps({"m.homeserver": {"base_url": "http://localhost:8008"}, "org.matrix.msc4143.rtc_foci": [{"type": "livekit", "livekit_service_url": "http://127.0.0.1:8070"}]}).encode()
|
||||
class H(http.server.BaseHTTPRequestHandler):
|
||||
def do_GET(self):
|
||||
if self.path.startswith('/.well-known/matrix/client'):
|
||||
self.send_response(200); self.send_header('Content-Type','application/json'); self.send_header('Access-Control-Allow-Origin','*'); self.send_header('Content-Length',str(len(BODY))); self.end_headers(); self.wfile.write(BODY)
|
||||
else:
|
||||
self.send_response(404); self.end_headers()
|
||||
def log_message(self,*a): pass
|
||||
srv = http.server.ThreadingHTTPServer(('127.0.0.1', 443), H)
|
||||
ctx = ssl.SSLContext(ssl.PROTOCOL_TLS_SERVER); ctx.load_cert_chain(os.environ.get('CERT', 'wk.crt'), os.environ.get('KEY', 'wk.key')); srv.socket = ctx.wrap_socket(srv.socket, server_side=True)
|
||||
srv.serve_forever()
|
||||
@@ -44,7 +44,7 @@ try {
|
||||
// patched form was found, meaning folds changed the Icon implementation.
|
||||
// Fail loudly so the postinstall hook / CI breaks instead of silently
|
||||
// shipping an unpatched folds (which crashes at render with "src is not a
|
||||
// function"). See LOTUS_TODO.md "Dependencies / Build / Hygiene" for
|
||||
// function"). See cinny #210 (build hygiene notes) for
|
||||
// context on why this is a direct node_modules patch rather than
|
||||
// patch-package.
|
||||
console.error('ERROR: folds Icon patch target not found.');
|
||||
@@ -52,7 +52,7 @@ try {
|
||||
console.error(` Expected to find (surrounding context):\n${original}`);
|
||||
console.error(
|
||||
' folds likely changed its Icon implementation. Update the patch target ' +
|
||||
'in scripts/patch-folds.mjs (see LOTUS_TODO -> "Dependencies / Build / Hygiene" ' +
|
||||
'in scripts/patch-folds.mjs (see cinny #210 ' +
|
||||
'-> patch-folds.mjs entry) before building.',
|
||||
);
|
||||
process.exit(1);
|
||||
|
||||
@@ -26,6 +26,7 @@ import {
|
||||
RoomEvent,
|
||||
} from 'matrix-js-sdk';
|
||||
import { IRTCNotificationContent, RTCNotificationType } from 'matrix-js-sdk/lib/matrixrtc/types';
|
||||
import { MatrixRTCSessionEvent } from 'matrix-js-sdk/lib/matrixrtc/MatrixRTCSession';
|
||||
import { CryptoBackend } from 'matrix-js-sdk/lib/common-crypto/CryptoBackend';
|
||||
import {
|
||||
CallEmbedContextProvider,
|
||||
@@ -33,18 +34,27 @@ import {
|
||||
useCallHangupEvent,
|
||||
useCallJoined,
|
||||
useCallThemeSync,
|
||||
useCallMemberSoundSync,
|
||||
useCallStart,
|
||||
} from '../hooks/useCallEmbed';
|
||||
import { callChatAtom, callEmbedAtom } from '../state/callEmbed';
|
||||
import { toastQueueAtom } from '../state/toast';
|
||||
import { CallEmbed, useCallControlState } from '../plugins/call';
|
||||
import { hangupCallAndWait } from '../plugins/call/hangup';
|
||||
import { useSelectedRoom } from '../hooks/router/useSelectedRoom';
|
||||
import { ScreenSize, useScreenSizeContext } from '../hooks/useScreenSize';
|
||||
import { useMatrixClient } from '../hooks/useMatrixClient';
|
||||
import { previewRingtone, startRingtone, unlockRingtoneAudio } from '../utils/ringtones';
|
||||
import { useCallMembersChange, useCallSession } from '../hooks/useCall';
|
||||
import { useCallJoinLeaveSounds } from '../hooks/useCallJoinLeaveSounds';
|
||||
import { useCallPolicyRevokedToast } from '../hooks/useCallPolicyRevokedToast';
|
||||
import { useCallEndedToast } from '../hooks/useCallEndedToast';
|
||||
import { useCallRejoin } from '../hooks/useCallRejoin';
|
||||
import { usePttHaptics } from '../hooks/usePttHaptics';
|
||||
import { useScreenshareNotices } from '../hooks/useScreenshareNotices';
|
||||
import { useCallAnnouncements } from '../hooks/useCallAnnouncements';
|
||||
import { useMutedTalkWarning } from '../hooks/useMutedTalkWarning';
|
||||
import { callAnnouncementAtom } from '../state/callAnnouncement';
|
||||
import { SrOnly } from '../features/call-status/styles.css';
|
||||
import { useCallHotkeys } from '../hooks/useCallHotkeys';
|
||||
import { useAfkAutoMute } from '../hooks/useAfkAutoMute';
|
||||
import { useCallQuality } from '../hooks/useCallQuality';
|
||||
@@ -68,6 +78,7 @@ import { getPowersLevelFromMatrixEvent } from '../hooks/usePowerLevels';
|
||||
import { getRoomCreatorsForRoomId } from '../hooks/useRoomCreators';
|
||||
import { getRoomPermissionsAPI } from '../hooks/useRoomPermissions';
|
||||
import { useLivekitSupport } from '../hooks/useLivekitSupport';
|
||||
import { useNotificationsQuiet } from '../hooks/useNotificationsQuiet';
|
||||
import { CallAvatarAnimation } from '../styles/Animations.css';
|
||||
import { webRTCSupported } from '../utils/rtc';
|
||||
import { zIndices } from '../styles/zIndex';
|
||||
@@ -111,9 +122,17 @@ function IncomingCall({ dm, info, onIgnore, onAnswer, onReject }: IncomingCallPr
|
||||
const rtcSupported = webRTCSupported();
|
||||
const canAnswer = livekitSupported && rtcSupported;
|
||||
const { room } = info;
|
||||
// [Gitea #135] Answer follows cameraOnJoin: say so, and offer the audio-only
|
||||
// alternative, rather than putting the user on video without warning.
|
||||
const [cameraOnJoinPref] = useSetting(settingsAtom, 'cameraOnJoin');
|
||||
const willAnswerWithCamera = info.intent === 'video' && !!cameraOnJoinPref;
|
||||
|
||||
const [ringtoneVolume] = useSetting(settingsAtom, 'ringtoneVolume');
|
||||
const [ringtoneId] = useSetting(settingsAtom, 'ringtoneId');
|
||||
// Gitea #28 — don't ring during quiet hours / DND / Focus Assist / snooze. The
|
||||
// call can still be answered from this overlay; only the audible ring is
|
||||
// skipped.
|
||||
const quiet = useNotificationsQuiet();
|
||||
|
||||
const roomName = useRoomName(room);
|
||||
const roomAvatar = useRoomAvatar(room, dm);
|
||||
@@ -135,10 +154,10 @@ function IncomingCall({ dm, info, onIgnore, onAnswer, onReject }: IncomingCallPr
|
||||
);
|
||||
|
||||
useEffect(() => {
|
||||
if (info.notificationType !== 'ring') return undefined;
|
||||
if (info.notificationType !== 'ring' || quiet) return undefined;
|
||||
const stop = startRingtone(ringtoneId, Math.max(0, Math.min(1, ringtoneVolume / 100)));
|
||||
return stop;
|
||||
}, [info.notificationType, ringtoneId, ringtoneVolume]);
|
||||
}, [info.notificationType, ringtoneId, ringtoneVolume, quiet]);
|
||||
|
||||
useEffect(() => {
|
||||
const remaining = info.senderTs + info.lifetime - Date.now();
|
||||
@@ -212,6 +231,11 @@ function IncomingCall({ dm, info, onIgnore, onAnswer, onReject }: IncomingCallPr
|
||||
</Text>
|
||||
)}
|
||||
<Box direction="Column" gap="300">
|
||||
{willAnswerWithCamera && (
|
||||
<Text size="T200" align="Center" priority="300">
|
||||
Answering turns your camera on.
|
||||
</Text>
|
||||
)}
|
||||
<Button
|
||||
style={{ flexGrow: 1 }}
|
||||
variant="Success"
|
||||
@@ -228,9 +252,25 @@ function IncomingCall({ dm, info, onIgnore, onAnswer, onReject }: IncomingCallPr
|
||||
disabled={!canAnswer}
|
||||
>
|
||||
<Text as="span" size="B400">
|
||||
Answer
|
||||
{willAnswerWithCamera ? 'Answer with camera' : 'Answer'}
|
||||
</Text>
|
||||
</Button>
|
||||
{willAnswerWithCamera && (
|
||||
<Button
|
||||
style={{ flexGrow: 1 }}
|
||||
variant="Success"
|
||||
fill="Soft"
|
||||
size="400"
|
||||
radii="400"
|
||||
onClick={() => onAnswer(room, false)}
|
||||
before={<Icon size="200" src={Icons.Phone} filled />}
|
||||
disabled={!canAnswer}
|
||||
>
|
||||
<Text as="span" size="B400">
|
||||
Answer without camera
|
||||
</Text>
|
||||
</Button>
|
||||
)}
|
||||
<Button
|
||||
style={{ flexGrow: 1 }}
|
||||
variant={dm ? 'Critical' : 'Secondary'}
|
||||
@@ -272,9 +312,14 @@ function IncomingCallBanner({ dm, info, onIgnore, onAnswer, onReject }: Incoming
|
||||
const useAuthentication = useMediaAuthentication();
|
||||
const { room } = info;
|
||||
const isVideo = info.intent === 'video';
|
||||
const [cameraOnJoinPref] = useSetting(settingsAtom, 'cameraOnJoin');
|
||||
const bannerCameraOn = isVideo && !!cameraOnJoinPref;
|
||||
|
||||
const [ringtoneVolume] = useSetting(settingsAtom, 'ringtoneVolume');
|
||||
const [ringtoneId] = useSetting(settingsAtom, 'ringtoneId');
|
||||
// Gitea #28 — no ping during quiet hours / DND / Focus Assist / snooze; the
|
||||
// banner itself still shows so the call can be answered.
|
||||
const quiet = useNotificationsQuiet();
|
||||
|
||||
const roomName = useRoomName(room);
|
||||
const roomAvatar = useRoomAvatar(room, dm);
|
||||
@@ -301,11 +346,11 @@ function IncomingCallBanner({ dm, info, onIgnore, onAnswer, onReject }: Incoming
|
||||
// ringtone settings while the banner is showing.
|
||||
const pingedRef = useRef<string | undefined>(undefined);
|
||||
useEffect(() => {
|
||||
if (info.notificationType !== 'ring') return;
|
||||
if (info.notificationType !== 'ring' || quiet) return;
|
||||
if (pingedRef.current === info.refEventId) return;
|
||||
pingedRef.current = info.refEventId;
|
||||
previewRingtone(ringtoneId, Math.max(0, Math.min(1, ringtoneVolume / 100)));
|
||||
}, [info.notificationType, info.refEventId, ringtoneId, ringtoneVolume]);
|
||||
}, [info.notificationType, info.refEventId, ringtoneId, ringtoneVolume, quiet]);
|
||||
|
||||
useEffect(() => {
|
||||
const remaining = info.senderTs + info.lifetime - Date.now();
|
||||
@@ -367,7 +412,7 @@ function IncomingCallBanner({ dm, info, onIgnore, onAnswer, onReject }: Incoming
|
||||
</Text>
|
||||
</Box>
|
||||
</Box>
|
||||
<Box gap="200">
|
||||
<Box gap="200" wrap="Wrap">
|
||||
<Button
|
||||
style={{ flexGrow: 1 }}
|
||||
variant="Success"
|
||||
@@ -376,11 +421,27 @@ function IncomingCallBanner({ dm, info, onIgnore, onAnswer, onReject }: Incoming
|
||||
radii="300"
|
||||
onClick={() => onAnswer(room, isVideo)}
|
||||
before={<Icon size="100" src={isVideo ? Icons.VideoCamera : Icons.Phone} filled />}
|
||||
title={bannerCameraOn ? 'Answering turns your camera on' : undefined}
|
||||
>
|
||||
<Text as="span" size="B300">
|
||||
Answer
|
||||
{bannerCameraOn ? 'Answer with camera' : 'Answer'}
|
||||
</Text>
|
||||
</Button>
|
||||
{bannerCameraOn && (
|
||||
<Button
|
||||
style={{ flexGrow: 1 }}
|
||||
variant="Success"
|
||||
fill="Soft"
|
||||
size="300"
|
||||
radii="300"
|
||||
onClick={() => onAnswer(room, false)}
|
||||
before={<Icon size="100" src={Icons.Phone} filled />}
|
||||
>
|
||||
<Text as="span" size="B300">
|
||||
Answer without camera
|
||||
</Text>
|
||||
</Button>
|
||||
)}
|
||||
<Button
|
||||
style={{ flexGrow: 1 }}
|
||||
variant={dm ? 'Critical' : 'Secondary'}
|
||||
@@ -413,6 +474,7 @@ function IncomingCallListener({ callEmbed, joined }: IncomingCallListenerProps)
|
||||
const [callInfo, setCallInfo] = useState<IncomingCallInfo>();
|
||||
const dm = callInfo ? directs.has(callInfo.room.roomId) : false;
|
||||
const startCall = useCallStart(dm);
|
||||
const setCallEmbed = useSetAtom(callEmbedAtom);
|
||||
const { microphone, sound } = useCallPreferences();
|
||||
const [cameraOnJoin] = useSetting(settingsAtom, 'cameraOnJoin');
|
||||
|
||||
@@ -551,6 +613,50 @@ function IncomingCallListener({ callEmbed, joined }: IncomingCallListenerProps)
|
||||
setCallInfo(undefined);
|
||||
}, []);
|
||||
|
||||
// [Gitea #161] Stop ringing here when the call was handled ELSEWHERE:
|
||||
// - answered on another of our devices (our own m.call.member appears),
|
||||
// - declined on another of our devices (our own RTCDecline for this ring),
|
||||
// - the caller hung up before we picked up (nobody left in the session).
|
||||
// Without this every other device kept ringing for the full lifetime.
|
||||
useEffect(() => {
|
||||
if (!callInfo) return undefined;
|
||||
const { room, refEventId } = callInfo;
|
||||
const myUserId = mx.getSafeUserId();
|
||||
const dismiss = () =>
|
||||
setCallInfo((current) => (current?.refEventId === refEventId ? undefined : current));
|
||||
|
||||
const session = mx.matrixRTC.getRoomSession(room);
|
||||
const checkMemberships = () => {
|
||||
const { memberships } = session;
|
||||
if (memberships.some((m) => m.sender === myUserId))
|
||||
dismiss(); // answered elsewhere
|
||||
else if (memberships.length === 0) dismiss(); // caller gone
|
||||
};
|
||||
const onTimeline: EventTimelineSetHandlerMap[RoomEvent.Timeline] = (
|
||||
event,
|
||||
eventRoom,
|
||||
_s,
|
||||
_r,
|
||||
data,
|
||||
) => {
|
||||
if (eventRoom?.roomId !== room.roomId || !data.liveEvent) return;
|
||||
if (event.getType() === EventType.RTCDecline && event.getSender() === myUserId) {
|
||||
const related = event.getRelation()?.event_id;
|
||||
if (!related || related === refEventId) dismiss(); // declined elsewhere
|
||||
}
|
||||
};
|
||||
session.on(MatrixRTCSessionEvent.MembershipsChanged, checkMemberships);
|
||||
mx.on(RoomEvent.Timeline, onTimeline);
|
||||
// The caller's membership may not have arrived yet when the ring starts —
|
||||
// only treat "empty" as hung-up after it has had a moment to sync.
|
||||
const settle = setTimeout(checkMemberships, 5000);
|
||||
return () => {
|
||||
session.off(MatrixRTCSessionEvent.MembershipsChanged, checkMemberships);
|
||||
mx.removeListener(RoomEvent.Timeline, onTimeline);
|
||||
clearTimeout(settle);
|
||||
};
|
||||
}, [mx, callInfo]);
|
||||
|
||||
const handleReject = useCallback(
|
||||
(room: Room, eventId: string) => {
|
||||
// Best-effort: the local UI dismisses regardless (below), but a failed
|
||||
@@ -570,16 +676,26 @@ function IncomingCallListener({ callEmbed, joined }: IncomingCallListenerProps)
|
||||
);
|
||||
|
||||
const handleAnswer = useCallback(
|
||||
(room: Room, video: boolean) => {
|
||||
async (room: Room, video: boolean) => {
|
||||
setCallInfo(undefined);
|
||||
// [Gitea #195] Answering from the in-call banner is the one call-to-call
|
||||
// switch path. Disposing the current embed alone leaves our ghost
|
||||
// `m.call.member` in the old room for ~17 s (until the delayed leave
|
||||
// expires) — hang up explicitly and wait for the membership to clear.
|
||||
if (callEmbed?.joined) {
|
||||
await hangupCallAndWait(mx, callEmbed);
|
||||
// Dispose it ourselves now: its HangupCall echo would otherwise land
|
||||
// after startCall() and clear the NEW embed from the atom.
|
||||
setCallEmbed(undefined);
|
||||
}
|
||||
// Honour cameraOnJoin and the persisted mic/sound preferences instead of
|
||||
// forcing camera+mic+sound on — every other join path does this, and
|
||||
// Answer was skipping it, publishing the camera with no prescreen.
|
||||
// (PTT's forceAudioOff is applied downstream inside useCallStart.)
|
||||
startCall(room, { microphone, video: cameraOnJoin && video, sound });
|
||||
setCallInfo(undefined);
|
||||
navigateRoom(room.roomId);
|
||||
},
|
||||
[startCall, navigateRoom, microphone, sound, cameraOnJoin],
|
||||
[startCall, navigateRoom, microphone, sound, cameraOnJoin, callEmbed, mx, setCallEmbed],
|
||||
);
|
||||
|
||||
if (!callInfo) return null;
|
||||
@@ -611,6 +727,16 @@ function IncomingCallListener({ callEmbed, joined }: IncomingCallListenerProps)
|
||||
);
|
||||
}
|
||||
|
||||
// [Gitea #168] Lives outside the embed so "Call ended" is still announced.
|
||||
function CallAnnouncementRegion() {
|
||||
const announcement = useAtomValue(callAnnouncementAtom);
|
||||
return (
|
||||
<span className={SrOnly} role="status" aria-live="polite" aria-atomic="true">
|
||||
{announcement}
|
||||
</span>
|
||||
);
|
||||
}
|
||||
|
||||
function CallUtils({ embed, joined }: { embed: CallEmbed; joined: boolean }) {
|
||||
const setCallEmbed = useSetAtom(callEmbedAtom);
|
||||
|
||||
@@ -620,8 +746,13 @@ function CallUtils({ embed, joined }: { embed: CallEmbed; joined: boolean }) {
|
||||
// the mobile in-call chat. Both are gated on `joined`.
|
||||
useCallHotkeys(embed, joined);
|
||||
useAfkAutoMute(joined ? embed : undefined);
|
||||
useCallMemberSoundSync(embed);
|
||||
useCallJoinLeaveSounds(embed);
|
||||
useCallPolicyRevokedToast(embed, joined);
|
||||
useCallEndedToast(embed);
|
||||
useScreenshareNotices(embed);
|
||||
usePttHaptics();
|
||||
useCallAnnouncements(embed, joined);
|
||||
useMutedTalkWarning(embed, joined);
|
||||
useCallThemeSync(embed);
|
||||
useCallQuality(embed);
|
||||
useCallHangupEvent(
|
||||
@@ -716,6 +847,12 @@ function PipMuteOverlay({ callEmbed }: { callEmbed: CallEmbed }) {
|
||||
type CallEmbedProviderProps = {
|
||||
children?: ReactNode;
|
||||
};
|
||||
/** [Gitea #118] Heartbeat + rejoin after a crash/restart; needs the embed container mounted. */
|
||||
function CallRejoin({ callEmbed, joined }: { callEmbed?: CallEmbed; joined: boolean }) {
|
||||
useCallRejoin(callEmbed, joined);
|
||||
return null;
|
||||
}
|
||||
|
||||
export function CallEmbedProvider({ children }: CallEmbedProviderProps) {
|
||||
const callEmbed = useAtomValue(callEmbedAtom);
|
||||
const callEmbedRef = useRef<HTMLDivElement>(null) as React.RefObject<HTMLDivElement>;
|
||||
@@ -1165,8 +1302,10 @@ export function CallEmbedProvider({ children }: CallEmbedProviderProps) {
|
||||
return (
|
||||
<CallEmbedContextProvider value={callEmbed}>
|
||||
{callEmbed && <CallUtils embed={callEmbed} joined={joined} />}
|
||||
<CallAnnouncementRegion />
|
||||
<CallEmbedRefContextProvider value={callEmbedRef}>
|
||||
<IncomingCallListener callEmbed={callEmbed} joined={joined} />
|
||||
<CallRejoin callEmbed={callEmbed} joined={joined} />
|
||||
{children}
|
||||
</CallEmbedRefContextProvider>
|
||||
<div
|
||||
@@ -1178,7 +1317,15 @@ export function CallEmbedProvider({ children }: CallEmbedProviderProps) {
|
||||
left: 0,
|
||||
width: '100%',
|
||||
height: '50%',
|
||||
...(callVisible && !pipMode ? wallpaperStyle : {}),
|
||||
// [Gitea #224] The fork renders EC transparent (lotusTransparent) so the
|
||||
// wallpaper shows through the full-size embed; in PiP the thing behind
|
||||
// the frame is whatever room you navigated to, so give it an opaque
|
||||
// surface instead of letting the timeline bleed through the tiles.
|
||||
...(pipMode
|
||||
? { background: color.Surface.Container }
|
||||
: callVisible
|
||||
? wallpaperStyle
|
||||
: {}),
|
||||
}}
|
||||
ref={callEmbedRef}
|
||||
>
|
||||
|
||||
@@ -19,7 +19,7 @@ import { useSaveFile } from '../hooks/useSaveFile';
|
||||
import { useModalStyle } from '../hooks/useModalStyle';
|
||||
import { PasswordInput } from './password-input';
|
||||
import { ContainerColor } from '../styles/ContainerColor.css';
|
||||
import { copyToClipboard } from '../utils/dom';
|
||||
import { useSensitiveCopy } from '../hooks/useSensitiveCopy';
|
||||
import { AsyncStatus, useAsyncCallback } from '../hooks/useAsyncCallback';
|
||||
import { clearSecretStorageKeys } from '../../client/secretStorageKeys';
|
||||
import { ActionUIA, ActionUIAFlowsLoader } from './ActionUIA';
|
||||
@@ -232,9 +232,8 @@ function RecoveryKeyDisplay({ recoveryKey }: RecoveryKeyDisplayProps) {
|
||||
const [show, setShow] = useState(false);
|
||||
const saveFile = useSaveFile();
|
||||
|
||||
const handleCopy = () => {
|
||||
copyToClipboard(recoveryKey);
|
||||
};
|
||||
// [Gitea #156] The key leaves the clipboard again after 60 s, visibly.
|
||||
const { copy: handleCopy, secondsLeft } = useSensitiveCopy(recoveryKey);
|
||||
|
||||
const handleDownload = () => {
|
||||
const blob = new Blob([recoveryKey], {
|
||||
@@ -272,8 +271,10 @@ function RecoveryKeyDisplay({ recoveryKey }: RecoveryKeyDisplayProps) {
|
||||
</Box>
|
||||
</Box>
|
||||
<Box direction="Column" gap="200">
|
||||
<Button onClick={handleCopy}>
|
||||
<Text size="B400">Copy</Text>
|
||||
<Button onClick={handleCopy} aria-live="polite">
|
||||
<Text size="B400">
|
||||
{secondsLeft !== null ? `Copied · clears in ${secondsLeft} s` : 'Copy'}
|
||||
</Text>
|
||||
</Button>
|
||||
<Button onClick={handleDownload} fill="Soft">
|
||||
<Text size="B400">Download</Text>
|
||||
|
||||
@@ -4,6 +4,8 @@ import { useAtom } from 'jotai';
|
||||
import { Grid, SearchBar, SearchContext, SearchContextManager } from '@giphy/react-components';
|
||||
import { IGif } from '@giphy/js-types';
|
||||
import { Box, color, config } from 'folds';
|
||||
import { TapToSendBar } from './tap-to-send/TapToSendBar';
|
||||
import { useRecentTouch } from '../hooks/useRecentTouch';
|
||||
import { useElementSizeObserver } from '../hooks/useElementSizeObserver';
|
||||
import { useSetting } from '../state/hooks/settings';
|
||||
import { settingsAtom } from '../state/settings';
|
||||
@@ -120,13 +122,31 @@ function GifPickerInner({ onSelect, requestClose, lotusTerminal }: GifPickerInne
|
||||
|
||||
const sendGif = useCallback(
|
||||
(gif: RecentGif) => {
|
||||
setRecents((prev) => addRecentGif(prev, gif));
|
||||
const { url, width, height, previewUrl } = gif;
|
||||
setRecents((prev) => addRecentGif(prev, { url, width, height, previewUrl }));
|
||||
onSelect(gif.url, gif.width, gif.height);
|
||||
requestClose();
|
||||
},
|
||||
[onSelect, requestClose, setRecents],
|
||||
);
|
||||
|
||||
// [Gitea #147] Touch: first tap parks the GIF in a preview bar, second tap
|
||||
// (or Send) sends. Mouse/keyboard/screen reader: one step, as before.
|
||||
const containerRef = useRef<HTMLDivElement>(null);
|
||||
const { wasTouch } = useRecentTouch(containerRef);
|
||||
const [pending, setPending] = useState<(RecentGif & { title?: string }) | undefined>();
|
||||
const pick = useCallback(
|
||||
(gif: RecentGif & { title?: string }) => {
|
||||
if (wasTouch() && pending?.url !== gif.url) {
|
||||
setPending(gif);
|
||||
return;
|
||||
}
|
||||
setPending(undefined);
|
||||
sendGif(gif);
|
||||
},
|
||||
[wasTouch, pending, sendGif],
|
||||
);
|
||||
|
||||
const handleClick = useCallback(
|
||||
(gif: IGif, e: React.SyntheticEvent) => {
|
||||
e.preventDefault();
|
||||
@@ -135,14 +155,15 @@ function GifPickerInner({ onSelect, requestClose, lotusTerminal }: GifPickerInne
|
||||
gif.images.fixed_width_small_still?.url ??
|
||||
gif.images.downsized_still?.url ??
|
||||
gif.images.original_still?.url;
|
||||
sendGif({
|
||||
pick({
|
||||
url: r.url,
|
||||
width: Number(r.width) || 200,
|
||||
height: Number(r.height) || 200,
|
||||
previewUrl,
|
||||
title: gif.title,
|
||||
});
|
||||
},
|
||||
[sendGif],
|
||||
[pick],
|
||||
);
|
||||
|
||||
const showRecents = recents.length > 0 && !(term ?? '').trim();
|
||||
@@ -150,7 +171,6 @@ function GifPickerInner({ onSelect, requestClose, lotusTerminal }: GifPickerInne
|
||||
// The container is min(312px, 100vw-16); feed the Grid the live pixel width
|
||||
// (minus the inner 8px padding on each side) so it doesn't overflow a phone
|
||||
// narrower than 312px with a fixed 296px grid.
|
||||
const containerRef = useRef<HTMLDivElement>(null);
|
||||
const [gridWidth, setGridWidth] = useState(PICKER_WIDTH - 16);
|
||||
useElementSizeObserver(
|
||||
useCallback(() => containerRef.current, []),
|
||||
@@ -180,11 +200,22 @@ function GifPickerInner({ onSelect, requestClose, lotusTerminal }: GifPickerInne
|
||||
<SearchBar />
|
||||
</div>
|
||||
</Box>
|
||||
{pending && (
|
||||
<TapToSendBar
|
||||
previewUrl={pending.previewUrl ?? pending.url}
|
||||
label={pending.title || 'GIF'}
|
||||
onSend={() => {
|
||||
setPending(undefined);
|
||||
sendGif(pending);
|
||||
}}
|
||||
onCancel={() => setPending(undefined)}
|
||||
/>
|
||||
)}
|
||||
<div
|
||||
style={{ overflowY: 'auto', overflowX: 'hidden', maxHeight: '340px', padding: '0 8px 8px' }}
|
||||
>
|
||||
{showRecents && (
|
||||
<RecentGifs recents={recents} lotusTerminal={lotusTerminal} onPick={sendGif} />
|
||||
<RecentGifs recents={recents} lotusTerminal={lotusTerminal} onPick={pick} />
|
||||
)}
|
||||
<Grid
|
||||
key={searchKey}
|
||||
|
||||
@@ -30,7 +30,7 @@ export const ImageOverlay = as<'div', ImageOverlayProps>(
|
||||
<Modal
|
||||
className={ModalWide}
|
||||
size="500"
|
||||
onContextMenu={(evt: any) => evt.stopPropagation()}
|
||||
onContextMenu={(evt: React.MouseEvent) => evt.stopPropagation()}
|
||||
>
|
||||
{renderViewer({
|
||||
src,
|
||||
|
||||
@@ -1,7 +1,10 @@
|
||||
import React, { forwardRef, useCallback } from 'react';
|
||||
import { Dialog, Header, config, Box, Text, Button, Spinner, color } from 'folds';
|
||||
import { useAtom } from 'jotai';
|
||||
import { AsyncStatus, useAsyncCallback } from '../hooks/useAsyncCallback';
|
||||
import { logoutClient } from '../../client/initMatrix';
|
||||
import { callEmbedAtom } from '../state/callEmbed';
|
||||
import { hangupCallAndWait } from '../plugins/call/hangup';
|
||||
import { useMatrixClient } from '../hooks/useMatrixClient';
|
||||
import { useModalStyle } from '../hooks/useModalStyle';
|
||||
import { useCrossSigningActive } from '../hooks/useCrossSigning';
|
||||
@@ -11,6 +14,11 @@ import {
|
||||
VerificationStatus,
|
||||
} from '../hooks/useDeviceVerificationStatus';
|
||||
|
||||
/**
|
||||
* Ask Element Call to hang up and wait (bounded) until our own MatrixRTC
|
||||
* membership has actually been removed from the room, so the leave reaches
|
||||
* the homeserver before the client is stopped and the token is revoked.
|
||||
*/
|
||||
type LogoutDialogProps = {
|
||||
handleClose: () => void;
|
||||
};
|
||||
@@ -26,10 +34,19 @@ export const LogoutDialog = forwardRef<HTMLDivElement, LogoutDialogProps>(
|
||||
mx.getDeviceId() ?? undefined,
|
||||
);
|
||||
|
||||
const [callEmbed, setCallEmbed] = useAtom(callEmbedAtom);
|
||||
|
||||
const [logoutState, logout] = useAsyncCallback<void, Error, []>(
|
||||
useCallback(async () => {
|
||||
// [Gitea #29] Logging out mid-call must hang up first, or the MatrixRTC
|
||||
// membership (expires: 4 h) stays behind as a ghost participant and
|
||||
// everyone else sees you "in call" until it times out.
|
||||
if (callEmbed && callEmbed.joined && !callEmbed.disposed) {
|
||||
await hangupCallAndWait(mx, callEmbed);
|
||||
setCallEmbed(undefined);
|
||||
}
|
||||
await logoutClient(mx);
|
||||
}, [mx]),
|
||||
}, [mx, callEmbed, setCallEmbed]),
|
||||
);
|
||||
|
||||
const ongoingLogout = logoutState.status === AsyncStatus.Loading;
|
||||
|
||||
@@ -24,6 +24,8 @@ export function Modal500({ requestClose, children }: Modal500Props) {
|
||||
<Modal
|
||||
size="500"
|
||||
variant="Background"
|
||||
role="dialog"
|
||||
aria-modal="true"
|
||||
// On mobile expand to fill the viewport. On desktop fall back to the
|
||||
// folds `size="500"` width (~50rem) — overriding maxWidth here would
|
||||
// squish the two-pane settings layout.
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import React from 'react';
|
||||
import { MsgType } from 'matrix-js-sdk';
|
||||
import { MatrixEvent, MsgType } from 'matrix-js-sdk';
|
||||
import { HTMLReactParserOptions } from 'html-react-parser';
|
||||
import { Opts } from 'linkifyjs';
|
||||
import { config, Text } from 'folds';
|
||||
@@ -26,6 +26,8 @@ import {
|
||||
VerificationRequestContent,
|
||||
VideoContent,
|
||||
} from './message';
|
||||
import { DiffToken } from '../utils/wordDiff';
|
||||
import { EditDiffContext } from './message/content/EditDiffContext';
|
||||
import { UrlPreviewCard, UrlPreviewHolder } from './url-preview';
|
||||
import { Image, MediaControl, Video } from './media';
|
||||
import { ImageViewer } from './image-viewer';
|
||||
@@ -70,8 +72,21 @@ type RenderMessageContentProps = {
|
||||
linkifyOpts: Opts;
|
||||
outlineAttachment?: boolean;
|
||||
eventId?: string;
|
||||
/** [Gitea #219] Open the room's shared media lightbox at this event. */
|
||||
onOpenImageViewer?: () => void;
|
||||
/** [Gitea #159] The event, for the undecryptable placeholder's reason + retry. */
|
||||
mEvent?: MatrixEvent;
|
||||
/** [Gitea #144] Word diff of the last edit, shown on "(edited)" hover. */
|
||||
editDiff?: DiffToken[];
|
||||
};
|
||||
export function RenderMessageContent({
|
||||
export function RenderMessageContent({ editDiff, ...props }: RenderMessageContentProps) {
|
||||
return (
|
||||
<EditDiffContext.Provider value={editDiff}>
|
||||
<RenderMessageContentBody {...props} />
|
||||
</EditDiffContext.Provider>
|
||||
);
|
||||
}
|
||||
function RenderMessageContentBody({
|
||||
displayName,
|
||||
msgType,
|
||||
ts,
|
||||
@@ -85,7 +100,9 @@ export function RenderMessageContent({
|
||||
linkifyOpts,
|
||||
outlineAttachment,
|
||||
eventId,
|
||||
}: RenderMessageContentProps) {
|
||||
onOpenImageViewer,
|
||||
mEvent,
|
||||
}: Omit<RenderMessageContentProps, 'editDiff'>) {
|
||||
const renderUrlsPreview = (urls: string[]) => {
|
||||
// Cap previews per message so a link-dump doesn't spawn dozens of preview
|
||||
// fetches + iframes at once. De-dupe first: a message linking the same URL
|
||||
@@ -241,6 +258,7 @@ export function RenderMessageContent({
|
||||
autoPlay={mediaAutoLoad}
|
||||
renderImage={(p) => <Image {...p} loading="lazy" />}
|
||||
renderViewer={(p) => <ImageViewer {...p} />}
|
||||
onOpenViewer={onOpenImageViewer}
|
||||
/>
|
||||
)}
|
||||
outlined={outlineAttachment}
|
||||
@@ -342,7 +360,7 @@ export function RenderMessageContent({
|
||||
}
|
||||
|
||||
if (msgType === 'm.bad.encrypted') {
|
||||
return <MBadEncrypted />;
|
||||
return <MBadEncrypted mEvent={mEvent} />;
|
||||
}
|
||||
|
||||
if (msgType === 'm.key.verification.request') {
|
||||
|
||||
@@ -248,7 +248,7 @@ export function VoiceMessageRecorder({ onSend, onError }: VoiceRecorderProps) {
|
||||
radii="300"
|
||||
title="Record voice message"
|
||||
>
|
||||
<Icon src={Icons.Mic} size="100" />
|
||||
<Icon src={Icons.Mic} />
|
||||
</IconButton>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -0,0 +1,100 @@
|
||||
import React, { ReactNode, useCallback, useRef, useState } from 'react';
|
||||
import FocusTrap from 'focus-trap-react';
|
||||
import { Box, Overlay, OverlayBackdrop, config, color, toRem } from 'folds';
|
||||
import { stopPropagation } from '../../utils/keyboard';
|
||||
|
||||
type ActionSheetProps = {
|
||||
open: boolean;
|
||||
onClose: () => void;
|
||||
'aria-label'?: string;
|
||||
children: ReactNode;
|
||||
};
|
||||
|
||||
/**
|
||||
* [Gitea #166] A bottom sheet for touch screens: slides up from the bottom,
|
||||
* swipe-down or backdrop tap dismisses. Content is whatever the caller
|
||||
* renders (quick reactions + a folds Menu, for message actions).
|
||||
*/
|
||||
export function ActionSheet({
|
||||
open,
|
||||
onClose,
|
||||
children,
|
||||
'aria-label': ariaLabel,
|
||||
}: ActionSheetProps) {
|
||||
const [dragY, setDragY] = useState(0);
|
||||
const startY = useRef<number | null>(null);
|
||||
// The long-press that opened us ends with a touchend/click that lands
|
||||
// "outside" the sheet — ignore outside clicks for the first moments.
|
||||
const openedAt = useRef(Date.now());
|
||||
|
||||
const onTouchStart = useCallback((evt: React.TouchEvent) => {
|
||||
startY.current = evt.touches[0]?.clientY ?? null;
|
||||
}, []);
|
||||
const onTouchMove = useCallback((evt: React.TouchEvent) => {
|
||||
if (startY.current === null) return;
|
||||
const dy = (evt.touches[0]?.clientY ?? startY.current) - startY.current;
|
||||
setDragY(Math.max(0, dy));
|
||||
}, []);
|
||||
const onTouchEnd = useCallback(() => {
|
||||
const dismiss = dragY > 80;
|
||||
startY.current = null;
|
||||
setDragY(0);
|
||||
if (dismiss) onClose();
|
||||
}, [dragY, onClose]);
|
||||
|
||||
if (!open) return null;
|
||||
return (
|
||||
<Overlay open backdrop={<OverlayBackdrop />}>
|
||||
<FocusTrap
|
||||
focusTrapOptions={{
|
||||
initialFocus: false,
|
||||
onDeactivate: onClose,
|
||||
clickOutsideDeactivates: () => Date.now() - openedAt.current > 600,
|
||||
escapeDeactivates: stopPropagation,
|
||||
}}
|
||||
>
|
||||
<Box
|
||||
role="dialog"
|
||||
aria-modal
|
||||
aria-label={ariaLabel}
|
||||
direction="Column"
|
||||
style={{
|
||||
position: 'fixed',
|
||||
left: 0,
|
||||
right: 0,
|
||||
bottom: 0,
|
||||
maxHeight: '75vh',
|
||||
background: color.Surface.Container,
|
||||
color: color.Surface.OnContainer,
|
||||
borderTopLeftRadius: toRem(16),
|
||||
borderTopRightRadius: toRem(16),
|
||||
boxShadow: '0 -8px 32px rgba(0,0,0,0.35)',
|
||||
paddingBottom: 'env(safe-area-inset-bottom)',
|
||||
transform: dragY ? `translateY(${dragY}px)` : undefined,
|
||||
transition: dragY ? undefined : 'transform 120ms ease-out',
|
||||
overflow: 'hidden',
|
||||
}}
|
||||
onTouchStart={onTouchStart}
|
||||
onTouchMove={onTouchMove}
|
||||
onTouchEnd={onTouchEnd}
|
||||
onTouchCancel={onTouchEnd}
|
||||
>
|
||||
<Box justifyContent="Center" shrink="No" style={{ padding: config.space.S200 }}>
|
||||
<div
|
||||
aria-hidden
|
||||
style={{
|
||||
width: toRem(36),
|
||||
height: toRem(4),
|
||||
borderRadius: toRem(2),
|
||||
background: color.Surface.ContainerLine,
|
||||
}}
|
||||
/>
|
||||
</Box>
|
||||
<Box direction="Column" style={{ overflowY: 'auto' }}>
|
||||
{children}
|
||||
</Box>
|
||||
</Box>
|
||||
</FocusTrap>
|
||||
</Overlay>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
export * from './ActionSheet';
|
||||
@@ -16,21 +16,16 @@ export const EditorOptions = style([
|
||||
DefaultReset,
|
||||
{
|
||||
padding: config.space.S200,
|
||||
'@media': {
|
||||
// On phones the toolbar can hold many 44px buttons; let them wrap to a
|
||||
// second line instead of overflowing horizontally.
|
||||
'(max-width: 750px)': { flexWrap: 'wrap' },
|
||||
},
|
||||
},
|
||||
]);
|
||||
|
||||
// The composer's before | editable | after row. On phones, allow the toolbar
|
||||
// (`after`) to wrap below the input instead of squeezing the editable to zero
|
||||
// and pushing the Send button off-screen.
|
||||
// The composer's before | editable | after row. It must NOT wrap: folds'
|
||||
// Scroll (the editable's wrapper) is `width: 100%`, so a wrapping row always
|
||||
// breaks into three stacked lines (before / editable / after) — the "wonky"
|
||||
// phone composer. Narrow viewports keep one row by collapsing the secondary
|
||||
// buttons behind the "+" overflow instead (RoomInput `compact`).
|
||||
export const EditorInputRow = style({
|
||||
'@media': {
|
||||
'(max-width: 750px)': { flexWrap: 'wrap' },
|
||||
},
|
||||
minWidth: 0,
|
||||
});
|
||||
|
||||
export const EditorTextareaScroll = style({});
|
||||
@@ -41,6 +36,20 @@ export const EditorTextarea = style([
|
||||
flexGrow: 1,
|
||||
height: '100%',
|
||||
padding: `${toRem(13)} ${toRem(1)}`,
|
||||
'@media': {
|
||||
// Phone-width composer rows carry 44px touch targets (MobileTouchTarget),
|
||||
// so the row is 60px instead of 48px; pad the text to keep it level with
|
||||
// the buttons instead of hugging the top of the row. Only when the row
|
||||
// actually has before/after buttons (not the edit-message editor).
|
||||
'(max-width: 750px)': {
|
||||
selectors: {
|
||||
[`${EditorTextareaScroll}:not(:only-child) &`]: {
|
||||
paddingTop: toRem(19),
|
||||
paddingBottom: toRem(19),
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
selectors: {
|
||||
[`${EditorTextareaScroll}:first-child &`]: {
|
||||
paddingLeft: toRem(13),
|
||||
@@ -58,7 +67,9 @@ export const EditorTextarea = style([
|
||||
export const EditorPlaceholderContainer = style([
|
||||
DefaultReset,
|
||||
{
|
||||
opacity: config.opacity.Placeholder,
|
||||
// [Gitea #222] folds' Placeholder opacity (0.5) lands at ~2.3:1 on the
|
||||
// composer surface; P300 keeps it visibly secondary at AA contrast.
|
||||
opacity: config.opacity.P300,
|
||||
pointerEvents: 'none',
|
||||
userSelect: 'none',
|
||||
},
|
||||
@@ -70,6 +81,13 @@ export const EditorPlaceholderTextVisual = style([
|
||||
display: 'block',
|
||||
paddingTop: toRem(13),
|
||||
paddingLeft: toRem(1),
|
||||
'@media': {
|
||||
'(max-width: 750px)': {
|
||||
selectors: {
|
||||
[`${EditorTextareaScroll}:not(:only-child) &`]: { paddingTop: toRem(19) },
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
]);
|
||||
|
||||
|
||||
@@ -23,7 +23,13 @@ import { CustomElement } from './slate';
|
||||
import * as css from './Editor.css';
|
||||
import { toggleKeyboardShortcut } from './keyboard';
|
||||
|
||||
const initialValue: CustomElement[] = [
|
||||
// One FRESH value per editor instance. slate-react keys its node→path weak
|
||||
// maps by node object identity, so a module-level constant shared by every
|
||||
// <Slate> (main composer + thread composer + message editor) makes the second
|
||||
// mount hijack the first editor's nodes and the first editor throws "Unable to
|
||||
// find the path for Slate node" on its next render — the app-wide crash when
|
||||
// opening a thread on a pristine composer (Gitea #165 / #184).
|
||||
const createInitialValue = (): CustomElement[] => [
|
||||
{
|
||||
type: BlockType.Paragraph,
|
||||
children: [{ text: '' }],
|
||||
@@ -92,6 +98,7 @@ export const CustomEditor = forwardRef<HTMLDivElement, CustomEditorProps>(
|
||||
},
|
||||
ref,
|
||||
) => {
|
||||
const [initialValue] = useState(createInitialValue);
|
||||
const renderElement = useCallback(
|
||||
(props: RenderElementProps) => <RenderElement {...props} />,
|
||||
[],
|
||||
|
||||
@@ -65,3 +65,27 @@ test('no math conversion inside a code block', () => {
|
||||
test('a message with no math is unchanged', () => {
|
||||
assert.equal(toMatrixCustomHTML(txt('just hello'), OPTS), 'just hello');
|
||||
});
|
||||
|
||||
// Gitea #184 O3 — markdown mode: fences and backtick spans typed as plain
|
||||
// paragraphs are literal too (the block markdown parser only sees the fence
|
||||
// after the lines are joined, so math must be skipped while serialising them).
|
||||
const MD_OPTS = { ...OPTS, allowInlineMarkdown: true, allowBlockMarkdown: true };
|
||||
|
||||
test('markdown: no math conversion inside a typed ``` fence', () => {
|
||||
const paragraphs = [
|
||||
el(BlockType.Paragraph, [txt('```')]),
|
||||
el(BlockType.Paragraph, [txt('$x$ literal')]),
|
||||
el(BlockType.Paragraph, [txt('```')]),
|
||||
el(BlockType.Paragraph, [txt('after $y$')]),
|
||||
];
|
||||
const out = toMatrixCustomHTML(paragraphs, MD_OPTS);
|
||||
assert.ok(out.includes('<pre'), 'fence became a code block');
|
||||
assert.ok(out.includes('$x$ literal'), 'code block content stays literal');
|
||||
assert.ok(out.includes('data-mx-maths="y"'), 'math after the fence still converts');
|
||||
});
|
||||
|
||||
test('markdown: no math conversion inside a backtick span, math outside still converts', () => {
|
||||
const out = toMatrixCustomHTML(el(BlockType.Paragraph, [txt('use `$x$` and $y$')]), MD_OPTS);
|
||||
assert.ok(/<code[^>]*>\$x\$<\/code>/.test(out), 'backtick span stays literal');
|
||||
assert.ok(out.includes('data-mx-maths="y"'));
|
||||
});
|
||||
|
||||
@@ -36,6 +36,18 @@ const textToCustomHtml = (node: Text, opts: OutputOptions): string => {
|
||||
// applied inside inline code. Non-math text recurses with allowMath off so it
|
||||
// still gets the normal marks + inline-markdown treatment.
|
||||
if (opts.allowMath && !node.code) {
|
||||
// Markdown inline code spans (`…`) are literal too: apply math only to the
|
||||
// text between them (Gitea #184 O3 — `$x$` inside backticks stayed math).
|
||||
if (opts.allowInlineMarkdown && /`[^`]*`/.test(node.text)) {
|
||||
return node.text
|
||||
.split(/(`+[^`]*`+)/)
|
||||
.map((part) =>
|
||||
part.startsWith('`')
|
||||
? textToCustomHtml({ ...node, text: part }, { ...opts, allowMath: false })
|
||||
: textToCustomHtml({ ...node, text: part }, opts),
|
||||
)
|
||||
.join('');
|
||||
}
|
||||
const segments = splitMathSegments(node.text);
|
||||
if (segments.some((seg) => seg.type !== 'text')) {
|
||||
return segments
|
||||
@@ -128,12 +140,20 @@ export const toMatrixCustomHTML = (
|
||||
opts: OutputOptions,
|
||||
): string => {
|
||||
let markdownLines = '';
|
||||
// Inside a markdown ``` fence every line is literal: no `$…$` math conversion
|
||||
// (the fence is only recognised by parseBlockMD after the lines are joined,
|
||||
// which is too late — Gitea #184 O3).
|
||||
let inFence = false;
|
||||
const parseNode = (n: Descendant, index: number, targetNodes: Descendant[]) => {
|
||||
if (opts.allowBlockMarkdown && 'type' in n && n.type === BlockType.Paragraph) {
|
||||
const isFenceLine = /^\s*```/.test(toPlainText(n, false));
|
||||
const literal = inFence || isFenceLine;
|
||||
if (isFenceLine) inFence = !inFence;
|
||||
const line = toMatrixCustomHTML(n, {
|
||||
...opts,
|
||||
allowInlineMarkdown: false,
|
||||
allowBlockMarkdown: false,
|
||||
allowMath: opts.allowMath && !literal,
|
||||
})
|
||||
.replace(/<br\/>$/, '\n')
|
||||
.replace(/^(\\*)>/, '$1>');
|
||||
|
||||
@@ -268,15 +268,15 @@ export const getPointUntilChar = (
|
||||
return targetPoint;
|
||||
};
|
||||
|
||||
export const getPrevWorldRange = (editor: Editor): BaseRange | undefined => {
|
||||
export const getPrevWordRange = (editor: Editor): BaseRange | undefined => {
|
||||
const { selection } = editor;
|
||||
if (!selection || !Range.isCollapsed(selection)) return undefined;
|
||||
const [cursorPoint] = Range.edges(selection);
|
||||
const worldStartPoint = getPointUntilChar(editor, cursorPoint, {
|
||||
const wordStartPoint = getPointUntilChar(editor, cursorPoint, {
|
||||
reverse: true,
|
||||
match: (char) => char === ' ',
|
||||
match: (char) => char === ' ' || char === '',
|
||||
});
|
||||
return worldStartPoint && Editor.range(editor, worldStartPoint, cursorPoint);
|
||||
return wordStartPoint && Editor.range(editor, wordStartPoint, cursorPoint);
|
||||
};
|
||||
|
||||
export const isEmptyEditor = (editor: Editor): boolean => {
|
||||
|
||||
@@ -31,6 +31,8 @@ import { useThrottle } from '../../hooks/useThrottle';
|
||||
import { addRecentEmoji } from '../../plugins/recent-emoji';
|
||||
import { addRecentSticker, recentStickersAtom } from '../../state/recentStickers';
|
||||
import { useMediaAuthentication } from '../../hooks/useMediaAuthentication';
|
||||
import { useRecentTouch } from '../../hooks/useRecentTouch';
|
||||
import { TapToSendBar } from '../tap-to-send/TapToSendBar';
|
||||
import { ImagePack, ImageUsage, PackImageReader } from '../../plugins/custom-emoji';
|
||||
import { getEmoticonSearchStr } from '../../plugins/utils';
|
||||
import {
|
||||
@@ -52,7 +54,7 @@ import {
|
||||
EmojiGroup,
|
||||
EmojiBoardLayout,
|
||||
} from './components';
|
||||
import { EmojiBoardTab, EmojiType } from './types';
|
||||
import { EmojiBoardTab, EmojiItemInfo, EmojiType } from './types';
|
||||
import { VirtualTile } from '../virtualizer';
|
||||
|
||||
const RECENT_GROUP_ID = 'recent_group';
|
||||
@@ -518,10 +520,27 @@ export function EmojiBoard({
|
||||
});
|
||||
const vItems = virtualizer.getVirtualItems();
|
||||
|
||||
// [Gitea #147] Touch: first tap on a sticker parks it in a preview bar,
|
||||
// second tap (or the bar's Send) sends. Mouse/keyboard/screen reader: one step.
|
||||
const { wasTouch } = useRecentTouch(contentScrollRef);
|
||||
const [pendingSticker, setPendingSticker] = useState<EmojiItemInfo | undefined>();
|
||||
const stickerUseAuthentication = useMediaAuthentication();
|
||||
const sendSticker = (info: EmojiItemInfo, close: boolean) => {
|
||||
onStickerSelect?.(info.data, info.shortcode, info.label);
|
||||
setRecentStickers((prev) =>
|
||||
addRecentSticker(prev, { url: info.data, shortcode: info.shortcode, body: info.label }),
|
||||
);
|
||||
setPendingSticker(undefined);
|
||||
if (close) requestClose();
|
||||
};
|
||||
|
||||
const handleGroupItemClick: MouseEventHandler = (evt) => {
|
||||
const targetEl = targetFromEvent(evt.nativeEvent, 'button');
|
||||
const emojiInfo = targetEl && getEmojiItemInfo(targetEl);
|
||||
if (!emojiInfo) return;
|
||||
if (!emojiInfo) {
|
||||
if (pendingSticker) setPendingSticker(undefined);
|
||||
return;
|
||||
}
|
||||
|
||||
if (emojiInfo.type === EmojiType.Emoji) {
|
||||
onEmojiSelect?.(emojiInfo.data, emojiInfo.shortcode);
|
||||
@@ -533,14 +552,12 @@ export function EmojiBoard({
|
||||
onCustomEmojiSelect?.(emojiInfo.data, emojiInfo.shortcode);
|
||||
}
|
||||
if (emojiInfo.type === EmojiType.Sticker) {
|
||||
onStickerSelect?.(emojiInfo.data, emojiInfo.shortcode, emojiInfo.label);
|
||||
setRecentStickers((prev) =>
|
||||
addRecentSticker(prev, {
|
||||
url: emojiInfo.data,
|
||||
shortcode: emojiInfo.shortcode,
|
||||
body: emojiInfo.label,
|
||||
}),
|
||||
);
|
||||
if (wasTouch() && pendingSticker?.data !== emojiInfo.data) {
|
||||
setPendingSticker(emojiInfo);
|
||||
return;
|
||||
}
|
||||
sendSticker(emojiInfo, !evt.altKey && !evt.shiftKey);
|
||||
return;
|
||||
}
|
||||
if (!evt.altKey && !evt.shiftKey) requestClose();
|
||||
};
|
||||
@@ -670,7 +687,18 @@ export function EmojiBoard({
|
||||
{tab === EmojiBoardTab.Sticker && groups.length === 0 && <NoStickerPacks />}
|
||||
</EmojiGroupHolder>
|
||||
</Box>
|
||||
<Preview previewAtom={previewAtom} />
|
||||
{pendingSticker && tab === EmojiBoardTab.Sticker ? (
|
||||
<TapToSendBar
|
||||
previewUrl={
|
||||
mxcUrlToHttp(mx, pendingSticker.data, stickerUseAuthentication) ?? undefined
|
||||
}
|
||||
label={pendingSticker.label}
|
||||
onSend={() => sendSticker(pendingSticker, true)}
|
||||
onCancel={() => setPendingSticker(undefined)}
|
||||
/>
|
||||
) : (
|
||||
<Preview previewAtom={previewAtom} />
|
||||
)}
|
||||
</EmojiBoardLayout>
|
||||
</FocusTrap>
|
||||
);
|
||||
|
||||
@@ -24,32 +24,19 @@ import { useSpaceOptionally } from '../../hooks/useSpace';
|
||||
import { getMouseEventCords } from '../../utils/dom';
|
||||
import { useSetting } from '../../state/hooks/settings';
|
||||
import { settingsAtom } from '../../state/settings';
|
||||
import { today, yesterday, timeHourMinute, timeMon, timeDay, timeYear } from '../../utils/time';
|
||||
import { TimestampPrefs, formatTimestamp } from '../../utils/formatTimestamp';
|
||||
import { useTimestampFormatter } from '../../hooks/useTimestampFormatter';
|
||||
|
||||
function formatReadTs(ts: number, hour24Clock: boolean): string {
|
||||
const timeStr = timeHourMinute(ts, hour24Clock);
|
||||
if (today(ts)) return `Today at ${timeStr}`;
|
||||
if (yesterday(ts)) return `Yesterday at ${timeStr}`;
|
||||
const sameYear = timeYear(ts) === timeYear(Date.now());
|
||||
return sameYear
|
||||
? `${timeMon(ts)} ${timeDay(ts)} at ${timeStr}`
|
||||
: `${timeMon(ts)} ${timeDay(ts)} ${timeYear(ts)} at ${timeStr}`;
|
||||
}
|
||||
const formatReadTs = (ts: number, prefs: TimestampPrefs): string => formatTimestamp(ts, prefs);
|
||||
|
||||
type EventReaderItemProps = {
|
||||
room: Room;
|
||||
readerId: string;
|
||||
hour24Clock: boolean;
|
||||
prefs: TimestampPrefs;
|
||||
lotusTerminal: boolean;
|
||||
onSelect: React.MouseEventHandler<HTMLButtonElement>;
|
||||
};
|
||||
function EventReaderItem({
|
||||
room,
|
||||
readerId,
|
||||
hour24Clock,
|
||||
lotusTerminal,
|
||||
onSelect,
|
||||
}: EventReaderItemProps) {
|
||||
function EventReaderItem({ room, readerId, prefs, lotusTerminal, onSelect }: EventReaderItemProps) {
|
||||
const { name, avatarUrl } = useMemberAvatar(room, readerId, 100, 100);
|
||||
const receiptTs = room.getReadReceiptForUserId(readerId)?.data.ts;
|
||||
|
||||
@@ -86,7 +73,7 @@ function EventReaderItem({
|
||||
: undefined
|
||||
}
|
||||
>
|
||||
{formatReadTs(receiptTs, hour24Clock)}
|
||||
{formatReadTs(receiptTs, prefs)}
|
||||
</Text>
|
||||
)}
|
||||
</Box>
|
||||
@@ -106,7 +93,7 @@ export const EventReaders = as<'div', EventReadersProps>(
|
||||
const latestEventReaders = useRoomEventReaders(room, eventId).filter((id) => id !== myUserId);
|
||||
const openProfile = useOpenUserRoomProfile();
|
||||
const space = useSpaceOptionally();
|
||||
const [hour24Clock] = useSetting(settingsAtom, 'hour24Clock');
|
||||
const { prefs } = useTimestampFormatter();
|
||||
const [lotusTerminal] = useSetting(settingsAtom, 'lotusTerminal');
|
||||
|
||||
return (
|
||||
@@ -157,7 +144,7 @@ export const EventReaders = as<'div', EventReadersProps>(
|
||||
key={readerId}
|
||||
room={room}
|
||||
readerId={readerId}
|
||||
hour24Clock={hour24Clock}
|
||||
prefs={prefs}
|
||||
lotusTerminal={lotusTerminal}
|
||||
onSelect={(event) => {
|
||||
openProfile(
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import React from 'react';
|
||||
import React, { useEffect, useRef } from 'react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import classNames from 'classnames';
|
||||
import { Box, Chip, Header, Icon, IconButton, Icons, Text, as } from 'folds';
|
||||
@@ -27,12 +27,37 @@ export const ImageViewer = as<'div', ImageViewerProps>(
|
||||
saveFile(fileContent, alt);
|
||||
};
|
||||
|
||||
// [Gitea #164] Same keyboard model as the gallery lightbox: + / = zoom
|
||||
// in, - zoom out, 0 reset; double-click toggles 1× ↔ 2×. The root takes
|
||||
// focus on open so those keys (and Escape, handled by the modal) work
|
||||
// immediately instead of only after clicking inside the viewer.
|
||||
const rootRef = useRef<HTMLDivElement>(null);
|
||||
useEffect(() => {
|
||||
rootRef.current?.focus({ preventScroll: true });
|
||||
}, []);
|
||||
const handleKeyDown = (evt: React.KeyboardEvent) => {
|
||||
if (evt.key === '+' || evt.key === '=') zoomIn();
|
||||
else if (evt.key === '-') zoomOut();
|
||||
else if (evt.key === '0') setZoom(1);
|
||||
else return;
|
||||
evt.preventDefault();
|
||||
};
|
||||
|
||||
return (
|
||||
<Box
|
||||
className={classNames(css.ImageViewer, className)}
|
||||
direction="Column"
|
||||
role="dialog"
|
||||
aria-modal
|
||||
aria-label={alt || 'Image viewer'}
|
||||
tabIndex={-1}
|
||||
onKeyDown={handleKeyDown}
|
||||
{...props}
|
||||
ref={ref}
|
||||
ref={(node: HTMLDivElement | null) => {
|
||||
rootRef.current = node;
|
||||
if (typeof ref === 'function') ref(node);
|
||||
else if (ref) (ref as React.MutableRefObject<HTMLDivElement | null>).current = node;
|
||||
}}
|
||||
>
|
||||
<Header className={css.ImageViewerHeader} size="400">
|
||||
<Box grow="Yes" alignItems="Center" gap="200">
|
||||
@@ -116,6 +141,7 @@ export const ImageViewer = as<'div', ImageViewerProps>(
|
||||
alt={alt}
|
||||
onMouseDown={onMouseDown}
|
||||
onTouchStart={onTouchStart}
|
||||
onDoubleClick={() => setZoom(zoom === 1 ? 2 : 1)}
|
||||
/>
|
||||
</Box>
|
||||
</Box>
|
||||
|
||||
@@ -33,6 +33,7 @@ import {
|
||||
import { Room } from 'matrix-js-sdk';
|
||||
import { isKeyHotkey } from 'is-hotkey';
|
||||
import FocusTrap from 'focus-trap-react';
|
||||
import { QRCodeSVG } from 'qrcode.react';
|
||||
import { stopPropagation } from '../../utils/keyboard';
|
||||
import { useDirectUsers } from '../../hooks/useDirectUsers';
|
||||
import {
|
||||
@@ -237,13 +238,25 @@ export function InviteUserPrompt({ room, requestClose }: InviteUserProps) {
|
||||
borderBottom: `1px solid ${color.Surface.ContainerLine}`,
|
||||
}}
|
||||
>
|
||||
<img
|
||||
src={`https://api.qrserver.com/v1/create-qr-code/?size=180x180&data=${encodeURIComponent(inviteUrl)}`}
|
||||
alt="QR code for room invite link"
|
||||
width={180}
|
||||
height={180}
|
||||
style={{ display: 'block', borderRadius: config.radii.R300 }}
|
||||
/>
|
||||
{/* Generated locally (qrcode.react) like RoomShareInvite — the
|
||||
old api.qrserver.com <img> leaked the room link to a third
|
||||
party and is blocked by the prod CSP img-src anyway
|
||||
(Gitea #192). White quiet-zone so it scans on any theme. */}
|
||||
<Box
|
||||
style={{
|
||||
padding: config.space.S200,
|
||||
background: '#ffffff',
|
||||
borderRadius: config.radii.R300,
|
||||
lineHeight: 0,
|
||||
}}
|
||||
>
|
||||
<QRCodeSVG
|
||||
value={inviteUrl}
|
||||
size={164}
|
||||
level="M"
|
||||
title="QR code for room invite link"
|
||||
/>
|
||||
</Box>
|
||||
<Text
|
||||
size="T200"
|
||||
style={{ opacity: 0.6, wordBreak: 'break-all', textAlign: 'center' }}
|
||||
|
||||
@@ -0,0 +1,67 @@
|
||||
import React, { MouseEventHandler } from 'react';
|
||||
import { Box, Icon, Icons, Text, as, toRem } from 'folds';
|
||||
import { MatrixClient } from 'matrix-js-sdk';
|
||||
import classNames from 'classnames';
|
||||
import * as css from './Reply.css';
|
||||
import { ForwardedMeta } from '../../features/room/message/forwardContent';
|
||||
import { getMemberDisplayName } from '../../utils/room';
|
||||
import { getMxIdLocalPart } from '../../utils/matrix';
|
||||
import { formatTimestamp } from '../../utils/formatTimestamp';
|
||||
|
||||
type ForwardedHeaderProps = {
|
||||
mx: MatrixClient;
|
||||
meta: ForwardedMeta;
|
||||
hour24Clock: boolean;
|
||||
dateFormatString: string;
|
||||
/** Present when the viewer can open the original (they are in the source room). */
|
||||
onJump?: MouseEventHandler;
|
||||
};
|
||||
|
||||
/**
|
||||
* "↪ Forwarded · from <sender> in <room> · <time>" — the provenance line above
|
||||
* a forwarded message (Gitea: forwards used to look like the forwarder's own
|
||||
* words). Renders in the same visual slot and style as a reply quote so it
|
||||
* reads as message context, not as content.
|
||||
*/
|
||||
export const ForwardedHeader = as<'div', ForwardedHeaderProps>(
|
||||
({ mx, meta, hour24Clock, dateFormatString, onJump, className, ...props }, ref) => {
|
||||
const sourceRoom = meta.room_id ? mx.getRoom(meta.room_id) : null;
|
||||
const senderName =
|
||||
(sourceRoom && getMemberDisplayName(sourceRoom, meta.sender)) ??
|
||||
mx.getUser(meta.sender)?.displayName ??
|
||||
getMxIdLocalPart(meta.sender) ??
|
||||
meta.sender;
|
||||
const ts = meta.origin_server_ts;
|
||||
const when = formatTimestamp(ts, { hour24Clock, dateFormatString });
|
||||
const canJump = !!sourceRoom && !!onJump;
|
||||
|
||||
return (
|
||||
<Box
|
||||
as={canJump ? 'button' : 'div'}
|
||||
className={classNames(css.Reply, className)}
|
||||
alignItems="Center"
|
||||
gap="100"
|
||||
onClick={canJump ? onJump : undefined}
|
||||
title={canJump ? 'Jump to the original message' : undefined}
|
||||
aria-label={`Forwarded from ${senderName}${sourceRoom ? ` in ${sourceRoom.name}` : ''}, ${when}`}
|
||||
{...props}
|
||||
ref={ref}
|
||||
>
|
||||
<Box alignItems="Center" gap="100" shrink="No" style={{ maxWidth: toRem(420) }}>
|
||||
<Icon size="100" src={Icons.ArrowGoRight} />
|
||||
<Text size="T300" priority="300" truncate>
|
||||
Forwarded from <b>{senderName}</b>
|
||||
{sourceRoom ? (
|
||||
<>
|
||||
{' in '}
|
||||
<b>{sourceRoom.name}</b>
|
||||
</>
|
||||
) : null}
|
||||
{' · '}
|
||||
{when}
|
||||
</Text>
|
||||
</Box>
|
||||
</Box>
|
||||
);
|
||||
},
|
||||
);
|
||||
@@ -1,7 +1,11 @@
|
||||
import React, { CSSProperties, ReactNode, useEffect, useRef, useState } from 'react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { Box, Button, config, Icon, Icons, Text, color, toRem } from 'folds';
|
||||
import { IContent } from 'matrix-js-sdk';
|
||||
import { IContent, MatrixEvent } from 'matrix-js-sdk';
|
||||
import { useSetAtom } from 'jotai';
|
||||
import { useMatrixClient } from '../../hooks/useMatrixClient';
|
||||
import { settingsRequestAtom } from '../../state/settingsRequest';
|
||||
import { describeDecryptionFailure } from '../../utils/decryptionReason';
|
||||
import { JUMBO_EMOJI_REG, URL_REG } from '../../utils/regex';
|
||||
import { trimReplyFromBody } from '../../utils/room';
|
||||
import { MessageTextBody } from './layout';
|
||||
@@ -42,14 +46,31 @@ type CollapsibleBodyProps = {
|
||||
eventId?: string;
|
||||
children: ReactNode;
|
||||
};
|
||||
// [Gitea #152] Messages the user expanded this session. The timeline unmounts
|
||||
// rows as they scroll away, so component state alone forgot the choice;
|
||||
// module-scoped (never persisted) survives remounts and clears on reload.
|
||||
const expandedMessages = new Set<string>();
|
||||
|
||||
function CollapsibleBody({ eventId, children }: CollapsibleBodyProps) {
|
||||
const bodyRef = useRef<HTMLDivElement>(null);
|
||||
const [needsCollapse, setNeedsCollapse] = useState(false);
|
||||
const [collapsed, setCollapsed] = useState(true);
|
||||
const [collapsed, setCollapsedState] = useState(
|
||||
() => !(eventId && expandedMessages.has(eventId)),
|
||||
);
|
||||
const setCollapsed = (next: boolean | ((c: boolean) => boolean)) => {
|
||||
setCollapsedState((c) => {
|
||||
const value = typeof next === 'function' ? next(c) : next;
|
||||
if (eventId) {
|
||||
if (value) expandedMessages.delete(eventId);
|
||||
else expandedMessages.add(eventId);
|
||||
}
|
||||
return value;
|
||||
});
|
||||
};
|
||||
|
||||
// Reset collapsed state when the event changes (new message)
|
||||
useEffect(() => {
|
||||
setCollapsed(true);
|
||||
setCollapsedState(!(eventId && expandedMessages.has(eventId)));
|
||||
setNeedsCollapse(false);
|
||||
}, [eventId]);
|
||||
|
||||
@@ -120,11 +141,59 @@ function CollapsibleBody({ eventId, children }: CollapsibleBodyProps) {
|
||||
);
|
||||
}
|
||||
|
||||
export function MBadEncrypted() {
|
||||
type MBadEncryptedProps = {
|
||||
mEvent?: MatrixEvent;
|
||||
};
|
||||
/**
|
||||
* [Gitea #159] The undecryptable placeholder says WHY and offers the one
|
||||
* action that fixes it (set up key backup / verify this session / retry).
|
||||
* The raw SDK code stays in the tooltip for support.
|
||||
*/
|
||||
export function MBadEncrypted({ mEvent }: MBadEncryptedProps) {
|
||||
const mx = useMatrixClient();
|
||||
const requestSettings = useSetAtom(settingsRequestAtom);
|
||||
const [retrying, setRetrying] = useState(false);
|
||||
const code = mEvent?.decryptionFailureReason ?? null;
|
||||
const reason = describeDecryptionFailure(code);
|
||||
|
||||
const handleAction = async () => {
|
||||
if (reason.action === 'setup-backup' || reason.action === 'verify-session') {
|
||||
requestSettings('devices');
|
||||
return;
|
||||
}
|
||||
if (reason.action === 'retry' && mEvent) {
|
||||
setRetrying(true);
|
||||
try {
|
||||
await mx.decryptEventIfNeeded(mEvent, { forceRedecryptIfUntrusted: true });
|
||||
} catch {
|
||||
// still undecryptable — the placeholder re-renders with the current reason
|
||||
} finally {
|
||||
setRetrying(false);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<Text>
|
||||
<MessageBadEncryptedContent />
|
||||
</Text>
|
||||
<Box direction="Column" gap="100" alignItems="Start">
|
||||
<Text>
|
||||
<MessageBadEncryptedContent title={code ?? undefined} />
|
||||
</Text>
|
||||
<Text size="T200" priority="300">
|
||||
{reason.text}
|
||||
</Text>
|
||||
{reason.action !== 'none' && (
|
||||
<Button
|
||||
size="300"
|
||||
variant="Secondary"
|
||||
fill="Soft"
|
||||
radii="300"
|
||||
onClick={handleAction}
|
||||
disabled={retrying}
|
||||
>
|
||||
<Text size="B300">{retrying ? 'Retrying…' : reason.actionLabel}</Text>
|
||||
</Button>
|
||||
)}
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
@@ -8,6 +8,7 @@ import { getMxIdLocalPart } from '../../utils/matrix';
|
||||
import { LinePlaceholder } from './placeholder';
|
||||
import { randomNumberBetween } from '../../utils/common';
|
||||
import * as css from './Reply.css';
|
||||
import { ReplyMediaThumb, hasReplyMedia } from './ReplyMediaThumb';
|
||||
import { MessageBadEncryptedContent, MessageDeletedContent, MessageFailedContent } from './content';
|
||||
import { scaleSystemEmoji } from '../../plugins/react-custom-html-parser';
|
||||
import { useRoomEvent } from '../../hooks/useRoomEvent';
|
||||
@@ -143,9 +144,12 @@ export const Reply = as<'div', ReplyProps>(
|
||||
<i>Original message not available</i>
|
||||
</Text>
|
||||
) : (
|
||||
<Text size="T300" truncate>
|
||||
{badEncryption ? <MessageBadEncryptedContent /> : bodyJSX}
|
||||
</Text>
|
||||
<Box alignItems="Center" gap="200" style={{ minWidth: 0 }}>
|
||||
{hasReplyMedia(replyEvent) && <ReplyMediaThumb mEvent={replyEvent} />}
|
||||
<Text size="T300" truncate>
|
||||
{badEncryption ? <MessageBadEncryptedContent /> : bodyJSX}
|
||||
</Text>
|
||||
</Box>
|
||||
)}
|
||||
</ReplyLayout>
|
||||
</Box>
|
||||
|
||||
@@ -0,0 +1,75 @@
|
||||
import React from 'react';
|
||||
import { Icon, Icons, config, toRem } from 'folds';
|
||||
import { MatrixEvent, MsgType } from 'matrix-js-sdk';
|
||||
import { useMatrixClient } from '../../hooks/useMatrixClient';
|
||||
import { useMediaAuthentication } from '../../hooks/useMediaAuthentication';
|
||||
import { useDecryptedMediaUrl } from '../../hooks/useDecryptedMediaUrl';
|
||||
import { getThumbMxc } from '../../utils/mediaThumb';
|
||||
import { MessageEvent } from '../../../types/matrix/room';
|
||||
|
||||
const SIZE = 36;
|
||||
|
||||
/** Whether a reply quote for this event should carry a thumbnail. */
|
||||
export const hasReplyMedia = (mEvent: MatrixEvent | null | undefined): boolean => {
|
||||
if (!mEvent || mEvent.isRedacted()) return false;
|
||||
if (mEvent.getType() === MessageEvent.Sticker) return true;
|
||||
const msgtype = mEvent.getContent().msgtype;
|
||||
return msgtype === MsgType.Image || msgtype === MsgType.Video;
|
||||
};
|
||||
|
||||
/**
|
||||
* [Gitea #151] 36 px thumbnail in a reply quote for an image/video/sticker.
|
||||
* Uses the event's own thumbnail (decrypting it for E2EE media), never the
|
||||
* full-size file.
|
||||
*/
|
||||
export function ReplyMediaThumb({ mEvent }: { mEvent: MatrixEvent }) {
|
||||
const mx = useMatrixClient();
|
||||
const useAuthentication = useMediaAuthentication();
|
||||
const content = mEvent.getContent();
|
||||
const isVideo = content.msgtype === MsgType.Video;
|
||||
const thumbMxc = getThumbMxc(mEvent);
|
||||
const info = content.info as Record<string, unknown> | undefined;
|
||||
const encInfo = content.file
|
||||
? ((info?.thumbnail_file as typeof content.file | undefined) ?? content.file)
|
||||
: undefined;
|
||||
const mimeType =
|
||||
(info?.thumbnail_info as { mimetype?: string } | undefined)?.mimetype ??
|
||||
(info?.mimetype as string | undefined);
|
||||
const media = useDecryptedMediaUrl(mx, thumbMxc, encInfo, useAuthentication, mimeType);
|
||||
|
||||
return (
|
||||
<span
|
||||
aria-hidden
|
||||
style={{
|
||||
position: 'relative',
|
||||
display: 'inline-flex',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
width: toRem(SIZE),
|
||||
height: toRem(SIZE),
|
||||
flexShrink: 0,
|
||||
borderRadius: config.radii.R300,
|
||||
overflow: 'hidden',
|
||||
background: 'rgba(127, 127, 127, 0.15)',
|
||||
}}
|
||||
>
|
||||
{media.status === 'ok' ? (
|
||||
<img
|
||||
src={media.url}
|
||||
alt=""
|
||||
style={{ width: '100%', height: '100%', objectFit: 'cover', display: 'block' }}
|
||||
/>
|
||||
) : (
|
||||
<Icon size="100" src={isVideo ? Icons.Play : Icons.Photo} />
|
||||
)}
|
||||
{isVideo && media.status === 'ok' && (
|
||||
<Icon
|
||||
size="50"
|
||||
src={Icons.Play}
|
||||
filled
|
||||
style={{ position: 'absolute', color: 'white', filter: 'drop-shadow(0 0 2px black)' }}
|
||||
/>
|
||||
)}
|
||||
</span>
|
||||
);
|
||||
}
|
||||
@@ -1,6 +1,6 @@
|
||||
import React, { ComponentProps } from 'react';
|
||||
import { Text, as } from 'folds';
|
||||
import { timeDayMonYear, timeHourMinute, today, yesterday } from '../../utils/time';
|
||||
import { formatTimestamp } from '../../utils/formatTimestamp';
|
||||
|
||||
export type TimeProps = {
|
||||
compact?: boolean;
|
||||
@@ -12,8 +12,8 @@ export type TimeProps = {
|
||||
/**
|
||||
* Renders a formatted timestamp, supporting compact and full display modes.
|
||||
*
|
||||
* Displays the time in hour:minute format if the message is from today, yesterday, or if `compact` is true.
|
||||
* For older messages, it shows the date and time.
|
||||
* `compact` always shows the clock time; otherwise the shared `formatTimestamp`
|
||||
* rules apply (today → time, yesterday/this week → day word + time, else date + time).
|
||||
*
|
||||
* @param {number} ts - The timestamp to display.
|
||||
* @param {boolean} [compact=false] - If true, always show only the time.
|
||||
@@ -23,18 +23,7 @@ export type TimeProps = {
|
||||
*/
|
||||
export const Time = as<'span', TimeProps & ComponentProps<typeof Text>>(
|
||||
({ compact, hour24Clock, dateFormatString, ts, ...props }, ref) => {
|
||||
const formattedTime = timeHourMinute(ts, hour24Clock);
|
||||
|
||||
let time = '';
|
||||
if (compact) {
|
||||
time = formattedTime;
|
||||
} else if (today(ts)) {
|
||||
time = formattedTime;
|
||||
} else if (yesterday(ts)) {
|
||||
time = `Yesterday ${formattedTime}`;
|
||||
} else {
|
||||
time = `${timeDayMonYear(ts, dateFormatString)} ${formattedTime}`;
|
||||
}
|
||||
const time = formatTimestamp(ts, { hour24Clock, dateFormatString }, compact ? 'time' : 'auto');
|
||||
|
||||
return (
|
||||
<Text as="time" style={{ flexShrink: 0 }} size="T200" priority="300" {...props} ref={ref}>
|
||||
|
||||
@@ -0,0 +1,6 @@
|
||||
import { createContext, useContext } from 'react';
|
||||
import { DiffToken } from '../../../utils/wordDiff';
|
||||
|
||||
/** [Gitea #144] Word diff of the message's last edit, for the "(edited)" hover. */
|
||||
export const EditDiffContext = createContext<DiffToken[] | undefined>(undefined);
|
||||
export const useEditDiff = () => useContext(EditDiffContext);
|
||||
@@ -1,5 +1,20 @@
|
||||
import { Box, Icon, Icons, Text, as, color, config } from 'folds';
|
||||
import React from 'react';
|
||||
import {
|
||||
Box,
|
||||
Icon,
|
||||
Icons,
|
||||
PopOut,
|
||||
RectCords,
|
||||
Text,
|
||||
Tooltip,
|
||||
TooltipProvider,
|
||||
as,
|
||||
color,
|
||||
config,
|
||||
} from 'folds';
|
||||
import React, { useEffect, useState } from 'react';
|
||||
import { useLongPress } from '../../../hooks/useLongPress';
|
||||
import { DiffToken, countChanges } from '../../../utils/wordDiff';
|
||||
import { useEditDiff } from './EditDiffContext';
|
||||
|
||||
const warningStyle = { color: color.Warning.Main, opacity: config.opacity.P300 };
|
||||
const criticalStyle = { color: color.Critical.Main, opacity: config.opacity.P300 };
|
||||
@@ -66,29 +81,157 @@ export const MessageVerificationRequestContent = as<'div', { children?: never }>
|
||||
),
|
||||
);
|
||||
|
||||
const editDiffStyle: React.CSSProperties = {
|
||||
maxWidth: '40ch',
|
||||
whiteSpace: 'pre-wrap',
|
||||
overflowWrap: 'anywhere',
|
||||
maxHeight: '12lh',
|
||||
overflow: 'hidden',
|
||||
};
|
||||
|
||||
/** The last edit as a word diff: removed words struck, added words bold. */
|
||||
export function EditDiffBody({ tokens, hint }: { tokens: DiffToken[]; hint: string }) {
|
||||
const { added, removed } = countChanges(tokens);
|
||||
return (
|
||||
<Box direction="Column" gap="100" style={editDiffStyle}>
|
||||
<Text size="T200" priority="300">
|
||||
Last edit
|
||||
{added > 0 && ` · +${added}`}
|
||||
{removed > 0 && ` · −${removed}`}
|
||||
</Text>
|
||||
<Text as="span" size="T300" dir="auto">
|
||||
{tokens.map((t, i) => {
|
||||
if (t.op === 'add')
|
||||
return (
|
||||
<ins key={i} style={{ textDecoration: 'none', fontWeight: 'bold' }}>
|
||||
{t.text}
|
||||
</ins>
|
||||
);
|
||||
if (t.op === 'del')
|
||||
return (
|
||||
<del key={i} style={{ opacity: config.opacity.P300 }}>
|
||||
{t.text}
|
||||
</del>
|
||||
);
|
||||
return <React.Fragment key={i}>{t.text}</React.Fragment>;
|
||||
})}
|
||||
</Text>
|
||||
<Text size="T200" priority="300">
|
||||
{hint}
|
||||
</Text>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
const editedButtonStyle: React.CSSProperties = {
|
||||
cursor: 'pointer',
|
||||
background: 'none',
|
||||
border: 'none',
|
||||
padding: 0,
|
||||
};
|
||||
|
||||
/**
|
||||
* "(edited)" label. With an edit-history handler it is a button that opens
|
||||
* the viewer; when the surrounding message also provides a last-edit diff
|
||||
* (see `EditDiffContext`) hover/focus shows it as a tooltip and a touch
|
||||
* long-press shows it as a popout. [Gitea #144]
|
||||
*/
|
||||
export const MessageEditedContent = as<
|
||||
'span',
|
||||
{ children?: never; onEditHistoryClick?: () => void }
|
||||
>(({ onEditHistoryClick, ...props }, ref) =>
|
||||
onEditHistoryClick ? (
|
||||
>(({ onEditHistoryClick, ...props }, ref) => {
|
||||
const diff = useEditDiff();
|
||||
const [pressAnchor, setPressAnchor] = useState<RectCords | undefined>();
|
||||
const { coarse, handlers, suppressContextMenu } = useLongPress((x, y) => {
|
||||
if (diff) setPressAnchor({ x, y, width: 1, height: 1 });
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
if (!pressAnchor) return undefined;
|
||||
const close = () => setPressAnchor(undefined);
|
||||
const t = window.setTimeout(close, 6000);
|
||||
window.addEventListener('touchstart', close, { passive: true });
|
||||
window.addEventListener('scroll', close, { passive: true, capture: true });
|
||||
return () => {
|
||||
window.clearTimeout(t);
|
||||
window.removeEventListener('touchstart', close);
|
||||
window.removeEventListener('scroll', close, { capture: true });
|
||||
};
|
||||
}, [pressAnchor]);
|
||||
|
||||
if (!onEditHistoryClick) {
|
||||
return (
|
||||
<Text as="span" size="T200" priority="300" {...props} ref={ref}>
|
||||
{' (edited)'}
|
||||
</Text>
|
||||
);
|
||||
}
|
||||
|
||||
const button = (tipRef?: React.RefCallback<HTMLElement>) => (
|
||||
<button
|
||||
ref={tipRef}
|
||||
type="button"
|
||||
onClick={() => {
|
||||
if (suppressContextMenu.current) return;
|
||||
onEditHistoryClick();
|
||||
}}
|
||||
onContextMenu={(evt) => {
|
||||
if (suppressContextMenu.current) evt.preventDefault();
|
||||
}}
|
||||
{...handlers}
|
||||
// Keep the message's own long-press (action sheet) from firing too.
|
||||
onTouchStart={(evt) => {
|
||||
evt.stopPropagation();
|
||||
handlers.onTouchStart?.(evt);
|
||||
}}
|
||||
aria-label={diff ? 'View edit history — hover for the last change' : 'View edit history'}
|
||||
style={editedButtonStyle}
|
||||
>
|
||||
<Text as="span" size="T200" priority="300">
|
||||
{' (edited)'}
|
||||
</Text>
|
||||
</button>
|
||||
);
|
||||
|
||||
return (
|
||||
<span ref={ref} {...(props as React.HTMLAttributes<HTMLSpanElement>)}>
|
||||
<button
|
||||
type="button"
|
||||
onClick={onEditHistoryClick}
|
||||
aria-label="View edit history"
|
||||
style={{ cursor: 'pointer', background: 'none', border: 'none', padding: 0 }}
|
||||
>
|
||||
<Text as="span" size="T200" priority="300">
|
||||
{' (edited)'}
|
||||
</Text>
|
||||
</button>
|
||||
{diff ? (
|
||||
<TooltipProvider
|
||||
position="Top"
|
||||
align="Start"
|
||||
delay={300}
|
||||
tooltip={
|
||||
<Tooltip>
|
||||
<EditDiffBody
|
||||
tokens={diff}
|
||||
hint={coarse ? 'Tap for full history' : 'Click for full history'}
|
||||
/>
|
||||
</Tooltip>
|
||||
}
|
||||
>
|
||||
{(tipRef) => button(tipRef)}
|
||||
</TooltipProvider>
|
||||
) : (
|
||||
button()
|
||||
)}
|
||||
{diff && pressAnchor && (
|
||||
<PopOut
|
||||
anchor={pressAnchor}
|
||||
position="Top"
|
||||
align="Start"
|
||||
content={
|
||||
<Tooltip>
|
||||
<EditDiffBody
|
||||
tokens={diff}
|
||||
hint={coarse ? 'Tap for full history' : 'Click for full history'}
|
||||
/>
|
||||
</Tooltip>
|
||||
}
|
||||
/>
|
||||
)}
|
||||
</span>
|
||||
) : (
|
||||
<Text as="span" size="T200" priority="300" {...props} ref={ref}>
|
||||
{' (edited)'}
|
||||
</Text>
|
||||
),
|
||||
);
|
||||
);
|
||||
});
|
||||
|
||||
type TranslatedStatus = 'downloading' | 'translating' | 'done' | 'error';
|
||||
|
||||
|
||||
@@ -114,7 +114,7 @@ export function ReadTextFile({ body, mimeType, url, encInfo, renderViewer }: Rea
|
||||
<Modal
|
||||
className={ModalWide}
|
||||
size="500"
|
||||
onContextMenu={(evt: any) => evt.stopPropagation()}
|
||||
onContextMenu={(evt: React.MouseEvent) => evt.stopPropagation()}
|
||||
>
|
||||
{renderViewer({
|
||||
name: body,
|
||||
@@ -203,7 +203,7 @@ export function ReadPdfFile({ body, mimeType, url, encInfo, renderViewer }: Read
|
||||
<Modal
|
||||
className={ModalWide}
|
||||
size="500"
|
||||
onContextMenu={(evt: any) => evt.stopPropagation()}
|
||||
onContextMenu={(evt: React.MouseEvent) => evt.stopPropagation()}
|
||||
>
|
||||
{renderViewer({
|
||||
name: body,
|
||||
|
||||
@@ -59,6 +59,9 @@ export type ImageContentProps = {
|
||||
spoilerReason?: string;
|
||||
renderViewer: (props: RenderViewerProps) => ReactNode;
|
||||
renderImage: (props: RenderImageProps) => ReactNode;
|
||||
// [Gitea #219] When given, a click opens THIS instead of the built-in
|
||||
// viewer — the room timeline hands it to the shared media lightbox.
|
||||
onOpenViewer?: () => void;
|
||||
};
|
||||
export const ImageContent = as<'div', ImageContentProps>(
|
||||
(
|
||||
@@ -74,6 +77,7 @@ export const ImageContent = as<'div', ImageContentProps>(
|
||||
spoilerReason,
|
||||
renderViewer,
|
||||
renderImage,
|
||||
onOpenViewer,
|
||||
...props
|
||||
},
|
||||
ref,
|
||||
@@ -139,7 +143,7 @@ export const ImageContent = as<'div', ImageContentProps>(
|
||||
<Modal
|
||||
className={ModalWide}
|
||||
size="500"
|
||||
onContextMenu={(evt: any) => evt.stopPropagation()}
|
||||
onContextMenu={(evt: React.MouseEvent) => evt.stopPropagation()}
|
||||
>
|
||||
{renderViewer({
|
||||
src: srcState.data,
|
||||
@@ -182,7 +186,7 @@ export const ImageContent = as<'div', ImageContentProps>(
|
||||
src: srcState.data,
|
||||
onLoad: handleLoad,
|
||||
onError: handleError,
|
||||
onClick: () => setViewer(true),
|
||||
onClick: () => (onOpenViewer ? onOpenViewer() : setViewer(true)),
|
||||
tabIndex: 0,
|
||||
})}
|
||||
</Box>
|
||||
|
||||
@@ -8,3 +8,4 @@ export * from './Time';
|
||||
export * from './MsgTypeRenderers';
|
||||
export * from './FileHeader';
|
||||
export * from './RenderBody';
|
||||
export * from './ForwardedHeader';
|
||||
|
||||
@@ -9,16 +9,35 @@ export const NavItem = as<
|
||||
{
|
||||
highlight?: boolean;
|
||||
} & css.RoomSelectorVariants
|
||||
>(({ as: AsNavItem = 'div', className, highlight, variant, radii, children, ...props }, ref) => (
|
||||
<AsNavItem
|
||||
className={classNames(css.NavItem({ variant, radii }), className)}
|
||||
data-highlight={highlight}
|
||||
{...props}
|
||||
ref={ref}
|
||||
>
|
||||
{children}
|
||||
</AsNavItem>
|
||||
));
|
||||
>(
|
||||
(
|
||||
{
|
||||
as: AsNavItem = 'div',
|
||||
className,
|
||||
highlight,
|
||||
variant,
|
||||
radii,
|
||||
children,
|
||||
'aria-selected': selected,
|
||||
...props
|
||||
},
|
||||
ref,
|
||||
) => (
|
||||
// [Gitea #222] Callers pass `aria-selected`, but that attribute is only
|
||||
// valid on option/tab/row roles; on a plain div axe flags it as critical.
|
||||
// Keep the prop for callers and styling, expose the state as aria-current.
|
||||
<AsNavItem
|
||||
className={classNames(css.NavItem({ variant, radii }), className)}
|
||||
data-highlight={highlight}
|
||||
data-selected={selected === true || selected === 'true' ? true : undefined}
|
||||
aria-current={selected === true || selected === 'true' ? 'page' : undefined}
|
||||
{...props}
|
||||
ref={ref}
|
||||
>
|
||||
{children}
|
||||
</AsNavItem>
|
||||
),
|
||||
);
|
||||
|
||||
export const NavLink = forwardRef<HTMLAnchorElement, ComponentProps<typeof Link>>(
|
||||
({ className, ...props }, ref) => (
|
||||
|
||||
@@ -69,7 +69,7 @@ const NavItemBase = style({
|
||||
[`&:has(.${NavLink}:active)`]: {
|
||||
backgroundColor: ContainerActive,
|
||||
},
|
||||
'&[aria-selected=true]': {
|
||||
'&[data-selected=true]': {
|
||||
backgroundColor: ContainerActive,
|
||||
},
|
||||
[`&:has(.${NavLink}:focus-visible)`]: {
|
||||
|
||||
@@ -19,15 +19,13 @@ import { getMemberDisplayName, getStateEvent } from '../../utils/room';
|
||||
import { useMatrixClient } from '../../hooks/useMatrixClient';
|
||||
import { getMxIdLocalPart, mxcUrlToHttp } from '../../utils/matrix';
|
||||
import { AsyncStatus, useAsyncCallback } from '../../hooks/useAsyncCallback';
|
||||
import { timeDayMonthYear, timeHourMinute } from '../../utils/time';
|
||||
import { useTimestampFormatter } from '../../hooks/useTimestampFormatter';
|
||||
import { useRoomNavigate } from '../../hooks/useRoomNavigate';
|
||||
import { RoomAvatar } from '../room-avatar';
|
||||
import { nameInitials } from '../../utils/common';
|
||||
import { useRoomAvatar, useLocalRoomName, useRoomTopic } from '../../hooks/useRoomMeta';
|
||||
import { mDirectAtom } from '../../state/mDirectList';
|
||||
import { useMediaAuthentication } from '../../hooks/useMediaAuthentication';
|
||||
import { useSetting } from '../../state/hooks/settings';
|
||||
import { settingsAtom } from '../../state/settings';
|
||||
import { InviteUserPrompt } from '../invite-user-prompt';
|
||||
import { RoomTopicViewer } from '../room-topic-viewer';
|
||||
import { stopPropagation } from '../../utils/keyboard';
|
||||
@@ -68,7 +66,7 @@ export const RoomIntro = as<'div', RoomIntroProps>(({ room, ...props }, ref) =>
|
||||
useCallback(async (roomId: string) => mx.joinRoom(roomId), [mx]),
|
||||
);
|
||||
|
||||
const [hour24Clock] = useSetting(settingsAtom, 'hour24Clock');
|
||||
const { format } = useTimestampFormatter();
|
||||
|
||||
return (
|
||||
<Box direction="Column" grow="Yes" gap="500" {...props} ref={ref}>
|
||||
@@ -135,7 +133,7 @@ export const RoomIntro = as<'div', RoomIntroProps>(({ room, ...props }, ref) =>
|
||||
<Text size="T200" priority="300">
|
||||
{'Created by '}
|
||||
<b>@{creatorName}</b>
|
||||
{` on ${timeDayMonthYear(ts)} ${timeHourMinute(ts, hour24Clock)}`}
|
||||
{` on ${format(ts, 'dateTime')}`}
|
||||
</Text>
|
||||
)}
|
||||
</Box>
|
||||
|
||||
@@ -1,21 +1,49 @@
|
||||
import React, { useEffect, useMemo, useState } from 'react';
|
||||
import React, { Suspense, useEffect, useMemo, useState } from 'react';
|
||||
import { useAtomValue } from 'jotai';
|
||||
import { settingsAtom } from '../../state/settings';
|
||||
import { useReducedMotion } from '../../hooks/useReducedMotion';
|
||||
import { zIndices } from '../../styles/zIndex';
|
||||
import { SeasonTheme } from './types';
|
||||
import { resolveSeasonTheme } from './seasonSchedule';
|
||||
import { HalloweenOverlay } from './themes/Halloween';
|
||||
import { ChristmasOverlay } from './themes/Christmas';
|
||||
import { NewYearOverlay } from './themes/NewYear';
|
||||
import { AutumnOverlay } from './themes/Autumn';
|
||||
import { AprilFoolsOverlay } from './themes/AprilFools';
|
||||
import { LunarNewYearOverlay } from './themes/LunarNewYear';
|
||||
import { ValentinesOverlay } from './themes/Valentines';
|
||||
import { StPatricksOverlay } from './themes/StPatricks';
|
||||
import { EarthDayOverlay } from './themes/EarthDay';
|
||||
import { DeepSpaceOverlay } from './themes/DeepSpace';
|
||||
import { ArcadeOverlay } from './themes/Arcade';
|
||||
|
||||
// [Gitea #167] Each overlay (its particles + keyframes) is its own chunk,
|
||||
// fetched only when that season is active or previewed in Settings — the
|
||||
// date/override decision stays in the main bundle.
|
||||
const lazyOverlay = (load: () => Promise<{ default: React.ComponentType<{ reduced: boolean }> }>) =>
|
||||
React.lazy(load);
|
||||
const HalloweenOverlay = lazyOverlay(() =>
|
||||
import('./themes/Halloween').then((m) => ({ default: m.HalloweenOverlay })),
|
||||
);
|
||||
const ChristmasOverlay = lazyOverlay(() =>
|
||||
import('./themes/Christmas').then((m) => ({ default: m.ChristmasOverlay })),
|
||||
);
|
||||
const NewYearOverlay = lazyOverlay(() =>
|
||||
import('./themes/NewYear').then((m) => ({ default: m.NewYearOverlay })),
|
||||
);
|
||||
const AutumnOverlay = lazyOverlay(() =>
|
||||
import('./themes/Autumn').then((m) => ({ default: m.AutumnOverlay })),
|
||||
);
|
||||
const AprilFoolsOverlay = lazyOverlay(() =>
|
||||
import('./themes/AprilFools').then((m) => ({ default: m.AprilFoolsOverlay })),
|
||||
);
|
||||
const LunarNewYearOverlay = lazyOverlay(() =>
|
||||
import('./themes/LunarNewYear').then((m) => ({ default: m.LunarNewYearOverlay })),
|
||||
);
|
||||
const ValentinesOverlay = lazyOverlay(() =>
|
||||
import('./themes/Valentines').then((m) => ({ default: m.ValentinesOverlay })),
|
||||
);
|
||||
const StPatricksOverlay = lazyOverlay(() =>
|
||||
import('./themes/StPatricks').then((m) => ({ default: m.StPatricksOverlay })),
|
||||
);
|
||||
const EarthDayOverlay = lazyOverlay(() =>
|
||||
import('./themes/EarthDay').then((m) => ({ default: m.EarthDayOverlay })),
|
||||
);
|
||||
const DeepSpaceOverlay = lazyOverlay(() =>
|
||||
import('./themes/DeepSpace').then((m) => ({ default: m.DeepSpaceOverlay })),
|
||||
);
|
||||
const ArcadeOverlay = lazyOverlay(() =>
|
||||
import('./themes/Arcade').then((m) => ({ default: m.ArcadeOverlay })),
|
||||
);
|
||||
|
||||
// SeasonTheme + the date-window logic now live in leaf modules (single source
|
||||
// of truth, shared with the settings UI). Re-exported here for existing
|
||||
@@ -69,7 +97,7 @@ function SeasonalOverlay({ theme, reduced }: { theme: SeasonTheme; reduced: bool
|
||||
overflow: 'hidden',
|
||||
}}
|
||||
>
|
||||
{buildOverlayContent(theme, reduced)}
|
||||
<Suspense fallback={null}>{buildOverlayContent(theme, reduced)}</Suspense>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -94,7 +122,7 @@ export function SeasonalPreview({ theme }: { theme: SeasonTheme }) {
|
||||
containerType: 'inline-size',
|
||||
}}
|
||||
>
|
||||
{buildOverlayContent(theme, true)}
|
||||
<Suspense fallback={null}>{buildOverlayContent(theme, true)}</Suspense>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import React, { ReactNode } from 'react';
|
||||
import React, { ReactNode, useEffect, useId, useRef } from 'react';
|
||||
import { Box, Text } from 'folds';
|
||||
import { BreakWord } from '../../styles/Text.css';
|
||||
|
||||
@@ -10,12 +10,35 @@ type SettingTileProps = {
|
||||
children?: ReactNode;
|
||||
};
|
||||
export function SettingTile({ title, description, before, after, children }: SettingTileProps) {
|
||||
const titleId = useId();
|
||||
const afterRef = useRef<HTMLDivElement>(null);
|
||||
|
||||
// [Gitea #185] The control in `after` is almost always an icon-only Switch
|
||||
// (or a bare select/input) whose only visible label is this tile's title.
|
||||
// Point it at the title so screen readers announce "Show Notifications,
|
||||
// switch, on" instead of "switch, on". Explicit labels are left alone.
|
||||
useEffect(() => {
|
||||
if (!title || !afterRef.current) return;
|
||||
afterRef.current
|
||||
.querySelectorAll<HTMLElement>('[role="switch"], input, select, textarea, [role="combobox"]')
|
||||
.forEach((el) => {
|
||||
if (el.hasAttribute('aria-label') || el.hasAttribute('aria-labelledby')) return;
|
||||
if (
|
||||
el.tagName === 'INPUT' &&
|
||||
el.id &&
|
||||
afterRef.current?.querySelector(`label[for="${el.id}"]`)
|
||||
)
|
||||
return;
|
||||
el.setAttribute('aria-labelledby', titleId);
|
||||
});
|
||||
});
|
||||
|
||||
return (
|
||||
<Box alignItems="Center" gap="300">
|
||||
{before && <Box shrink="No">{before}</Box>}
|
||||
<Box grow="Yes" direction="Column" gap="100">
|
||||
{title && (
|
||||
<Text className={BreakWord} size="T300">
|
||||
<Text id={titleId} className={BreakWord} size="T300">
|
||||
{title}
|
||||
</Text>
|
||||
)}
|
||||
@@ -26,7 +49,11 @@ export function SettingTile({ title, description, before, after, children }: Set
|
||||
)}
|
||||
{children}
|
||||
</Box>
|
||||
{after && <Box shrink="No">{after}</Box>}
|
||||
{after && (
|
||||
<Box shrink="No" ref={afterRef}>
|
||||
{after}
|
||||
</Box>
|
||||
)}
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -0,0 +1,125 @@
|
||||
import React, { MouseEvent, ReactNode, useState } from 'react';
|
||||
import FocusTrap from 'focus-trap-react';
|
||||
import {
|
||||
Box,
|
||||
Button,
|
||||
Dialog,
|
||||
Header,
|
||||
Icon,
|
||||
IconButton,
|
||||
Icons,
|
||||
Overlay,
|
||||
OverlayBackdrop,
|
||||
OverlayCenter,
|
||||
Text,
|
||||
color,
|
||||
config,
|
||||
} from 'folds';
|
||||
import { stopPropagation } from '../../utils/keyboard';
|
||||
import { LinkSafety } from '../../utils/linkSafety';
|
||||
|
||||
type SuspiciousLinkProps = {
|
||||
href: string;
|
||||
safety: LinkSafety;
|
||||
anchorProps: Record<string, unknown>;
|
||||
children: ReactNode;
|
||||
};
|
||||
|
||||
/**
|
||||
* [Gitea #122] A link whose visible text names a different site than its
|
||||
* destination (or whose destination is a punycode host) opens a small
|
||||
* confirm instead of navigating straight away. Honest links never see this.
|
||||
*/
|
||||
export function SuspiciousLink({ href, safety, anchorProps, children }: SuspiciousLinkProps) {
|
||||
const [open, setOpen] = useState(false);
|
||||
|
||||
const handleClick = (evt: MouseEvent) => {
|
||||
evt.preventDefault();
|
||||
evt.stopPropagation();
|
||||
setOpen(true);
|
||||
};
|
||||
const proceed = () => {
|
||||
setOpen(false);
|
||||
window.open(href, '_blank', 'noopener,noreferrer');
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<a
|
||||
{...anchorProps}
|
||||
href={href}
|
||||
onClick={handleClick}
|
||||
data-lotus-suspicious-link
|
||||
title={`Goes to ${safety.realHost}`}
|
||||
>
|
||||
{children}
|
||||
</a>
|
||||
{open && (
|
||||
<Overlay open backdrop={<OverlayBackdrop />}>
|
||||
<OverlayCenter>
|
||||
<FocusTrap
|
||||
focusTrapOptions={{
|
||||
initialFocus: false,
|
||||
onDeactivate: () => setOpen(false),
|
||||
clickOutsideDeactivates: true,
|
||||
escapeDeactivates: stopPropagation,
|
||||
}}
|
||||
>
|
||||
<Dialog variant="Surface" style={{ maxWidth: 440 }}>
|
||||
<Header
|
||||
style={{
|
||||
padding: `0 ${config.space.S200} 0 ${config.space.S400}`,
|
||||
borderBottomWidth: config.borderWidth.B300,
|
||||
}}
|
||||
variant="Surface"
|
||||
size="500"
|
||||
>
|
||||
<Box grow="Yes">
|
||||
<Text as="h2" size="H4">
|
||||
This link doesn't go where it says
|
||||
</Text>
|
||||
</Box>
|
||||
<IconButton
|
||||
size="300"
|
||||
onClick={() => setOpen(false)}
|
||||
radii="300"
|
||||
aria-label="Close"
|
||||
>
|
||||
<Icon src={Icons.Cross} />
|
||||
</IconButton>
|
||||
</Header>
|
||||
<Box style={{ padding: config.space.S400 }} direction="Column" gap="400">
|
||||
<Text>
|
||||
{safety.shownHost ? (
|
||||
<>
|
||||
It shows <b>{safety.shownHost}</b> but goes to{' '}
|
||||
<b style={{ color: color.Critical.Main }}>{safety.realHost}</b>.
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
It goes to <b style={{ color: color.Critical.Main }}>{safety.realHost}</b>.
|
||||
</>
|
||||
)}
|
||||
{safety.punycode &&
|
||||
' The destination uses look-alike (internationalised) characters in its name.'}
|
||||
</Text>
|
||||
<Text size="T200" priority="300" style={{ wordBreak: 'break-all' }}>
|
||||
{href}
|
||||
</Text>
|
||||
<Box gap="200" justifyContent="End">
|
||||
<Button variant="Secondary" fill="Soft" onClick={() => setOpen(false)}>
|
||||
<Text size="B400">Cancel</Text>
|
||||
</Button>
|
||||
<Button variant="Critical" onClick={proceed}>
|
||||
<Text size="B400">Open anyway</Text>
|
||||
</Button>
|
||||
</Box>
|
||||
</Box>
|
||||
</Dialog>
|
||||
</FocusTrap>
|
||||
</OverlayCenter>
|
||||
</Overlay>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
export * from './SuspiciousLink';
|
||||
@@ -0,0 +1,75 @@
|
||||
import React, { useEffect, useRef } from 'react';
|
||||
import { Box, Button, Icon, IconButton, Icons, Text, color, config, toRem } from 'folds';
|
||||
|
||||
type TapToSendBarProps = {
|
||||
previewUrl?: string;
|
||||
label: string;
|
||||
onSend: () => void;
|
||||
onCancel: () => void;
|
||||
};
|
||||
|
||||
/**
|
||||
* [Gitea #147] Fat-finger guard for touch screens: the first tap on a sticker
|
||||
* or GIF parks it here with a preview; "Send" (or a second tap on the same
|
||||
* item) sends it.
|
||||
*/
|
||||
export function TapToSendBar({ previewUrl, label, onSend, onCancel }: TapToSendBarProps) {
|
||||
const liveRef = useRef<HTMLDivElement>(null);
|
||||
useEffect(() => {
|
||||
liveRef.current?.focus?.();
|
||||
}, [label]);
|
||||
|
||||
return (
|
||||
<Box
|
||||
ref={liveRef}
|
||||
role="status"
|
||||
aria-live="polite"
|
||||
tabIndex={-1}
|
||||
shrink="No"
|
||||
alignItems="Center"
|
||||
gap="300"
|
||||
style={{
|
||||
margin: `0 ${config.space.S300} ${config.space.S200}`,
|
||||
padding: config.space.S200,
|
||||
borderRadius: config.radii.R400,
|
||||
backgroundColor: color.SurfaceVariant.Container,
|
||||
color: color.SurfaceVariant.OnContainer,
|
||||
outline: 'none',
|
||||
}}
|
||||
>
|
||||
{previewUrl && (
|
||||
<img
|
||||
src={previewUrl}
|
||||
alt=""
|
||||
style={{
|
||||
width: toRem(40),
|
||||
height: toRem(40),
|
||||
objectFit: 'contain',
|
||||
borderRadius: config.radii.R300,
|
||||
flexShrink: 0,
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
<Box grow="Yes" direction="Column" style={{ minWidth: 0 }}>
|
||||
<Text size="T200" priority="300">
|
||||
Tap again to send
|
||||
</Text>
|
||||
<Text size="T300" truncate>
|
||||
{label}
|
||||
</Text>
|
||||
</Box>
|
||||
<Button size="300" variant="Primary" fill="Solid" radii="300" onClick={onSend}>
|
||||
<Text size="B300">Send</Text>
|
||||
</Button>
|
||||
<IconButton
|
||||
size="300"
|
||||
variant="SurfaceVariant"
|
||||
radii="300"
|
||||
onClick={onCancel}
|
||||
aria-label="Cancel"
|
||||
>
|
||||
<Icon size="100" src={Icons.Cross} />
|
||||
</IconButton>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
@@ -6,6 +6,7 @@ import { useMatrixClient } from '../../hooks/useMatrixClient';
|
||||
import { TUploadContent } from '../../utils/matrix';
|
||||
import { bytesToSize, getFileTypeIcon } from '../../utils/common';
|
||||
import { useMediaConfig } from '../../hooks/useMediaConfig';
|
||||
import { describeUploadError } from '../../utils/uploadError';
|
||||
|
||||
type CompactUploadCardRendererProps = {
|
||||
isEncrypted?: boolean;
|
||||
@@ -91,7 +92,7 @@ export function CompactUploadCardRenderer({
|
||||
)}
|
||||
{upload.status === UploadStatus.Error && (
|
||||
<UploadCardError>
|
||||
<Text size="T200">{upload.error.message}</Text>
|
||||
<Text size="T200">{describeUploadError(upload.error, allowSize)}</Text>
|
||||
</UploadCardError>
|
||||
)}
|
||||
{upload.status === UploadStatus.Idle && fileSizeExceeded && (
|
||||
|
||||
@@ -24,6 +24,7 @@ import {
|
||||
} from '../../state/room/roomInputDrafts';
|
||||
import { useObjectURL } from '../../hooks/useObjectURL';
|
||||
import { useMediaConfig } from '../../hooks/useMediaConfig';
|
||||
import { describeUploadError } from '../../utils/uploadError';
|
||||
import { compressImage, formatFileSize, isCompressible } from '../../utils/imageCompression';
|
||||
|
||||
type PreviewImageProps = {
|
||||
@@ -282,6 +283,12 @@ type UploadCardRendererProps = {
|
||||
setMetadata: (fileItem: TUploadItem, metadata: TUploadMetadata) => void;
|
||||
onRemove: (file: TUploadContent) => void;
|
||||
onComplete?: (upload: UploadSuccess) => void;
|
||||
/** [Gitea #129] Focus the caption field on mount (single image into an empty composer). */
|
||||
autoFocusCaption?: boolean;
|
||||
/** Enter in the caption field: send the board (and any composer text). */
|
||||
onCaptionSubmit?: () => void;
|
||||
/** Escape in the caption field: hand focus back to the composer. */
|
||||
onCaptionEscape?: () => void;
|
||||
};
|
||||
export function UploadCardRenderer({
|
||||
isEncrypted,
|
||||
@@ -289,6 +296,9 @@ export function UploadCardRenderer({
|
||||
setMetadata,
|
||||
onRemove,
|
||||
onComplete,
|
||||
autoFocusCaption,
|
||||
onCaptionSubmit,
|
||||
onCaptionEscape,
|
||||
}: UploadCardRendererProps) {
|
||||
const mx = useMatrixClient();
|
||||
const mediaConfig = useMediaConfig();
|
||||
@@ -378,9 +388,27 @@ export function UploadCardRenderer({
|
||||
size="300"
|
||||
radii="300"
|
||||
style={{ marginTop: config.space.S200, width: '100%' }}
|
||||
autoFocus={autoFocusCaption}
|
||||
onKeyDown={(e: React.KeyboardEvent<HTMLInputElement>) => {
|
||||
if (e.key === 'Enter' && !e.shiftKey && !e.nativeEvent.isComposing) {
|
||||
e.preventDefault();
|
||||
onCaptionSubmit?.();
|
||||
} else if (e.key === 'Escape') {
|
||||
e.preventDefault();
|
||||
onCaptionEscape?.();
|
||||
}
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
<CompressionCheckbox fileItem={fileItem} metadata={metadata} setMetadata={setMetadata} />
|
||||
{metadata.metadataStripped && (
|
||||
<Box alignItems="Center" gap="100" style={{ marginTop: config.space.S100 }}>
|
||||
<Icon size="50" src={Icons.Shield} style={{ color: color.Success.Main }} />
|
||||
<Text size="T200" priority="300">
|
||||
Photo metadata removed (location, camera, time)
|
||||
</Text>
|
||||
</Box>
|
||||
)}
|
||||
{upload.status === UploadStatus.Idle && !fileSizeExceeded && (
|
||||
<UploadCardProgress sentBytes={0} totalBytes={file.size} />
|
||||
)}
|
||||
@@ -389,7 +417,7 @@ export function UploadCardRenderer({
|
||||
)}
|
||||
{upload.status === UploadStatus.Error && (
|
||||
<UploadCardError>
|
||||
<Text size="T200">{upload.error.message}</Text>
|
||||
<Text size="T200">{describeUploadError(upload.error, allowSize)}</Text>
|
||||
</UploadCardError>
|
||||
)}
|
||||
{upload.status === UploadStatus.Idle && fileSizeExceeded && (
|
||||
|
||||
@@ -19,6 +19,7 @@ import { getMxIdLocalPart } from '../../utils/matrix';
|
||||
import { BreakWord, LineClamp2, LineClamp3 } from '../../styles/Text.css';
|
||||
import { ModalMobileFull } from '../../styles/Modal.css';
|
||||
import { UserPresence } from '../../hooks/useUserPresence';
|
||||
import { describeLastActive } from '../../utils/lastActive';
|
||||
import { AvatarPresence, PresenceBadge } from '../presence';
|
||||
import { AvatarDecoration } from '../avatar-decoration/AvatarDecoration';
|
||||
import { ImageViewer } from '../image-viewer';
|
||||
@@ -87,7 +88,7 @@ export function UserHero({ userId, avatarUrl, presence }: UserHeroProps) {
|
||||
<Modal
|
||||
size="500"
|
||||
className={ModalMobileFull}
|
||||
onContextMenu={(evt: any) => evt.stopPropagation()}
|
||||
onContextMenu={(evt: React.MouseEvent) => evt.stopPropagation()}
|
||||
>
|
||||
<ImageViewer
|
||||
src={viewAvatar}
|
||||
@@ -110,6 +111,8 @@ type UserHeroNameProps = {
|
||||
status?: string;
|
||||
pronouns?: string;
|
||||
timezone?: string;
|
||||
/** [Gitea #150] Presence for the "Active now / Last active …" line. */
|
||||
presence?: UserPresence;
|
||||
};
|
||||
export function UserHeroName({
|
||||
displayName,
|
||||
@@ -117,7 +120,9 @@ export function UserHeroName({
|
||||
status,
|
||||
pronouns,
|
||||
timezone,
|
||||
presence,
|
||||
}: UserHeroNameProps) {
|
||||
const lastActive = describeLastActive(presence);
|
||||
const username = getMxIdLocalPart(userId);
|
||||
const [hour24Clock] = useSetting(settingsAtom, 'hour24Clock');
|
||||
const localTimeInfo = useLocalTime(timezone, !hour24Clock);
|
||||
@@ -158,6 +163,13 @@ export function UserHeroName({
|
||||
</Text>
|
||||
</Box>
|
||||
)}
|
||||
{lastActive && (
|
||||
<Box alignItems="Center" gap="100" style={{ marginTop: '1px', overflow: 'hidden' }}>
|
||||
<Text size="T200" style={{ opacity: 0.6 }}>
|
||||
{lastActive}
|
||||
</Text>
|
||||
</Box>
|
||||
)}
|
||||
{status && (
|
||||
<Box alignItems="Center" gap="100" style={{ marginTop: '2px', overflow: 'hidden' }}>
|
||||
<Text
|
||||
|
||||
@@ -6,9 +6,7 @@ import { SettingTile } from '../setting-tile';
|
||||
import { AsyncStatus, useAsyncCallback } from '../../hooks/useAsyncCallback';
|
||||
import { useMatrixClient } from '../../hooks/useMatrixClient';
|
||||
import { BreakWord } from '../../styles/Text.css';
|
||||
import { useSetting } from '../../state/hooks/settings';
|
||||
import { settingsAtom } from '../../state/settings';
|
||||
import { timeDayMonYear, timeHourMinute } from '../../utils/time';
|
||||
import { useTimestampFormatter } from '../../hooks/useTimestampFormatter';
|
||||
|
||||
type UserKickAlertProps = {
|
||||
reason?: string;
|
||||
@@ -16,11 +14,8 @@ type UserKickAlertProps = {
|
||||
ts?: number;
|
||||
};
|
||||
export function UserKickAlert({ reason, kickedBy, ts }: UserKickAlertProps) {
|
||||
const [hour24Clock] = useSetting(settingsAtom, 'hour24Clock');
|
||||
const [dateFormatString] = useSetting(settingsAtom, 'dateFormatString');
|
||||
|
||||
const time = ts ? timeHourMinute(ts, hour24Clock) : undefined;
|
||||
const date = ts ? timeDayMonYear(ts, dateFormatString) : undefined;
|
||||
const { format } = useTimestampFormatter();
|
||||
const when = ts ? format(ts) : undefined;
|
||||
|
||||
return (
|
||||
<CutoutCard style={{ padding: config.space.S200 }} variant="Critical">
|
||||
@@ -28,11 +23,7 @@ export function UserKickAlert({ reason, kickedBy, ts }: UserKickAlertProps) {
|
||||
<Box direction="Column" gap="200">
|
||||
<Box gap="200" justifyContent="SpaceBetween">
|
||||
<Text size="L400">Kicked User</Text>
|
||||
{time && date && (
|
||||
<Text size="T200">
|
||||
{date} {time}
|
||||
</Text>
|
||||
)}
|
||||
{when && <Text size="T200">{when}</Text>}
|
||||
</Box>
|
||||
<Box direction="Column">
|
||||
{kickedBy && (
|
||||
@@ -66,11 +57,8 @@ type UserBanAlertProps = {
|
||||
export function UserBanAlert({ userId, reason, canUnban, bannedBy, ts }: UserBanAlertProps) {
|
||||
const mx = useMatrixClient();
|
||||
const room = useRoom();
|
||||
const [hour24Clock] = useSetting(settingsAtom, 'hour24Clock');
|
||||
const [dateFormatString] = useSetting(settingsAtom, 'dateFormatString');
|
||||
|
||||
const time = ts ? timeHourMinute(ts, hour24Clock) : undefined;
|
||||
const date = ts ? timeDayMonYear(ts, dateFormatString) : undefined;
|
||||
const { format } = useTimestampFormatter();
|
||||
const when = ts ? format(ts) : undefined;
|
||||
|
||||
const [unbanState, unban] = useAsyncCallback<undefined, Error, []>(
|
||||
useCallback(async () => {
|
||||
@@ -86,11 +74,7 @@ export function UserBanAlert({ userId, reason, canUnban, bannedBy, ts }: UserBan
|
||||
<Box direction="Column" gap="200">
|
||||
<Box gap="200" justifyContent="SpaceBetween">
|
||||
<Text size="L400">Banned User</Text>
|
||||
{time && date && (
|
||||
<Text size="T200">
|
||||
{date} {time}
|
||||
</Text>
|
||||
)}
|
||||
{when && <Text size="T200">{when}</Text>}
|
||||
</Box>
|
||||
<Box direction="Column">
|
||||
{bannedBy && (
|
||||
@@ -141,11 +125,8 @@ type UserInviteAlertProps = {
|
||||
export function UserInviteAlert({ userId, reason, canKick, invitedBy, ts }: UserInviteAlertProps) {
|
||||
const mx = useMatrixClient();
|
||||
const room = useRoom();
|
||||
const [hour24Clock] = useSetting(settingsAtom, 'hour24Clock');
|
||||
const [dateFormatString] = useSetting(settingsAtom, 'dateFormatString');
|
||||
|
||||
const time = ts ? timeHourMinute(ts, hour24Clock) : undefined;
|
||||
const date = ts ? timeDayMonYear(ts, dateFormatString) : undefined;
|
||||
const { format } = useTimestampFormatter();
|
||||
const when = ts ? format(ts) : undefined;
|
||||
|
||||
const [kickState, kick] = useAsyncCallback<undefined, Error, []>(
|
||||
useCallback(async () => {
|
||||
@@ -161,11 +142,7 @@ export function UserInviteAlert({ userId, reason, canKick, invitedBy, ts }: User
|
||||
<Box direction="Column" gap="200">
|
||||
<Box gap="200" justifyContent="SpaceBetween">
|
||||
<Text size="L400">Invited User</Text>
|
||||
{time && date && (
|
||||
<Text size="T200">
|
||||
{date} {time}
|
||||
</Text>
|
||||
)}
|
||||
{when && <Text size="T200">{when}</Text>}
|
||||
</Box>
|
||||
<Box direction="Column">
|
||||
{invitedBy && (
|
||||
|
||||
@@ -371,6 +371,7 @@ export function UserRoomProfile({ userId }: UserRoomProfileProps) {
|
||||
displayName={displayName}
|
||||
userId={userId}
|
||||
status={presence?.status}
|
||||
presence={presence && presence.lastActiveTs !== 0 ? presence : undefined}
|
||||
pronouns={extProfile.pronouns}
|
||||
timezone={extProfile.timezone}
|
||||
/>
|
||||
|
||||
@@ -35,19 +35,8 @@ import { nameInitials } from '../../utils/common';
|
||||
import { ContainerColor } from '../../styles/ContainerColor.css';
|
||||
import { stopPropagation } from '../../utils/keyboard';
|
||||
import * as css from './BookmarksPanel.css';
|
||||
|
||||
function formatTimeAgo(ts: number): string {
|
||||
const diff = Date.now() - ts;
|
||||
const minutes = Math.floor(diff / 60_000);
|
||||
if (minutes < 1) return 'just now';
|
||||
if (minutes < 60) return `${minutes}m ago`;
|
||||
const hours = Math.floor(minutes / 60);
|
||||
if (hours < 24) return `${hours}h ago`;
|
||||
const days = Math.floor(hours / 24);
|
||||
if (days === 1) return 'yesterday';
|
||||
if (days < 7) return `${days}d ago`;
|
||||
return new Date(ts).toLocaleDateString();
|
||||
}
|
||||
import { useTimestampFormatter } from '../../hooks/useTimestampFormatter';
|
||||
import { formatRelativeAge } from '../../utils/formatTimestamp';
|
||||
|
||||
// Remember the last-chosen sort across panel opens (the panel unmounts on close).
|
||||
// getOnInit reads localStorage synchronously at init so the persisted sort is
|
||||
@@ -110,7 +99,8 @@ function BookmarkItem({ bookmark, onJump, onRemove, preview, senderName }: Bookm
|
||||
: undefined;
|
||||
// Prefer a live-resolved author name, then the stored snapshot.
|
||||
const author = senderName ?? bookmark.senderName;
|
||||
const timeAgo = formatTimeAgo(bookmark.savedAt);
|
||||
const { prefs } = useTimestampFormatter();
|
||||
const timeAgo = formatRelativeAge(bookmark.savedAt, prefs);
|
||||
|
||||
return (
|
||||
<Box
|
||||
|
||||
@@ -0,0 +1,150 @@
|
||||
import React, { useCallback, useEffect, useState } from 'react';
|
||||
import FocusTrap from 'focus-trap-react';
|
||||
import {
|
||||
Box,
|
||||
Icon,
|
||||
IconButton,
|
||||
Icons,
|
||||
Menu,
|
||||
MenuItem,
|
||||
PopOut,
|
||||
RectCords,
|
||||
Text,
|
||||
Tooltip,
|
||||
TooltipProvider,
|
||||
config,
|
||||
toRem,
|
||||
} from 'folds';
|
||||
import { CallEmbed } from '../../plugins/call';
|
||||
import { MobileTouchTarget } from '../../styles/mobile.css';
|
||||
import { stopPropagation } from '../../utils/keyboard';
|
||||
|
||||
/** Output selection needs setSinkId; Firefox/Safari/Android Chrome lack it. */
|
||||
export const audioOutputSelectable = (): boolean =>
|
||||
typeof HTMLMediaElement !== 'undefined' &&
|
||||
'setSinkId' in HTMLMediaElement.prototype &&
|
||||
typeof navigator !== 'undefined' &&
|
||||
!!navigator.mediaDevices?.enumerateDevices;
|
||||
|
||||
type OutputDevice = { id: string; label: string };
|
||||
|
||||
/**
|
||||
* [Gitea #119] Speaker button in the call bar: a small menu of audio outputs
|
||||
* (headset ↔ speakers) without opening Settings. The choice goes to the fork
|
||||
* as io.lotus.set_audio_output; the fork's own picker is unreachable here
|
||||
* because the embed hides Element Call's footer.
|
||||
*/
|
||||
export function AudioOutputButton({ embed, disabled }: { embed: CallEmbed; disabled?: boolean }) {
|
||||
const [anchor, setAnchor] = useState<RectCords>();
|
||||
const [devices, setDevices] = useState<OutputDevice[]>([]);
|
||||
const [selected, setSelected] = useState<string | undefined>(embed.control.audioOutputId);
|
||||
|
||||
const refresh = useCallback(async () => {
|
||||
try {
|
||||
const all = await navigator.mediaDevices.enumerateDevices();
|
||||
setDevices(
|
||||
all
|
||||
.filter((d) => d.kind === 'audiooutput')
|
||||
.map((d, i) => ({ id: d.deviceId, label: d.label || `Output ${i + 1}` })),
|
||||
);
|
||||
} catch {
|
||||
setDevices([]);
|
||||
}
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
if (!anchor) return undefined;
|
||||
refresh();
|
||||
navigator.mediaDevices.addEventListener('devicechange', refresh);
|
||||
return () => navigator.mediaDevices.removeEventListener('devicechange', refresh);
|
||||
}, [anchor, refresh]);
|
||||
|
||||
const choose = (id: string) => {
|
||||
embed.control.setAudioOutput(id);
|
||||
setSelected(id);
|
||||
setAnchor(undefined);
|
||||
};
|
||||
|
||||
return (
|
||||
<PopOut
|
||||
anchor={anchor}
|
||||
position="Top"
|
||||
align="Center"
|
||||
offset={6}
|
||||
content={
|
||||
<FocusTrap
|
||||
focusTrapOptions={{
|
||||
initialFocus: false,
|
||||
// The list is enumerated after the menu opens; until then the only
|
||||
// tabbable node is the menu itself.
|
||||
fallbackFocus: '#call-audio-output-menu',
|
||||
onDeactivate: () => setAnchor(undefined),
|
||||
clickOutsideDeactivates: true,
|
||||
escapeDeactivates: stopPropagation,
|
||||
}}
|
||||
>
|
||||
<Menu
|
||||
id="call-audio-output-menu"
|
||||
tabIndex={-1}
|
||||
style={{ maxWidth: toRem(280), width: '100vw' }}
|
||||
aria-label="Audio output"
|
||||
>
|
||||
<Box direction="Column" gap="100" style={{ padding: config.space.S100 }}>
|
||||
{devices.length === 0 && (
|
||||
<Text size="T200" priority="300" style={{ padding: config.space.S200 }}>
|
||||
No audio outputs found.
|
||||
</Text>
|
||||
)}
|
||||
{devices.map((d) => {
|
||||
const isSelected = selected ? d.id === selected : d.id === 'default';
|
||||
return (
|
||||
<MenuItem
|
||||
key={d.id}
|
||||
size="300"
|
||||
radii="300"
|
||||
role="menuitemradio"
|
||||
aria-checked={isSelected}
|
||||
after={isSelected ? <Icon size="100" src={Icons.Check} /> : undefined}
|
||||
onClick={() => choose(d.id)}
|
||||
>
|
||||
<Text style={{ flexGrow: 1 }} as="span" size="T300" truncate>
|
||||
{d.label}
|
||||
</Text>
|
||||
</MenuItem>
|
||||
);
|
||||
})}
|
||||
</Box>
|
||||
</Menu>
|
||||
</FocusTrap>
|
||||
}
|
||||
>
|
||||
<TooltipProvider
|
||||
position="Top"
|
||||
tooltip={
|
||||
<Tooltip>
|
||||
<Text size="T200">Audio output</Text>
|
||||
</Tooltip>
|
||||
}
|
||||
>
|
||||
{(tipRef) => (
|
||||
<IconButton
|
||||
ref={tipRef}
|
||||
variant="Surface"
|
||||
fill="Soft"
|
||||
radii="300"
|
||||
size="300"
|
||||
className={MobileTouchTarget}
|
||||
outlined
|
||||
disabled={disabled}
|
||||
aria-label="Audio output"
|
||||
aria-haspopup="menu"
|
||||
aria-expanded={!!anchor}
|
||||
onClick={(e) => setAnchor(e.currentTarget.getBoundingClientRect())}
|
||||
>
|
||||
<Icon size="100" src={Icons.VolumeHigh} />
|
||||
</IconButton>
|
||||
)}
|
||||
</TooltipProvider>
|
||||
</PopOut>
|
||||
);
|
||||
}
|
||||
@@ -8,6 +8,7 @@ import { callEmbedAtom } from '../../state/callEmbed';
|
||||
import { MobileTouchTarget } from '../../styles/mobile.css';
|
||||
import { useRoomCallPolicy } from '../../hooks/useRoomCallPolicy';
|
||||
import { ScreenshareConfirm } from '../call/ScreenshareConfirm';
|
||||
import { AudioOutputButton, audioOutputSelectable } from './AudioOutputButton';
|
||||
|
||||
type MicrophoneButtonProps = {
|
||||
enabled: boolean;
|
||||
@@ -230,6 +231,9 @@ export function CallControl({
|
||||
onToggle={() => callEmbed.control.toggleSound()}
|
||||
disabled={!callJoined}
|
||||
/>
|
||||
{!compact && audioOutputSelectable() && (
|
||||
<AudioOutputButton embed={callEmbed} disabled={!callJoined} />
|
||||
)}
|
||||
{!compact && (showCamera || showScreenshare) && <StatusDivider />}
|
||||
{showCamera && (
|
||||
<VideoButton enabled={video} onToggle={handleVideoToggle} disabled={!callJoined} />
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import React from 'react';
|
||||
import { Box, Spinner } from 'folds';
|
||||
import { Box, Spinner, Text, color } from 'folds';
|
||||
import { useAtomValue } from 'jotai';
|
||||
import classNames from 'classnames';
|
||||
import { LiveChip } from './LiveChip';
|
||||
import * as css from './styles.css';
|
||||
@@ -14,6 +15,8 @@ import { CallEmbed } from '../../plugins/call/CallEmbed';
|
||||
import { useCallJoined } from '../../hooks/useCallEmbed';
|
||||
import { useCallSpeakers } from '../../hooks/useCallSpeakers';
|
||||
import { MemberSpeaking } from './MemberSpeaking';
|
||||
import { clockSkewAtom } from '../../state/clockSkew';
|
||||
import { describeSkewVsServer } from '../../utils/clockSkew';
|
||||
|
||||
type CallStatusProps = {
|
||||
callEmbed: CallEmbed;
|
||||
@@ -26,6 +29,8 @@ export function CallStatus({ callEmbed }: CallStatusProps) {
|
||||
const screenSize = useScreenSize();
|
||||
const callJoined = useCallJoined(callEmbed);
|
||||
const speakers = useCallSpeakers(callEmbed);
|
||||
// [Gitea #158] Same warning as the top banner, where the user is looking during a call.
|
||||
const clockSkew = useAtomValue(clockSkewAtom);
|
||||
|
||||
const compact = screenSize === ScreenSize.Mobile;
|
||||
|
||||
@@ -51,6 +56,19 @@ export function CallStatus({ callEmbed }: CallStatusProps) {
|
||||
{!compact && (
|
||||
<>
|
||||
<CallRoomName room={room} />
|
||||
{clockSkew.warning && clockSkew.skewMs !== null && (
|
||||
<>
|
||||
<StatusDivider />
|
||||
<Text
|
||||
size="T200"
|
||||
truncate
|
||||
style={{ color: color.Warning.Main }}
|
||||
title="Fix your computer's clock — calls and encryption depend on it"
|
||||
>
|
||||
Clock {describeSkewVsServer(clockSkew.skewMs)} — calls will fail
|
||||
</Text>
|
||||
</>
|
||||
)}
|
||||
{speakers.size > 0 && (
|
||||
<>
|
||||
<StatusDivider />
|
||||
|
||||
@@ -41,7 +41,7 @@ export function CallMemberCard({ member }: CallMemberCardProps) {
|
||||
className={css.CallMemberCard}
|
||||
variant="SurfaceVariant"
|
||||
radii="500"
|
||||
onClick={(evt: any) =>
|
||||
onClick={(evt: React.MouseEvent) =>
|
||||
openUserProfile(
|
||||
room.roomId,
|
||||
undefined,
|
||||
|
||||
@@ -0,0 +1,294 @@
|
||||
import React, { useCallback, useEffect, useState } from 'react';
|
||||
import {
|
||||
Box,
|
||||
Button,
|
||||
Checkbox,
|
||||
color,
|
||||
config,
|
||||
Dialog,
|
||||
Header,
|
||||
Icon,
|
||||
IconButton,
|
||||
Icons,
|
||||
Input,
|
||||
Overlay,
|
||||
OverlayBackdrop,
|
||||
OverlayCenter,
|
||||
Spinner,
|
||||
Text,
|
||||
} from 'folds';
|
||||
import FocusTrap from 'focus-trap-react';
|
||||
import { useAtomValue, useSetAtom, useStore } from 'jotai';
|
||||
import { SequenceCard } from '../../../components/sequence-card';
|
||||
import { SequenceCardStyle } from '../../room-settings/styles.css';
|
||||
import { SettingTile } from '../../../components/setting-tile';
|
||||
import { useRoom } from '../../../hooks/useRoom';
|
||||
import { useMatrixClient } from '../../../hooks/useMatrixClient';
|
||||
import { useModalStyle } from '../../../hooks/useModalStyle';
|
||||
import { stopPropagation } from '../../../utils/keyboard';
|
||||
import { toastQueueAtom } from '../../../state/toast';
|
||||
import {
|
||||
cancelRedactJob,
|
||||
clearRedactJob,
|
||||
hydrateRedactJob,
|
||||
redactJobsAtom,
|
||||
runRedactJob,
|
||||
} from '../../../state/redactOwnMessagesJob';
|
||||
import { collectOwnEventIds } from '../../../utils/redactOwnMessages';
|
||||
|
||||
const TYPE_TO_CONFIRM_ABOVE = 50;
|
||||
|
||||
type ConfirmDialogProps = {
|
||||
onStart: (leaveAfter: boolean) => void;
|
||||
requestClose: () => void;
|
||||
};
|
||||
|
||||
/**
|
||||
* Scan first (live count), then confirm with the number — typing the room name
|
||||
* for > 50 — and an optional "leave the room afterwards".
|
||||
*/
|
||||
function ConfirmDialog({ onStart, requestClose }: ConfirmDialogProps) {
|
||||
const mx = useMatrixClient();
|
||||
const room = useRoom();
|
||||
const modalStyle = useModalStyle(480);
|
||||
const [count, setCount] = useState<number | null>(null);
|
||||
const [scanError, setScanError] = useState<string>();
|
||||
const [typed, setTyped] = useState('');
|
||||
const [leaveAfter, setLeaveAfter] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
const ctrl = new AbortController();
|
||||
setCount(null);
|
||||
collectOwnEventIds(mx, room.roomId, mx.getSafeUserId(), (n) => setCount(n), ctrl.signal)
|
||||
.then((ids) => setCount(ids.length))
|
||||
.catch((e) => {
|
||||
if (!ctrl.signal.aborted) setScanError(e instanceof Error ? e.message : String(e));
|
||||
});
|
||||
return () => ctrl.abort();
|
||||
}, [mx, room.roomId]);
|
||||
|
||||
const scanning = count === null && !scanError;
|
||||
const needsTyping = (count ?? 0) > TYPE_TO_CONFIRM_ABOVE;
|
||||
const roomName = room.name ?? room.roomId;
|
||||
const canStart =
|
||||
!scanning && !scanError && (count ?? 0) > 0 && (!needsTyping || typed.trim() === roomName);
|
||||
|
||||
return (
|
||||
<Overlay open backdrop={<OverlayBackdrop />}>
|
||||
<OverlayCenter>
|
||||
<FocusTrap
|
||||
focusTrapOptions={{
|
||||
initialFocus: false,
|
||||
onDeactivate: requestClose,
|
||||
clickOutsideDeactivates: true,
|
||||
escapeDeactivates: stopPropagation,
|
||||
}}
|
||||
>
|
||||
<Dialog variant="Surface" style={modalStyle}>
|
||||
<Header
|
||||
style={{
|
||||
padding: `0 ${config.space.S200} 0 ${config.space.S400}`,
|
||||
borderBottomWidth: config.borderWidth.B300,
|
||||
}}
|
||||
variant="Surface"
|
||||
size="500"
|
||||
>
|
||||
<Box grow="Yes">
|
||||
<Text as="h2" size="H4">
|
||||
Delete all your messages
|
||||
</Text>
|
||||
</Box>
|
||||
<IconButton size="300" onClick={requestClose} radii="300" aria-label="Close">
|
||||
<Icon src={Icons.Cross} />
|
||||
</IconButton>
|
||||
</Header>
|
||||
<Box style={{ padding: config.space.S400 }} direction="Column" gap="400">
|
||||
{scanning && (
|
||||
<Box alignItems="Center" gap="200">
|
||||
<Spinner size="200" />
|
||||
<Text>
|
||||
Counting your messages in <b>{roomName}</b>…{' '}
|
||||
{count ? `${Number(count).toLocaleString()} so far` : ''}
|
||||
</Text>
|
||||
</Box>
|
||||
)}
|
||||
{scanError && (
|
||||
<Text style={{ color: color.Critical.Main }}>
|
||||
Couldn't count your messages: {scanError}
|
||||
</Text>
|
||||
)}
|
||||
{!scanning && !scanError && (
|
||||
<>
|
||||
<Text>
|
||||
Redact <b>{(count ?? 0).toLocaleString()}</b> messages you sent in{' '}
|
||||
<b>{roomName}</b>? This cannot be undone. Redactions are visible to others as
|
||||
“message deleted”, and files you uploaded stay on the server until
|
||||
an admin purges them.
|
||||
</Text>
|
||||
{needsTyping && (
|
||||
<Box direction="Column" gap="100">
|
||||
<Text size="L400">Type the room name to confirm</Text>
|
||||
<Input
|
||||
variant="Background"
|
||||
size="400"
|
||||
radii="300"
|
||||
value={typed}
|
||||
onChange={(e) => setTyped(e.currentTarget.value)}
|
||||
placeholder={roomName}
|
||||
aria-label="Room name confirmation"
|
||||
/>
|
||||
</Box>
|
||||
)}
|
||||
<Box as="label" alignItems="Center" gap="200">
|
||||
<Checkbox
|
||||
variant="Critical"
|
||||
checked={leaveAfter}
|
||||
onClick={() => setLeaveAfter((v) => !v)}
|
||||
aria-label="Leave the room afterwards"
|
||||
/>
|
||||
<Text>Leave the room afterwards</Text>
|
||||
</Box>
|
||||
</>
|
||||
)}
|
||||
<Box gap="200" justifyContent="End">
|
||||
<Button variant="Secondary" fill="Soft" onClick={requestClose}>
|
||||
<Text size="B400">Cancel</Text>
|
||||
</Button>
|
||||
<Button variant="Critical" disabled={!canStart} onClick={() => onStart(leaveAfter)}>
|
||||
<Text size="B400">Delete {count ? count.toLocaleString() : ''} messages</Text>
|
||||
</Button>
|
||||
</Box>
|
||||
</Box>
|
||||
</Dialog>
|
||||
</FocusTrap>
|
||||
</OverlayCenter>
|
||||
</Overlay>
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* [Gitea #169] Room Settings tile: "Your messages in this room" with a
|
||||
* Delete all… flow. The job runs outside React (closing settings is fine),
|
||||
* shows its progress here, persists so a reload can resume, and toasts when done.
|
||||
*/
|
||||
export function DeleteMyMessages() {
|
||||
const mx = useMatrixClient();
|
||||
const room = useRoom();
|
||||
const store = useStore();
|
||||
const setToast = useSetAtom(toastQueueAtom);
|
||||
const jobs = useAtomValue(redactJobsAtom);
|
||||
const job = jobs[room.roomId];
|
||||
const [confirm, setConfirm] = useState(false);
|
||||
|
||||
// A reload mid-job: offer to resume.
|
||||
useEffect(() => {
|
||||
if (!jobs[room.roomId]) hydrateRedactJob(store, room.roomId);
|
||||
}, [store, room.roomId, jobs]);
|
||||
|
||||
const start = useCallback(
|
||||
(leaveAfter: boolean, resume?: boolean) => {
|
||||
setConfirm(false);
|
||||
const resumeState = resume ? jobs[room.roomId] : undefined;
|
||||
const name = room.name ?? room.roomId;
|
||||
runRedactJob(
|
||||
store,
|
||||
mx,
|
||||
room.roomId,
|
||||
{
|
||||
leaveAfter,
|
||||
onDone: (s) =>
|
||||
setToast({
|
||||
id: `redact-done-${room.roomId}`,
|
||||
displayName: 'Lotus Chat',
|
||||
body: `Deleted ${s.redacted.toLocaleString()} of your messages in ${name}${s.skipped ? ` (${s.skipped} already gone)` : ''}.`,
|
||||
roomName: name,
|
||||
roomId: room.roomId,
|
||||
}),
|
||||
},
|
||||
resumeState,
|
||||
);
|
||||
},
|
||||
[store, mx, room, jobs, setToast],
|
||||
);
|
||||
|
||||
const running = job && (job.phase === 'collecting' || job.phase === 'redacting');
|
||||
const total = job ? job.redacted + job.skipped + job.pending.length : 0;
|
||||
const done = job ? job.redacted + job.skipped : 0;
|
||||
|
||||
let status: React.ReactNode = 'Redact everything you sent here — no moderator needed.';
|
||||
if (job?.phase === 'collecting') status = `Counting… ${job.found.toLocaleString()} found`;
|
||||
else if (job?.phase === 'redacting')
|
||||
status = `Deleting… ${done.toLocaleString()} / ${total.toLocaleString()}`;
|
||||
else if (job?.phase === 'error')
|
||||
status = `Stopped: ${job.error}. ${job.pending.length} left — you can resume.`;
|
||||
else if (job?.phase === 'cancelled' && job.pending.length > 0)
|
||||
status = `Cancelled with ${job.pending.length.toLocaleString()} left — you can resume.`;
|
||||
else if (job?.phase === 'done') status = `Deleted ${job.redacted.toLocaleString()} messages.`;
|
||||
|
||||
const resumable = job && !running && job.pending.length > 0;
|
||||
|
||||
return (
|
||||
<SequenceCard
|
||||
className={SequenceCardStyle}
|
||||
variant="SurfaceVariant"
|
||||
direction="Column"
|
||||
gap="400"
|
||||
>
|
||||
<SettingTile
|
||||
title="Your messages in this room"
|
||||
description={status}
|
||||
after={
|
||||
<Box gap="200">
|
||||
{running && (
|
||||
<Button
|
||||
size="300"
|
||||
variant="Secondary"
|
||||
fill="Soft"
|
||||
radii="300"
|
||||
onClick={() => cancelRedactJob(room.roomId)}
|
||||
>
|
||||
<Text size="B300">Cancel</Text>
|
||||
</Button>
|
||||
)}
|
||||
{resumable && (
|
||||
<>
|
||||
<Button
|
||||
size="300"
|
||||
variant="Critical"
|
||||
fill="Soft"
|
||||
radii="300"
|
||||
onClick={() => start(job.leaveAfter, true)}
|
||||
>
|
||||
<Text size="B300">Resume</Text>
|
||||
</Button>
|
||||
<Button
|
||||
size="300"
|
||||
variant="Secondary"
|
||||
fill="None"
|
||||
radii="300"
|
||||
onClick={() => clearRedactJob(store, room.roomId)}
|
||||
>
|
||||
<Text size="B300">Discard</Text>
|
||||
</Button>
|
||||
</>
|
||||
)}
|
||||
{!running && !resumable && (
|
||||
<Button
|
||||
size="300"
|
||||
variant="Critical"
|
||||
fill="Soft"
|
||||
radii="300"
|
||||
onClick={() => setConfirm(true)}
|
||||
>
|
||||
<Text size="B300">Delete all…</Text>
|
||||
</Button>
|
||||
)}
|
||||
</Box>
|
||||
}
|
||||
/>
|
||||
{confirm && (
|
||||
<ConfirmDialog onStart={(leave) => start(leave)} requestClose={() => setConfirm(false)} />
|
||||
)}
|
||||
</SequenceCard>
|
||||
);
|
||||
}
|
||||
@@ -40,10 +40,15 @@ import { useMatrixClient } from '../../../hooks/useMatrixClient';
|
||||
import { useMediaAuthentication } from '../../../hooks/useMediaAuthentication';
|
||||
import { StateEvent } from '../../../../types/matrix/room';
|
||||
import { sendStateEvent } from '../../../utils/room';
|
||||
import { describeRoomVisibility } from '../../../utils/roomVisibilityLine';
|
||||
import { useStateEvent } from '../../../hooks/useStateEvent';
|
||||
import { CompactUploadCardRenderer } from '../../../components/upload-card';
|
||||
import { useObjectURL } from '../../../hooks/useObjectURL';
|
||||
import { createUploadAtom, UploadSuccess } from '../../../state/upload';
|
||||
import { stripImageMetadata as stripImageMetadata_ } from '../../../utils/stripImageMetadata';
|
||||
import { useFilePicker } from '../../../hooks/useFilePicker';
|
||||
import { useSetting } from '../../../state/hooks/settings';
|
||||
import { settingsAtom } from '../../../state/settings';
|
||||
import { AsyncStatus, useAsyncCallback } from '../../../hooks/useAsyncCallback';
|
||||
import { useAlive } from '../../../hooks/useAlive';
|
||||
import { RoomPermissionsAPI } from '../../../hooks/useRoomPermissions';
|
||||
@@ -138,7 +143,19 @@ export function RoomProfileEdit({
|
||||
return undefined;
|
||||
}, [imageFile]);
|
||||
|
||||
const pickFile = useFilePicker(setImageFile, false);
|
||||
// [Gitea #109] Avatars go through the same metadata strip as messages.
|
||||
const [stripImageMetadata] = useSetting(settingsAtom, 'stripImageMetadata');
|
||||
const pickFile = useFilePicker(
|
||||
useCallback(
|
||||
(file: File) => {
|
||||
(stripImageMetadata ? stripImageMetadata_(file) : Promise.resolve({ file })).then((r) =>
|
||||
setImageFile(r.file),
|
||||
);
|
||||
},
|
||||
[stripImageMetadata],
|
||||
),
|
||||
false,
|
||||
);
|
||||
|
||||
const handleRemoveUpload = useCallback(() => {
|
||||
setImageFile(undefined);
|
||||
@@ -419,6 +436,14 @@ export function RoomProfile({ permissions }: RoomProfileProps) {
|
||||
const name = useRoomName(room);
|
||||
const topic = useRoomTopic(room);
|
||||
const joinRule = useRoomJoinRule(room);
|
||||
// [Gitea #133] One line, no controls: encryption · join rule · history.
|
||||
const historyVisibilityEvent = useStateEvent(room, StateEvent.RoomHistoryVisibility);
|
||||
const visibilityLine = describeRoomVisibility({
|
||||
encrypted: room.hasEncryptionStateEvent(),
|
||||
joinRule: joinRule?.join_rule,
|
||||
historyVisibility: historyVisibilityEvent?.getContent<{ history_visibility?: string }>()
|
||||
.history_visibility,
|
||||
});
|
||||
|
||||
const canEditAvatar = permissions.stateEvent(StateEvent.RoomAvatar, mx.getSafeUserId());
|
||||
const canEditName = permissions.stateEvent(StateEvent.RoomName, mx.getSafeUserId());
|
||||
@@ -459,6 +484,9 @@ export function RoomProfile({ permissions }: RoomProfileProps) {
|
||||
<Text className={BreakWord} size="H5">
|
||||
{name ?? 'Unknown'}
|
||||
</Text>
|
||||
<Text size="T200" priority="300" className={BreakWord}>
|
||||
{visibilityLine}
|
||||
</Text>
|
||||
{topic && (
|
||||
<Text className={classNames(BreakWord, LineClamp3)} size="T200">
|
||||
{topic.format === 'org.matrix.custom.html' &&
|
||||
|
||||
@@ -41,7 +41,7 @@ type RoomQualityProps = {
|
||||
/**
|
||||
* [P5-31] Room-admin quality ceiling. Writes `io.lotus.room_quality`; every
|
||||
* Lotus client clamps its per-user quality to these caps. Hard enforcement for
|
||||
* ALL Matrix clients is a server-side follow-up (see LOTUS_TODO.md P5-31).
|
||||
* ALL Matrix clients is a server-side follow-up (see cinny #174, D2-8).
|
||||
*/
|
||||
export function RoomQuality({ permissions }: RoomQualityProps) {
|
||||
const mx = useMatrixClient();
|
||||
|
||||
@@ -65,6 +65,7 @@ export function RoomVoiceLimit({ permissions }: RoomVoiceLimitProps) {
|
||||
<Input
|
||||
key={maxUsers}
|
||||
name="limitInput"
|
||||
aria-label="Voice channel participant limit"
|
||||
defaultValue={maxUsers}
|
||||
type="number"
|
||||
min={0}
|
||||
|
||||
@@ -9,3 +9,4 @@ export * from './RoomRetention';
|
||||
export * from './RoomShareInvite';
|
||||
export * from './RoomUpgrade';
|
||||
export * from './RoomVoiceLimit';
|
||||
export * from './DeleteMyMessages';
|
||||
|
||||
@@ -52,6 +52,7 @@ import { SearchResultGroup } from './SearchResultGroup';
|
||||
import { SearchInput } from './SearchInput';
|
||||
import { SearchFilters } from './SearchFilters';
|
||||
import { VirtualTile } from '../../components/virtualizer';
|
||||
import { useTimestampFormatter } from '../../hooks/useTimestampFormatter';
|
||||
|
||||
const useSearchPathSearchParams = (searchParams: URLSearchParams): _SearchPathSearchParams =>
|
||||
useMemo(
|
||||
@@ -74,6 +75,7 @@ type EncryptedRoomCachePanelProps = {
|
||||
};
|
||||
function EncryptedRoomCachePanel({ roomIds, onLoaded }: EncryptedRoomCachePanelProps) {
|
||||
const mx = useMatrixClient();
|
||||
const { format } = useTimestampFormatter();
|
||||
const [loadingRooms, setLoadingRooms] = useState<Set<string>>(new Set());
|
||||
|
||||
const encryptedRooms = useMemo(
|
||||
@@ -140,7 +142,7 @@ function EncryptedRoomCachePanel({ roomIds, onLoaded }: EncryptedRoomCachePanelP
|
||||
</Text>
|
||||
<Text size="T200" priority="300">
|
||||
{msgEvents.length > 0
|
||||
? `${msgEvents.length} messages cached · oldest: ${new Date(oldest!.getTs()).toLocaleDateString()}`
|
||||
? `${msgEvents.length} messages cached · oldest: ${format(oldest!.getTs(), 'date')}`
|
||||
: 'No messages cached yet'}
|
||||
</Text>
|
||||
</Box>
|
||||
@@ -246,8 +248,15 @@ export function MessageSearch({
|
||||
const [cacheVersion, setCacheVersion] = useState(0);
|
||||
const handleCacheLoaded = useCallback(() => setCacheVersion((v) => v + 1), []);
|
||||
// Explicit wipe of the persistent on-disk index, then re-run the merge.
|
||||
// After a clear, the active search re-runs (cacheVersion) and would persist
|
||||
// the in-memory rows straight back — skip that one write so "Clear cached
|
||||
// index" actually leaves the disk empty until the next new search.
|
||||
const skipPersistOnceRef = useRef(false);
|
||||
const handleClearSearchCache = useCallback(() => {
|
||||
clearSearchCache().then(() => setCacheVersion((v) => v + 1));
|
||||
clearSearchCache().then(() => {
|
||||
skipPersistOnceRef.current = true;
|
||||
setCacheVersion((v) => v + 1);
|
||||
});
|
||||
}, []);
|
||||
|
||||
// The rooms actually in scope for this search (mirrors server-side logic)
|
||||
@@ -277,12 +286,15 @@ export function MessageSearch({
|
||||
return undefined;
|
||||
}
|
||||
let cancelled = false;
|
||||
const persist = !skipPersistOnceRef.current;
|
||||
skipPersistOnceRef.current = false;
|
||||
searchLocalMessages({
|
||||
term: msgSearchParams.term ?? '',
|
||||
roomIds: localSearchRooms,
|
||||
senders: msgSearchParams.senders,
|
||||
fromTs: msgSearchParams.fromTs,
|
||||
toTs: msgSearchParams.toTs,
|
||||
persist,
|
||||
}).then((result) => {
|
||||
if (!cancelled) setLocalResult(result);
|
||||
});
|
||||
|
||||
@@ -18,6 +18,12 @@ export type LocalSearchParams = {
|
||||
/** Optional date-range filter (ms). Applied to both memory and cached rows. */
|
||||
fromTs?: number;
|
||||
toTs?: number;
|
||||
/**
|
||||
* Set false to run the scan without writing it back to IndexedDB — used
|
||||
* right after "Clear cached index" so the clear is not undone by the
|
||||
* re-run of the active search (Gitea #184 O4).
|
||||
*/
|
||||
persist?: boolean;
|
||||
};
|
||||
|
||||
export type LocalSearchResult = {
|
||||
@@ -149,6 +155,7 @@ export const useLocalMessageSearch = () => {
|
||||
senders,
|
||||
fromTs,
|
||||
toTs,
|
||||
persist = true,
|
||||
}: LocalSearchParams): Promise<LocalSearchResult> => {
|
||||
const trimmedTerm = term.trim();
|
||||
const senderSet = senders && senders.length > 0 ? new Set(senders) : null;
|
||||
@@ -302,7 +309,7 @@ export const useLocalMessageSearch = () => {
|
||||
// Fire-and-forget persist of freshly scanned rows + coverage.
|
||||
// saveRoomIndex swallows all errors internally, so a floating promise
|
||||
// here can never reject.
|
||||
if (cacheEnabled && rowsToPersist.length > 0) {
|
||||
if (cacheEnabled && persist && rowsToPersist.length > 0) {
|
||||
saveRoomIndex(roomId, rowsToPersist);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -23,6 +23,7 @@ import {
|
||||
Overlay,
|
||||
OverlayBackdrop,
|
||||
OverlayCenter,
|
||||
color,
|
||||
config,
|
||||
PopOut,
|
||||
toRem,
|
||||
@@ -30,18 +31,29 @@ import {
|
||||
RectCords,
|
||||
Badge,
|
||||
Spinner,
|
||||
Tooltip,
|
||||
TooltipProvider,
|
||||
} from 'folds';
|
||||
import { useFocusWithin, useHover } from 'react-aria';
|
||||
import FocusTrap from 'focus-trap-react';
|
||||
import { useAtom, useAtomValue, useSetAtom } from 'jotai';
|
||||
import { selectAtom } from 'jotai/utils';
|
||||
import dayjs from 'dayjs';
|
||||
import isToday from 'dayjs/plugin/isToday';
|
||||
import isYesterday from 'dayjs/plugin/isYesterday';
|
||||
import {
|
||||
isSectionTag,
|
||||
listSectionNames,
|
||||
sectionName,
|
||||
sectionTag,
|
||||
validateSectionName,
|
||||
} from '../../utils/roomSections';
|
||||
import { NavItem, NavItemContent, NavItemOptions, NavLink } from '../../components/nav';
|
||||
import { UnreadBadge, UnreadBadgeCenter } from '../../components/unread-badge';
|
||||
import { RoomAvatar, RoomIcon } from '../../components/room-avatar';
|
||||
import { getDirectRoomAvatarUrl, getRoomAvatarUrl, getStateEvent } from '../../utils/room';
|
||||
import {
|
||||
getDirectRoomAvatarUrl,
|
||||
getMemberName,
|
||||
getRoomAvatarUrl,
|
||||
getStateEvent,
|
||||
} from '../../utils/room';
|
||||
import { nameInitials } from '../../utils/common';
|
||||
import { useMatrixClient } from '../../hooks/useMatrixClient';
|
||||
import { useRoomUnread } from '../../state/hooks/unread';
|
||||
@@ -90,29 +102,11 @@ import { MessageEvent, StateEvent } from '../../../types/matrix/room';
|
||||
import { webRTCSupported } from '../../utils/rtc';
|
||||
import { useRoomLatestRenderedEvent } from '../../hooks/useRoomLatestRenderedEvent';
|
||||
import { EmojiBoard } from '../../components/emoji-board';
|
||||
|
||||
dayjs.extend(isToday);
|
||||
dayjs.extend(isYesterday);
|
||||
import { useTimestampFormatter } from '../../hooks/useTimestampFormatter';
|
||||
import { formatShortAge } from '../../utils/formatTimestamp';
|
||||
|
||||
const PREVIEW_MAX_CHARS = 48;
|
||||
|
||||
function formatDmTimestamp(ts: number): string {
|
||||
const d = dayjs(ts);
|
||||
const now = dayjs();
|
||||
const diffMinutes = now.diff(d, 'minute');
|
||||
if (diffMinutes < 60) {
|
||||
return `${diffMinutes < 1 ? 0 : diffMinutes}m`;
|
||||
}
|
||||
const diffHours = now.diff(d, 'hour');
|
||||
if (diffHours < 24) {
|
||||
return `${diffHours}h`;
|
||||
}
|
||||
if (d.isYesterday()) {
|
||||
return 'Yesterday';
|
||||
}
|
||||
return d.format('D MMM');
|
||||
}
|
||||
|
||||
type RenameRoomDialogProps = {
|
||||
room: Room;
|
||||
onClose: () => void;
|
||||
@@ -291,6 +285,14 @@ const RoomNavItemMenu = forwardRef<HTMLDivElement, RoomNavItemMenuProps>(
|
||||
|
||||
const [invitePrompt, setInvitePrompt] = useState(false);
|
||||
const [muteMenuAnchor, setMuteMenuAnchor] = useState<RectCords>();
|
||||
// [Gitea #108] "Add to section" submenu: existing u.* sections + new one.
|
||||
const [sectionMenuAnchor, setSectionMenuAnchor] = useState<RectCords>();
|
||||
const [newSectionName, setNewSectionName] = useState('');
|
||||
const [newSectionError, setNewSectionError] = useState<string>();
|
||||
const sectionNames = useMemo(() => listSectionNames(mx), [mx]);
|
||||
const roomSections = Object.keys(room.tags ?? {})
|
||||
.filter(isSectionTag)
|
||||
.map(sectionName);
|
||||
const isServerNotice = room.getType() === 'm.server_notice';
|
||||
|
||||
const isFavorite = !!room.tags?.['m.favourite'];
|
||||
@@ -330,6 +332,25 @@ const RoomNavItemMenu = forwardRef<HTMLDivElement, RoomNavItemMenuProps>(
|
||||
requestClose();
|
||||
};
|
||||
|
||||
const handleToggleSection = (name: string) => {
|
||||
const tag = sectionTag(name);
|
||||
const op = room.tags?.[tag]
|
||||
? mx.deleteRoomTag(room.roomId, tag)
|
||||
: mx.setRoomTag(room.roomId, tag, { order: 0.5 });
|
||||
op.catch(notifyTagFailure);
|
||||
requestClose();
|
||||
};
|
||||
|
||||
const handleNewSection = (evt: React.FormEvent) => {
|
||||
evt.preventDefault();
|
||||
const error = validateSectionName(newSectionName, sectionNames);
|
||||
if (error) {
|
||||
setNewSectionError(error);
|
||||
return;
|
||||
}
|
||||
handleToggleSection(newSectionName.trim());
|
||||
};
|
||||
|
||||
const markedUnread = useAtomValue(markedUnreadAtom).has(room.roomId);
|
||||
|
||||
const handleMarkAsRead = () => {
|
||||
@@ -512,6 +533,97 @@ const RoomNavItemMenu = forwardRef<HTMLDivElement, RoomNavItemMenuProps>(
|
||||
{isLowPriority ? 'Remove from Low Priority' : 'Add to Low Priority'}
|
||||
</Text>
|
||||
</MenuItem>
|
||||
<PopOut
|
||||
anchor={sectionMenuAnchor}
|
||||
position="Right"
|
||||
align="Start"
|
||||
offset={4}
|
||||
content={
|
||||
<FocusTrap
|
||||
focusTrapOptions={{
|
||||
initialFocus: false,
|
||||
onDeactivate: () => setSectionMenuAnchor(undefined),
|
||||
clickOutsideDeactivates: true,
|
||||
escapeDeactivates: stopPropagation,
|
||||
}}
|
||||
>
|
||||
<Menu style={{ maxWidth: toRem(220), width: '100vw' }}>
|
||||
<Box direction="Column" gap="100" style={{ padding: config.space.S100 }}>
|
||||
{sectionNames.map((name) => {
|
||||
const inSection = roomSections.includes(name);
|
||||
return (
|
||||
<MenuItem
|
||||
key={name}
|
||||
size="300"
|
||||
radii="300"
|
||||
role="menuitemcheckbox"
|
||||
aria-checked={inSection}
|
||||
after={inSection ? <Icon size="100" src={Icons.Check} /> : undefined}
|
||||
onClick={() => handleToggleSection(name)}
|
||||
>
|
||||
<Text style={{ flexGrow: 1 }} as="span" size="T300" truncate>
|
||||
{name}
|
||||
</Text>
|
||||
</MenuItem>
|
||||
);
|
||||
})}
|
||||
{sectionNames.length > 0 && <Line variant="Surface" size="300" />}
|
||||
<Box
|
||||
as="form"
|
||||
direction="Column"
|
||||
gap="100"
|
||||
onSubmit={handleNewSection}
|
||||
style={{ padding: config.space.S100 }}
|
||||
>
|
||||
<Input
|
||||
size="300"
|
||||
variant="Background"
|
||||
radii="300"
|
||||
placeholder="New section…"
|
||||
aria-label="New section name"
|
||||
value={newSectionName}
|
||||
onChange={(e) => {
|
||||
setNewSectionName(e.currentTarget.value);
|
||||
setNewSectionError(undefined);
|
||||
}}
|
||||
after={
|
||||
<IconButton
|
||||
type="submit"
|
||||
size="300"
|
||||
radii="300"
|
||||
variant="Background"
|
||||
aria-label="Create section"
|
||||
>
|
||||
<Icon size="100" src={Icons.Plus} />
|
||||
</IconButton>
|
||||
}
|
||||
/>
|
||||
{newSectionError && (
|
||||
<Text size="T200" style={{ color: color.Critical.Main }}>
|
||||
{newSectionError}
|
||||
</Text>
|
||||
)}
|
||||
</Box>
|
||||
</Box>
|
||||
</Menu>
|
||||
</FocusTrap>
|
||||
}
|
||||
>
|
||||
<MenuItem
|
||||
size="300"
|
||||
after={<Icon size="100" src={Icons.ChevronRight} />}
|
||||
radii="300"
|
||||
aria-pressed={!!sectionMenuAnchor}
|
||||
aria-haspopup="menu"
|
||||
onClick={(e) => setSectionMenuAnchor(e.currentTarget.getBoundingClientRect())}
|
||||
>
|
||||
<Text style={{ flexGrow: 1 }} as="span" size="T300" truncate>
|
||||
{roomSections.length > 0
|
||||
? `Sections: ${roomSections.join(', ')}`
|
||||
: 'Add to Section'}
|
||||
</Text>
|
||||
</MenuItem>
|
||||
</PopOut>
|
||||
<MenuItem
|
||||
onClick={handleInvite}
|
||||
variant="Primary"
|
||||
@@ -639,6 +751,7 @@ function RoomNavItem_({
|
||||
|
||||
const roomName = useLocalRoomName(room);
|
||||
const hasLocalName = useHasLocalRoomName(room.roomId);
|
||||
const { prefs } = useTimestampFormatter();
|
||||
|
||||
// Whether this room has an unsent message draft. selectAtom maps to a boolean
|
||||
// so the row only re-renders when that flips (the draft atom itself is written
|
||||
@@ -670,7 +783,7 @@ function RoomNavItem_({
|
||||
}
|
||||
if (!body) return null;
|
||||
const preview = body.length > PREVIEW_MAX_CHARS ? `${body.slice(0, PREVIEW_MAX_CHARS)}…` : body;
|
||||
return { preview, time: formatDmTimestamp(ts) };
|
||||
return { preview, time: formatShortAge(ts, prefs) };
|
||||
})();
|
||||
|
||||
const handleContextMenu: MouseEventHandler<HTMLElement> = (evt) => {
|
||||
@@ -690,6 +803,14 @@ function RoomNavItem_({
|
||||
const optionsVisible = hover || !!menuAnchor;
|
||||
const callSession = useCallSession(room);
|
||||
const callMembers = useCallMembers(callSession);
|
||||
const liveNames = useMemo(() => {
|
||||
const names = Array.from(
|
||||
new Set(callMembers.map((m) => m.sender).filter((u): u is string => !!u)),
|
||||
).map((u) => getMemberName(room, u));
|
||||
const shown = names.slice(0, 6);
|
||||
const more = names.length - shown.length;
|
||||
return more > 0 ? `${shown.join(', ')} and ${more} more` : shown.join(', ');
|
||||
}, [callMembers, room]);
|
||||
const startCall = useCallStart(direct);
|
||||
const callEmbed = useCallEmbed();
|
||||
// [Gitea #30] Same voice-limit check the call prescreen uses, so the sidebar
|
||||
@@ -853,11 +974,32 @@ function RoomNavItem_({
|
||||
/>
|
||||
)}
|
||||
{callMembers.length > 0 && (
|
||||
<Badge variant="Critical" fill="Solid" size="400">
|
||||
<Text as="span" size="L400" truncate>
|
||||
{callMembers.length} Live
|
||||
</Text>
|
||||
</Badge>
|
||||
// [Gitea #157] The count alone doesn't tell you whether it's your
|
||||
// squad — name the people on hover/focus (long-press on touch).
|
||||
<TooltipProvider
|
||||
position="Right"
|
||||
delay={300}
|
||||
tooltip={
|
||||
<Tooltip>
|
||||
<Text size="T200">{liveNames}</Text>
|
||||
</Tooltip>
|
||||
}
|
||||
>
|
||||
{(tipRef) => (
|
||||
<Badge
|
||||
ref={tipRef}
|
||||
variant="Critical"
|
||||
fill="Solid"
|
||||
size="400"
|
||||
tabIndex={0}
|
||||
aria-label={`${callMembers.length} in call: ${liveNames}`}
|
||||
>
|
||||
<Text as="span" size="L400" truncate>
|
||||
{callMembers.length} Live
|
||||
</Text>
|
||||
</Badge>
|
||||
)}
|
||||
</TooltipProvider>
|
||||
)}
|
||||
</Box>
|
||||
</NavItemContent>
|
||||
|
||||
@@ -4,6 +4,7 @@ import { EventType } from 'matrix-js-sdk';
|
||||
import { Page, PageContent, PageHeader } from '../../components/page';
|
||||
import { useMatrixClient } from '../../hooks/useMatrixClient';
|
||||
import { useRoom } from '../../hooks/useRoom';
|
||||
import { createDetachedTimelineSet } from '../../utils/detachedTimeline';
|
||||
import { useRoomName } from '../../hooks/useRoomMeta';
|
||||
import { SequenceCard } from '../../components/sequence-card';
|
||||
import { SequenceCardStyle } from '../common-settings/styles.css';
|
||||
@@ -73,7 +74,10 @@ export function ExportRoomHistory({ requestClose }: ExportRoomHistoryProps) {
|
||||
// so we must deduplicate by eventId to avoid re-adding the same events
|
||||
// on each pagination step.
|
||||
const seen = new Set<string>();
|
||||
const timeline = room.getLiveTimeline();
|
||||
// [Gitea #163] Paginate a private timeline set, not the live one: the
|
||||
// export can pull thousands of events and the room behind this modal
|
||||
// renders the live timeline by index.
|
||||
const timeline = createDetachedTimelineSet(mx, room).set.getLiveTimeline();
|
||||
let canLoadMore = true;
|
||||
// Track the oldest collected timestamp incrementally so the fromTs check
|
||||
// doesn't rescan the whole `collected` array on every pagination step.
|
||||
|
||||
@@ -1,9 +1,16 @@
|
||||
import React, { useCallback, useEffect, useState } from 'react';
|
||||
import React, { useCallback, useEffect, useMemo, useState } from 'react';
|
||||
import { Box, Button, Icon, IconButton, Icons, Scroll, Spinner, Text, color, config } from 'folds';
|
||||
import { MatrixEvent } from 'matrix-js-sdk';
|
||||
import { Page, PageContent, PageHeader } from '../../components/page';
|
||||
import { useMatrixClient } from '../../hooks/useMatrixClient';
|
||||
import { useRoom } from '../../hooks/useRoom';
|
||||
import {
|
||||
collectTimelineEvents,
|
||||
createDetachedTimelineSet,
|
||||
createTypesFilter,
|
||||
} from '../../utils/detachedTimeline';
|
||||
import { useTimestampFormatter } from '../../hooks/useTimestampFormatter';
|
||||
import { formatRelativeAge } from '../../utils/formatTimestamp';
|
||||
|
||||
// ── Types ─────────────────────────────────────────────────────────────────────
|
||||
|
||||
@@ -22,20 +29,6 @@ type StateEventType = (typeof STATE_EVENT_TYPES)[number];
|
||||
|
||||
// ── Timestamp formatting ──────────────────────────────────────────────────────
|
||||
|
||||
function formatRelativeTs(ts: number): string {
|
||||
const diff = Date.now() - ts;
|
||||
if (diff < 60000) return 'just now';
|
||||
if (diff < 3600000) return `${Math.floor(diff / 60000)}m ago`;
|
||||
if (diff < 86400000) return `${Math.floor(diff / 3600000)}h ago`;
|
||||
const d = new Date(ts);
|
||||
const sameYear = d.getFullYear() === new Date().getFullYear();
|
||||
return d.toLocaleDateString('en-US', {
|
||||
month: 'short',
|
||||
day: 'numeric',
|
||||
...(sameYear ? {} : { year: 'numeric' }),
|
||||
});
|
||||
}
|
||||
|
||||
// ── Event description ─────────────────────────────────────────────────────────
|
||||
|
||||
function getDisplayName(mx: ReturnType<typeof useMatrixClient>, userId: string): string {
|
||||
@@ -291,6 +284,7 @@ type LogEntryProps = {
|
||||
};
|
||||
|
||||
function LogEntry({ ev, desc }: LogEntryProps) {
|
||||
const { prefs } = useTimestampFormatter();
|
||||
return (
|
||||
<Box
|
||||
alignItems="Center"
|
||||
@@ -321,7 +315,7 @@ function LogEntry({ ev, desc }: LogEntryProps) {
|
||||
{desc.text}
|
||||
</Text>
|
||||
<Text size="T200" priority="300">
|
||||
{formatRelativeTs(ev.getTs())}
|
||||
{formatRelativeAge(ev.getTs(), prefs)}
|
||||
</Text>
|
||||
</Box>
|
||||
</Box>
|
||||
@@ -343,15 +337,23 @@ export function RoomActivityLog({ requestClose }: RoomActivityLogProps) {
|
||||
const [hasLoadedOnce, setHasLoadedOnce] = useState(false);
|
||||
const [canLoadMore, setCanLoadMore] = useState(true);
|
||||
|
||||
// [Gitea #163] Page through a detached, type-filtered timeline set: the
|
||||
// live timeline (rendered by index behind this modal) must not be mutated.
|
||||
const detached = useMemo(
|
||||
() =>
|
||||
createDetachedTimelineSet(mx, room, {
|
||||
filter: createTypesFilter(mx.getSafeUserId(), STATE_EVENT_TYPES, 'io.lotus.activity'),
|
||||
filterSafeWhenEncrypted: true,
|
||||
}),
|
||||
[mx, room],
|
||||
);
|
||||
|
||||
const getStateEvents = useCallback((): MatrixEvent[] => {
|
||||
const typeSet = new Set<string>(STATE_EVENT_TYPES);
|
||||
return room
|
||||
.getLiveTimeline()
|
||||
.getEvents()
|
||||
return collectTimelineEvents(detached.set.getLiveTimeline())
|
||||
.filter((ev) => typeSet.has(ev.getType()) && !ev.isRedacted())
|
||||
.slice()
|
||||
.reverse();
|
||||
}, [room]);
|
||||
}, [detached]);
|
||||
|
||||
const [events, setEvents] = useState<MatrixEvent[]>(() => getStateEvents());
|
||||
|
||||
@@ -363,7 +365,7 @@ export function RoomActivityLog({ requestClose }: RoomActivityLogProps) {
|
||||
if (loading || !canLoadMore) return;
|
||||
setLoading(true);
|
||||
try {
|
||||
const hasMore = await mx.paginateEventTimeline(room.getLiveTimeline(), {
|
||||
const hasMore = await mx.paginateEventTimeline(detached.set.getLiveTimeline(), {
|
||||
backwards: true,
|
||||
limit: 50,
|
||||
});
|
||||
@@ -375,7 +377,7 @@ export function RoomActivityLog({ requestClose }: RoomActivityLogProps) {
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
}, [loading, canLoadMore, mx, room, getStateEvents]);
|
||||
}, [loading, canLoadMore, mx, detached, getStateEvents]);
|
||||
|
||||
// Auto-paginate on mount — state events are rarely in the initial sync
|
||||
// window, so we immediately fetch backwards to populate the log.
|
||||
|
||||
@@ -9,21 +9,10 @@ import { useMediaAuthentication } from '../../hooks/useMediaAuthentication';
|
||||
import { getMemberAvatarMxc, getMemberName } from '../../utils/room';
|
||||
import { mxcUrlToHttp } from '../../utils/matrix';
|
||||
import { UserAvatar } from '../../components/user-avatar';
|
||||
import { useTimestampFormatter } from '../../hooks/useTimestampFormatter';
|
||||
|
||||
// ── Helpers ───────────────────────────────────────────────────────────────────
|
||||
|
||||
function formatDate(ts: number): string {
|
||||
return new Date(ts).toLocaleDateString(undefined, {
|
||||
month: 'short',
|
||||
day: 'numeric',
|
||||
year: 'numeric',
|
||||
});
|
||||
}
|
||||
|
||||
function formatUpdatedAt(ts: number): string {
|
||||
return new Date(ts).toLocaleTimeString(undefined, { hour: 'numeric', minute: '2-digit' });
|
||||
}
|
||||
|
||||
// Throttle window for re-computing stats on new timeline events - avoids
|
||||
// re-running every heatmap/list computation on every single incoming message
|
||||
// during a burst.
|
||||
@@ -74,6 +63,7 @@ type RoomInsightsProps = {
|
||||
};
|
||||
|
||||
export function RoomInsights({ requestClose }: RoomInsightsProps) {
|
||||
const { format } = useTimestampFormatter();
|
||||
const mx = useMatrixClient();
|
||||
const room = useRoom();
|
||||
const useAuthentication = useMediaAuthentication();
|
||||
@@ -234,11 +224,11 @@ export function RoomInsights({ requestClose }: RoomInsightsProps) {
|
||||
</Text>
|
||||
{stats.oldestTs !== null && stats.newestTs !== null && (
|
||||
<Text size="T200" priority="300">
|
||||
from {formatDate(stats.oldestTs)} to {formatDate(stats.newestTs)}
|
||||
from {format(stats.oldestTs, 'date')} to {format(stats.newestTs, 'date')}
|
||||
</Text>
|
||||
)}
|
||||
<Text size="T200" priority="300">
|
||||
Last updated {formatUpdatedAt(lastUpdated)}
|
||||
Last updated {format(lastUpdated, 'time')}
|
||||
</Text>
|
||||
</Box>
|
||||
<Box shrink="No">
|
||||
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user