LotusGuild/cinny
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix three open bugs from LOTUS_BUGS.md
CI / Build & Quality Checks (push) Successful in 10m38s
Details
Trigger Desktop Build / trigger (push) Failing after 5s
Details

Browse Source 
- EditHistoryModal: decrypt fetched edit events in E2EE rooms via
  mx.decryptEventIfNeeded() before rendering; previously events not
  found in the room cache showed ciphertext or "(no text)"
- CallEmbedProvider: add touch support for PiP resize corners;
  extracted shared applyResize() helper; onTouchStart wired to all
  four corners alongside existing onMouseDown
- RoomView: skip chatBgStyle when glassmorphism is active; document.body
  already carries the background for the blur effect, rendering it twice
  doubled CSS animation work unnecessarily

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Jared Vititoe
2026-06-12 18:15:16 -04:00
parent 3df9c4d9e6
commit aa48c9ef8a
4 changed files with 128 additions and 75 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/components/CallEmbedProvider.tsx
+82 -34
View File
@@ -722,6 +722,54 @@ export function CallEmbedProvider({ children }: CallEmbedProviderProps) {
document.addEventListener('touchend', onTouchEnd);
};
function applyResize(
el: HTMLElement,
corner: Corner,
sx: number,
sy: number,
sw: number,
sh: number,
sl: number,
st: number,
cx: number,
cy: number,
) {
const dx = cx - sx;
const dy = cy - sy;
let w = sw;
let h = sh;
let l = sl;
let t = st;
if (corner === 'se') {
w = sw + dx;
h = sh + dy;
}
if (corner === 'sw') {
w = sw - dx;
h = sh + dy;
l = sl + sw - Math.max(PIP_MIN_W, w);
}
if (corner === 'ne') {
w = sw + dx;
h = sh - dy;
t = st + sh - Math.max(PIP_MIN_H, h);
}
if (corner === 'nw') {
w = sw - dx;
h = sh - dy;
l = sl + sw - Math.max(PIP_MIN_W, w);
t = st + sh - Math.max(PIP_MIN_H, h);
}
w = Math.max(PIP_MIN_W, Math.min(w, window.innerWidth));
h = Math.max(PIP_MIN_H, Math.min(h, window.innerHeight));
l = Math.max(0, Math.min(l, window.innerWidth - PIP_MIN_W));
t = Math.max(0, Math.min(t, window.innerHeight - PIP_MIN_H));
el.style.width = `${w}px`;
el.style.height = `${h}px`;
el.style.left = `${l}px`;
el.style.top = `${t}px`;
}
const handleResizeMouseDown = (e: React.MouseEvent, corner: Corner) => {
e.stopPropagation();
e.preventDefault();
@@ -737,40 +785,7 @@ export function CallEmbedProvider({ children }: CallEmbedProviderProps) {
document.body.style.cursor = `${corner}-resize`;
document.body.style.userSelect = 'none';
const onMove = (ev: MouseEvent) => {
const dx = ev.clientX - sx;
const dy = ev.clientY - sy;
let w = sw;
let h = sh;
let l = sl;
let t = st;
if (corner === 'se') {
w = sw + dx;
h = sh + dy;
}
if (corner === 'sw') {
w = sw - dx;
h = sh + dy;
l = sl + sw - Math.max(PIP_MIN_W, w);
}
if (corner === 'ne') {
w = sw + dx;
h = sh - dy;
t = st + sh - Math.max(PIP_MIN_H, h);
}
if (corner === 'nw') {
w = sw - dx;
h = sh - dy;
l = sl + sw - Math.max(PIP_MIN_W, w);
t = st + sh - Math.max(PIP_MIN_H, h);
}
w = Math.max(PIP_MIN_W, Math.min(w, window.innerWidth));
h = Math.max(PIP_MIN_H, Math.min(h, window.innerHeight));
l = Math.max(0, Math.min(l, window.innerWidth - PIP_MIN_W));
t = Math.max(0, Math.min(t, window.innerHeight - PIP_MIN_H));
el.style.width = `${w}px`;
el.style.height = `${h}px`;
el.style.left = `${l}px`;
el.style.top = `${t}px`;
applyResize(el, corner, sx, sy, sw, sh, sl, st, ev.clientX, ev.clientY);
};
const onUp = () => {
document.removeEventListener('mousemove', onMove);
@@ -789,6 +804,38 @@ export function CallEmbedProvider({ children }: CallEmbedProviderProps) {
document.addEventListener('mouseup', onUp);
};
const handleResizeTouchStart = (e: React.TouchEvent, corner: Corner) => {
e.stopPropagation();
e.preventDefault();
const el = callEmbedRef.current;
if (!el || e.touches.length !== 1) return;
normaliseToTopLeft(el);
const touch = e.touches[0];
const sx = touch.clientX;
const sy = touch.clientY;
const sw = el.offsetWidth;
const sh = el.offsetHeight;
const sl = parseFloat(el.style.left);
const st = parseFloat(el.style.top);
const onMove = (ev: TouchEvent) => {
if (ev.touches.length !== 1) return;
ev.preventDefault();
const t = ev.touches[0];
applyResize(el, corner, sx, sy, sw, sh, sl, st, t.clientX, t.clientY);
};
const onEnd = () => {
document.removeEventListener('touchmove', onMove);
document.removeEventListener('touchend', onEnd);
activeDragCleanupRef.current = null;
};
activeDragCleanupRef.current = () => {
document.removeEventListener('touchmove', onMove);
document.removeEventListener('touchend', onEnd);
};
document.addEventListener('touchmove', onMove, { passive: false });
document.addEventListener('touchend', onEnd);
};
return (
<CallEmbedContextProvider value={callEmbed}>
{callEmbed && <CallUtils embed={callEmbed} />}
@@ -871,6 +918,7 @@ export function CallEmbedProvider({ children }: CallEmbedProviderProps) {
<div
key={corner}
onMouseDown={(ev) => handleResizeMouseDown(ev, corner)}
onTouchStart={(ev) => handleResizeTouchStart(ev, corner)}
onClick={(ev) => ev.stopPropagation()}
style={{
position: 'absolute',
src/app/features/room/RoomView.tsx
+12 -6
View File
@@ -62,6 +62,7 @@ export function RoomView({ eventId }: { eventId?: string }) {
const [chatBackground] = useSetting(settingsAtom, 'chatBackground');
const [lotusTerminal] = useSetting(settingsAtom, 'lotusTerminal');
const [pauseAnimations] = useSetting(settingsAtom, 'pauseAnimations');
const [glassmorphismSidebar] = useSetting(settingsAtom, 'glassmorphismSidebar');
const theme = useTheme();
const isDark = theme.kind === ThemeKind.Dark;
@@ -97,14 +98,19 @@ export function RoomView({ eventId }: { eventId?: string }) {
),
);
// When glassmorphism is active, document.body already carries the background so the
// sidebar blur has something to work through. Skip applying it here to avoid running
// the same CSS animation twice (one per layer = double GPU work).
const chatBgStyle = useMemo(
() =>
getChatBg(
lotusTerminal && chatBackground === 'none' ? 'tactical' : chatBackground,
isDark,
pauseAnimations,
),
[chatBackground, lotusTerminal, isDark, pauseAnimations],
glassmorphismSidebar
? {}
: getChatBg(
lotusTerminal && chatBackground === 'none' ? 'tactical' : chatBackground,
isDark,
pauseAnimations,
),
[chatBackground, lotusTerminal, isDark, pauseAnimations, glassmorphismSidebar],
);
return (
src/app/features/room/message/EditHistoryModal.tsx
+21 -15
View File
@@ -110,21 +110,27 @@ export function EditHistoryModal({ room, mEvent, onClose }: EditHistoryModalProp
if (!fetchRes.ok) throw new Error(`HTTP ${fetchRes.status}`);
const res = (await fetchRes.json()) as EditHistoryResponse;
const rawEvents = res.chunk ?? [];
const events = rawEvents
.filter(isRawEditEvent)
.sort((a, b) => a.origin_server_ts - b.origin_server_ts)
.map((raw) => {
const existing = room.findEventById(raw.event_id);
if (existing) return existing;
return new MatrixEvent({
type: raw.type,
content: raw.content,
origin_server_ts: raw.origin_server_ts,
event_id: raw.event_id,
room_id: roomId,
sender: mEvent.getSender() ?? '',
});
});
const events = await Promise.all(
rawEvents
.filter(isRawEditEvent)
.sort((a, b) => a.origin_server_ts - b.origin_server_ts)
.map(async (raw) => {
const existing = room.findEventById(raw.event_id);
if (existing) return existing;
const evt = new MatrixEvent({
type: raw.type,
content: raw.content,
origin_server_ts: raw.origin_server_ts,
event_id: raw.event_id,
room_id: roomId,
sender: mEvent.getSender() ?? '',
});
if (evt.isEncrypted()) {
await mx.decryptEventIfNeeded(evt);
}
return evt;
}),
);
return { events, hasMore: !!res.next_batch };
}, [mx, roomId, eventId, room, mEvent]),