chore(deps): pin @lotusguild/element-call-embedded 0.25.0-lotus.27 (#265, #277)

lotus.27 reports remote screenshare audio (element-call#57) and keeps
your own tile on phones with the camera off (element-call#58).

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_017PCb59uY3UKqDqt7B6hzd5

.gitleaks.toml

@@ -12,6 +12,9 @@ regexes = [
   '''https?://matrix\.lotusguild\.org''',
   '''https?://code\.lotusguild\.org/api/packages/LotusGuild/npm/''',
   '''matrix\.lotusguild\.org''',
+  # Lotus Chat desktop updater's minisign PUBLIC key (published in the
+  # cinny-desktop README); utils/updateErrors.ts verifies Linux downloads with it.
+  '''RWRZZdyii05/NUcz337A5SAbiZK\+NPVDWuiL2mM5Jk1p/LfRmNfiZ/6l''',
 ]
 paths = [
   '''config\.json''',

LOTUS_FEATURES.md

@@ -233,7 +233,7 @@ All decoration files are 256×256 APNGs. They animate natively in all modern bro
 Decoration preference is stored in the public Matrix profile field `io.lotus.avatar_decoration` (a slug string, e.g. `lotus_flower`). Any Lotus Chat user viewing your profile sees your current decoration.
 
 **CDN:**
-Files are self-hosted on the Lotus Nextcloud instance. Direct access: `https://drive.lotusguild.org/public.php/dav/files/{token}/cinny-decorations/{slug}.png`. `<img>` elements load cross-origin freely — no CORS headers needed.
+Static files at `https://chat.lotusguild.org/decorations/{slug}.png` (thumbnails: `thumbs/{slug}.webp`), cached for a week. They come from the versioned `avatar-decorations` package in Gitea's package registry, installed by the matrix repo's LXC 106 deploy (see its README, "Avatar decorations"). To add or replace decorations, publish a new package version there, then update the catalog in `avatarDecorations.ts`. They used to be served from Nextcloud (matrix #22). `<img>` elements load cross-origin freely, so no CORS headers are needed.
 
 **Module-level cache with in-flight deduplication:**
 `useAvatarDecoration(userId)` fetches the profile field once per user per session. A `Map<userId, slug|null>` cache prevents redundant requests; a second `pending` waiters map ensures multiple components requesting the same userId simultaneously share one HTTP request rather than firing duplicates.

e2e/a11y.spec.ts

@@ -118,8 +118,26 @@ test.describe('accessibility', () => {
     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();
+      // [Gitea #278] The dialog has an accessible name.
+      await expect(page.getByRole('dialog', { name: 'A11y Room settings' })).toBeVisible();
       await auditPage(page, 'room settings');
+      // [Gitea #278] aria-selected on the power chips, unlabelled pack name and
+      // export date inputs were only on these pages.
+      // One page at a time, in order.
+      for (const name of ['Permissions', 'Emojis & Stickers', 'Export']) {
+        // eslint-disable-next-line no-await-in-loop
+        await page.getByRole('dialog').getByText(name, { exact: true }).first().click();
+        // eslint-disable-next-line no-await-in-loop
+        await page.waitForTimeout(1000);
+        // eslint-disable-next-line no-await-in-loop
+        await auditPage(page, `room settings: ${name}`);
+      }
+    });
+
+    test('inbox invites', async ({ page }) => {
+      await page.goto('/inbox/invites/');
+      await expect(page.getByRole('button', { name: /Known|Unknown|Spam/ }).first()).toBeVisible();
+      await auditPage(page, 'inbox invites');
     });
   });
 });

e2e/local-homeserver.spec.ts

@@ -265,6 +265,46 @@ test.describe('local homeserver regression', () => {
     await expect.poll(threadUnread).toBe(false);
   });
 
+  test("a thread I don't follow stays unread while I view the room (#314)", async ({ page }) => {
+    const room = await createRoom(alice, 'Unfollowed Thread Room', { invite: [bob.userId] });
+    await joinRoom(bob, room);
+    const inThread = (root: string) => ({
+      'm.relates_to': {
+        rel_type: 'm.thread',
+        event_id: root,
+        is_falling_back: true,
+        'm.in_reply_to': { event_id: root },
+      },
+    });
+    const root = await sendText(bob, room, "bob's thread root");
+    await loginUI(page, alice);
+    await openRoom(page, room);
+    await sendText(bob, room, 'reply in bob thread', inThread(root));
+    await sendText(bob, room, 'newer main message 314');
+    await expect(page.getByText('newer main message 314')).toBeVisible();
+    const threadUnread = async () => {
+      const filter = {
+        room: {
+          rooms: [room],
+          timeline: { limit: 1, unread_thread_notifications: true, not_types: [uniq('x.')] },
+        },
+      };
+      const sync = await api<{
+        rooms: {
+          join: Record<string, { unread_thread_notifications?: Record<string, unknown> }>;
+        };
+      }>(
+        'GET',
+        `/_matrix/client/v3/sync?timeout=0&filter=${enc(JSON.stringify(filter))}`,
+        alice.token,
+      );
+      return root in (sync.rooms.join[room]?.unread_thread_notifications ?? {});
+    };
+    await page.waitForTimeout(2000); // let any receipt the room view would send go out
+    // Viewing the room used to read every thread you don't follow (#314).
+    expect(await threadUnread()).toBe(true);
+  });
+
   test('timeline image opens the gallery lightbox (#219) @webkit', async ({ page }) => {
     const room = await createRoom(alice, 'Lightbox Room');
     const png = Buffer.from(

package-lock.json

@@ -81,7 +81,7 @@
       },
       "devDependencies": {
         "@axe-core/playwright": "4.13.0",
-        "@lotusguild/element-call-embedded": "0.25.0-lotus.23",
+        "@lotusguild/element-call-embedded": "0.25.0-lotus.27",
         "@playwright/test": "1.63.0",
         "@rollup/plugin-inject": "5.0.5",
         "@rollup/plugin-wasm": "6.2.2",
@@ -2695,9 +2695,9 @@
       "integrity": "sha512-dfLbk+PwWvFzSxwk3n5ySL0hfBog779o8h68wK/7/APo/7cgyWp5jcXockbxdk5kFRkbeXWm4Fbi9FrdN381sA=="
     },
     "node_modules/@lotusguild/element-call-embedded": {
-      "version": "0.25.0-lotus.23",
-      "resolved": "https://code.lotusguild.org/api/packages/LotusGuild/npm/%40lotusguild%2Felement-call-embedded/-/0.25.0-lotus.23/element-call-embedded-0.25.0-lotus.23.tgz",
-      "integrity": "sha512-vRmcWeJcU0Accyl2x3mqNEzrIe8djE5BekyYbYOSCsMflC98rZgD1mO7KOe7bA1cX7gparRf6sAt1fotHoU+bA==",
+      "version": "0.25.0-lotus.27",
+      "resolved": "https://code.lotusguild.org/api/packages/LotusGuild/npm/%40lotusguild%2Felement-call-embedded/-/0.25.0-lotus.27/element-call-embedded-0.25.0-lotus.27.tgz",
+      "integrity": "sha512-24ZAvGR/t0C6LWFygZkvtk7HalPUvjERDWWkxpJJf4AZCDOJGuhoOuBrjmO+tUGwIrgLOTN6EFAWSaPpTU9rlQ==",
       "dev": true
     },
     "node_modules/@matrix-org/matrix-sdk-crypto-wasm": {

package.json

@@ -108,7 +108,7 @@
   },
   "devDependencies": {
     "@axe-core/playwright": "4.13.0",
-    "@lotusguild/element-call-embedded": "0.25.0-lotus.23",
+    "@lotusguild/element-call-embedded": "0.25.0-lotus.27",
     "@playwright/test": "1.63.0",
     "@rollup/plugin-inject": "5.0.5",
     "@rollup/plugin-wasm": "6.2.2",

src/app/components/CallEmbedProvider.tsx

@@ -86,6 +86,7 @@ import { CallAvatarAnimation } from '../styles/Animations.css';
 import { webRTCSupported } from '../utils/rtc';
 import { CallsUnavailableMessage } from '../features/call/CallsUnavailable';
 import { zIndices } from '../styles/zIndex';
+import { useReconnectWhenSynced } from '../hooks/useCallError';
 import { useDenoiseNotices } from '../hooks/useDenoiseNotices';
 
 const PIP_MIN_W = 200;
@@ -817,6 +818,7 @@ function CallUtils({ embed, joined }: { embed: CallEmbed; joined: boolean }) {
   useCallPolicyRevokedToast(embed, joined);
   useCallEndedToast(embed);
   useScreenshareNotices(embed);
+  useReconnectWhenSynced(embed.control);
   useDenoiseNotices(embed);
   // [Gitea #43] The in-frame screenshare button follows the same room policy
   // as the host bar's (hidden where the server would refuse the share).

src/app/components/ManualVerification.tsx

@@ -82,7 +82,7 @@ export function ManualVerificationMethodSwitcher({
                 <MenuItem
                   size="300"
                   variant="Surface"
-                  aria-selected={value === ManualVerificationMethod.RecoveryPassphrase}
+                  aria-pressed={value === ManualVerificationMethod.RecoveryPassphrase}
                   radii="300"
                   onClick={() => handleSelect(ManualVerificationMethod.RecoveryPassphrase)}
                 >
@@ -93,7 +93,7 @@ export function ManualVerificationMethodSwitcher({
                 <MenuItem
                   size="300"
                   variant="Surface"
-                  aria-selected={value === ManualVerificationMethod.RecoveryKey}
+                  aria-pressed={value === ManualVerificationMethod.RecoveryKey}
                   radii="300"
                   onClick={() => handleSelect(ManualVerificationMethod.RecoveryKey)}
                 >

src/app/components/Modal500.tsx

@@ -7,8 +7,10 @@ import { ScreenSize, useScreenSizeContext } from '../hooks/useScreenSize';
 type Modal500Props = {
   requestClose: () => void;
   children: ReactNode;
+  /** [Gitea #278] The dialog's accessible name (role="dialog" needs one). */
+  label: string;
 };
-export function Modal500({ requestClose, children }: Modal500Props) {
+export function Modal500({ requestClose, children, label }: Modal500Props) {
   const isMobile = useScreenSizeContext() === ScreenSize.Mobile;
   return (
     <Overlay open backdrop={<OverlayBackdrop />}>
@@ -26,6 +28,7 @@ export function Modal500({ requestClose, children }: Modal500Props) {
             variant="Background"
             role="dialog"
             aria-modal="true"
+            aria-label={label}
             // 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.

src/app/components/editor/Editor.tsx

@@ -117,7 +117,14 @@ export const CustomEditor = forwardRef<HTMLDivElement, CustomEditorProps>(
 
     const renderPlaceholder = useCallback(
       ({ attributes, children }: RenderPlaceholderProps) => (
-        <span {...attributes} className={css.EditorPlaceholderContainer}>
+        <span
+          {...attributes}
+          // [Gitea #278] Slate puts an inline `opacity: 0.333` on the placeholder,
+          // which beat EditorPlaceholderContainer's AA-contrast opacity (#222):
+          // measured 2.66:1. Drop it so the class decides.
+          style={{ ...attributes.style, opacity: undefined }}
+          className={css.EditorPlaceholderContainer}
+        >
           {/* Inner component to style the actual text position and appearance */}
           <Text as="span" className={css.EditorPlaceholderTextVisual} truncate>
             {children}

src/app/components/image-pack-view/UsageSwitcher.tsx

@@ -39,7 +39,7 @@ export function UsageSelector({ selected, onChange }: UsageSelectorProps) {
           key={getUsageStr(usage)}
           size="300"
           variant={isSelected(usage) ? 'SurfaceVariant' : 'Surface'}
-          aria-selected={isSelected(usage)}
+          aria-pressed={isSelected(usage)}
           radii="300"
           onClick={() => onChange(usage)}
         >

src/app/components/presence/Presence.tsx

@@ -13,11 +13,13 @@ import {
 import React, { ReactNode } from 'react';
 import * as css from './styles.css';
 import { Presence, usePresenceLabel } from '../../hooks/useUserPresence';
+import { isDndPresence } from '../../utils/busyPresence';
 
 const PresenceToColor: Record<Presence, MainColor> = {
   [Presence.Online]: 'Success',
   [Presence.Unavailable]: 'Warning',
   [Presence.Offline]: 'Secondary',
+  [Presence.Busy]: 'Critical',
 };
 
 type PresenceBadgeProps = {
@@ -31,9 +33,11 @@ export function PresenceBadge({ presence, status, size }: PresenceBadgeProps) {
   // Disturb" to match PresenceRingAvatar and the settings picker (which both
   // special-case 'dnd' → Critical) — the badge was the lone outlier showing a
   // yellow "Idle". The 'dnd' sentinel isn't surfaced as a status line.
-  const isDnd = presence === Presence.Unavailable && status === 'dnd';
+  // [Gitea #283] or MSC3026 busy, which keeps a real status line.
+  const isDnd = isDndPresence(presence, status);
+  const legacyDnd = isDnd && status === 'dnd';
   const displayLabel = isDnd ? 'Do Not Disturb' : label[presence];
-  const displayStatus = isDnd ? undefined : status;
+  const displayStatus = legacyDnd ? undefined : status;
   const ariaLabel = displayStatus ? `${displayLabel} — ${displayStatus}` : displayLabel;
 
   return (

src/app/components/presence/PresenceRingAvatar.tsx

@@ -4,6 +4,7 @@ import { Presence, useUserPresence } from '../../hooks/useUserPresence';
 
 function presenceRingColor(presence: Presence | undefined, status?: string): string | null {
   if (!presence || presence === Presence.Offline) return null;
+  if (presence === Presence.Busy) return color.Critical.Main; // [Gitea #283] DND
   if (presence === Presence.Unavailable) {
     return status === 'dnd' ? color.Critical.Main : color.Warning.Main;
   }

src/app/components/setting-tile/SettingTile.tsx

@@ -34,7 +34,8 @@ export function SettingTile({ title, description, before, after, children }: Set
   });
 
   return (
-    <Box alignItems="Center" gap="300">
+    // data-setting-tile: lets a group card draw dividers between tiles only (#273).
+    <Box alignItems="Center" gap="300" data-setting-tile="">
       {before && <Box shrink="No">{before}</Box>}
       <Box grow="Yes" direction="Column" gap="100">
         {title && (

src/app/components/time-date/DatePicker.tsx

@@ -69,7 +69,7 @@ export const DatePicker = forwardRef<HTMLDivElement, DatePickerProps>(
                   variant={selectedDay === day ? 'Primary' : 'SurfaceVariant'}
                   fill="None"
                   radii="300"
-                  aria-selected={selectedDay === day}
+                  aria-pressed={selectedDay === day}
                   onClick={() => handleDay(day)}
                   disabled={
                     (selectedYear === minYear && selectedMonth === minMonth && day < minDay) ||
@@ -90,7 +90,7 @@ export const DatePicker = forwardRef<HTMLDivElement, DatePickerProps>(
                   variant={selectedMonth === month ? 'Primary' : 'SurfaceVariant'}
                   fill="None"
                   radii="300"
-                  aria-selected={selectedMonth === month}
+                  aria-pressed={selectedMonth === month}
                   onClick={() => handleMonth(month)}
                   disabled={
                     (selectedYear === minYear && month < minMonth) ||
@@ -115,7 +115,7 @@ export const DatePicker = forwardRef<HTMLDivElement, DatePickerProps>(
                   variant={selectedYear === year ? 'Primary' : 'SurfaceVariant'}
                   fill="None"
                   radii="300"
-                  aria-selected={selectedYear === year}
+                  aria-pressed={selectedYear === year}
                   onClick={() => handleYear(year)}
                 >
                   <Text size="T300">{year}</Text>

src/app/components/time-date/TimePicker.tsx

@@ -71,7 +71,7 @@ export const TimePicker = forwardRef<HTMLDivElement, TimePickerProps>(
                     variant={hour === selectedHour ? 'Primary' : 'Background'}
                     fill="None"
                     radii="300"
-                    aria-selected={hour === selectedHour}
+                    aria-pressed={hour === selectedHour}
                     onClick={() => handleHour(hour)}
                     disabled={(minDay && hour < minHour24) || (maxDay && hour > maxHour24)}
                   >
@@ -90,7 +90,7 @@ export const TimePicker = forwardRef<HTMLDivElement, TimePickerProps>(
                       variant={hour === selectedHour ? 'Primary' : 'Background'}
                       fill="None"
                       radii="300"
-                      aria-selected={hour === selectedHour}
+                      aria-pressed={hour === selectedHour}
                       onClick={() => handleHour(hour)}
                       disabled={
                         (minDay && hour12to24(hour, selectedPM) < minHour24) ||
@@ -109,7 +109,7 @@ export const TimePicker = forwardRef<HTMLDivElement, TimePickerProps>(
                 variant={minute === selectedMinute ? 'Primary' : 'Background'}
                 fill="None"
                 radii="300"
-                aria-selected={minute === selectedMinute}
+                aria-pressed={minute === selectedMinute}
                 onClick={() => handleMinute(minute)}
                 disabled={
                   (minDay && hour24 === minHour24 && minute < minMinute) ||
@@ -127,7 +127,7 @@ export const TimePicker = forwardRef<HTMLDivElement, TimePickerProps>(
                 variant={!selectedPM ? 'Primary' : 'SurfaceVariant'}
                 fill="None"
                 radii="300"
-                aria-selected={!selectedPM}
+                aria-pressed={!selectedPM}
                 onClick={() => handlePeriod(false)}
                 disabled={minDay && minPM}
               >
@@ -138,7 +138,7 @@ export const TimePicker = forwardRef<HTMLDivElement, TimePickerProps>(
                 variant={selectedPM ? 'Primary' : 'SurfaceVariant'}
                 fill="None"
                 radii="300"
-                aria-selected={selectedPM}
+                aria-pressed={selectedPM}
                 onClick={() => handlePeriod(true)}
                 disabled={maxDay && !maxPM}
               >

src/app/components/user-avatar/UserAvatar.tsx

@@ -33,7 +33,9 @@ export function UserAvatar({ className, userId, src, alt, renderFallback }: User
     <AvatarImage
       className={classNames(css.UserAvatar, className)}
       src={src}
-      alt={alt}
+      // [Gitea #278] An avatar sits next to the person's name or inside a
+      // labelled button, so without an explicit alt it is decorative.
+      alt={alt ?? ''}
       onError={() => setError(true)}
       onLoad={handleLoad}
       draggable={false}

src/app/components/user-profile/UserRoomProfile.tsx

@@ -286,10 +286,11 @@ function UserPrivateNotes({ userId }: { userId: string }) {
       </Box>
       <textarea
         aria-label="Private note about this user"
+        aria-describedby="private-note-storage"
         value={draft}
         onChange={handleChange}
         maxLength={USER_NOTE_MAX_LENGTH}
-        placeholder="Notes only visible to you…"
+        placeholder="Add a private note…"
         rows={3}
         style={{
           width: '100%',
@@ -305,6 +306,11 @@ function UserPrivateNotes({ userId }: { userId: string }) {
           outline: 'none',
         }}
       />
+      {/* [Gitea #329] Account data isn't end-to-end encrypted: say so. */}
+      <Text id="private-note-storage" size="T200" priority="300">
+        Only you can see this in Lotus Chat. It&apos;s stored on your homeserver and isn&apos;t
+        end-to-end encrypted.
+      </Text>
     </Box>
   );
 }

src/app/features/bookmarks/BookmarksPanel.css.ts

@@ -1,10 +1,11 @@
 import { style } from '@vanilla-extract/css';
-import { config, toRem } from 'folds';
+import { config } from 'folds';
+import { SIDE_PANEL_WIDTH } from '../../styles/sidePanel';
 
-// Mirrors MembersDrawer: a 266px side panel on desktop that becomes a
+// Mirrors MembersDrawer: a side panel (shared width) on desktop that becomes a
 // full-screen fixed panel on narrow viewports — the app's canonical drawer.
 export const BookmarksPanel = style({
-  width: toRem(266),
+  width: SIDE_PANEL_WIDTH,
   '@media': {
     '(max-width: 750px)': {
       position: 'fixed',

src/app/features/call-status/AudioOutputButton.tsx

@@ -16,6 +16,7 @@ import {
   toRem,
 } from 'folds';
 import { CallEmbed } from '../../plugins/call';
+import { AUDIO_OUTPUT_STATE } from '../../plugins/call/CallControl';
 import { MobileTouchTarget } from '../../styles/mobile.css';
 import { stopPropagation } from '../../utils/keyboard';
 
@@ -39,6 +40,21 @@ export function AudioOutputButton({ embed, disabled }: { embed: CallEmbed; disab
   const [devices, setDevices] = useState<OutputDevice[]>([]);
   const [selected, setSelected] = useState<string | undefined>(embed.control.audioOutputId);
 
+  // [Gitea #310] Prefer the fork's list: its ids are the ones valid inside
+  // the call iframe. Older forks don't report one; fall back to our own.
+  const [forkDevices, setForkDevices] = useState(embed.control.audioOutputs);
+  useEffect(() => {
+    const onState = () => {
+      setForkDevices(embed.control.audioOutputs);
+      setSelected(embed.control.audioOutputId);
+    };
+    onState();
+    embed.control.on(AUDIO_OUTPUT_STATE, onState);
+    return () => {
+      embed.control.off(AUDIO_OUTPUT_STATE, onState);
+    };
+  }, [embed]);
+
   const refresh = useCallback(async () => {
     try {
       const all = await navigator.mediaDevices.enumerateDevices();
@@ -53,11 +69,13 @@ export function AudioOutputButton({ embed, disabled }: { embed: CallEmbed; disab
   }, []);
 
   useEffect(() => {
-    if (!anchor) return undefined;
+    if (!anchor || forkDevices) return undefined;
     refresh();
     navigator.mediaDevices.addEventListener('devicechange', refresh);
     return () => navigator.mediaDevices.removeEventListener('devicechange', refresh);
-  }, [anchor, refresh]);
+  }, [anchor, refresh, forkDevices]);
+
+  const shown = forkDevices ?? devices;
 
   const choose = (id: string) => {
     embed.control.setAudioOutput(id);
@@ -90,13 +108,14 @@ export function AudioOutputButton({ embed, disabled }: { embed: CallEmbed; disab
             aria-label="Audio output"
           >
             <Box direction="Column" gap="100" style={{ padding: config.space.S100 }}>
-              {devices.length === 0 && (
+              {shown.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';
+              {shown.map((d) => {
+                const isSelected =
+                  selected !== undefined ? d.id === selected : d.id === 'default' || d.id === '';
                 return (
                   <MenuItem
                     key={d.id}

src/app/features/call-status/CallStatus.tsx

@@ -1,5 +1,5 @@
 import React, { useMemo } from 'react';
-import { Box, Spinner, Text, color } from 'folds';
+import { Box, Button, Spinner, Text, color } from 'folds';
 import { useAtomValue } from 'jotai';
 import classNames from 'classnames';
 import { LiveChip } from './LiveChip';
@@ -18,6 +18,7 @@ import { useMatrixClient } from '../../hooks/useMatrixClient';
 import { MemberSpeaking } from './MemberSpeaking';
 import { clockSkewAtom } from '../../state/clockSkew';
 import { describeSkewVsServer } from '../../utils/clockSkew';
+import { useCallError } from '../../hooks/useCallError';
 
 type CallStatusProps = {
   callEmbed: CallEmbed;
@@ -42,6 +43,8 @@ export function CallStatus({ callEmbed }: CallStatusProps) {
   const clockSkew = useAtomValue(clockSkewAtom);
 
   const compact = screenSize === ScreenSize.Mobile;
+  // [Gitea #318] The call dropped ("Connection lost" in the frame).
+  const callError = useCallError(callEmbed.control);
 
   const memberVisible = callJoined && callMembers.length > 0;
 
@@ -65,6 +68,25 @@ export function CallStatus({ callEmbed }: CallStatusProps) {
           {!compact && (
             <>
               <CallRoomName room={room} />
+              {callError && (
+                <>
+                  <StatusDivider />
+                  <Text size="T200" truncate role="alert" style={{ color: color.Critical.Main }}>
+                    Call disconnected
+                  </Text>
+                  {callError.recoverable && (
+                    <Button
+                      size="300"
+                      radii="300"
+                      variant="Critical"
+                      fill="Soft"
+                      onClick={() => callEmbed.control.reconnect()}
+                    >
+                      <Text size="B300">Reconnect</Text>
+                    </Button>
+                  )}
+                </>
+              )}
               {clockSkew.warning && clockSkew.skewMs !== null && (
                 <>
                   <StatusDivider />
@@ -102,8 +124,19 @@ export function CallStatus({ callEmbed }: CallStatusProps) {
       {memberVisible && !compact && <StatusDivider />}
       <Box shrink="No" alignItems="Center" gap="Inherit">
         {compact && (
-          <Box grow="Yes">
+          <Box grow="Yes" alignItems="Center" gap="200">
             <CallRoomName room={room} />
+            {callError?.recoverable && (
+              <Button
+                size="300"
+                radii="300"
+                variant="Critical"
+                fill="Soft"
+                onClick={() => callEmbed.control.reconnect()}
+              >
+                <Text size="B300">Reconnect</Text>
+              </Button>
+            )}
           </Box>
         )}
         <CallControl callJoined={callJoined} compact={compact} callEmbed={callEmbed} />

src/app/features/call/CallControls.tsx

@@ -44,6 +44,7 @@ import { stopPropagation } from '../../utils/keyboard';
 import { AsyncStatus, useAsyncCallback } from '../../hooks/useAsyncCallback';
 import { useCallEmbedRef } from '../../hooks/useCallEmbed';
 import { pttActiveAtom } from '../../hooks/useCallHotkeys';
+import { SCREENSHARE_AUDIO_STATE } from '../../plugins/call/CallControl';
 import { CallSoundboard } from './CallSoundboard';
 import { useRoomCallPolicy } from '../../hooks/useRoomCallPolicy';
 import { ScreenshareConfirm } from './ScreenshareConfirm';
@@ -90,6 +91,21 @@ export function CallControls({ callEmbed }: CallControlsProps) {
 
   const { microphone, video, sound, screenshare, spotlight, screenshareAudioMuted } =
     useCallControlState(callEmbed.control);
+  // [Gitea #277] Only offer "Mute Screenshare Audio" while a remote share's
+  // audio is playing, or while it is muted (so a hidden mute can't silently
+  // swallow the next share).
+  const [remoteScreenshareAudio, setRemoteScreenshareAudio] = useState(
+    callEmbed.control.remoteScreenshareAudio,
+  );
+  useEffect(() => {
+    const onState = () => setRemoteScreenshareAudio(callEmbed.control.remoteScreenshareAudio);
+    onState();
+    callEmbed.control.on(SCREENSHARE_AUDIO_STATE, onState);
+    return () => {
+      callEmbed.control.off(SCREENSHARE_AUDIO_STATE, onState);
+    };
+  }, [callEmbed]);
+  const showScreenshareAudio = remoteScreenshareAudio || screenshareAudioMuted;
   const micLevel = useCallMicLevel(callEmbed);
 
   const [cords, setCords] = useState<RectCords>();
@@ -122,6 +138,8 @@ export function CallControls({ callEmbed }: CallControlsProps) {
   };
   const showScreenshare = allowScreenshare || screenshare;
   const showVideoGroup = showCamera || showScreenshare || !!document.fullscreenEnabled;
+  // [Gitea #265] Phones can't share their screen from a browser; don't offer it.
+  const canShareScreen = typeof navigator.mediaDevices?.getDisplayMedia === 'function';
   const handleOpenMenu: MouseEventHandler<HTMLButtonElement> = (evt) => {
     setCords(evt.currentTarget.getBoundingClientRect());
   };
@@ -166,6 +184,111 @@ export function CallControls({ callEmbed }: CallControlsProps) {
     return () => clearTimeout(id);
   }, [hangupState.status, callEmbed, setCallEmbed]);
 
+  const moreMenu = (
+    <PopOut
+      anchor={cords}
+      position="Top"
+      align="Center"
+      content={
+        <FocusTrap
+          focusTrapOptions={{
+            initialFocus: false,
+            onDeactivate: () => setCords(undefined),
+            clickOutsideDeactivates: true,
+            isKeyForward: (evt: KeyboardEvent) => evt.key === 'ArrowDown',
+            isKeyBackward: (evt: KeyboardEvent) => evt.key === 'ArrowUp',
+            escapeDeactivates: stopPropagation,
+          }}
+        >
+          <Menu>
+            <Box direction="Column" style={{ padding: config.space.S100 }}>
+              {compact && showScreenshare && screenshareMode !== 'hidden' && canShareScreen && (
+                <MenuItem
+                  size="300"
+                  variant="Surface"
+                  radii="300"
+                  onClick={() => {
+                    setCords(undefined);
+                    handleScreenshareToggle();
+                  }}
+                >
+                  <Text size="B300" truncate>
+                    {screenshare ? 'Stop Screenshare' : 'Share Screen'}
+                  </Text>
+                </MenuItem>
+              )}
+              {compact && showScreenshareAudio && (
+                <MenuItem
+                  size="300"
+                  variant="Surface"
+                  radii="300"
+                  onClick={() => {
+                    setCords(undefined);
+                    callEmbed.control.toggleScreenshareAudio();
+                  }}
+                >
+                  <Text size="B300" truncate>
+                    {screenshareAudioMuted ? 'Unmute Screenshare Audio' : 'Mute Screenshare Audio'}
+                  </Text>
+                </MenuItem>
+              )}
+              {compact && !!document.fullscreenEnabled && (
+                <MenuItem
+                  size="300"
+                  variant="Surface"
+                  radii="300"
+                  onClick={() => {
+                    setCords(undefined);
+                    handleFullscreen();
+                  }}
+                >
+                  <Text size="B300" truncate>
+                    {isFullscreen ? 'Exit Fullscreen' : 'Fullscreen'}
+                  </Text>
+                </MenuItem>
+              )}
+              <MenuItem size="300" variant="Surface" radii="300" onClick={handleSpotlightClick}>
+                <Text size="B300" truncate>
+                  {spotlight ? 'Grid View' : 'Spotlight View'}
+                </Text>
+              </MenuItem>
+              <MenuItem size="300" variant="Surface" radii="300" onClick={handleReactionsClick}>
+                <Text size="B300" truncate>
+                  Reactions
+                </Text>
+              </MenuItem>
+              <MenuItem size="300" variant="Surface" radii="300" onClick={handleSettingsClick}>
+                <Text size="B300" truncate>
+                  Settings
+                </Text>
+              </MenuItem>
+            </Box>
+          </Menu>
+        </FocusTrap>
+      }
+    >
+      <IconButton
+        variant="Surface"
+        fill="Soft"
+        radii="400"
+        size="400"
+        onClick={handleOpenMenu}
+        outlined
+        aria-label="More options"
+        aria-expanded={!!cords}
+        aria-haspopup="menu"
+      >
+        <Icon size="400" src={Icons.VerticalDots} />
+      </IconButton>
+    </PopOut>
+  );
+
+  const hangupIcon = exiting ? (
+    <Spinner variant="Critical" fill="Solid" size="200" />
+  ) : (
+    <Icon src={Icons.PhoneDown} size="200" filled />
+  );
+
   const pttKeyLabel = pttKey === 'Space' ? 'SPACE' : pttKey.replace('Key', '').replace('Digit', '');
 
   return (
@@ -204,144 +327,114 @@ export function CallControls({ callEmbed }: CallControlsProps) {
         }}
         onCancel={() => setShareConfirm(false)}
       />
-      <SequenceCard
-        className={css.ControlCard}
-        variant="SurfaceVariant"
-        gap="400"
-        radii="500"
-        alignItems="Center"
-        justifyContent="SpaceBetween"
-        wrap="Wrap"
-      >
-        <Box alignItems="Center" gap="Inherit" grow="Yes" direction={compact ? 'Column' : 'Row'}>
-          <Box shrink="No" alignItems="Inherit" justifyContent="Inherit" gap="200">
-            <MicrophoneButton
-              enabled={microphone}
-              onToggle={handleMicrophoneToggle}
-              level={micLevel}
-            />
-            <SoundButton enabled={sound} onToggle={() => callEmbed.control.toggleSound()} />
-          </Box>
-          {!compact && showVideoGroup && <ControlDivider />}
-          {showVideoGroup && (
+      {compact ? (
+        // [Gitea #265] Phones / narrow windows: ONE row. Screenshare, its audio
+        // mute and fullscreen live in More (they rarely matter on a phone), and
+        // End is icon-only. The old stacked layout took four rows (~40% of a
+        // portrait phone).
+        <SequenceCard
+          className={css.ControlCard}
+          variant="SurfaceVariant"
+          gap="200"
+          radii="500"
+          alignItems="Center"
+          justifyContent="SpaceBetween"
+          wrap="NoWrap"
+        >
+          <MicrophoneButton
+            enabled={microphone}
+            onToggle={handleMicrophoneToggle}
+            level={micLevel}
+          />
+          <SoundButton enabled={sound} onToggle={() => callEmbed.control.toggleSound()} />
+          {showCamera && <VideoButton enabled={video} onToggle={handleVideoToggle} />}
+          <ChatButton />
+          {soundboardEnabled && <CallSoundboard callEmbed={callEmbed} />}
+          {moreMenu}
+          <Button
+            variant="Critical"
+            fill="Solid"
+            radii="400"
+            size="400"
+            onClick={hangup}
+            disabled={exiting}
+            aria-label="End Call"
+            style={{ paddingInline: config.space.S300 }}
+          >
+            {hangupIcon}
+          </Button>
+        </SequenceCard>
+      ) : (
+        <SequenceCard
+          className={css.ControlCard}
+          variant="SurfaceVariant"
+          gap="400"
+          radii="500"
+          alignItems="Center"
+          justifyContent="SpaceBetween"
+          wrap="Wrap"
+        >
+          <Box alignItems="Center" gap="Inherit" grow="Yes">
             <Box shrink="No" alignItems="Inherit" justifyContent="Inherit" gap="200">
-              {/* Show a forbidden control while its track is still live so the
-                  user can stop it; once stopped it hides and can't be restarted. */}
-              {showCamera && <VideoButton enabled={video} onToggle={handleVideoToggle} />}
-              {showScreenshare && (
-                <>
-                  {screenshareMode !== 'hidden' && (
-                    <ScreenShareButton
-                      enabled={screenshare}
-                      onToggle={() => handleScreenshareToggle()}
-                    />
-                  )}
-                  {/* Mute-screenshare-audio sits directly next to the screenshare
-                      control since they're the same concern. */}
-                  <ScreenshareAudioButton
-                    muted={screenshareAudioMuted}
-                    onToggle={() => callEmbed.control.toggleScreenshareAudio()}
-                  />
-                </>
-              )}
-              {!!document.fullscreenEnabled && (
-                <FullscreenButton isFullscreen={isFullscreen} onToggle={handleFullscreen} />
-              )}
+              <MicrophoneButton
+                enabled={microphone}
+                onToggle={handleMicrophoneToggle}
+                level={micLevel}
+              />
+              <SoundButton enabled={sound} onToggle={() => callEmbed.control.toggleSound()} />
             </Box>
-          )}
-        </Box>
-        {!compact && <ControlDivider />}
-        <Box alignItems="Center" gap="Inherit" grow="Yes" direction={compact ? 'Column' : 'Row'}>
-          <Box shrink="No" alignItems="Inherit" justifyContent="Inherit" gap="200">
-            <ChatButton />
-            {soundboardEnabled && <CallSoundboard callEmbed={callEmbed} />}
-            <PopOut
-              anchor={cords}
-              position="Top"
-              align="Center"
-              content={
-                <FocusTrap
-                  focusTrapOptions={{
-                    initialFocus: false,
-                    onDeactivate: () => setCords(undefined),
-                    clickOutsideDeactivates: true,
-                    isKeyForward: (evt: KeyboardEvent) => evt.key === 'ArrowDown',
-                    isKeyBackward: (evt: KeyboardEvent) => evt.key === 'ArrowUp',
-                    escapeDeactivates: stopPropagation,
-                  }}
-                >
-                  <Menu>
-                    <Box direction="Column" style={{ padding: config.space.S100 }}>
-                      <MenuItem
-                        size="300"
-                        variant="Surface"
-                        radii="300"
-                        onClick={handleSpotlightClick}
-                      >
-                        <Text size="B300" truncate>
-                          {spotlight ? 'Grid View' : 'Spotlight View'}
-                        </Text>
-                      </MenuItem>
-                      <MenuItem
-                        size="300"
-                        variant="Surface"
-                        radii="300"
-                        onClick={handleReactionsClick}
-                      >
-                        <Text size="B300" truncate>
-                          Reactions
-                        </Text>
-                      </MenuItem>
-                      <MenuItem
-                        size="300"
-                        variant="Surface"
-                        radii="300"
-                        onClick={handleSettingsClick}
-                      >
-                        <Text size="B300" truncate>
-                          Settings
-                        </Text>
-                      </MenuItem>
-                    </Box>
-                  </Menu>
-                </FocusTrap>
-              }
-            >
-              <IconButton
-                variant="Surface"
-                fill="Soft"
-                radii="400"
-                size="400"
-                onClick={handleOpenMenu}
-                outlined
-                aria-label="More options"
-                aria-expanded={!!cords}
-                aria-haspopup="menu"
+            {showVideoGroup && <ControlDivider />}
+            {showVideoGroup && (
+              <Box shrink="No" alignItems="Inherit" justifyContent="Inherit" gap="200">
+                {/* Show a forbidden control while its track is still live so the
+                    user can stop it; once stopped it hides and can't be restarted. */}
+                {showCamera && <VideoButton enabled={video} onToggle={handleVideoToggle} />}
+                {showScreenshare && (
+                  <>
+                    {screenshareMode !== 'hidden' && (
+                      <ScreenShareButton
+                        enabled={screenshare}
+                        onToggle={() => handleScreenshareToggle()}
+                      />
+                    )}
+                    {/* Mute-screenshare-audio sits directly next to the screenshare
+                        control since they're the same concern. */}
+                    {showScreenshareAudio && (
+                      <ScreenshareAudioButton
+                        muted={screenshareAudioMuted}
+                        onToggle={() => callEmbed.control.toggleScreenshareAudio()}
+                      />
+                    )}
+                  </>
+                )}
+                {!!document.fullscreenEnabled && (
+                  <FullscreenButton isFullscreen={isFullscreen} onToggle={handleFullscreen} />
+                )}
+              </Box>
+            )}
+          </Box>
+          <ControlDivider />
+          <Box alignItems="Center" gap="Inherit" grow="Yes">
+            <Box shrink="No" alignItems="Inherit" justifyContent="Inherit" gap="200">
+              <ChatButton />
+              {soundboardEnabled && <CallSoundboard callEmbed={callEmbed} />}
+              {moreMenu}
+            </Box>
+            <Box shrink="No" direction="Column">
+              <Button
+                style={{ minWidth: toRem(88) }}
+                variant="Critical"
+                fill="Solid"
+                onClick={hangup}
+                before={hangupIcon}
+                disabled={exiting}
               >
-                <Icon size="400" src={Icons.VerticalDots} />
-              </IconButton>
-            </PopOut>
+                <Text size="B400">End</Text>
+              </Button>
+            </Box>
           </Box>
-          <Box shrink="No" direction="Column">
-            <Button
-              style={{ minWidth: toRem(88) }}
-              variant="Critical"
-              fill="Solid"
-              onClick={hangup}
-              before={
-                exiting ? (
-                  <Spinner variant="Critical" fill="Solid" size="200" />
-                ) : (
-                  <Icon src={Icons.PhoneDown} size="200" filled />
-                )
-              }
-              disabled={exiting}
-            >
-              <Text size="B400">End</Text>
-            </Button>
-          </Box>
-        </Box>
-      </SequenceCard>
+        </SequenceCard>
+      )}
     </Box>
   );
 }

src/app/features/common-settings/emojis-stickers/RoomPacks.tsx

@@ -109,8 +109,11 @@ function CreatePackTile({ packs, roomId }: CreatePackTileProps) {
           alignItems="End"
         >
           <Box direction="Column" gap="100" grow="Yes">
-            <Text size="L400">Name</Text>
+            <Text as="label" htmlFor="room-pack-name" size="L400">
+              Name
+            </Text>
             <Input
+              id="room-pack-name"
               name="nameInput"
               required
               size="400"

src/app/features/common-settings/general/RoomProfile.tsx

@@ -52,8 +52,7 @@ import { settingsAtom } from '../../../state/settings';
 import { AsyncStatus, useAsyncCallback } from '../../../hooks/useAsyncCallback';
 import { useAlive } from '../../../hooks/useAlive';
 import { RoomPermissionsAPI } from '../../../hooks/useRoomPermissions';
-
-const MARKDOWN_PATTERN = /(\*\*|__|\*|_|~~|`|\[.+?\]\(.+?\))/;
+import { buildTopicContent } from '../../../utils/topicMarkdown';
 
 function wrapSelection(textarea: HTMLTextAreaElement, syntax: string, placeholder: string) {
   const start = textarea.selectionStart;
@@ -71,30 +70,6 @@ function wrapSelection(textarea: HTMLTextAreaElement, syntax: string, placeholde
   textarea.setSelectionRange(cursorStart, cursorEnd);
 }
 
-function topicMarkdownToHtml(text: string): string {
-  return text
-    .replace(/&/g, '&')
-    .replace(/</g, '&lt;')
-    .replace(/>/g, '&gt;')
-    .replace(/\*\*(.+?)\*\*/g, '<strong>$1</strong>')
-    .replace(/__(.+?)__/g, '<strong>$1</strong>')
-    .replace(/\*(.+?)\*/g, '<em>$1</em>')
-    .replace(/_(.+?)_/g, '<em>$1</em>')
-    .replace(/~~(.+?)~~/g, '<del>$1</del>')
-    .replace(/`(.+?)`/g, '<code>$1</code>')
-    .replace(/\[(.+?)\]\((.+?)\)/g, '<a href="$2">$1</a>')
-    .replace(/\n/g, '<br>');
-}
-
-function buildTopicContent(topic: string): Record<string, string> {
-  if (!MARKDOWN_PATTERN.test(topic)) return { topic };
-  const formattedBody = topicMarkdownToHtml(topic);
-  // Use HTML-stripped text as the plain topic so the header shows clean text, not raw markdown syntax
-  const plainTopic = formattedBody.replace(/<br>/g, '\n').replace(/<[^>]+>/g, '');
-
-  return { topic: plainTopic, format: 'org.matrix.custom.html', formatted_body: formattedBody };
-}
-
 type RoomProfileEditProps = {
   canEditAvatar: boolean;
   canEditName: boolean;

src/app/features/common-settings/permissions/PermissionGroups.tsx

@@ -136,7 +136,8 @@ export function PermissionGroups({
                     outlined={powerChanges}
                     fill="Soft"
                     radii="Pill"
-                    aria-selected={opened}
+                    aria-haspopup="menu"
+                    aria-expanded={opened}
                     disabled={!canEdit || applyingChanges}
                     after={
                       powerChanges && (
@@ -200,7 +201,8 @@ export function PermissionGroups({
                           outlined={powerChanges}
                           fill="Soft"
                           radii="Pill"
-                          aria-selected={opened}
+                          aria-haspopup="menu"
+                          aria-expanded={opened}
                           disabled={!canEdit || applyingChanges}
                           after={
                             powerChanges && (

src/app/features/common-settings/soundboard/Soundboard.tsx

@@ -38,10 +38,14 @@ export function Soundboard({ requestClose }: SoundboardProps) {
           <PageContent>
             <Box direction="Column" gap="700">
               <Box direction="Column" gap="200">
-                <Text size="L400">This room / space (shared)</Text>
+                <Text size="L400">
+                  {room?.isSpaceRoom() ? 'This space (shared)' : 'This room (shared)'}
+                </Text>
                 <Text size="T200" priority="300">
-                  Clips here are shared with everyone, and inherited by every room under this space
-                  — just like emoji/sticker packs. Only members with permission can edit.
+                  {/* [Gitea #279] Only a space's clips are inherited by rooms under it. */}
+                  {room?.isSpaceRoom()
+                    ? 'Clips here are shared with everyone, and inherited by every room under this space — just like emoji/sticker packs. Only members with permission can edit.'
+                    : 'Clips here are shared with everyone in this room — just like emoji/sticker packs. Only members with permission can edit.'}
                 </Text>
                 {room && <RoomSoundboardPack room={room} stateKey="" />}
               </Box>

src/app/features/lotus/avatarDecorations.ts

@@ -3,8 +3,10 @@
 // of this file at runtime (by regex) instead of re-declaring it, so the two can
 // never drift. If you migrate the CDN, change it here ONLY — keep the
 // `export const DECORATION_CDN = '...'` shape so the sync script can still parse it.
-export const DECORATION_CDN =
-  'https://drive.lotusguild.org/public.php/dav/files/bHswJ9pNKp2t26N/cinny-decorations';
+// matrix #22: static files on chat.lotusguild.org (a versioned package installed
+// by the matrix repo's LXC 106 deploy), not Nextcloud's public DAV. Absolute, so
+// the desktop app and the Element Call fork's origin allowlist both work.
+export const DECORATION_CDN = 'https://chat.lotusguild.org/decorations';
 
 // Runtime base. A deployment can repoint the decorations at a different host
 // without editing the catalog literal above (which scripts/syncDecorations.mjs

src/app/features/outbox/OutboxFeature.tsx

@@ -94,10 +94,15 @@ export function OutboxFeature() {
       OFFLINE.has(mx.getSyncState()) ||
       (typeof navigator !== 'undefined' && navigator.onLine === false);
 
-    const persist = (next: OutboxEntry[]) => {
-      if (next === entries) return;
+    // [Gitea #268] Read-modify-write: another tab may have queued or cleared
+    // entries since we last looked, and saving our own copy over the key
+    // would drop theirs. Entries are added/removed by txnId, so applying our
+    // change to the stored list merges cleanly.
+    const persist = (update: (list: OutboxEntry[]) => OutboxEntry[]) => {
+      const stored = loadOutbox(userId);
+      const next = update(stored);
       entries = next;
-      saveOutbox(userId, entries);
+      if (next !== stored) saveOutbox(userId, next);
     };
 
     /**
@@ -123,8 +128,8 @@ export function OutboxFeature() {
         if (!shouldKeepInOutbox(event.getType(), event.getContent())) return;
         live.set(txnId, { event, room });
         if (event.status === EventStatus.NOT_SENT) scheduleBlipRetry(event);
-        persist(
-          withEntry(entries, {
+        persist((list) =>
+          withEntry(list, {
             txnId,
             roomId: room.roomId,
             threadId: event.threadRootId ?? null,
@@ -138,7 +143,7 @@ export function OutboxFeature() {
       // SENT, CANCELLED, or the remote echo replaced it (status null).
       live.delete(txnId);
       autoRetries.delete(txnId);
-      persist(withoutEntry(entries, txnId));
+      persist((list) => withoutEntry(list, txnId));
     };
 
     /** Re-send network failures, oldest first; a room stops at its first failure. */
@@ -191,7 +196,7 @@ export function OutboxFeature() {
           return !!room && isDelivered(room, entry.txnId);
         },
       );
-      plan.drop.forEach((entry) => persist(withoutEntry(entries, entry.txnId)));
+      plan.drop.forEach((entry) => persist((list) => withoutEntry(list, entry.txnId)));
       plan.restore.forEach((entry) => {
         const room = mx.getRoom(entry.roomId);
         if (!room || live.has(entry.txnId)) return;

src/app/features/room-settings/ExportRoomHistory.tsx

@@ -353,8 +353,11 @@ ${msgRows}
                 >
                   <Box gap="400" wrap="Wrap">
                     <Box direction="Column" gap="100" style={{ flex: 1, minWidth: 160 }}>
-                      <Text size="T300">From</Text>
+                      <Text as="label" htmlFor="export-from-date" size="T300">
+                        From
+                      </Text>
                       <Input
+                        id="export-from-date"
                         type="date"
                         variant="Secondary"
                         size="400"
@@ -364,8 +367,11 @@ ${msgRows}
                       />
                     </Box>
                     <Box direction="Column" gap="100" style={{ flex: 1, minWidth: 160 }}>
-                      <Text size="T300">To</Text>
+                      <Text as="label" htmlFor="export-to-date" size="T300">
+                        To
+                      </Text>
                       <Input
+                        id="export-to-date"
                         type="date"
                         variant="Secondary"
                         size="400"

src/app/features/room-settings/RoomInsights.tsx

@@ -401,16 +401,19 @@ export function RoomInsights({ requestClose }: RoomInsightsProps) {
                               {displayName}
                             </Text>
                             <Box alignItems="Center" gap="200">
-                              <div
-                                style={{
-                                  height: 6,
-                                  width: barWidth,
-                                  background: color.Primary.Main,
-                                  borderRadius: config.radii.R300,
-                                  transition: 'width 0.3s ease',
-                                  flexShrink: 0,
-                                }}
-                              />
+                              {/* [Gitea #270] The bar's % width is of its own track,
+                                  not of the row, so the count always fits beside it. */}
+                              <div style={{ flex: 1, minWidth: 0 }}>
+                                <div
+                                  style={{
+                                    height: 6,
+                                    width: barWidth,
+                                    background: color.Primary.Main,
+                                    borderRadius: config.radii.R300,
+                                    transition: 'width 0.3s ease',
+                                  }}
+                                />
+                              </div>
                               <Text size="T200" priority="300" style={{ flexShrink: 0 }}>
                                 {count}
                               </Text>

src/app/features/room-settings/RoomServerACL.tsx

@@ -32,24 +32,12 @@ import { AsyncStatus, useAsyncCallback } from '../../hooks/useAsyncCallback';
 import { SequenceCard } from '../../components/sequence-card';
 import { SequenceCardStyle } from '../common-settings/styles.css';
 import { stopPropagation } from '../../utils/keyboard';
-import { isValidServerPattern, matchesAnyGlob } from '../../utils/serverAcl';
+import { isValidServerPattern, matchesAnyGlob, normalizeServerAcl } from '../../utils/serverAcl';
 import { MobileTouchTarget } from '../../styles/mobile.css';
 import { useModalStyle } from '../../hooks/useModalStyle';
 
 // ── Types ─────────────────────────────────────────────────────────────────────
 
-type ServerAclContent = {
-  allow: string[];
-  deny: string[];
-  allow_ip_literals: boolean;
-};
-
-const DEFAULT_ACL: ServerAclContent = {
-  allow: ['*'],
-  deny: [],
-  allow_ip_literals: false,
-};
-
 // ── Server list sub-component ─────────────────────────────────────────────────
 
 type ServerListProps = {
@@ -185,20 +173,20 @@ export function RoomServerACL({ requestClose }: RoomServerACLProps) {
 
   // Read current ACL from room state
   const aclEvent = useStateEvent(room, StateEvent.RoomServerAcl);
-  const currentAcl = aclEvent?.getContent<ServerAclContent>() ?? DEFAULT_ACL;
+  const currentAcl = normalizeServerAcl(aclEvent?.getContent());
 
   // Local draft state — initialised from current ACL
-  const [allowList, setAllowList] = useState<string[]>(() => currentAcl.allow ?? ['*']);
-  const [denyList, setDenyList] = useState<string[]>(() => currentAcl.deny ?? []);
+  const [allowList, setAllowList] = useState<string[]>(() => currentAcl.allow);
+  const [denyList, setDenyList] = useState<string[]>(() => currentAcl.deny);
   const [allowIpLiterals, setAllowIpLiterals] = useState<boolean>(
-    () => currentAcl.allow_ip_literals ?? false,
+    () => currentAcl.allow_ip_literals,
   );
 
   // Track whether there are unsaved changes
   const isDirty =
-    JSON.stringify(allowList) !== JSON.stringify(currentAcl.allow ?? ['*']) ||
-    JSON.stringify(denyList) !== JSON.stringify(currentAcl.deny ?? []) ||
-    allowIpLiterals !== (currentAcl.allow_ip_literals ?? false);
+    JSON.stringify(allowList) !== JSON.stringify(currentAcl.allow) ||
+    JSON.stringify(denyList) !== JSON.stringify(currentAcl.deny) ||
+    allowIpLiterals !== currentAcl.allow_ip_literals;
 
   // Save handler
   const [saveState, save] = useAsyncCallback(
@@ -336,7 +324,10 @@ export function RoomServerACL({ requestClose }: RoomServerACLProps) {
                       id="allow-ip-literals"
                       checked={allowIpLiterals}
                       disabled={!canEdit}
-                      onClick={() => setAllowIpLiterals(!allowIpLiterals)}
+                      // folds' Checkbox has no onChange; readOnly tells React the
+                      // click handler controls it (no "checked without onChange").
+                      readOnly
+                      onClick={(e) => setAllowIpLiterals(e.currentTarget.checked)}
                       size="300"
                       variant="Primary"
                     />

src/app/features/room-settings/RoomSettingsRenderer.tsx

@@ -21,7 +21,7 @@ function RenderSettings({ state }: RenderSettingsProps) {
   if (!room) return null;
 
   return (
-    <Modal500 requestClose={closeSettings}>
+    <Modal500 requestClose={closeSettings} label={`${room.name} settings`}>
       <SpaceProvider value={space ?? null}>
         <RoomProvider value={room}>
           <RoomSettings initialPage={page} requestClose={closeSettings} />

src/app/features/room/MediaGallery.css.ts

@@ -1,13 +1,13 @@
 import { style } from '@vanilla-extract/css';
 import { color, config, toRem } from 'folds';
+import { SIDE_PANEL_WIDTH } from '../../styles/sidePanel';
 
 // Right-side drawer DOCKED into the room layout row (a flex sibling of the
-// timeline), exactly like MembersDrawer — not a floating overlay. 320px is a
-// little wider than the 266px member/bookmark drawers because it hosts a media
-// grid. On narrow viewports it becomes a full-screen fixed panel, matching the
-// app's other drawers.
+// timeline), exactly like MembersDrawer — not a floating overlay. Same width as
+// every other right-hand panel (styles/sidePanel.ts, #263). On narrow viewports
+// it becomes a full-screen fixed panel, matching the app's other drawers.
 export const MediaGalleryDrawer = style({
-  width: toRem(320),
+  width: SIDE_PANEL_WIDTH,
   overflow: 'hidden',
   '@media': {
     '(max-width: 750px)': {

src/app/features/room/MembersDrawer.css.ts

@@ -1,8 +1,9 @@
 import { keyframes, style } from '@vanilla-extract/css';
-import { config, toRem } from 'folds';
+import { config } from 'folds';
+import { SIDE_PANEL_WIDTH } from '../../styles/sidePanel';
 
 export const MembersDrawer = style({
-  width: toRem(266),
+  width: SIDE_PANEL_WIDTH,
   '@media': {
     '(max-width: 750px)': {
       position: 'fixed',

src/app/features/room/ScheduleMessageModal.tsx

@@ -20,7 +20,12 @@ import { IContent } from 'matrix-js-sdk';
 import { useTimestampFormatter } from '../../hooks/useTimestampFormatter';
 import { useMatrixClient } from '../../hooks/useMatrixClient';
 import { stopPropagation } from '../../utils/keyboard';
-import { scheduleMessage } from '../../utils/scheduledMessages';
+import {
+  describeScheduleError,
+  MAX_SCHEDULE_AHEAD_MS,
+  scheduleMessage,
+  SCHEDULE_TOO_FAR_TEXT,
+} from '../../utils/scheduledMessages';
 import { useModalStyle } from '../../hooks/useModalStyle';
 import {
   toLocalDate,
@@ -121,7 +126,13 @@ export function ScheduleMessageModal({
       return;
     }
     const diffMs = sendAt.getTime() - Date.now();
-    if (diffMs < 60_000) {
+    // [Gitea #275] Say so as soon as a too-late time is picked, not on submit.
+    const tooFar = diffMs > MAX_SCHEDULE_AHEAD_MS;
+    setError((e) => {
+      if (tooFar) return SCHEDULE_TOO_FAR_TEXT;
+      return e === SCHEDULE_TOO_FAR_TEXT ? null : e;
+    });
+    if (diffMs < 60_000 || tooFar) {
       setPreview(null);
       return;
     }
@@ -149,6 +160,10 @@ export function ScheduleMessageModal({
       setError('Scheduled time must be at least 1 minute in the future.');
       return;
     }
+    if (diffMs > MAX_SCHEDULE_AHEAD_MS) {
+      setError(SCHEDULE_TOO_FAR_TEXT);
+      return;
+    }
     if (!messageText.trim()) {
       setError('Please enter a message to schedule.');
       return;
@@ -162,7 +177,7 @@ export function ScheduleMessageModal({
       onScheduled(delayId, sendAt.getTime(), content);
       onClose();
     } catch (err) {
-      setError(err instanceof Error ? err.message : 'Failed to schedule message.');
+      setError(describeScheduleError(err));
       setSubmitting(false);
     }
   };
@@ -247,6 +262,8 @@ export function ScheduleMessageModal({
                     <input
                       id="schedule-date"
                       type="date"
+                      min={toLocalDate(new Date())}
+                      max={toLocalDate(new Date(Date.now() + MAX_SCHEDULE_AHEAD_MS))}
                       value={dateValue}
                       onChange={(e) => setDateValue(e.target.value)}
                       style={pickerInputStyle(color, config)}
@@ -294,7 +311,8 @@ export function ScheduleMessageModal({
                   </Box>
                 </Box>
               ) : (
-                (dateValue || timeValue) && (
+                (dateValue || timeValue) &&
+                error !== SCHEDULE_TOO_FAR_TEXT && (
                   <Text size="T200" style={{ color: color.Critical.Main }}>
                     Must be at least 1 minute in the future
                   </Text>

src/app/features/room/message/Message.tsx

@@ -1137,25 +1137,31 @@ export const Message = React.memo(
         </AvatarBase>
       );
 
+      // [Gitea #269] The content column shrinks to the message's width; the
+      // receipt pill / delivery status sit OUTSIDE it, in a full-width column,
+      // so their `margin-left: auto` reaches the row's right edge instead of
+      // wherever the text happens to end.
       const msgContentJSX = (
-        <Box direction="Column" alignSelf="Start" style={{ maxWidth: '100%' }}>
-          {reply}
-          {edit && onEditId ? (
-            <MessageEditor
-              style={{
-                maxWidth: '100%',
-                width: '100vw',
-              }}
-              roomId={room.roomId}
-              room={room}
-              mEvent={mEvent}
-              imagePackRooms={imagePackRooms}
-              onCancel={() => onEditId()}
-            />
-          ) : (
-            children
-          )}
-          {reactions}
+        <Box direction="Column" style={{ maxWidth: '100%', flexGrow: 1, minWidth: 0 }}>
+          <Box direction="Column" alignSelf="Start" style={{ maxWidth: '100%' }}>
+            {reply}
+            {edit && onEditId ? (
+              <MessageEditor
+                style={{
+                  maxWidth: '100%',
+                  width: '100vw',
+                }}
+                roomId={room.roomId}
+                room={room}
+                mEvent={mEvent}
+                imagePackRooms={imagePackRooms}
+                onCancel={() => onEditId()}
+              />
+            ) : (
+              children
+            )}
+            {reactions}
+          </Box>
           {readReceiptUsers.length > 0 && (
             <ReadReceiptAvatars
               room={room}

src/app/features/room/room-pin-menu/RoomPinMenu.tsx

@@ -531,7 +531,7 @@ export const RoomPinMenu = forwardRef<HTMLDivElement, RoomPinMenuProps>(
                         No Pinned Messages
                       </Text>
                       <Text size="T400" align="Center">
-                        Users with sufficient power level can pin a messages from its context menu.
+                        Users with sufficient power level can pin a message from its context menu.
                       </Text>
                     </Box>
                   </Box>

src/app/features/room/thread/ThreadPanel.css.ts

@@ -1,8 +1,9 @@
 import { style } from '@vanilla-extract/css';
-import { config, toRem } from 'folds';
+import { config } from 'folds';
+import { SIDE_PANEL_WIDTH } from '../../../styles/sidePanel';
 
 export const ThreadPanel = style({
-  width: toRem(360),
+  width: SIDE_PANEL_WIDTH,
   '@media': {
     '(max-width: 750px)': {
       position: 'fixed',

src/app/features/room/thread/ThreadsListPanel.css.ts

@@ -1,8 +1,9 @@
 import { style } from '@vanilla-extract/css';
-import { color, config, toRem } from 'folds';
+import { color, config } from 'folds';
+import { SIDE_PANEL_WIDTH } from '../../../styles/sidePanel';
 
 export const ThreadsListPanel = style({
-  width: toRem(340),
+  width: SIDE_PANEL_WIDTH,
   '@media': {
     '(max-width: 750px)': {
       position: 'fixed',

src/app/features/room/widgets/WidgetsPanel.css.ts

@@ -1,8 +1,9 @@
 import { style } from '@vanilla-extract/css';
-import { config, toRem } from 'folds';
+import { config } from 'folds';
+import { SIDE_PANEL_WIDTH } from '../../../styles/sidePanel';
 
 export const WidgetsPanel = style({
-  width: toRem(360),
+  width: SIDE_PANEL_WIDTH,
   '@media': {
     '(max-width: 750px)': {
       position: 'fixed',

src/app/features/room/widgets/widgetUtils.test.ts

@@ -106,3 +106,19 @@ test('classifyWidgetCapabilities: reading protected state is fine, changing unpr
 test('loadWidgetConsent tolerates missing storage', () => {
   assert.equal(loadWidgetConsent('!r:x', 'w', 'https://w.example'), undefined);
 });
+
+test('[#266] space structure, call membership and Lotus room policy can never be granted', () => {
+  const { auto, ask } = classifyWidgetCapabilities(
+    [
+      'm.space.child',
+      'm.space.parent',
+      'org.matrix.msc3401.call',
+      'org.matrix.msc3401.call.member',
+      'm.call.member',
+      'io.lotus.voice_limit',
+      'io.lotus.room_quality',
+    ].map((t) => `org.matrix.msc2762.send.state_event:${t}`),
+  );
+  assert.equal(auto.size, 0);
+  assert.deepEqual(ask, []);
+});

src/app/features/room/widgets/widgetUtils.ts

@@ -67,6 +67,16 @@ export const PROTECTED_STATE_TYPES: ReadonlySet<string> = new Set([
   'm.room.third_party_invite',
   'im.vector.modular.widgets',
   'm.widget',
+  // [Gitea #266] Space structure, call membership and Lotus room policy: a
+  // widget could restructure a space, fake call membership or lift the
+  // voice-channel limit, so these can't be granted even with consent.
+  'm.space.child',
+  'm.space.parent',
+  'org.matrix.msc3401.call',
+  'org.matrix.msc3401.call.member',
+  'm.call.member',
+  'io.lotus.voice_limit',
+  'io.lotus.room_quality',
 ]);
 
 export type WidgetPermissionRequest = {
@@ -137,8 +147,11 @@ export const classifyWidgetCapabilities = (
  */
 export type StoredWidgetConsent = { url: string; allowed: Capability[]; denied: Capability[] };
 
+// [Gitea #266] Swept on logout by clearPlaintextCaches, so one account's
+// approvals never apply to the next account on the same device.
+export const WIDGET_CONSENT_PREFIX = 'lotus.widgetConsent.';
 export const widgetConsentKey = (roomId: string, widgetId: string): string =>
-  `lotus.widgetConsent.${roomId}.${widgetId}`;
+  `${WIDGET_CONSENT_PREFIX}${roomId}.${widgetId}`;
 
 export const loadWidgetConsent = (
   roomId: string,

src/app/features/settings/about/About.tsx

@@ -8,6 +8,7 @@ import { getOriginBaseUrl, withOriginBaseUrl } from '../../../pages/pathUtils';
 import pkg from '../../../../../package.json';
 import { clearCacheAndReload } from '../../../../client/initMatrix';
 import { useMatrixClient } from '../../../hooks/useMatrixClient';
+import { tauriInvoke } from '../../../hooks/useTauri';
 
 const LotusLogo = withOriginBaseUrl(getOriginBaseUrl(), '/public/res/lotus-logo.png');
 
@@ -78,6 +79,51 @@ function useServerSupport(): { support: MSC1929Support | null; loading: boolean
 type AboutProps = {
   requestClose: () => void;
 };
+/**
+ * [Gitea #276] Which build someone is on: the web deploy's commit and build
+ * date (stamped in by vite.config.js), plus the desktop app's own version from
+ * Tauri, the number a desktop or updater bug report needs.
+ */
+function BuildInfo() {
+  const [desktopVersion, setDesktopVersion] = useState<string>();
+  useEffect(() => {
+    tauriInvoke()?.('plugin:app|version')
+      .then((v) => {
+        if (typeof v === 'string') setDesktopVersion(v);
+      })
+      .catch(() => undefined);
+  }, []);
+  const commit = __LOTUS_BUILD_COMMIT__;
+  const built = new Date(__LOTUS_BUILD_DATE__);
+  const builtText = Number.isNaN(built.getTime())
+    ? undefined
+    : built.toLocaleString(undefined, { dateStyle: 'medium', timeStyle: 'short' });
+  return (
+    <Box direction="Column" gap="0">
+      {desktopVersion && (
+        <Text size="T200" priority="300">
+          Desktop {desktopVersion}
+        </Text>
+      )}
+      <Text size="T200" priority="300">
+        Web build{' '}
+        {commit !== 'unknown' ? (
+          <a
+            href={`https://code.lotusguild.org/LotusGuild/cinny/commit/${commit}`}
+            target="_blank"
+            rel="noreferrer noopener"
+          >
+            {commit}
+          </a>
+        ) : (
+          commit
+        )}
+        {builtText && ` · built ${builtText}`}
+      </Text>
+    </Box>
+  );
+}
+
 export function About({ requestClose }: AboutProps) {
   const mx = useMatrixClient();
   const { support: serverSupport, loading: supportLoading } = useServerSupport();
@@ -117,6 +163,7 @@ export function About({ requestClose }: AboutProps) {
                       <Text size="T200">v{pkg.version}</Text>
                     </Box>
                     <Text>A Matrix client for Lotus Guild.</Text>
+                    <BuildInfo />
                   </Box>
 
                   <Box gap="200" wrap="Wrap">

src/app/features/settings/account/Profile.tsx

@@ -38,7 +38,11 @@ import { SettingTile } from '../../../components/setting-tile';
 import { useMatrixClient } from '../../../hooks/useMatrixClient';
 import { getAccountData, setAccountData } from '../../../utils/accountData';
 import { presenceStateFromSetting } from '../../../hooks/usePresenceUpdater';
-import { describePresenceError, setPresenceWithRetry } from '../../../utils/presenceWrite';
+import {
+  describePresenceError,
+  setPresenceWithRetry,
+  writePresence,
+} from '../../../utils/presenceWrite';
 import { useSetting } from '../../../state/hooks/settings';
 import { settingsAtom } from '../../../state/settings';
 import { UserProfile, useUserProfile } from '../../../hooks/useUserProfile';
@@ -560,7 +564,7 @@ function ProfileStatus() {
     localStorage.removeItem(STATUS_EXPIRY_KEY(userId));
     writeStatusExpiry(mx, '').catch(() => undefined);
     // Preserve the user's chosen presence when clearing the status message.
-    mx.setPresence({
+    writePresence(mx, {
       presence: presenceStateFromSetting(presenceStatus, hidePresence),
       status_msg: '',
     }).catch(() => undefined);

src/app/features/settings/account/ProfileDecoration.tsx

@@ -1,7 +1,12 @@
 import React, { ChangeEvent, useCallback, useEffect, useMemo, useRef, useState } from 'react';
-import { Box, Button, Chip, Icon, Icons, Input, Text, Spinner, color } from 'folds';
+import { Avatar, Box, Button, Chip, Icon, Icons, Input, Text, Spinner, color } from 'folds';
 import { Method } from 'matrix-js-sdk';
 import { useMatrixClient } from '../../../hooks/useMatrixClient';
+import { useMediaAuthentication } from '../../../hooks/useMediaAuthentication';
+import { useUserProfile } from '../../../hooks/useUserProfile';
+import { getMxIdLocalPart, mxcUrlToHttp } from '../../../utils/matrix';
+import { nameInitials } from '../../../utils/common';
+import { UserAvatar } from '../../../components/user-avatar';
 import { AsyncStatus, useAsyncCallback } from '../../../hooks/useAsyncCallback';
 import { SettingTile } from '../../../components/setting-tile';
 import {
@@ -14,6 +19,8 @@ import { invalidateDecorationCache } from '../../../hooks/useAvatarDecoration';
 
 const PROFILE_FIELD = 'io.lotus.avatar_decoration';
 const CELL_SIZE = 72;
+// Matches AvatarDecoration's default inset, so the preview looks like the timeline.
+const PREVIEW_INSET = 8;
 
 function DecorationPreviewCell({
   slug,
@@ -86,6 +93,12 @@ function categoryOf(slug: string | null): string {
 export function ProfileDecoration() {
   const mx = useMatrixClient();
   const userId = mx.getUserId()!;
+  const useAuthentication = useMediaAuthentication();
+  const profile = useUserProfile(userId);
+  const myName = profile.displayName ?? getMxIdLocalPart(userId) ?? userId;
+  const myAvatarUrl = profile.avatarUrl
+    ? (mxcUrlToHttp(mx, profile.avatarUrl, useAuthentication, 96, 96, 'crop') ?? undefined)
+    : undefined;
 
   const [current, setCurrent] = useState<string | null>(null);
   const [selected, setSelected] = useState<string | null>(null);
@@ -198,6 +211,10 @@ export function ProfileDecoration() {
       <Box direction="Column" gap="300">
         {/* Current selection preview */}
         <Box alignItems="Center" gap="300">
+          {/* [Gitea #272] Your own avatar with the decoration overlaid, as the
+              timeline draws it (AvatarDecoration: the image is the avatar plus
+              an 8px margin on every side). With no decoration the circle gets
+              a visible dashed outline instead of vanishing into the card. */}
           <div
             style={{
               position: 'relative',
@@ -205,10 +222,29 @@ export function ProfileDecoration() {
               height: CELL_SIZE,
               flexShrink: 0,
               borderRadius: '50%',
-              background: color.SurfaceVariant.Container,
-              overflow: 'hidden',
+              boxSizing: 'border-box',
+              border: selected
+                ? 'none'
+                : `2px dashed color-mix(in srgb, ${color.SurfaceVariant.OnContainer} 45%, transparent)`,
             }}
           >
+            <Avatar
+              size="500"
+              radii="Pill"
+              style={{
+                position: 'absolute',
+                inset: PREVIEW_INSET,
+                width: CELL_SIZE - PREVIEW_INSET * 2,
+                height: CELL_SIZE - PREVIEW_INSET * 2,
+              }}
+            >
+              <UserAvatar
+                userId={userId}
+                src={myAvatarUrl}
+                alt=""
+                renderFallback={() => <Text size="H5">{nameInitials(myName)}</Text>}
+              />
+            </Avatar>
             {selected && (
               <img
                 src={decorationUrl(selected)}
@@ -220,6 +256,7 @@ export function ProfileDecoration() {
                   height: '100%',
                   objectFit: 'contain',
                   pointerEvents: 'none',
+                  zIndex: 1,
                 }}
               />
             )}

src/app/features/settings/general/General.tsx

@@ -111,7 +111,8 @@ import {
   translationUnavailableText,
 } from '../../../utils/translation/langUtils';
 import { chromeTranslationEngine } from '../../../utils/translation/chromeEngine';
-import { SequenceCardStyle } from '../styles.css';
+import { SequenceCardStyle, SettingTileGroup } from '../styles.css';
+import { ScreenSize, useScreenSize } from '../../../hooks/useScreenSize';
 import { UpdateProgress, useTauriUpdater } from '../../../hooks/useTauriUpdater';
 import {
   describeUpdateError,
@@ -1598,6 +1599,7 @@ function Privacy() {
 // [Gitea #104] Sync toggle + the two manual actions. The toggle is itself
 // device-local (never synced) so switching it off here sticks.
 function SettingsSyncSection() {
+  const isMobile = useScreenSize() === ScreenSize.Mobile;
   const [settingsSync, setSettingsSync] = useSetting(settingsAtom, 'settingsSync');
   const { pushNow, clearRemote } = useSettingsSyncActions();
   const [busy, setBusy] = useState<'push' | 'clear' | null>(null);
@@ -1621,6 +1623,34 @@ function SettingsSyncSection() {
     }
   };
 
+  const syncButtons = (
+    <Box gap="200">
+      <Button
+        size="300"
+        variant="Secondary"
+        fill="Soft"
+        outlined
+        radii="300"
+        disabled={busy !== null}
+        before={busy === 'push' ? <Spinner size="100" variant="Secondary" /> : undefined}
+        onClick={() => run('push')}
+      >
+        <Text size="B300">Push now</Text>
+      </Button>
+      <Button
+        size="300"
+        variant="Critical"
+        fill="None"
+        radii="300"
+        disabled={busy !== null}
+        before={busy === 'clear' ? <Spinner size="100" variant="Critical" /> : undefined}
+        onClick={() => run('clear')}
+      >
+        <Text size="B300">Clear synced copy</Text>
+      </Button>
+    </Box>
+  );
+
   return (
     <Box direction="Column" gap="100">
       <Text size="L400">Sync</Text>
@@ -1636,34 +1666,12 @@ function SettingsSyncSection() {
           <SettingTile
             title="Use This Device's Settings Everywhere"
             description="Push this device's current preferences so every other device adopts them, even ones that changed something more recently."
-            after={
-              <Box gap="200">
-                <Button
-                  size="300"
-                  variant="Secondary"
-                  fill="Soft"
-                  outlined
-                  radii="300"
-                  disabled={busy !== null}
-                  before={busy === 'push' ? <Spinner size="100" variant="Secondary" /> : undefined}
-                  onClick={() => run('push')}
-                >
-                  <Text size="B300">Push now</Text>
-                </Button>
-                <Button
-                  size="300"
-                  variant="Critical"
-                  fill="None"
-                  radii="300"
-                  disabled={busy !== null}
-                  before={busy === 'clear' ? <Spinner size="100" variant="Critical" /> : undefined}
-                  onClick={() => run('clear')}
-                >
-                  <Text size="B300">Clear synced copy</Text>
-                </Button>
-              </Box>
-            }
-          />
+            // [Gitea #273] On phones the two buttons squeezed the text into a
+            // narrow column; put them under the description there.
+            after={isMobile ? undefined : syncButtons}
+          >
+            {isMobile && <Box style={{ paddingTop: config.space.S100 }}>{syncButtons}</Box>}
+          </SettingTile>
           {note && (
             <Text
               size="T200"
@@ -1800,7 +1808,8 @@ function Calls() {
           title="Noise Suppression"
           description={
             <Box direction="Column" gap="200">
-              <Text>
+              {/* [Gitea #271] T200 like every other setting description. */}
+              <Text size="T200">
                 Filter background noise from your mic during calls. Browser-native uses the built-in
                 WebRTC suppressor (Google NSNet2). ML runs a dedicated model for stronger removal.
               </Text>
@@ -2033,7 +2042,7 @@ function Calls() {
         )}
       </SequenceCard>
       <SequenceCard
-        className={SequenceCardStyle}
+        className={`${SequenceCardStyle} ${SettingTileGroup}`}
         variant="SurfaceVariant"
         direction="Column"
         gap="400"
@@ -2089,7 +2098,12 @@ function Calls() {
           description={
             deafenBind.error ??
             (deafenHotkey
-              ? `Press ${keyLabel(deafenKey)} during a call to mute your speakers. Press Escape to cancel rebind.${
+              ? `${
+                  // [Gitea #279] The Escape hint only applies while rebinding.
+                  deafenBind.listening
+                    ? 'Press a key to bind it, or Escape to cancel.'
+                    : `Press ${keyLabel(deafenKey)} during a call to mute your speakers.`
+                }${
                   !isSafeGlobalToggleKey(deafenKey)
                     ? ` A letter, digit or Space only works in the call view — on a chat screen typing takes priority${
                         isTauriEnv() && globalCallHotkeys ? ' and other apps are never watched' : ''
@@ -2130,7 +2144,7 @@ function Calls() {
         )}
       </SequenceCard>
       <SequenceCard
-        className={SequenceCardStyle}
+        className={`${SequenceCardStyle} ${SettingTileGroup}`}
         variant="SurfaceVariant"
         direction="Column"
         gap="400"
@@ -2264,7 +2278,11 @@ function Calls() {
         />
       </SequenceCard>
 
-      <SequenceCard className={SequenceCardStyle} variant="SurfaceVariant" direction="Column">
+      <SequenceCard
+        className={`${SequenceCardStyle} ${SettingTileGroup}`}
+        variant="SurfaceVariant"
+        direction="Column"
+      >
         <SettingTile
           title="Soundboard"
           description="Show a soundboard button in the call bar. Upload short audio clips (like custom emojis) to play them into the call. Clips sync across your devices."
@@ -2751,7 +2769,11 @@ function Messages() {
           }
         />
       </SequenceCard>
-      <SequenceCard className={SequenceCardStyle} variant="SurfaceVariant" direction="Column">
+      <SequenceCard
+        className={`${SequenceCardStyle} ${SettingTileGroup}`}
+        variant="SurfaceVariant"
+        direction="Column"
+      >
         <SettingTile
           title="Translate Messages Into"
           description={

src/app/features/settings/notifications/NotificationModeSwitcher.tsx

@@ -98,7 +98,7 @@ export function NotificationModeSwitcher({ pushRule, onChange }: NotificationMod
                     key={mode}
                     size="300"
                     variant="Surface"
-                    aria-selected={mode === selectedMode}
+                    aria-pressed={mode === selectedMode}
                     radii="300"
                     onClick={() => handleSelect(mode)}
                   >

src/app/features/settings/styles.css.ts

@@ -1,6 +1,18 @@
-import { style } from '@vanilla-extract/css';
-import { config } from 'folds';
+import { globalStyle, style } from '@vanilla-extract/css';
+import { color, config } from 'folds';
 
 export const SequenceCardStyle = style({
   padding: config.space.S300,
 });
+
+/**
+ * [Gitea #273] Several settings share one card; without a separator the next
+ * tile's title read like part of the previous description. A thin line goes
+ * between tiles only (not between a tile and its own slider or note).
+ */
+export const SettingTileGroup = style({});
+// globalStyle: vanilla-extract's `selectors` may only target the element itself.
+globalStyle(`${SettingTileGroup} > [data-setting-tile] ~ [data-setting-tile]`, {
+  borderTop: `1px solid color-mix(in srgb, ${color.SurfaceVariant.OnContainer} 14%, transparent)`,
+  paddingTop: config.space.S400,
+});

src/app/features/space-settings/SpaceSettingsRenderer.tsx

@@ -21,7 +21,7 @@ function RenderSettings({ state }: RenderSettingsProps) {
   if (!room) return null;
 
   return (
-    <Modal500 requestClose={closeSettings}>
+    <Modal500 requestClose={closeSettings} label={`${room.name} space settings`}>
       <SpaceProvider value={space ?? null}>
         <RoomProvider value={room}>
           <SpaceSettings initialPage={page} requestClose={closeSettings} />

src/app/hooks/useCallError.ts

@@ -0,0 +1,41 @@
+import { useCallback, useEffect, useRef, useState } from 'react';
+import { SyncState } from 'matrix-js-sdk';
+import { CALL_ERROR_CHANGED, CallControl } from '../plugins/call/CallControl';
+import { CallErrorState } from '../plugins/call/callError';
+import { useMatrixClient } from './useMatrixClient';
+import { useSyncState } from './useSyncState';
+
+/** [Gitea #318] The fork's current call error (null while the call is fine). */
+export function useCallError(control: CallControl): CallErrorState {
+  const [err, setErr] = useState(control.callError);
+  useEffect(() => {
+    const on = () => setErr(control.callError);
+    on();
+    control.on(CALL_ERROR_CHANGED, on);
+    return () => {
+      control.off(CALL_ERROR_CHANGED, on);
+    };
+  }, [control]);
+  return err;
+}
+
+/**
+ * [Gitea #318] After a homeserver stall the call drops with "Connection
+ * lost". Once sync is back, reconnect automatically (once per drop).
+ */
+export function useReconnectWhenSynced(control: CallControl): void {
+  const mx = useMatrixClient();
+  const err = useCallError(control);
+  const tried = useRef<CallErrorState>(null);
+  useSyncState(
+    mx,
+    useCallback(
+      (state: SyncState | null) => {
+        if (state !== SyncState.Syncing || !err?.recoverable || tried.current === err) return;
+        tried.current = err;
+        control.reconnect();
+      },
+      [err, control],
+    ),
+  );
+}

src/app/hooks/usePresenceUpdater.ts

@@ -1,20 +1,27 @@
 import { useEffect, useRef } from 'react';
 import { SetPresence } from 'matrix-js-sdk';
-import { PresenceDeduper, PresenceWrite } from '../utils/presenceWrite';
+import { PresenceDeduper, PresenceWrite, writePresence } from '../utils/presenceWrite';
 import { useMatrixClient } from './useMatrixClient';
 import { getLastLocalStatusWrite, pickHeartbeatStatus } from '../utils/ownStatusSync';
 import { useSetting } from '../state/hooks/settings';
 import { settingsAtom } from '../state/settings';
+import {
+  BUSY_PRESENCE,
+  BUSY_PRESENCE_FEATURE,
+  isBusyPresenceSupported,
+  setBusyPresenceSupported,
+} from '../utils/busyPresence';
 
 const IDLE_TIMEOUT_MS = 10 * 60 * 1000;
 const ACTIVITY_THROTTLE_MS = 1000;
 
 export type PresenceSetting = 'auto' | 'online' | 'idle' | 'dnd' | 'invisible';
-export type PresenceState = 'online' | 'unavailable' | 'offline';
+export type PresenceState = 'online' | 'unavailable' | 'offline' | typeof BUSY_PRESENCE;
 
 /**
  * Single source of truth for mapping the user's presence preference to the
- * Matrix presence value: auto/online → 'online', idle/dnd → 'unavailable',
+ * Matrix presence value: auto/online → 'online', idle → 'unavailable', dnd →
+ * MSC3026 busy (or 'unavailable' where the server lacks it),
  * invisible (or the hidePresence override) → 'offline'. Shared with the Profile
  * status writer so setting/clearing a status message never overrides the user's
  * chosen presence (e.g. outing an Invisible user as online).
@@ -24,7 +31,10 @@ export function presenceStateFromSetting(
   hidePresence: boolean,
 ): PresenceState {
   if (hidePresence || presenceStatus === 'invisible') return 'offline';
-  if (presenceStatus === 'idle' || presenceStatus === 'dnd') return 'unavailable';
+  // [Gitea #283] DND is MSC3026 busy where the server supports it, so status
+  // writes (save / clear / auto-clear) don't downgrade it to "unavailable".
+  if (presenceStatus === 'dnd') return isBusyPresenceSupported() ? BUSY_PRESENCE : 'unavailable';
+  if (presenceStatus === 'idle') return 'unavailable';
   return 'online';
 }
 
@@ -62,8 +72,7 @@ export function usePresenceUpdater() {
     // by a heartbeat that changed nothing.
     const send = (write: PresenceWrite, label: string) => {
       if (!deduper.shouldSend(write)) return Promise.resolve();
-      return mx
-        .setPresence(write)
+      return writePresence(mx, write)
         .then(() => deduper.sent(write))
         .catch((err) => warnPresenceFailure(label, err));
     };
@@ -134,7 +143,22 @@ export function usePresenceUpdater() {
       return undefined;
     }
     if (presenceStatus === 'dnd') {
-      setUnavailable('dnd');
+      // [Gitea #283] Real "busy" presence where supported: the status text
+      // stays yours. /sync reporting "online" doesn't override busy on
+      // Synapse, so the sync loop can stay online. Older servers keep the
+      // legacy unavailable + "dnd" text encoding.
+      mx.doesServerSupportUnstableFeature(BUSY_PRESENCE_FEATURE)
+        .catch(() => false)
+        .then(async (busy) => {
+          setBusyPresenceSupported(busy);
+          if (!busy) {
+            setUnavailable('dnd');
+            return;
+          }
+          syncPresence(SetPresence.Online);
+          const status = await resolveStatus();
+          send({ presence: BUSY_PRESENCE, ...(status ? { status_msg: status } : {}) }, 'busy');
+        });
       return undefined;
     }
 

src/app/hooks/useUserPresence.ts

@@ -6,6 +6,8 @@ export enum Presence {
   Online = 'online',
   Unavailable = 'unavailable',
   Offline = 'offline',
+  // [Gitea #283] MSC3026 busy: Lotus's Do Not Disturb.
+  Busy = 'org.matrix.msc3026.busy',
 }
 
 export type UserPresence = {
@@ -129,6 +131,7 @@ export const usePresenceLabel = (): Record<Presence, string> =>
       [Presence.Online]: 'Online',
       [Presence.Unavailable]: 'Idle',
       [Presence.Offline]: 'Offline',
+      [Presence.Busy]: 'Do Not Disturb',
     }),
     [],
   );

src/app/pages/client/ClientRoot.tsx

@@ -33,6 +33,8 @@ import {
 } from '../../../client/initMatrix';
 import { deleteSearchCacheDatabase } from '../../utils/searchCache';
 import { clearPlaintextCaches } from '../../state/plaintextCaches';
+import { clearSoundboardClipCache } from '../../utils/soundboardClips';
+import { clearSharedPayload } from '../../../swShare';
 import { SplashScreen } from '../../components/splash-screen';
 import { ServerConfigsLoader } from '../../components/ServerConfigsLoader';
 import { CapabilitiesProvider } from '../../hooks/useCapabilities';
@@ -172,6 +174,10 @@ const useLogoutListener = (mx?: MatrixClient) => {
       // (translation, scheduled messages, recent searches/forwards/gifs/
       // stickers, nav paths) — wipe them on server-forced logout too.
       clearPlaintextCaches(mx?.getUserId() ?? undefined);
+      // [Gitea #57] As on manual logout: no decrypted clip bytes via blob: URLs.
+      clearSoundboardClipCache();
+      // [Gitea #267] As on manual logout: drop files stashed by the share target.
+      await clearSharedPayload().catch(() => undefined);
       // Remove only the session credential keys — NOT settings, drafts, and
       // other preferences (N98). The SDK's IndexedDB stores are cleared above;
       // window.localStorage.clear() is reserved for the explicit reset path.

src/app/pages/client/SyncStatus.tsx

@@ -65,12 +65,12 @@ export function SyncStatus({ mx }: SyncStatusProps) {
     );
   }
 
-  if (
-    (stateData.current === SyncState.Prepared ||
-      stateData.current === SyncState.Syncing ||
-      stateData.current === SyncState.Catchup) &&
-    stateData.previous !== SyncState.Syncing
-  ) {
+  // [Gitea #274] Only while catching up after a drop. Upstream also showed it
+  // for PREPARED and for the first SYNCING after PREPARED/RECONNECTING, i.e.
+  // until the NEXT /sync returned: on a quiet account that long-polls ~30 s
+  // while the app already works (a SYNCING means a sync just succeeded).
+  // A real failure still surfaces as Reconnecting / Connection lost.
+  if (stateData.current === SyncState.Catchup) {
     return (
       <Box direction="Column" shrink="No">
         <Box

src/app/pages/client/inbox/Invites.tsx

@@ -369,7 +369,7 @@ function InviteFilters({
     <Box gap="200">
       <Chip
         variant={isKnown ? 'Success' : 'Surface'}
-        aria-selected={isKnown}
+        aria-pressed={isKnown}
         outlined={!isKnown}
         onClick={() => onFilter(InviteFilter.Known)}
         before={isKnown && <Icon size="100" src={Icons.Check} />}
@@ -385,7 +385,7 @@ function InviteFilters({
       </Chip>
       <Chip
         variant={isUnknown ? 'Warning' : 'Surface'}
-        aria-selected={isUnknown}
+        aria-pressed={isUnknown}
         outlined={!isUnknown}
         onClick={() => onFilter(InviteFilter.Unknown)}
         before={isUnknown && <Icon size="100" src={Icons.Check} />}
@@ -401,7 +401,7 @@ function InviteFilters({
       </Chip>
       <Chip
         variant={isSpam ? 'Critical' : 'Surface'}
-        aria-selected={isSpam}
+        aria-pressed={isSpam}
         outlined={!isSpam}
         onClick={() => onFilter(InviteFilter.Spam)}
         before={isSpam && <Icon size="100" src={Icons.Check} />}

src/app/pages/client/share/Share.tsx

@@ -145,6 +145,11 @@ export function Share() {
               <Box direction="Column" gap="400">
                 <Box direction="Column" gap="200">
                   <Text size="L400">Shared</Text>
+                  {/* [Gitea #267] Not everything that arrives here came from the
+                      user's share sheet; say so before they pick a room. */}
+                  <Text size="T200" priority="300">
+                    This came from another app or website. Check it before you send it.
+                  </Text>
                   {shared.files.map((f) => (
                     <Box key={f.name} alignItems="Center" gap="200">
                       <Icon

src/app/pages/client/sidebar/SettingsTab.tsx

@@ -217,7 +217,7 @@ export function SettingsTab() {
       </SidebarItemTooltip>
       <PresencePicker />
       {settingsOpen && (
-        <Modal500 requestClose={() => setSettingsOpen(false)}>
+        <Modal500 requestClose={() => setSettingsOpen(false)} label="Settings">
           <Settings initialPage={initialPage} requestClose={() => setSettingsOpen(false)} />
         </Modal500>
       )}

src/app/pages/client/sidebar/UnverifiedTab.tsx

@@ -82,7 +82,7 @@ function UnverifiedIndicator() {
         </SidebarItem>
       )}
       {settings && (
-        <Modal500 requestClose={closeSettings}>
+        <Modal500 requestClose={closeSettings} label="Settings">
           <Settings initialPage={SettingsPages.DevicesPage} requestClose={closeSettings} />
         </Modal500>
       )}

src/app/plugins/call/CallControl.ts

@@ -3,6 +3,7 @@ import { EventEmitter } from 'events';
 import { CallControlState } from './CallControlState';
 import { ElementMediaStateDetail, ElementMediaStatePayload, ElementWidgetActions } from './types';
 import { canDelegateCapability } from './utils';
+import { CallErrorState, parseCallError } from './callError';
 
 export enum CallControlEvent {
   StateUpdate = 'state_update',
@@ -54,6 +55,38 @@ export function parseForkHotkeyReport(data: unknown): ForkHotkeyReport | null {
   };
 }
 
+export const CALL_ERROR_CHANGED = 'call_error_changed';
+
+export const SCREENSHARE_AUDIO_STATE = 'screenshare_audio_state';
+
+/** Pure: parse the fork's `io.lotus.screenshare_audio_state` (#277). */
+export function parseScreenshareAudioState(data: unknown): boolean | undefined {
+  if (typeof data !== 'object' || data === null) return undefined;
+  const { present } = data as { present?: unknown };
+  return typeof present === 'boolean' ? present : undefined;
+}
+
+export type AudioOutputOption = { id: string; label: string };
+export const AUDIO_OUTPUT_STATE = 'audio_output_state';
+
+/** Pure: parse the fork's `io.lotus.audio_output_state` (#310). */
+export function parseAudioOutputState(
+  data: unknown,
+): { deviceId?: string; available?: AudioOutputOption[] } | undefined {
+  if (typeof data !== 'object' || data === null) return undefined;
+  const { deviceId, available } = data as { deviceId?: unknown; available?: unknown };
+  const list = Array.isArray(available)
+    ? available.filter(
+        (o): o is AudioOutputOption =>
+          typeof o === 'object' &&
+          o !== null &&
+          typeof (o as AudioOutputOption).id === 'string' &&
+          typeof (o as AudioOutputOption).label === 'string',
+      )
+    : undefined;
+  return { deviceId: typeof deviceId === 'string' ? deviceId : undefined, available: list };
+}
+
 export class CallControl extends EventEmitter implements CallControlState {
   private state: CallControlState;
 
@@ -212,11 +245,67 @@ export class CallControl extends EventEmitter implements CallControlState {
     return this._audioOutputId;
   }
 
+  // [Gitea #318] The fork's error page ("Connection lost") is up; the host
+  // kept showing the call as joined with controls that did nothing.
+  private _callError: CallErrorState = null;
+
+  public get callError(): CallErrorState {
+    return this._callError;
+  }
+
+  /** The fork's `io.lotus.call_error` report. */
+  public onCallError(data: unknown) {
+    const next = parseCallError(data);
+    if (next === undefined) return;
+    this._callError = next;
+    this.emit(CALL_ERROR_CHANGED);
+  }
+
+  /** Press the fork's Reconnect / Try again. */
+  public reconnect(): void {
+    this.call.transport.send('io.lotus.reconnect', {}).catch(() => undefined);
+  }
+
   public setAudioOutput(deviceId: string): void {
     this._audioOutputId = deviceId;
     this.sendAudioOutput(deviceId);
   }
 
+  // [Gitea #310] deviceIds are hashed per frame/origin, so ids from the
+  // host's own enumerateDevices() mean nothing inside the call iframe. The
+  // fork reports its outputs (ids valid in the frame) and its effective
+  // selection; the call bar's menu uses those when present.
+  private _audioOutputs: AudioOutputOption[] | undefined;
+
+  public get audioOutputs(): AudioOutputOption[] | undefined {
+    return this._audioOutputs;
+  }
+
+  /** The fork's `io.lotus.audio_output_state` report. */
+  public onAudioOutputState(data: unknown) {
+    const report = parseAudioOutputState(data);
+    if (!report) return;
+    this._audioOutputs = report.available;
+    if (report.deviceId !== undefined) this._audioOutputId = report.deviceId;
+    this.emit(AUDIO_OUTPUT_STATE);
+  }
+
+  // [Gitea #277] Whether a remote screenshare's audio is being received (the
+  // fork's `io.lotus.screenshare_audio_state`), so the call bar only offers
+  // "Mute Screenshare Audio" when there is something to mute.
+  private _remoteScreenshareAudio = false;
+
+  public get remoteScreenshareAudio(): boolean {
+    return this._remoteScreenshareAudio;
+  }
+
+  public onScreenshareAudioState(data: unknown) {
+    const present = parseScreenshareAudioState(data);
+    if (present === undefined || present === this._remoteScreenshareAudio) return;
+    this._remoteScreenshareAudio = present;
+    this.emit(SCREENSHARE_AUDIO_STATE);
+  }
+
   private sendAudioOutput(deviceId: string): void {
     if (!this.joined) return;
     this.call.transport.send('io.lotus.set_audio_output', { deviceId }).catch(() => undefined);

src/app/plugins/call/CallEmbed.ts

@@ -453,6 +453,24 @@ export class CallEmbed {
         this.control.onControlsState((evt.detail as { data?: unknown } | undefined)?.data);
       }),
     );
+    // [Gitea #318] The fork's error page ("Connection lost") is up / cleared.
+    this.disposables.push(
+      this.listenAction('io.lotus.call_error', (evt) => {
+        this.control.onCallError((evt.detail as { data?: unknown } | undefined)?.data);
+      }),
+    );
+    // [Gitea #310] The fork's own output list + selection (frame-valid ids).
+    this.disposables.push(
+      this.listenAction('io.lotus.audio_output_state', (evt) => {
+        this.control.onAudioOutputState((evt.detail as { data?: unknown } | undefined)?.data);
+      }),
+    );
+    // [Gitea #277] Remote screenshare audio being received, or not.
+    this.disposables.push(
+      this.listenAction('io.lotus.screenshare_audio_state', (evt) => {
+        this.control.onScreenshareAudioState((evt.detail as { data?: unknown } | undefined)?.data);
+      }),
+    );
     // [Gitea #43] PTT / deafen keys pressed while focus is inside the frame.
     this.disposables.push(
       this.listenAction('io.lotus.hotkey', (evt) => {

src/app/plugins/call/audioOutputState.test.ts

@@ -0,0 +1,24 @@
+import { test } from 'node:test';
+import assert from 'node:assert/strict';
+import { parseAudioOutputState } from './CallControl';
+
+test('parseAudioOutputState: keeps valid options, tolerates garbage (#310)', () => {
+  assert.deepEqual(
+    parseAudioOutputState({
+      deviceId: 'f2',
+      available: [{ id: '', label: 'Default' }, { id: 'f2', label: 'Headset' }, { id: 3 }, null],
+    }),
+    {
+      deviceId: 'f2',
+      available: [
+        { id: '', label: 'Default' },
+        { id: 'f2', label: 'Headset' },
+      ],
+    },
+  );
+  assert.deepEqual(parseAudioOutputState({ deviceId: null }), {
+    deviceId: undefined,
+    available: undefined,
+  });
+  assert.equal(parseAudioOutputState('x'), undefined);
+});

src/app/plugins/call/callError.test.ts

@@ -0,0 +1,17 @@
+import { test } from 'node:test';
+import assert from 'node:assert/strict';
+import { parseCallError } from './callError';
+
+test('parseCallError (#318)', () => {
+  assert.deepEqual(parseCallError({ code: 'CONNECTION_LOST_ERROR', recoverable: true }), {
+    code: 'CONNECTION_LOST_ERROR',
+    recoverable: true,
+  });
+  assert.deepEqual(parseCallError({ code: 'E2EE_NOT_SUPPORTED' }), {
+    code: 'E2EE_NOT_SUPPORTED',
+    recoverable: false,
+  });
+  assert.equal(parseCallError({ code: null }), null);
+  assert.equal(parseCallError({}), undefined);
+  assert.equal(parseCallError('x'), undefined);
+});

src/app/plugins/call/callError.ts

@@ -0,0 +1,14 @@
+/**
+ * [Gitea #318] The fork's `io.lotus.call_error`: its error page is showing
+ * (`{ code, recoverable }`) or was cleared (`{ code: null }`).
+ */
+export type CallErrorState = { code: string; recoverable: boolean } | null;
+
+/** Pure: parse a report; undefined for garbage (ignored). */
+export function parseCallError(data: unknown): CallErrorState | undefined {
+  if (typeof data !== 'object' || data === null) return undefined;
+  const { code, recoverable } = data as { code?: unknown; recoverable?: unknown };
+  if (code === null) return null;
+  if (typeof code !== 'string' || !code) return undefined;
+  return { code, recoverable: recoverable === true };
+}

src/app/plugins/call/screenshareAudioState.test.ts

@@ -0,0 +1,12 @@
+import { test } from 'node:test';
+import assert from 'node:assert/strict';
+import { parseScreenshareAudioState } from './CallControl';
+
+test('parseScreenshareAudioState: reads present, ignores anything else (#277)', () => {
+  assert.equal(parseScreenshareAudioState({ present: true }), true);
+  assert.equal(parseScreenshareAudioState({ present: false }), false);
+  assert.equal(parseScreenshareAudioState({ present: 'yes' }), undefined);
+  assert.equal(parseScreenshareAudioState({}), undefined);
+  assert.equal(parseScreenshareAudioState(null), undefined);
+  assert.equal(parseScreenshareAudioState('present'), undefined);
+});

src/app/state/plaintextCaches.test.ts

@@ -26,7 +26,10 @@ const api = {
       : Object.getOwnPropertyDescriptor(target, key),
 });
 
-const { clearPlaintextCaches, plaintextCachesWiped } = await import('./plaintextCaches');
+const { clearPlaintextCaches, plaintextCachesWiped, WIDGET_CONSENT_KEY_PREFIX } =
+  await import('./plaintextCaches');
+const { WIDGET_CONSENT_PREFIX, widgetConsentKey } =
+  await import('../features/room/widgets/widgetUtils');
 
 test('clearPlaintextCaches removes every plaintext/PII localStorage key', () => {
   store.clear();
@@ -104,3 +107,17 @@ test('clearPlaintextCaches clears the encrypted-search opt-in and flags the wipe
   assert.equal(store.has('mxjssdk_memory_filter_FILTER_SYNC_@me:server'), false);
   assert.equal(plaintextCachesWiped(), true, 'draft writes stop until the page reloads');
 });
+
+test('[#266] clearPlaintextCaches sweeps remembered widget approvals', () => {
+  assert.equal(WIDGET_CONSENT_KEY_PREFIX, WIDGET_CONSENT_PREFIX, 'prefix kept in sync');
+  store.clear();
+  const consent = widgetConsentKey('!room:server', 'widget-1');
+  store.set(consent, '{"url":"https://pad.example","allowed":[],"denied":[]}');
+  store.set('lotus.widgetConsentNotAKey', 'kept');
+  removed.length = 0;
+
+  clearPlaintextCaches('@me:server');
+
+  assert.ok(removed.includes(consent), 'consent cleared');
+  assert.ok(store.has('lotus.widgetConsentNotAKey'), 'unrelated key kept');
+});

src/app/state/plaintextCaches.ts

@@ -139,6 +139,31 @@ const clearAccountScopedFlags = (userId?: string): void => {
   });
 };
 
+/**
+ * [Gitea #266] Remembered widget approvals (`lotus.widgetConsent.<room>.<widget>`,
+ * widgetUtils.ts) would otherwise apply silently to the next account on this
+ * device, and their keys list the previous account's rooms. Kept as a string
+ * here so logout doesn't pull the widget code into the entry chunk; a test
+ * checks it matches WIDGET_CONSENT_PREFIX.
+ */
+export const WIDGET_CONSENT_KEY_PREFIX = 'lotus.widgetConsent.';
+const clearWidgetConsents = (): void => {
+  let keys: string[];
+  try {
+    keys = Object.keys(localStorage);
+  } catch {
+    return;
+  }
+  keys.forEach((key) => {
+    if (!key.startsWith(WIDGET_CONSENT_KEY_PREFIX)) return;
+    try {
+      localStorage.removeItem(key);
+    } catch {
+      // best-effort
+    }
+  });
+};
+
 export const clearPlaintextCaches = (userId?: string): void => {
   wiped = true;
   clearTranslationCache();
@@ -153,5 +178,6 @@ export const clearPlaintextCaches = (userId?: string): void => {
   clearStatusMessage();
   clearCallVolumesAndSyncMeta(userId);
   clearAccountScopedFlags(userId);
+  clearWidgetConsents();
   if (userId) clearNavToActivePathStore(userId);
 };

src/app/styles/sidePanel.ts

@@ -0,0 +1,9 @@
+import { toRem } from 'folds';
+
+/**
+ * One width for every right-hand room panel (members, bookmarks, threads, a
+ * thread, media gallery, widgets). Swapping one panel for another must not
+ * resize the room view: when the widths differed, the header icons slid
+ * sideways and a second click on the same spot hit a different button (#263).
+ */
+export const SIDE_PANEL_WIDTH = toRem(340);

src/app/utils/busyPresence.test.ts

@@ -0,0 +1,11 @@
+import { test } from 'node:test';
+import assert from 'node:assert/strict';
+import { BUSY_PRESENCE, isDndPresence } from './busyPresence';
+
+test('isDndPresence: busy, or the legacy unavailable + "dnd" text (#283)', () => {
+  assert.equal(isDndPresence(BUSY_PRESENCE, '🎮 Gaming'), true);
+  assert.equal(isDndPresence(BUSY_PRESENCE, undefined), true);
+  assert.equal(isDndPresence('unavailable', 'dnd'), true);
+  assert.equal(isDndPresence('unavailable', 'lunch'), false);
+  assert.equal(isDndPresence('online', 'dnd'), false);
+});

src/app/utils/busyPresence.ts

@@ -0,0 +1,21 @@
+/**
+ * [Gitea #283] Do Not Disturb as a real presence state: MSC3026 "busy"
+ * (Synapse `experimental_features.msc3026_enabled`). Before, DND was sent as
+ * presence `unavailable` with the literal status text "dnd", which replaced
+ * your status and showed as "dnd" in other clients.
+ */
+export const BUSY_PRESENCE = 'org.matrix.msc3026.busy';
+export const BUSY_PRESENCE_FEATURE = 'org.matrix.msc3026.busy_presence';
+
+let busySupported = false;
+
+/** Recorded by the presence updater from the server's unstable_features. */
+export const setBusyPresenceSupported = (supported: boolean): void => {
+  busySupported = supported;
+};
+
+export const isBusyPresenceSupported = (): boolean => busySupported;
+
+/** Pure: whether a presence means Do Not Disturb (busy, or the legacy "dnd" text). */
+export const isDndPresence = (presence: string | undefined, status: string | undefined): boolean =>
+  presence === BUSY_PRESENCE || (presence === 'unavailable' && status === 'dnd');

src/app/utils/notifications.test.ts

@@ -169,7 +169,7 @@ test('private receipt flag uses ReadPrivate', async () => {
 // follows unread; an explicit mark-as-read still clears everything.
 const sender = (userId: string) => ({ getSender: () => userId });
 
-test('passive: a thread I replied in stays unread; main receipt is scoped to main', async () => {
+test('passive: threads stay unread, followed or not; main receipt is scoped to main (#314)', async () => {
   const mine = thread('$mine', evt('$r1'), { hasCurrentUserParticipated: true });
   const other = thread('$other', evt('$r2'));
   const { mx, calls } = setup({
@@ -181,10 +181,9 @@ test('passive: a thread I replied in stays unread; main receipt is scoped to mai
   await markAsRead(mx, '!r:server', false, { passive: true });
   assert.deepEqual(
     calls.map((c) => [c.eventId, c.unthreaded]),
-    [
-      ['b', false], // main-scoped: unthreaded would also read $mine's reply
-      ['$r2', false],
-    ],
+    // main-scoped (unthreaded would read the threads' replies), and no thread
+    // receipts: [Gitea #314] unfollowed threads used to be read silently.
+    [['b', false]],
   );
 });
 
@@ -203,7 +202,7 @@ test('passive: threads I started or was mentioned in stay unread', async () => {
   assert.equal(calls.length, 0);
 });
 
-test('passive: no followed thread unread → main receipt stays unthreaded', async () => {
+test('passive: an unfollowed unread thread is left unread too (#314)', async () => {
   const other = thread('$other', evt('$r2'), { rootEvent: sender('@bob:server') });
   const { mx, calls } = setup({
     timeline: [evt('a'), evt('b')],
@@ -214,10 +213,16 @@ test('passive: no followed thread unread → main receipt stays unthreaded', asy
   await markAsRead(mx, '!r:server', false, { passive: true });
   assert.deepEqual(
     calls.map((c) => [c.eventId, c.unthreaded]),
-    [
-      ['b', true],
-      ['$r2', false],
-    ],
+    [['b', false]],
+  );
+});
+
+test('passive: no thread unread → main receipt stays unthreaded', async () => {
+  const { mx, calls } = setup({ timeline: [evt('a'), evt('b')], readUpTo: 'a', threads: [] });
+  await markAsRead(mx, '!r:server', false, { passive: true });
+  assert.deepEqual(
+    calls.map((c) => [c.eventId, c.unthreaded]),
+    [['b', true]],
   );
 });
 
@@ -249,9 +254,10 @@ test('passive: the thread open in the panel is left to the panel', async () => {
     threadUnread: { $open: 1, $other: 1 },
   });
   await markAsRead(mx, '!r:server', false, { passive: true, openThreadId: '$open' });
+  // The open thread is left to the panel, and [#314] the other one stays unread.
   assert.deepEqual(
     calls.map((c) => c.eventId),
-    ['$r2'],
+    [],
   );
 });
 

src/app/utils/notifications.ts

@@ -1,27 +1,19 @@
-import { MatrixClient, NotificationCountType, ReceiptType, Room, Thread } from 'matrix-js-sdk';
+import { MatrixClient, NotificationCountType, ReceiptType, Thread } from 'matrix-js-sdk';
 import { getSettings } from '../state/settings';
 import { readMarkedUnread, setMarkedUnread } from '../state/room/markedUnread';
+import { isThreadFollowed } from './room';
 
-/**
- * [Gitea #217] Threads the user is following: they started it, replied in it,
- * or were mentioned in it. `hasCurrentUserParticipated` comes from the server's
- * thread bundle and lags a reply we just sent, so our own loaded events count too.
- */
-export function isThreadFollowed(room: Room, thread: Thread, userId: string | null): boolean {
-  if (thread.hasCurrentUserParticipated) return true;
-  if (userId && thread.rootEvent?.getSender() === userId) return true;
-  if (userId && thread.timeline?.some((e) => e.getSender() === userId)) return true;
-  return (
-    (room.getThreadUnreadNotificationCount(thread.id, NotificationCountType.Highlight) ?? 0) > 0
-  );
-}
+// isThreadFollowed lives in utils/room (getUnreadInfo needs it too).
+export { isThreadFollowed };
 
 export type MarkAsReadOptions = {
   /**
    * [Gitea #217] The read comes from simply looking at the room (timeline at
-   * the bottom and focused), not an explicit "mark as read". Threads the user
-   * follows stay unread until their panel is opened, like Slack and Discord;
-   * the rest are cleared so they don't keep the room dot lit forever.
+   * the bottom and focused), not an explicit "mark as read". Threads stay
+   * unread until opened (or "Mark all read"), like Slack and Discord.
+   * [Gitea #314] That includes threads you don't follow; those no longer
+   * count toward the room's unread dot (see getUnreadInfo), so leaving them
+   * unread doesn't keep the room lit.
    */
   passive?: boolean;
   /**
@@ -66,7 +58,9 @@ export async function markAsRead(
   const threads = room.getThreads();
   const threadUnread = (thread: Thread) =>
     room.getThreadUnreadNotificationCount(thread.id, NotificationCountType.Total) ?? 0;
-  const keepThread = (thread: Thread) => passive && isThreadFollowed(room, thread, mx.getUserId());
+  // [Gitea #314] A passive read leaves every thread's state alone (it used to
+  // silently read every thread you don't follow).
+  const keepThread = (_thread: Thread) => passive;
   // [Gitea #217] An unthreaded receipt also reads every thread reply older than
   // it, so a passive read while a followed thread is unread must stay scoped
   // to the main timeline or the next main message would clear that thread.

src/app/utils/presenceWrite.ts

@@ -1,4 +1,5 @@
-import { MatrixClient, MatrixError } from 'matrix-js-sdk';
+import { MatrixClient, MatrixError, IPresenceOpts, Method } from 'matrix-js-sdk';
+import { BUSY_PRESENCE } from './busyPresence';
 
 /**
  * Synapse rate-limits `PUT /presence/{user}/status` to ONE request per 10 s per
@@ -10,7 +11,29 @@ import { MatrixClient, MatrixError } from 'matrix-js-sdk';
  * and `PresenceDeduper` lets the heartbeat skip writes that would not change
  * anything, so it stops spending the budget in the first place.
  */
-export type PresenceWrite = { presence: 'online' | 'offline' | 'unavailable'; status_msg?: string };
+export type PresenceWrite = {
+  // [Gitea #283] or MSC3026 busy (Do Not Disturb)
+  presence: 'online' | 'offline' | 'unavailable' | typeof BUSY_PRESENCE;
+  status_msg?: string;
+};
+
+/**
+ * `mx.setPresence` for a PresenceWrite. The SDK refuses anything but the three
+ * spec presences ("Bad presence value"), so MSC3026 busy (#283) goes straight
+ * to the same endpoint.
+ */
+export const writePresence = async (
+  mx: Pick<MatrixClient, 'setPresence'> & Partial<Pick<MatrixClient, 'getSafeUserId' | 'http'>>,
+  write: PresenceWrite,
+): Promise<void> => {
+  if (write.presence !== BUSY_PRESENCE) {
+    await mx.setPresence(write as IPresenceOpts);
+    return;
+  }
+  if (!mx.getSafeUserId || !mx.http) throw new Error('busy presence needs a full MatrixClient');
+  const path = `/presence/${encodeURIComponent(mx.getSafeUserId())}/status`;
+  await mx.http.authedRequest(Method.Put, path, undefined, write);
+};
 
 const sleep = (ms: number) =>
   new Promise<void>((r) => {
@@ -28,7 +51,7 @@ export async function setPresenceWithRetry(
   for (;;) {
     try {
       // eslint-disable-next-line no-await-in-loop
-      await mx.setPresence(write);
+      await writePresence(mx, write);
       return;
     } catch (e) {
       if (!(e instanceof MatrixError) || e.httpStatus !== 429) throw e;

src/app/utils/room.test.ts

@@ -928,3 +928,42 @@ test('getAllVersionsRoomCreator returns empty set when no create event', () => {
 test('EventTimeline.FORWARDS constant is available', () => {
   assert.equal(typeof EventTimeline.FORWARDS, 'string');
 });
+
+test('getUnreadInfo: unfollowed threads do not light the room; followed and mentioned do (#314)', () => {
+  const threads = [
+    { id: '$followed', hasCurrentUserParticipated: true },
+    { id: '$other' },
+    { id: '$mention' },
+  ];
+  const counts: Record<string, { total: number; highlight: number }> = {
+    $followed: { total: 2, highlight: 0 },
+    $other: { total: 3, highlight: 0 },
+    $mention: { total: 1, highlight: 1 },
+  };
+  const room = {
+    roomId: '!r:x',
+    // Server room totals include thread counts: 2 + 3 + 1 thread, 0 main.
+    getUnreadNotificationCount: (type: NotificationCountType) =>
+      type === NotificationCountType.Total ? 6 : 1,
+    getThreads: () => threads,
+    getThreadUnreadNotificationCount: (id: string, type: NotificationCountType) =>
+      type === NotificationCountType.Total ? counts[id].total : counts[id].highlight,
+    getEventReadUpTo: () => null,
+    getLiveTimeline: () => ({ getEvents: () => [] }),
+  } as unknown as Room;
+  const me = { getUserId: () => '@me:x' } as unknown as MatrixClient;
+  assert.deepEqual(getUnreadInfo(room, undefined, me), { roomId: '!r:x', highlight: 1, total: 3 });
+  // Only an unfollowed thread is unread: the room isn't lit.
+  counts.$followed.total = 0;
+  counts.$mention = { total: 0, highlight: 0 };
+  const onlyOther = {
+    ...room,
+    getUnreadNotificationCount: (type: NotificationCountType) =>
+      type === NotificationCountType.Total ? 3 : 0,
+  } as unknown as Room;
+  assert.deepEqual(getUnreadInfo(onlyOther, undefined, me), {
+    roomId: '!r:x',
+    highlight: 0,
+    total: 0,
+  });
+});

src/app/utils/room.ts

@@ -18,6 +18,7 @@ import {
   NotificationCountType,
   RelationType,
   Room,
+  Thread,
   RoomMember,
   TimelineEvents,
   IRoomTimelineData,
@@ -418,6 +419,20 @@ export const roomHaveUnread = (mx: MatrixClient, room: Room) => {
   return true;
 };
 
+/**
+ * [Gitea #217] Threads the user is following: they started it, replied in it,
+ * or were mentioned in it. `hasCurrentUserParticipated` comes from the server's
+ * thread bundle and lags a reply we just sent, so our own loaded events count too.
+ */
+export function isThreadFollowed(room: Room, thread: Thread, userId: string | null): boolean {
+  if (thread.hasCurrentUserParticipated) return true;
+  if (userId && thread.rootEvent?.getSender() === userId) return true;
+  if (userId && thread.timeline?.some((e) => e.getSender() === userId)) return true;
+  return (
+    (room.getThreadUnreadNotificationCount(thread.id, NotificationCountType.Highlight) ?? 0) > 0
+  );
+}
+
 export const getUnreadInfo = (
   room: Room,
   mutedThreads?: Set<string>,
@@ -439,6 +454,18 @@ export const getUnreadInfo = (
     if (highlight < 0) highlight = 0;
   }
 
+  // [Gitea #314] Threads you don't follow stay unread in the Threads panel
+  // (viewing the room no longer reads them) but don't light the room's dot.
+  // A mention makes a thread followed, so highlights are never subtracted.
+  if (mx) {
+    room.getThreads().forEach((thread) => {
+      if (mutedThreads?.has(thread.id)) return;
+      if (isThreadFollowed(room, thread, mx.getUserId())) return;
+      total -= room.getThreadUnreadNotificationCount(thread.id, NotificationCountType.Total) ?? 0;
+    });
+    if (total < 0) total = 0;
+  }
+
   const resolvedTotal = highlight > total ? highlight : total;
 
   // Suppress a spurious Total when the room isn't really unread. Two safe cases,

src/app/utils/scheduledMessages.test.ts

@@ -179,3 +179,15 @@ test('groupScheduledByRoom: groups and sorts by sendAt', () => {
   );
   assert.equal(g.get('!2')?.length, 1);
 });
+
+test('[#275] the server limit maps to friendly text; other errors keep theirs', async () => {
+  const { describeScheduleError, SCHEDULE_TOO_FAR_TEXT, MAX_SCHEDULE_AHEAD_MS } =
+    await import('./scheduledMessages');
+  assert.equal(MAX_SCHEDULE_AHEAD_MS, 86_400_000);
+  const tooLarge = Object.assign(new Error('The requested delay (172800000ms) exceeds…'), {
+    errcode: 'ORG.MATRIX.MSC4140_DELAY_TOO_LARGE',
+  });
+  assert.equal(describeScheduleError(tooLarge), SCHEDULE_TOO_FAR_TEXT);
+  assert.equal(describeScheduleError(new Error('Boom')), 'Boom');
+  assert.equal(describeScheduleError('nope'), 'Failed to schedule message.');
+});

src/app/utils/scheduledMessages.ts

@@ -1,6 +1,22 @@
 import { IContent, MatrixClient, Method } from 'matrix-js-sdk';
 import type { ScheduledMessage } from '../state/scheduledMessages';
 
+/**
+ * [Gitea #275] Production Synapse caps delayed events at
+ * `max_event_delay_duration: 24h`; a later time is rejected with
+ * ORG.MATRIX.MSC4140_DELAY_TOO_LARGE. The dialog enforces the same limit and
+ * the server's error maps to the same text, in case the limit changes.
+ */
+export const MAX_SCHEDULE_AHEAD_MS = 24 * 60 * 60 * 1000;
+export const SCHEDULE_TOO_FAR_TEXT = 'You can schedule up to 24 hours ahead.';
+
+/** A user-facing sentence for a failed schedule. */
+export const describeScheduleError = (err: unknown): string => {
+  const errcode = (err as { errcode?: unknown } | null)?.errcode;
+  if (errcode === 'ORG.MATRIX.MSC4140_DELAY_TOO_LARGE') return SCHEDULE_TOO_FAR_TEXT;
+  return err instanceof Error ? err.message : 'Failed to schedule message.';
+};
+
 /**
  * Schedule a message via MSC4140 (delayed messages).
  * Synapse implementation: pass org.matrix.msc4140.delay on the standard

src/app/utils/serverAcl.test.ts

@@ -1,6 +1,11 @@
 import { test } from 'node:test';
 import assert from 'node:assert/strict';
-import { isValidServerPattern, globToRegExp, matchesAnyGlob } from './serverAcl';
+import {
+  isValidServerPattern,
+  globToRegExp,
+  matchesAnyGlob,
+  normalizeServerAcl,
+} from './serverAcl';
 
 test('isValidServerPattern: accepts hostnames, IPs, and globs', () => {
   for (const v of [
@@ -42,3 +47,35 @@ test('matchesAnyGlob: true if any glob matches (self-ban detection)', () => {
   assert.equal(matchesAnyGlob('lotusguild.org', ['*.evil.com']), false);
   assert.equal(matchesAnyGlob('lotusguild.org', []), false);
 });
+
+test('no ACL event: every server allowed, IP literals allowed (#261)', () => {
+  assert.deepEqual(normalizeServerAcl(undefined), {
+    allow: ['*'],
+    deny: [],
+    allow_ip_literals: true,
+  });
+});
+
+test('a missing allow_ip_literals defaults to true, per the spec (#261)', () => {
+  assert.equal(normalizeServerAcl({ allow: ['*'], deny: ['bad.example'] }).allow_ip_literals, true);
+});
+
+test('an explicit allow_ip_literals is kept', () => {
+  assert.equal(
+    normalizeServerAcl({ allow: ['*'], allow_ip_literals: false }).allow_ip_literals,
+    false,
+  );
+  assert.equal(
+    normalizeServerAcl({ allow: ['*'], allow_ip_literals: true }).allow_ip_literals,
+    true,
+  );
+});
+
+test('missing or malformed lists become empty, non-strings are dropped', () => {
+  assert.deepEqual(normalizeServerAcl({ allow: ['a.example', 3, null] }), {
+    allow: ['a.example'],
+    deny: [],
+    allow_ip_literals: true,
+  });
+  assert.deepEqual(normalizeServerAcl({ allow: 'a.example', deny: {} }).allow, []);
+});

src/app/utils/serverAcl.ts

@@ -50,3 +50,29 @@ export function matchesAnyGlob(domain: string, globs: string[]): boolean {
     }
   });
 }
+
+/**
+ * `m.room.server_acl` content with the spec's defaults filled in (#261).
+ * `allow_ip_literals` defaults to **true** when absent; `allow` and `deny`
+ * default to empty lists, but with no ACL event at all every server is allowed,
+ * so the editor starts from `allow: ['*']` in that case.
+ * https://spec.matrix.org/v1.12/client-server-api/#mroomserver_acl
+ */
+export type ServerAclContent = {
+  allow: string[];
+  deny: string[];
+  allow_ip_literals: boolean;
+};
+
+const stringList = (value: unknown): string[] | undefined =>
+  Array.isArray(value) ? value.filter((v): v is string => typeof v === 'string') : undefined;
+
+export function normalizeServerAcl(content: Record<string, unknown> | undefined): ServerAclContent {
+  if (!content) return { allow: ['*'], deny: [], allow_ip_literals: true };
+  return {
+    allow: stringList(content.allow) ?? [],
+    deny: stringList(content.deny) ?? [],
+    allow_ip_literals:
+      typeof content.allow_ip_literals === 'boolean' ? content.allow_ip_literals : true,
+  };
+}

src/app/utils/topicMarkdown.test.ts

@@ -0,0 +1,72 @@
+import { test } from 'node:test';
+import assert from 'node:assert/strict';
+import { buildTopicContent } from './topicMarkdown';
+
+test('a URL with underscores is sent verbatim (#262)', () => {
+  const t = 'Rules: https://wiki.lotusguild.org/en/server_rules_and_faq';
+  assert.deepEqual(buildTopicContent(t), { topic: t });
+});
+
+test('a markdown link keeps its underscored URL in both fields (#262)', () => {
+  const c = buildTopicContent('[Our wiki](https://wiki.example.org/my_cool_page)');
+  assert.ok('formatted_body' in c);
+  assert.match(c.formatted_body, /href="https:\/\/wiki\.example\.org\/my_cool_page"/);
+  assert.equal(c.topic, 'Our wiki (https://wiki.example.org/my_cool_page)');
+});
+
+test('room aliases and user IDs with underscores are untouched (#262)', () => {
+  for (const t of [
+    'Join #my_room_name:matrix.org',
+    'Ask @some_user_x:matrix.org',
+    'see snake_case_word',
+  ]) {
+    assert.deepEqual(buildTopicContent(t), { topic: t });
+  }
+});
+
+test('emphasis still works at word boundaries', () => {
+  const c = buildTopicContent('this is _really_ *great* and **bold**');
+  assert.ok('formatted_body' in c);
+  assert.match(c.formatted_body, /<i data-md="_">really<\/i>/);
+  assert.match(c.formatted_body, /<i data-md="\*">great<\/i>/);
+  assert.match(c.formatted_body, /<strong data-md="\*\*">bold<\/strong>/);
+  assert.equal(c.topic, 'this is really great and bold');
+});
+
+test('emphasis around an alias keeps the alias intact', () => {
+  const c = buildTopicContent('**Join #my_room:matrix.org**');
+  assert.ok('formatted_body' in c);
+  assert.match(c.formatted_body, /<strong data-md="\*\*">Join #my_room:matrix\.org<\/strong>/);
+  assert.equal(c.topic, 'Join #my_room:matrix.org');
+});
+
+test('inline code keeps its underscores and no backslashes appear', () => {
+  const c = buildTopicContent('run `a_b_c` now');
+  assert.ok('formatted_body' in c);
+  assert.match(c.formatted_body, /<code data-md="`">a_b_c<\/code>/);
+  assert.equal(c.topic, 'run a_b_c now');
+});
+
+test('a double quote in a link target cannot break out of the attribute (#262)', () => {
+  const c = buildTopicContent('[x](https://a" onclick="alert(1))');
+  assert.ok('formatted_body' in c);
+  assert.doesNotMatch(c.formatted_body, /" onclick="/);
+});
+
+test('HTML in the topic is escaped, and the plain topic shows it as typed', () => {
+  const c = buildTopicContent('**<b>hi</b> & bye**');
+  assert.ok('formatted_body' in c);
+  assert.match(c.formatted_body, /&lt;b&gt;hi&lt;\/b&gt; &amp; bye/);
+  assert.equal(c.topic, '<b>hi</b> & bye');
+});
+
+test('line breaks become <br> and survive in the plain topic', () => {
+  const c = buildTopicContent('**Rules**\nBe nice');
+  assert.ok('formatted_body' in c);
+  assert.equal(c.formatted_body, '<strong data-md="**">Rules</strong><br>Be nice');
+  assert.equal(c.topic, 'Rules\nBe nice');
+});
+
+test('plain text with no markdown is sent as typed', () => {
+  assert.deepEqual(buildTopicContent("It's <fun> & games"), { topic: "It's <fun> & games" });
+});

src/app/utils/topicMarkdown.ts

@@ -0,0 +1,63 @@
+import { parseInlineMD } from '../plugins/markdown';
+import { sanitizeText } from './sanitize';
+
+/**
+ * Room topic markdown → `m.room.topic` content (#262).
+ *
+ * Uses the composer's inline markdown parser (the same rules as messages: links,
+ * bare URLs and `"` are handled), with one topic-specific guard: an `_` between
+ * two letters/digits is literal, as in CommonMark. Topics are full of
+ * `#room_alias:server`, `@user_name:server` and snake_case paths, which the
+ * shared parser would otherwise turn into italics and, worse, drop from the
+ * plain `topic` that every other client shows.
+ */
+
+// Spans the guard must not touch: inline code, link targets, bare URLs.
+const PROTECTED = /(`[^`\n]*`|\]\([^)\n]*\)|https?:\/\/[^\s<>"]+)/;
+const INTRAWORD_UNDERSCORES = /(?<=[\p{L}\p{N}])_+(?=[\p{L}\p{N}])/gu;
+
+const escapeIntrawordUnderscores = (line: string): string =>
+  line
+    .split(PROTECTED)
+    .map((part, i) =>
+      // split() with one capture group puts the protected spans at odd indexes.
+      i % 2 === 1 ? part : part.replace(INTRAWORD_UNDERSCORES, (m) => m.replace(/_/g, '\\_')),
+    )
+    .join('');
+
+const ENTITIES: Record<string, string> = {
+  '&amp;': '&',
+  '&lt;': '<',
+  '&gt;': '>',
+  '&quot;': '"',
+  '&#39;': "'",
+};
+const decodeEntities = (s: string): string =>
+  s.replace(/&(?:amp|lt|gt|quot|#39);/g, (e) => ENTITIES[e]);
+
+/** Readable plain text for `topic`: markers dropped, links kept as "text (url)". */
+const htmlToPlain = (html: string): string =>
+  decodeEntities(
+    html
+      .replace(/<a\b[^>]*\bhref="([^"]*)"[^>]*>(.*?)<\/a>/g, (_m, href: string, label: string) => {
+        const text = label.replace(/<[^>]+>/g, '');
+        return text === href ? href : `${text} (${href})`;
+      })
+      .replace(/<br>/g, '\n')
+      .replace(/<[^>]+>/g, ''),
+  );
+
+export type TopicContent =
+  | { topic: string }
+  | { topic: string; format: 'org.matrix.custom.html'; formatted_body: string };
+
+export function buildTopicContent(text: string): TopicContent {
+  const lines = text.split('\n');
+  const html = lines
+    .map((line) => parseInlineMD(sanitizeText(escapeIntrawordUnderscores(line))))
+    .join('<br>');
+  const plainHtml = lines.map(sanitizeText).join('<br>');
+  // No markdown at all: send the text as typed, without a formatted body.
+  if (html === plainHtml) return { topic: text };
+  return { topic: htmlToPlain(html), format: 'org.matrix.custom.html', formatted_body: html };
+}

src/app/utils/updateErrors.test.ts

@@ -69,13 +69,23 @@ test('install kinds: anything unknown keeps the in-app updater', async () => {
 test('package installs get their package manager’s command, not an Install button', async () => {
   const { packageUpdateHelp, isPackageManagedError } = await import('./updateErrors');
   const pacman = packageUpdateHelp('pacman')!;
-  // Not `pacman -U <url>`: that also wants `<url>.sig`, which we don't publish.
-  assert.equal(
-    pacman.command,
-    'curl -LO https://code.lotusguild.org/LotusGuild/cinny-desktop/releases/download/latest/LotusChat-x86_64.pkg.tar.zst && sudo pacman -U ./LotusChat-x86_64.pkg.tar.zst',
+  // [cinny-desktop #36] signature, then checksum, then install, in that order;
+  // a local `pacman -U ./file` (not `<url>`, which also wants `<url>.sig`).
+  const steps = pacman.command!.split(' && ');
+  assert.equal(steps[0], 'cd "$(mktemp -d)"');
+  assert.match(
+    steps[1],
+    /-fLO \S+\/LotusChat-x86_64\.pkg\.tar\.zst -fLO \S+\/SHA256SUMS\.txt -fLO \S+\/SHA256SUMS\.txt\.minisig$/,
   );
+  assert.equal(
+    steps[2],
+    'minisign -Vm SHA256SUMS.txt -P RWRZZdyii05/NUcz337A5SAbiZK+NPVDWuiL2mM5Jk1p/LfRmNfiZ/6l',
+  );
+  assert.equal(steps[3], 'sha256sum -c --ignore-missing SHA256SUMS.txt');
+  assert.equal(steps[4], 'sudo pacman -U ./LotusChat-x86_64.pkg.tar.zst');
   assert.match(pacman.url, /LotusChat-x86_64\.pkg\.tar\.zst$/);
   const deb = packageUpdateHelp('deb')!;
+  assert.match(deb.command!, /minisign -Vm SHA256SUMS\.txt/);
   assert.match(deb.command!, /sudo apt install \.\/LotusChat-x86_64\.deb$/);
   assert.equal(packageUpdateHelp('manual')?.command, undefined);
   assert.equal(packageUpdateHelp('in-app'), undefined);

src/app/utils/updateErrors.ts

@@ -64,23 +64,38 @@ export const toInstallKind = (value: unknown): InstallKind =>
 
 export type PackageUpdateHelp = { command?: string; url: string; download: string };
 
+/** The desktop updater's minisign public key (cinny-desktop tauri.conf.json). */
+export const RELEASE_MINISIGN_KEY = 'RWRZZdyii05/NUcz337A5SAbiZK+NPVDWuiL2mM5Jk1p/LfRmNfiZ/6l';
+
+/**
+ * [cinny-desktop #36] Download a Linux package and install it only after
+ * checking the release's minisign-signed SHA256SUMS.txt. Runs in a fresh temp
+ * directory so a stale SHA256SUMS.txt can't be picked up.
+ */
+const verifiedInstall = (file: string, install: string): string =>
+  [
+    `cd "$(mktemp -d)"`,
+    `curl -fLO ${RELEASE_DOWNLOAD}/${file} -fLO ${RELEASE_DOWNLOAD}/SHA256SUMS.txt -fLO ${RELEASE_DOWNLOAD}/SHA256SUMS.txt.minisig`,
+    `minisign -Vm SHA256SUMS.txt -P ${RELEASE_MINISIGN_KEY}`,
+    `sha256sum -c --ignore-missing SHA256SUMS.txt`,
+    `${install} ./${file}`,
+  ].join(' && ');
+
 export const packageUpdateHelp = (kind: InstallKind): PackageUpdateHelp | undefined => {
   if (kind === 'pacman') {
-    const url = `${RELEASE_DOWNLOAD}/LotusChat-x86_64.pkg.tar.zst`;
-    // Download first, then install the local file: `pacman -U <url>` also
-    // fetches `<url>.sig` and fails without it (we don't sign packages),
-    // while a local file falls under LocalFileSigLevel (signature optional).
+    // Install the local file: `pacman -U <url>` also fetches `<url>.sig` and
+    // fails without it (packages aren't signed for pacman), while a local file
+    // falls under LocalFileSigLevel. Integrity comes from SHA256SUMS.txt.
     return {
-      command: `curl -LO ${url} && sudo pacman -U ./LotusChat-x86_64.pkg.tar.zst`,
-      url,
+      command: verifiedInstall('LotusChat-x86_64.pkg.tar.zst', 'sudo pacman -U'),
+      url: `${RELEASE_DOWNLOAD}/LotusChat-x86_64.pkg.tar.zst`,
       download: 'Download package',
     };
   }
   if (kind === 'deb') {
-    const url = `${RELEASE_DOWNLOAD}/LotusChat-x86_64.deb`;
     return {
-      command: `curl -LO ${url} && sudo apt install ./LotusChat-x86_64.deb`,
-      url,
+      command: verifiedInstall('LotusChat-x86_64.deb', 'sudo apt install'),
+      url: `${RELEASE_DOWNLOAD}/LotusChat-x86_64.deb`,
       download: 'Download package',
     };
   }

src/app/utils/urlTracking.test.ts

@@ -109,3 +109,10 @@ describe('stripTrackingParamsInHtml', () => {
     assert.equal(stripTrackingParamsInHtml(html), html);
   });
 });
+
+it('[#280] Reddit keeps context= (it shows the parent comments) but drops share_id', () => {
+  assert.equal(
+    stripTrackingParams('https://www.reddit.com/r/x/comments/abc/def/xyz/?context=3&share_id=1'),
+    'https://www.reddit.com/r/x/comments/abc/def/xyz/?context=3',
+  );
+});

src/app/utils/urlTracking.ts

@@ -103,7 +103,9 @@ const HOST_PARAMS: Array<{ hosts: string[]; params: string[]; prefixes?: string[
   },
   {
     hosts: ['reddit.com'],
-    params: ['share_id', 'rdt', 'context'],
+    // [Gitea #280] Not `context`: on a comment permalink, ?context=N shows the
+    // N parent comments, i.e. the conversation the sender meant to share.
+    params: ['share_id', 'rdt'],
   },
   {
     hosts: ['tiktok.com'],

src/client/initMatrix.ts

@@ -9,6 +9,7 @@ import { pushSessionToSW } from '../sw-session';
 import { deleteSearchCacheDatabase, shouldRunBootCleanup } from '../app/utils/searchCache';
 import { clearPlaintextCaches } from '../app/state/plaintextCaches';
 import { clearSoundboardClipCache } from '../app/utils/soundboardClips';
+import { clearSharedPayload } from '../swShare';
 
 // Thrown when the local IndexedDB has a higher schema version than this SDK expects.
 // This happens after a downgrade (e.g. matrix-js-sdk was briefly upgraded and then reverted).
@@ -146,6 +147,9 @@ export const logoutClient = async (mx: MatrixClient) => {
   // [Gitea #57] Same reasoning as clearPlaintextCaches: decrypted soundboard
   // clip bytes stay reachable via live blob: URLs until the reload otherwise.
   clearSoundboardClipCache();
+  // [Gitea #267] Files stashed by the share target stay in Cache Storage until
+  // /share is opened; a shared photo must not outlive the logout.
+  await clearSharedPayload().catch(() => undefined);
   // Remove only the session credential keys, preserving user preferences and
   // unsent drafts (N98). The factory-reset path is clearLoginData() below.
   removeFallbackSession();

src/ext.d.ts

@@ -1,5 +1,9 @@
 /// <reference types="vite/client" />
 
+// [Gitea #276] Set by vite.config.js `define`.
+declare const __LOTUS_BUILD_COMMIT__: string;
+declare const __LOTUS_BUILD_DATE__: string;
+
 declare module 'browser-encrypt-attachment' {
   export interface EncryptedAttachmentInfo {
     v: string;

src/sw.ts

@@ -1,7 +1,7 @@
 /// <reference lib="WebWorker" />
 
 import { precacheAndRoute, type PrecacheEntry } from 'workbox-precaching';
-import { SHARE_TARGET_PATH, stashSharedForm } from './swShare';
+import { isTrustedShareRequest, SHARE_TARGET_PATH, stashSharedForm } from './swShare';
 import { pickReplySession, replyFailureText, sendNotificationReply } from './swReply';
 
 export type {};
@@ -249,6 +249,11 @@ self.addEventListener('fetch', (event: FetchEvent) => {
   // share_target). Stash the form and bounce to the in-app /share page.
   if (method === 'POST' && new URL(url).pathname.endsWith(SHARE_TARGET_PATH)) {
     const base = new URL(url).pathname.slice(0, -SHARE_TARGET_PATH.length);
+    // [Gitea #267] A cross-site form posting here is not a share: drop it.
+    if (!isTrustedShareRequest(event.request.headers, self.location.origin)) {
+      event.respondWith(Response.redirect(`${base}/`, 303));
+      return;
+    }
     event.respondWith(
       stashSharedForm(event.request, base).catch(() => Response.redirect(`${base}/`, 303)),
     );

src/swShare.test.ts

@@ -1,6 +1,6 @@
 import { test } from 'node:test';
 import assert from 'node:assert/strict';
-import { shareDraftText } from './swShare';
+import { isTrustedShareRequest, shareDraftText } from './swShare';
 
 const base = { files: [], receivedAt: 0 };
 
@@ -25,3 +25,14 @@ test('shareDraftText drops a title/url the text already contains', () => {
   assert.equal(shareDraftText({ ...base, url: 'https://x.test' }), 'https://x.test');
   assert.equal(shareDraftText(base), '');
 });
+
+test('[#267] a share another website submitted is refused', () => {
+  const app = 'https://chat.lotusguild.org';
+  const h = (origin?: string) => new Headers(origin ? { Origin: origin } : {});
+  assert.equal(isTrustedShareRequest(h(), app), true, 'no Origin (OS share sheet)');
+  assert.equal(isTrustedShareRequest(h('null'), app), true, 'opaque origin (OS share sheet)');
+  assert.equal(isTrustedShareRequest(h(app), app), true, 'the app itself');
+  assert.equal(isTrustedShareRequest(h('https://evil.example'), app), false);
+  assert.equal(isTrustedShareRequest(h('https://chat.lotusguild.org.evil.example'), app), false);
+  assert.equal(isTrustedShareRequest(h('http://chat.lotusguild.org'), app), false, 'other scheme');
+});

src/swShare.ts

@@ -20,6 +20,27 @@ export type SharePayload = {
   receivedAt: number;
 };
 
+/**
+ * [Gitea #267] Refuse a share that another website submitted: any site could
+ * otherwise auto-submit a cross-site form here and drop attacker-chosen text
+ * and files into the "Share to…" picker as if the user had shared them.
+ *
+ * The worker can't use `Sec-Fetch-Site`: fetch-metadata headers are added
+ * after the service worker and never appear on `event.request` (checked in
+ * Chromium). `Origin` does: a cross-site form carries the site's origin. The
+ * OS share sheet's POST has no web initiator, so its Origin is `null` or
+ * absent, and both stay accepted. A page can also produce `Origin: null`
+ * (sandboxed frame, no-referrer), which is why /share also says the content
+ * came from elsewhere.
+ */
+export const isTrustedShareRequest = (
+  headers: Pick<Headers, 'get'>,
+  selfOrigin: string,
+): boolean => {
+  const origin = headers.get('Origin');
+  return origin === null || origin === 'null' || origin === selfOrigin;
+};
+
 /** Worker side: stash the POSTed form and answer with a redirect to /share. */
 export async function stashSharedForm(request: Request, base: string): Promise<Response> {
   const form = await request.formData();

vite.config.js

@@ -6,6 +6,7 @@ import { viteStaticCopy } from 'vite-plugin-static-copy';
 import { vanillaExtractPlugin } from '@vanilla-extract/vite-plugin';
 import { VitePWA } from 'vite-plugin-pwa';
 import fs from 'fs';
+import { execSync } from 'child_process';
 import path from 'path';
 import buildConfig from './build.config';
 
@@ -272,8 +273,26 @@ const vendorChunks = (id) => {
   if (id.includes('node_modules/chroma-js')) return 'chroma';
 };
 
+// [Gitea #276] Which build is this? The short commit and build time are shown
+// in Settings → About (web deploys change many times a day while the package
+// version stays the same). LOTUS_BUILD_COMMIT overrides; no git → "unknown".
+const buildCommit = (() => {
+  if (process.env.LOTUS_BUILD_COMMIT) return process.env.LOTUS_BUILD_COMMIT.slice(0, 12);
+  try {
+    return execSync('git rev-parse --short=8 HEAD', { stdio: ['ignore', 'pipe', 'ignore'] })
+      .toString()
+      .trim();
+  } catch {
+    return 'unknown';
+  }
+})();
+
 export default defineConfig({
   appType: 'spa',
+  define: {
+    __LOTUS_BUILD_COMMIT__: JSON.stringify(buildCommit),
+    __LOTUS_BUILD_DATE__: JSON.stringify(new Date().toISOString()),
+  },
   publicDir: false,
   base: buildConfig.base,
   server: {