fix(calls): the call PiP no longer opens on top of the composer (#323)

The first-use PiP position was bottom-right, 72px from the bottom: on
desktop over Send, on phones over Send, Emoji and the message box, so
the first thing you typed or tapped in the text room hit the call.
Default to top-right under the room header instead. A dragged position
is still remembered.

Refs #323

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

src/app/components/CallEmbedProvider.tsx

@@ -89,6 +89,8 @@ import { zIndices } from '../styles/zIndex';
 
 const PIP_MIN_W = 200;
 const PIP_MIN_H = 112;
+/** Default PiP top: just below the 64px-ish room header. */
+const PIP_DEFAULT_TOP = 72;
 
 type Corner = 'se' | 'sw' | 'ne' | 'nw';
 
@@ -1046,8 +1048,11 @@ export function CallEmbedProvider({ children }: CallEmbedProviderProps) {
           el.style.left = `${Math.max(0, Math.min(savedPos.left, window.innerWidth - 280))}px`;
           el.style.top = `${Math.max(0, Math.min(savedPos.top, window.innerHeight - 158))}px`;
         } else {
-          el.style.left = `${window.innerWidth - 280 - 16}px`;
-          el.style.top = `${window.innerHeight - 158 - 72}px`;
+          // [Gitea #323] First use: top-right under the room header, over the
+          // timeline. Bottom-right sat on the composer (Send / Emoji, and on
+          // phones the whole message box), so typing landed on the call.
+          el.style.left = `${Math.max(0, window.innerWidth - 280 - 16)}px`;
+          el.style.top = `${PIP_DEFAULT_TOP}px`;
         }
         el.style.width = '280px';
         el.style.height = '158px';

src/app/features/shortcuts/KeyboardShortcutsDialog.tsx

@@ -25,9 +25,6 @@ import { settingsAtom } from '../../state/settings';
 import { isMacOS } from '../../utils/user-agent';
 import { KeySymbol } from '../../utils/key-symbol';
 import * as css from './KeyboardShortcutsDialog.css';
-import { BLOCK_HOTKEYS, INLINE_HOTKEYS } from '../../components/editor/keyboard';
-import { MarkType } from '../../components/editor/types';
-import { BLOCK_LABELS, MARK_LABELS, hotkeyKeys, keyCodeLabel } from './shortcutLabels';
 
 /** Global open-state for the keyboard shortcuts help dialog. */
 export const keyboardShortcutsDialogAtom = atom<boolean>(false);
@@ -101,9 +98,6 @@ export function KeyboardShortcutsDialog() {
   const { open, closeDialog } = useKeyboardShortcutsDialog();
   const modalStyle = useModalStyle(480);
   const [enterForNewline] = useSetting(settingsAtom, 'enterForNewline');
-  const [pttMode] = useSetting(settingsAtom, 'pttMode');
-  const [pttKey] = useSetting(settingsAtom, 'pttKey');
-  const [deafenKey] = useSetting(settingsAtom, 'deafenKey');
 
   const modKey = isMacOS() ? KeySymbol.Command : 'Ctrl';
 
@@ -115,8 +109,6 @@ export function KeyboardShortcutsDialog() {
       rows: [
         { description: 'Show keyboard shortcuts', keys: ['?'] },
         { description: 'Close open panel, otherwise mark room as read', keys: [KeySymbol.Escape] },
-        // [Gitea #334] the quick switcher / search was missing
-        { description: 'Quick switcher: jump to a room or person', keys: [modKey, 'K'] },
       ],
     },
     {
@@ -132,26 +124,6 @@ export function KeyboardShortcutsDialog() {
           keys: enterForNewline ? ['Enter'] : [KeySymbol.Shift, 'Enter'],
         },
         { description: 'Send message (always)', keys: [modKey, 'Enter'] },
-        { description: 'Edit your last message (empty composer)', keys: ['↑'] },
-      ],
-    },
-    {
-      // [Gitea #334] generated from the editor's own bindings so they can't drift
-      title: 'Composer formatting',
-      rows: [
-        ...Object.entries(INLINE_HOTKEYS).map(([hotkey, mark]) => ({
-          description:
-            mark === MarkType.StrikeThrough
-              ? `${MARK_LABELS[mark]} (not the browser's Save)`
-              : MARK_LABELS[mark],
-          keys: hotkeyKeys(hotkey, modKey),
-        })),
-        { description: 'Heading 1 / 2 / 3', keys: [modKey, '1 / 2 / 3'] },
-        ...Object.entries(BLOCK_HOTKEYS).map(([hotkey, block]) => ({
-          description: BLOCK_LABELS[block] ?? block,
-          keys: hotkeyKeys(hotkey, modKey),
-        })),
-        { description: 'Clear formatting', keys: [modKey, 'E'] },
       ],
     },
     {
@@ -160,19 +132,6 @@ export function KeyboardShortcutsDialog() {
         { description: 'Reveal message actions (react, reply, more)', keys: ['Hover / focus'] },
       ],
     },
-    {
-      // [Gitea #334] the user's own bindings (Settings → Calls)
-      title: 'Calls',
-      rows: [
-        {
-          description: pttMode
-            ? 'Push to talk (hold)'
-            : 'Push to talk (hold; turn on in Settings → Calls)',
-          keys: [keyCodeLabel(pttKey)],
-        },
-        { description: 'Deafen / undeafen', keys: [keyCodeLabel(deafenKey)] },
-      ],
-    },
   ];
 
   return (

src/app/features/shortcuts/shortcutLabels.test.ts

@@ -1,16 +0,0 @@
-import { test } from 'node:test';
-import assert from 'node:assert/strict';
-import { hotkeyKeys, keyCodeLabel } from './shortcutLabels';
-
-test('hotkeyKeys (#334)', () => {
-  assert.deepEqual(hotkeyKeys('mod+b', 'Ctrl'), ['Ctrl', 'B']);
-  assert.deepEqual(hotkeyKeys("mod+'", '⌘'), ['⌘', "'"]);
-  assert.deepEqual(hotkeyKeys('mod+[', 'Ctrl'), ['Ctrl', '[']);
-});
-
-test('keyCodeLabel (#334)', () => {
-  assert.equal(keyCodeLabel('KeyM'), 'M');
-  assert.equal(keyCodeLabel('Digit1'), '1');
-  assert.equal(keyCodeLabel('Space'), 'Space');
-  assert.equal(keyCodeLabel(''), 'Not set');
-});

src/app/features/shortcuts/shortcutLabels.ts

@@ -1,29 +0,0 @@
-import { BlockType, MarkType } from '../../components/editor/types';
-
-/** Pure: an is-hotkey string ('mod+b', "mod+'") as keycap labels. */
-export const hotkeyKeys = (hotkey: string, modKey: string): string[] =>
-  hotkey.split('+').map((k) => (k === 'mod' ? modKey : k.length === 1 ? k.toUpperCase() : k));
-
-/** Pure: a KeyboardEvent.code ('KeyM', 'Digit1', 'Space') as a keycap label. */
-export const keyCodeLabel = (code: string | undefined): string => {
-  if (!code) return 'Not set';
-  if (/^Key[A-Z]$/.test(code)) return code.slice(3);
-  if (/^Digit\d$/.test(code)) return code.slice(5);
-  return code;
-};
-
-export const MARK_LABELS: Record<MarkType, string> = {
-  [MarkType.Bold]: 'Bold',
-  [MarkType.Italic]: 'Italic',
-  [MarkType.Underline]: 'Underline',
-  [MarkType.StrikeThrough]: 'Strikethrough',
-  [MarkType.Code]: 'Inline code',
-  [MarkType.Spoiler]: 'Spoiler',
-};
-
-export const BLOCK_LABELS: Partial<Record<BlockType, string>> = {
-  [BlockType.OrderedList]: 'Numbered list',
-  [BlockType.UnorderedList]: 'Bulleted list',
-  [BlockType.BlockQuote]: 'Quote',
-  [BlockType.CodeBlock]: 'Code block',
-};