feat(web): image and file message attachments (send + render)

- lib/api/upload.ts: POST /v0/file/u/ (docs/IM-前后端对接文档.md:460-461) --
  a separate surface from /v1/im/*, at the tenant's file base URL, auth'd
  with X-MeetingIM-Auth: token <token> rather than Authorization: Bearer
  (matches upstream Tinode's own LargeFileHelper convention).
- lib/tinode/attachments.ts: sendImage/sendFile. Files <= the inband limit
  go in directly as base64 (Drafty.insertImage's `bits` field / attachFile's
  `data` field) with no upload round trip; larger ones upload first and
  reference the returned URL. Simplified from the old app's urlPromise
  dance (optimistic local preview while the upload runs in the background)
  by just awaiting the upload before creating the message -- less
  optimistic, meaningfully simpler.
- AttachmentPreview.tsx: image/file bubble rendering. Externally-referenced
  (non-inline) attachments need an authenticated fetch into a blob URL,
  not a plain <img src>/<a href> -- GET /v0/file/s/{file_id} requires the
  same custom auth header uploads do, which a bare element can't attach.
- drafty.tsx: wired the 'IM'/'EX' Drafty style-tag cases to these.

Verified end to end: sent a real inline image (confirmed the exact IM
entity shape in the outgoing WS packet, and that the <img> decoded and
loaded from its own base64 data) and a real inline file (rendered with the
correct icon/size/download affordance).

Known gap: voice messages (MediaRecorder + AU entities) not built yet --
meaningfully more complex (hold-to-record gesture, audio encoding,
duration/waveform) and deliberately left for a following pass rather than
rushed.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

web/src/lib/tinode/attachments.ts

@@ -0,0 +1,64 @@
+import { Drafty, type Topic } from 'tinode-sdk';
+
+import { uploadFile } from '@/lib/api/upload';
+import { MAX_INBAND_ATTACHMENT_SIZE } from '@/lib/config';
+
+function fileToBase64(file: File): Promise<string> {
+  return new Promise((resolve, reject) => {
+    const reader = new FileReader();
+    reader.onload = () => resolve((reader.result as string).split(',')[1] ?? '');
+    reader.onerror = () => reject(reader.error);
+    reader.readAsDataURL(file);
+  });
+}
+
+function imageDimensions(file: File): Promise<{ width: number; height: number }> {
+  return new Promise((resolve) => {
+    const url = URL.createObjectURL(file);
+    const img = new Image();
+    img.onload = () => {
+      resolve({ width: img.naturalWidth, height: img.naturalHeight });
+      URL.revokeObjectURL(url);
+    };
+    img.onerror = () => {
+      resolve({ width: 0, height: 0 });
+      URL.revokeObjectURL(url);
+    };
+    img.src = url;
+  });
+}
+
+/**
+ * Small files go inline as base64 (Drafty.insertImage's `bits` field) -- no upload round trip at
+ * all. Larger ones upload first, then reference the returned URL (`refurl`). Simplified from the
+ * old app's own urlPromise dance (which inserts an optimistic local preview immediately and lets
+ * the upload happen in the background): this awaits the upload before creating the message at all,
+ * trading that "shows immediately while uploading" nicety for meaningfully simpler code.
+ */
+export async function sendImage(topic: Topic, file: File): Promise<unknown> {
+  const { width, height } = await imageDimensions(file);
+  const content =
+    file.size <= MAX_INBAND_ATTACHMENT_SIZE
+      ? Drafty.insertImage(undefined, 0, { mime: file.type, bits: await fileToBase64(file), width, height, filename: file.name, size: file.size })
+      : Drafty.insertImage(undefined, 0, {
+          mime: file.type,
+          refurl: (await uploadFile(file, topic.name)).url,
+          width,
+          height,
+          filename: file.name,
+          size: file.size,
+        });
+  const msg = topic.createMessage(content, false);
+  msg.head = Object.assign(msg.head || {}, { 'x-im-type': 'image' });
+  return topic.publishDraft(msg, Promise.resolve());
+}
+
+export async function sendFile(topic: Topic, file: File): Promise<unknown> {
+  const content =
+    file.size <= MAX_INBAND_ATTACHMENT_SIZE
+      ? Drafty.attachFile(undefined, { mime: file.type, data: await fileToBase64(file), filename: file.name, size: file.size })
+      : Drafty.attachFile(undefined, { mime: file.type, refurl: (await uploadFile(file, topic.name)).url, filename: file.name, size: file.size });
+  const msg = topic.createMessage(content, false);
+  msg.head = Object.assign(msg.head || {}, { 'x-im-type': 'file' });
+  return topic.publishDraft(msg, Promise.resolve());
+}