feat(media): timeline images open the gallery lightbox at that event (#219)

Clicking an image in the room or thread timeline now opens the same viewer
the media gallery uses — dark backdrop, sender + date, 1/N counter, ←/→ across
the room's media, +/-/0 and wheel/double-click zoom, download, jump to
message — positioned at the clicked event. RoomMediaLightbox feeds it from the
detached media timeline (#163); when the event isn't in the loaded window it
pages back (bounded, 6 pages) and shows the clicked image alone meanwhile, so
the viewer opens instantly. ImageContent gains onOpenViewer (RenderMessageContent
passes onOpenImageViewer); its built-in viewer remains for stickers, search
results, pins, notifications and avatars.

Verified headless: click → 'Media viewer' dialog focused, counter 1/2, '+' →
120 %, Jump to message present, Esc closes; an older image 10 pages up →
found at 10/45 after paging.

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

src/app/features/room/thread/ThreadTimeline.tsx

@@ -72,6 +72,7 @@ import { useSetting } from '../../../state/hooks/settings';
 import { MessageLayout, settingsAtom } from '../../../state/settings';
 import { Message, Reactions, EncryptedContent } from '../message';
 import { RenderMessageContent } from '../../../components/RenderMessageContent';
+import { RoomMediaLightbox } from '../RoomMediaLightbox';
 import { Image } from '../../../components/media';
 import { ImageViewer } from '../../../components/image-viewer';
 import * as css from './ThreadTimeline.css';
@@ -309,6 +310,8 @@ export function ThreadTimeline({ room, thread, editor }: ThreadTimelineProps) {
 
   const [editId, setEditId] = useState<string>();
   const [editHistoryEvent, setEditHistoryEvent] = useState<MatrixEvent | undefined>();
+  // [Gitea #219] Thread images open the room's shared media lightbox too.
+  const [lightboxEventId, setLightboxEventId] = useState<string | undefined>();
 
   const linkifyOpts = useMemo<LinkifyOpts>(
     () => ({
@@ -711,6 +714,7 @@ export function ThreadTimeline({ room, thread, editor }: ThreadTimelineProps) {
             linkifyOpts={linkifyOpts}
             outlineAttachment={messageLayout === MessageLayout.Bubble}
             eventId={mEventId}
+            onOpenImageViewer={() => setLightboxEventId(mEventId)}
           />
         );
       };
@@ -1051,6 +1055,13 @@ export function ThreadTimeline({ room, thread, editor }: ThreadTimelineProps) {
           onClose={() => setEditHistoryEvent(undefined)}
         />
       )}
+      {lightboxEventId && (
+        <RoomMediaLightbox
+          room={room}
+          eventId={lightboxEventId}
+          onClose={() => setLightboxEventId(undefined)}
+        />
+      )}
     </Box>
   );
 }