stream-chat-react-native-core 9.10.1 → 10.0.0-rc.1

package/src/i18n/runtimeDefaults.ts

@@ -0,0 +1,148 @@
+/**
+ * The only translation data bundled with the SDK. Hand-maintained.
+ *
+ * Prose keys are not here — they pass their English copy inline at the call site
+ * (`t('message.status.sent.text', 'Sent')`). These keys have no inline copy to fall back on:
+ * they are formatter expressions, passed around as prop values and resolved by name at runtime
+ * (`timestampTranslationKey`), so the extractor never sees a literal call site for them.
+ *
+ * The leaf segment is the consuming component's name and stays PascalCase, matching the web SDK
+ * and the `timestamp/<Component>` values these keys replace. Every other namespace is lower
+ * camelCase.
+ *
+ * Two namespaces are typed into the catalog but supplied by `@stream-io/i18n` rather than declared
+ * here. `language.*` (ISO language names, generated from core's `TranslationLanguage` union) is
+ * merged in by the `Streami18n` subclass in `utils/i18n/Streami18n.ts`, underneath this file, so an
+ * individual name stays overridable. `relativeTime.*` needs no data at all: core's
+ * `timestampFormatter(relativeCompact: true)` passes its English inline the same way a call site
+ * does. There is
+ * no `translationBuilderTopic.*` — this SDK registers no i18next postProcessor; the formatter
+ * registry in `@stream-io/i18n` is the whole extension surface.
+ *
+ * `yarn build-translations` joins this file with the inline defaults to generate
+ * `src/i18n/keys.ts`; `yarn i18n:export` writes the joined catalog as JSON.
+ *
+ * Three entries hide English inside a formatter expression, so `dayjsLocaleConfigForLanguage`
+ * cannot reach them and an integrator has to override the key itself:
+ *
+ * - `timestamp.ChannelPreviewStatus` and `timestamp.ThreadListItem` carry day words inside their
+ *   own `calendarFormats` argument. A per-key `calendarFormats` replaces the locale's calendar
+ *   wholesale — `getDateString` short-circuits to `t()` before the Day.js calendar path, and
+ *   `timestampFormatter` then parses the calendar config out of the translation value itself.
+ * - `timestamp.UserActivityStatus` puts prose (`Last seen`) beside the interpolation.
+ *
+ * Adding a fourth fails a guard in `src/utils/__tests__/Streami18n.test.ts` that keeps
+ * `ai-docs/i18n-v10-migration.md` in sync.
+ */
+export const runtimeDefaults = {
+  'duration.messageReminder': '{{ milliseconds | durationFormatter(withSuffix: true) }}',
+  'timestamp.ChannelPreviewStatus':
+    '{{ timestamp | timestampFormatter(calendar: true; calendarFormats: {"lastDay":"[Yesterday]", "lastWeek":"dddd", "nextDay":"[Tomorrow]", "nextWeek":"dddd [at] LT", "sameDay":"LT", "sameElse":"L"}) }}',
+  'timestamp.FileAttachmentListSection': '{{ timestamp | timestampFormatter(format: MMMM YYYY) }}',
+  'timestamp.ImageGalleryHeader': '{{ timestamp | timestampFormatter(calendar: true) }}',
+  'timestamp.InlineDateSeparator': '{{ timestamp | timestampFormatter(calendar: true) }}',
+  'timestamp.MessageSystem': '{{ timestamp | timestampFormatter(calendar: true) }}',
+  'timestamp.MessageTimestamp': '{{ timestamp | timestampFormatter(format: LT) }}',
+  'timestamp.PollVote': '{{ timestamp | timestampFormatter(relativeCompact: true) }}',
+  'timestamp.StickyHeader': '{{ timestamp | timestampFormatter(calendar: true) }}',
+  'timestamp.ThreadListItem':
+    '{{ timestamp | timestampFormatter(calendar: true; calendarFormats: {"lastDay":"[Yesterday]", "lastWeek":"dddd", "nextDay":"[Tomorrow]", "nextWeek":"dddd [at] LT", "sameDay":"LT", "sameElse":"L"}) }}',
+  'timestamp.UserActivityStatus': 'Last seen {{ timestamp | fromNowFormatter }}',
+
+  // Screen-reader labels and lookup-table entries. These reach `t()` as runtime values — from a
+  // JSX prop, a ternary branch, or a table keyed by something other than the copy — so there is no
+  // call site at which an inline default could be written.
+  'attachment.gallery.doubleTapToOpen.accessibilityLabel': 'Double tap to open',
+  'attachment.gallery.image.accessibilityLabel': 'Gallery image',
+  'attachment.gallery.video.accessibilityLabel': 'Gallery video',
+  'attachmentPicker.image.deselect.accessibilityLabel': 'Deselect image',
+  'attachmentPicker.image.select.accessibilityLabel': 'Select image',
+  'attachmentPicker.typeButton.camera.accessibilityLabel': 'Open camera',
+  'attachmentPicker.typeButton.commands.accessibilityLabel': 'Open commands',
+  'attachmentPicker.typeButton.files.accessibilityLabel': 'Open file picker',
+  'attachmentPicker.typeButton.images.accessibilityLabel': 'Open photo picker',
+  'attachmentPicker.typeButton.poll.accessibilityLabel': 'Open poll creation',
+  'attachmentPicker.typeButton.videoRecorder.accessibilityLabel': 'Open video recorder',
+  'attachmentPicker.video.deselect.accessibilityLabel': 'Deselect video',
+  'attachmentPicker.video.select.accessibilityLabel': 'Select video',
+  'autoCompleteInput.mention.channel.description': 'Notify everyone in this channel',
+  'autoCompleteInput.mention.here.description': 'Notify every online member in this channel',
+  'autoCompleteInput.suggestions.commandsAvailable.accessibilityLabel':
+    'Command suggestions available',
+  'autoCompleteInput.suggestions.emojisAvailable.accessibilityLabel': 'Emoji suggestions available',
+  'autoCompleteInput.suggestions.mentionsAvailable.accessibilityLabel':
+    'Mention suggestions available',
+  'avatar.accessibilityLabel': 'Avatar of {{name}}',
+  'avatar.channel.direct.accessibilityLabel': 'Direct chat with {{name}}',
+  'avatar.channel.group.accessibilityLabel_one': 'Channel with {{count}} member',
+  'avatar.channel.group.accessibilityLabel_other': 'Channel with {{count}} members',
+  'channelDetails.addMembers.accessibilityLabel': 'Add members',
+  'channelDetails.editChannel.accessibilityLabel': 'Edit channel',
+  'channelDetails.editChannel.upload.accessibilityLabel': 'Upload channel image',
+  'channelDetails.editImageSheet.close.accessibilityLabel': 'Close edit picture sheet',
+  'channelDetails.header.back.accessibilityLabel': 'Back',
+  'channelDetails.navigation.files.label': 'Files',
+  'channelDetails.navigation.photosAndVideos.label': 'Photos & Videos',
+  'channelDetails.navigation.pinnedMessages.label': 'Pinned Messages',
+  'channelPreview.deliveryStatus.delivered.accessibilityLabel': 'Delivered, sent by you',
+  'channelPreview.deliveryStatus.read.accessibilityLabel': 'Read, sent by you',
+  'channelPreview.deliveryStatus.sent.accessibilityLabel': 'Sent by you',
+  'channelPreview.lastMessage.accessibilityLabel': 'Last message {{date}}',
+  'channelPreview.muted.accessibilityLabel': 'Muted',
+  'channelPreview.pinned.accessibilityLabel': 'Pinned',
+  'channelPreview.unreadCount.accessibilityLabel_one': '{{count}} unread message',
+  'channelPreview.unreadCount.accessibilityLabel_other': '{{count}} unread messages',
+  'common.close.accessibilityLabel': 'Close',
+  'common.messageOverlay.swipeHint.accessibilityLabel':
+    'Swipe right to go through different actions',
+  'imageGallery.footer.grid.accessibilityLabel': 'Grid Icon',
+  'imageGallery.footer.share.accessibilityLabel': 'Share Button',
+  'imageGallery.header.hideOverlay.accessibilityLabel': 'Hide Overlay',
+  'imageGallery.position.accessibilityLabel': '{{position}} of {{count}}',
+  'imageGallery.videoControl.playPause.accessibilityLabel': 'Play Pause Button',
+  'message.content.contextMenuHint.accessibilityLabel':
+    'Double tap and hold to activate contextual menu',
+  'message.content.fromSender.accessibilityLabel': 'Message from {{sender}}',
+  'message.content.fromYou.accessibilityLabel': 'Message from you',
+  'message.reactionList.more.accessibilityLabel_one': 'and {{count}} more reaction',
+  'message.reactionList.more.accessibilityLabel_other': 'and {{count}} more reactions',
+  'message.reactionList.viewHint.accessibilityLabel': 'Double tap to view reactions',
+  'message.reactionList.youReacted.accessibilityLabel': 'you reacted',
+  'message.status.delivered.accessibilityLabel': 'Delivered',
+  'message.status.read.accessibilityLabel': 'Read',
+  'message.status.sending.accessibilityLabel': 'Sending',
+  'message.status.sent.accessibilityLabel': 'Sent',
+  'messageInput.addAttachment.accessibilityLabel': 'Add attachment',
+  'messageInput.audioRecorder.delete.accessibilityLabel': 'Delete voice recording',
+  'messageInput.audioRecorder.send.accessibilityLabel': 'Send voice recording',
+  'messageInput.audioRecorder.start.accessibilityLabel': 'Start voice recording',
+  'messageInput.audioRecorder.stop.accessibilityLabel': 'Stop voice recording',
+  'messageInput.closeAttachments.accessibilityLabel': 'Close attachments',
+  'messageInput.removeAttachment.accessibilityLabel': 'Remove Attachment',
+  'messageInput.saveEdit.accessibilityLabel': 'Save edited message',
+  'messageInput.sendMessage.accessibilityLabel': 'Send message',
+  'messageList.dismissUnread.accessibilityLabel': 'Dismiss unread messages',
+  'messageList.scrollToBottom.accessibilityLabel': 'Scroll to bottom',
+  'messageList.scrollToBottom.withCount.accessibilityLabel_one':
+    'Scroll to bottom, {{count}} new message',
+  'messageList.scrollToBottom.withCount.accessibilityLabel_other':
+    'Scroll to bottom, {{count}} new messages',
+  'messageMenu.actionList.accessibilityLabel': 'Message actions',
+  'messageMenu.reactionPicker.moreReactions.accessibilityLabel': 'Open more reactions',
+  'notifications.attachmentUploadFailed.error': 'Error uploading attachment',
+  'notifications.attachmentUploadFailed.withReason.error':
+    'Attachment upload failed due to {{reason}}',
+  'notifications.pollCreateFailed.error': 'Failed to create the poll',
+  'notifications.pollCreateFailed.withReason.error': 'Failed to create the poll due to {{reason}}',
+  'notifications.pollEndFailed.withReason.error': 'Failed to end the poll due to {{reason}}',
+  'poll.createPoll.close.accessibilityLabel': 'Close poll creation',
+  'poll.createPoll.maxVotes.decrease.accessibilityLabel': 'Decrease maximum votes',
+  'poll.createPoll.maxVotes.increase.accessibilityLabel': 'Increase maximum votes',
+  'poll.createPoll.submit.accessibilityLabel': 'Create poll',
+  'poll.endVote.error': 'Failed to end the poll',
+  'poll.modalHeader.close.accessibilityLabel': 'Close poll',
+  'reply.removeEdit.accessibilityLabel': 'Remove edit',
+  'reply.removeReply.accessibilityLabel': 'Remove reply',
+  'uiComponents.bottomSheetModal.opened.accessibilityLabel':
+    'Bottom sheet opened. Activate the close action or use the escape gesture to dismiss.',
+};

package/src/i18n/types.ts

@@ -0,0 +1,54 @@
+import type {
+  LooseTranslationDictionaryOf,
+  RelativeTimeCatalog,
+  StreamTFunctionFor,
+  TranslationDictionaryOf,
+  TranslationKeyOf,
+} from '@stream-io/i18n';
+import type { LanguageNameCatalog } from 'stream-chat';
+
+import type { BundledTranslationKey, TranslationCatalog as GeneratedCatalog } from './keys';
+
+/**
+ * The SDK's i18n types, instantiated from the generic helpers in `@stream-io/i18n`.
+ *
+ * The derivations live in core so both UI SDKs share one implementation; the *catalog* stays here,
+ * because it is generated from this SDK's own `t()` call sites. That split is why core's helpers are
+ * generic over the catalog rather than driven by module augmentation — two catalogs have to be able to
+ * coexist in one TypeScript program.
+ *
+ * Two slices come from core, because core owns the code that renders them: `language.*` (derived from
+ * the same `TranslationLanguage` union the API uses) and `relativeTime.*` (used by
+ * `timestampFormatter(relativeCompact: true)`). Intersecting them in keeps both compile-checked and
+ * overridable.
+ */
+export type TranslationCatalog = GeneratedCatalog & LanguageNameCatalog & RelativeTimeCatalog;
+
+export type TranslationKey = TranslationKeyOf<TranslationCatalog>;
+export type TranslationDictionary = TranslationDictionaryOf<TranslationCatalog>;
+export type LooseTranslationDictionary = LooseTranslationDictionaryOf<TranslationCatalog>;
+
+/**
+ * The SDK's translation function.
+ *
+ * `BundledTranslationKey` is generated: the screen-reader labels and lookup-table entries that reach
+ * `t()` as runtime values, so there is nowhere to write an inline default. They are callable without one.
+ */
+export type StreamTFunction = StreamTFunctionFor<TranslationCatalog, BundledTranslationKey>;
+
+export type {
+  // Both are documented in `ai-docs/i18n-v10-migration.md`'s type table and were exported before the
+  // runtime moved; re-exporting them here keeps the public surface unchanged.
+  CalendarFormats,
+  CustomFormatters,
+  DateTimeParserModule,
+  DayjsLocaleConfig,
+  DurationFormatterOptions,
+  DynamicTranslationKey,
+  FormatterFactory,
+  PredefinedFormatters,
+  TDateTimeParser,
+  TDateTimeParserInput,
+  TDateTimeParserOutput,
+  TimestampFormatterOptions,
+} from '@stream-io/i18n';

package/src/i18n/utils.ts

@@ -0,0 +1,69 @@
+import {
+  createDefaultTranslatorFunction,
+  getCalendarDateStringForA11y as coreGetCalendarDateStringForA11y,
+  getDateString as coreGetDateString,
+  getDateStringForA11y as coreGetDateStringForA11y,
+} from '@stream-io/i18n';
+
+import type { StreamTFunction } from './types';
+
+/**
+ * The `t` in force before i18next has initialized, and the default value of the translation context.
+ *
+ * Core's factory, instantiated against this SDK's catalog so it is typed the same as the real `t`. It
+ * honours the inline `defaultValue` at each call site, which is what stops raw dotted keys flashing on
+ * the first frame — or rendering permanently for a component used outside `<OverlayProvider>`.
+ */
+export const defaultTranslatorFunction: StreamTFunction =
+  createDefaultTranslatorFunction() as StreamTFunction;
+
+/**
+ * The date/time and key helpers now live in `@stream-io/i18n`, shared with the React SDK.
+ *
+ * Re-exported from here rather than rewritten at ~15 call sites, so the internal module path stays
+ * stable. `getDateString` and the type guards behave identically; `predefinedFormatters` gains
+ * `fromNowFormatter` and loses `relativeCompactDateFormatter` — that behaviour is
+ * `timestampFormatter` with `relativeCompact: true`, whose wording goes through `t()` rather than being
+ * hardcoded English as it was here.
+ */
+export {
+  asDynamicKey,
+  defaultDateTimeParser,
+  isDate,
+  isDayOrMoment,
+  isNumberOrString,
+  predefinedFormatters,
+} from '@stream-io/i18n';
+
+/**
+ * `null` means "nothing renderable", which every caller already handles by omitting the element.
+ * `"Invalid Date"` is what Day.js formats an unparseable instance into, and it reaches the screen as
+ * copy. Whatever shape produced it, showing nothing is the better failure.
+ */
+const withoutInvalidDate = <T>(result: T) =>
+  typeof result === 'string' && result.includes('Invalid Date') ? null : result;
+
+/**
+ * This SDK's date formatters: core's, with an invalid result suppressed on the way out.
+ *
+ * These used to also rescale a nanosecond timestamp on the way in, because `latest_votes_by_option`
+ * reached the UI as a raw integer core's decoders did not convert. That rescale is gone: every
+ * server-sent timestamp is now a nanosecond number by contract, and each call site converts with
+ * `convertTimestampToDate` where core data enters the tree. Guessing from the magnitude here would
+ * hide a missed conversion instead of surfacing it.
+ */
+export const getDateString: typeof coreGetDateString = ({ messageCreatedAt, ...rest }) =>
+  withoutInvalidDate(coreGetDateString({ ...rest, messageCreatedAt }));
+
+export const getDateStringForA11y: typeof coreGetDateStringForA11y = ({
+  messageCreatedAt,
+  ...rest
+}) => withoutInvalidDate(coreGetDateStringForA11y({ ...rest, messageCreatedAt }));
+
+export const getCalendarDateStringForA11y: typeof coreGetCalendarDateStringForA11y = ({
+  messageCreatedAt,
+  ...rest
+}) => {
+  const result = coreGetCalendarDateStringForA11y({ ...rest, messageCreatedAt });
+  return withoutInvalidDate(result) ?? undefined;
+};

package/src/index.ts

@@ -20,26 +20,14 @@ export * from './middlewares';
 export * from './types/react-native-compat';
 export * from './types/types';
 
-export * from './utils/patchMessageTextCommand';
+export * from './utils/attachmentUrls';
 export * from './utils/i18n/Streami18n';
+export * from './i18n';
 export * from './utils/setupCommandUIMiddlewares';
 export * from './utils/createGenerateVideoThumbnails';
 export * from './utils/utils';
 export * from './nativeMultipartUpload';
 
-export { default as enTranslations } from './i18n/en.json';
-export { default as esTranslations } from './i18n/es.json';
-export { default as frTranslations } from './i18n/fr.json';
-export { default as heTranslations } from './i18n/he.json';
-export { default as hiTranslations } from './i18n/hi.json';
-export { default as itTranslations } from './i18n/it.json';
-export { default as jaTranslations } from './i18n/ja.json';
-export { default as koTranslations } from './i18n/ko.json';
-export { default as nlTranslations } from './i18n/nl.json';
-export { default as ptBRTranslations } from './i18n/pt-br.json';
-export { default as ruTranslations } from './i18n/ru.json';
-export { default as trTranslations } from './i18n/tr.json';
-
 export * from './state-store';
 export { SqliteClient, SqliteClientError, type SqliteClientErrorCode } from './store/SqliteClient';
 export { OfflineDB } from './store/OfflineDB';

package/src/middlewares/__tests__/attachments.test.ts

@@ -1,75 +1,95 @@
-import { LocalAttachment, MessageComposer } from 'stream-chat';
+import { AttachmentPreUploadMiddleware, LocalAttachment, MessageComposer } from 'stream-chat';
 
-import { createAttachmentsCompositionMiddleware } from '../attachments';
+import { setupVideoAttachmentPreviewMiddleware } from '../attachments';
 
-type AttachmentUploadState = 'finished' | 'blocked' | 'pending' | 'uploading' | 'failed';
-
-const createLocalImageAttachment = (
-  id: string,
-  uploadState: AttachmentUploadState,
-): LocalAttachment =>
-  ({
-    image_url: `file://local/${id}`,
-    localMetadata: {
-      file: { name: id, uri: `file://local/${id}` },
-      id,
-      uploadState,
-    },
-    // custom marker that survives localAttachmentToAttachment mapping, used to
-    // identify which attachments ended up in the composed message
-    title: id,
-    type: 'image',
-  }) as unknown as LocalAttachment;
+type InsertedMiddleware = {
+  middleware: AttachmentPreUploadMiddleware[];
+  position: { after?: string; before?: string };
+  unique?: boolean;
+};
 
-const runComposeHandler = (attachments: LocalAttachment[]) => {
+const install = () => {
+  const insert = jest.fn();
   const composer = {
-    attachmentManager: { attachments },
+    attachmentManager: { preUploadMiddlewareExecutor: { insert } },
   } as unknown as MessageComposer;
 
-  const middleware = createAttachmentsCompositionMiddleware(composer);
+  setupVideoAttachmentPreviewMiddleware(composer);
+
+  return { inserted: insert.mock.calls[0][0] as InsertedMiddleware };
+};
 
+const runPrepare = (attachment?: LocalAttachment) => {
+  const { inserted } = install();
   const next = jest.fn((value: unknown) => value);
   const forward = jest.fn();
-  const state = {
-    localMessage: { attachments: [] },
-    message: { attachments: [] },
-  };
 
-  middleware.handlers.compose({
+  inserted.middleware[0].handlers.prepare({
     forward,
     next,
-    state,
-  } as unknown as Parameters<typeof middleware.handlers.compose>[0]);
+    state: { attachment },
+  } as unknown as Parameters<AttachmentPreUploadMiddleware['handlers']['prepare']>[0]);
 
   return { forward, next };
 };
 
-describe('createAttachmentsCompositionMiddleware', () => {
-  it('excludes blocked attachments from the composed message', () => {
-    const { forward, next } = runComposeHandler([
-      createLocalImageAttachment('finished-attachment', 'finished'),
-      createLocalImageAttachment('blocked-attachment', 'blocked'),
-      createLocalImageAttachment('pending-attachment', 'pending'),
-    ]);
+const localVideoAttachment = (overrides: Record<string, unknown> = {}) =>
+  ({
+    localMetadata: {
+      file: { name: 'clip.mp4', uri: 'file://local/clip.mp4' },
+      id: 'clip',
+      uploadState: 'uploading',
+    },
+    thumb_url: 'file://local/clip-thumb.jpg',
+    type: 'video',
+    ...overrides,
+  }) as unknown as LocalAttachment;
+
+describe('setupVideoAttachmentPreviewMiddleware', () => {
+  it('inserts the preview middleware after the upload-config check, without duplicating it', () => {
+    const { inserted } = install();
+
+    expect(inserted.middleware).toHaveLength(1);
+    expect(inserted.middleware[0].id).toBe(
+      'stream-io/message-composer-ui-middleware/video-attachment-preview',
+    );
+    // After the config check, so a blocked file is rejected on its real size rather than the
+    // thumbnail's, and `unique` so a re-render cannot stack copies of it.
+    expect(inserted.position).toEqual({
+      after: 'stream-io/attachment-manager-middleware/file-upload-config-check',
+    });
+    expect(inserted.unique).toBe(true);
+  });
+
+  it('uses the thumbnail as the preview uri of a local video', () => {
+    const { forward, next } = runPrepare(localVideoAttachment());
 
     expect(forward).not.toHaveBeenCalled();
     expect(next).toHaveBeenCalledTimes(1);
 
-    const composedState = next.mock.calls[0][0] as {
-      message: { attachments: { title?: string }[] };
-    };
-    const titles = composedState.message.attachments.map((attachment) => attachment.title);
+    const state = next.mock.calls[0][0] as { attachment: LocalAttachment };
+    expect(state.attachment.localMetadata.previewUri).toBe('file://local/clip-thumb.jpg');
+    // Everything else is carried through untouched.
+    expect(state.attachment.localMetadata.id).toBe('clip');
+    expect(state.attachment.thumb_url).toBe('file://local/clip-thumb.jpg');
+  });
+
+  it('leaves a video without a thumbnail without a preview uri', () => {
+    const { next } = runPrepare(localVideoAttachment({ thumb_url: undefined }));
 
-    expect(titles).toEqual(['finished-attachment', 'pending-attachment']);
+    const state = next.mock.calls[0][0] as { attachment: LocalAttachment };
+    expect(state.attachment.localMetadata.previewUri).toBeUndefined();
   });
 
-  it('forwards without attachments when every attachment is blocked', () => {
-    const { forward, next } = runComposeHandler([
-      createLocalImageAttachment('blocked-1', 'blocked'),
-      createLocalImageAttachment('blocked-2', 'blocked'),
-    ]);
+  it('forwards anything that is not a local video', () => {
+    const image = runPrepare(
+      localVideoAttachment({ image_url: 'file://local/photo.jpg', type: 'image' }),
+    );
+    expect(image.next).not.toHaveBeenCalled();
+    expect(image.forward).toHaveBeenCalledTimes(1);
 
-    expect(next).not.toHaveBeenCalled();
-    expect(forward).toHaveBeenCalledTimes(1);
+    const none = runPrepare(undefined);
+    expect(none.next).not.toHaveBeenCalled();
+    expect(none.forward).toHaveBeenCalledTimes(1);
   });
 });

package/src/middlewares/attachments.ts

@@ -1,119 +1,16 @@
 import {
-  Attachment,
   AttachmentPreUploadMiddleware,
-  FileReference,
-  isLocalImageAttachment,
   isLocalVideoAttachment,
-  LocalAttachment,
   MessageComposer,
-  MessageComposerMiddlewareState,
-  MessageCompositionMiddleware,
-  MessageDraftComposerMiddlewareValueState,
-  MessageDraftCompositionMiddleware,
-  MiddlewareHandlerParams,
 } from 'stream-chat';
 
-import { isLocalUrl } from '../utils/utils';
-
-export const localAttachmentToAttachment = (localAttachment: LocalAttachment) => {
-  const { localMetadata, ...attachment } = localAttachment;
-
-  if (isLocalImageAttachment(localAttachment)) {
-    const isRemoteUri = !!attachment.image_url && !isLocalUrl(attachment.image_url);
-
-    if (isRemoteUri) return attachment as Attachment;
-
-    return {
-      ...attachment,
-      image_url: localMetadata?.previewUri,
-      localId: localMetadata?.id,
-      originalFile: localMetadata.file,
-    } as Attachment;
-  } else {
-    const isRemoteUri = !!attachment.asset_url && !isLocalUrl(attachment.asset_url);
-    if (isRemoteUri) return attachment as Attachment;
-
-    return {
-      ...attachment,
-      asset_url: (localMetadata.file as FileReference).uri,
-      localId: localMetadata?.id,
-      originalFile: localMetadata.file,
-    } as Attachment;
-  }
-};
-
-export const createAttachmentsCompositionMiddleware = (
-  composer: MessageComposer,
-): MessageCompositionMiddleware => ({
-  handlers: {
-    compose: ({
-      state,
-      next,
-      forward,
-    }: MiddlewareHandlerParams<MessageComposerMiddlewareState>) => {
-      const { attachmentManager } = composer;
-      if (!attachmentManager) return forward();
-
-      const attachments = (state.message.attachments ?? []).concat(
-        attachmentManager.attachments
-          // Blocked attachments (e.g. over the size limit) are permanent
-          // validation failures the server will reject, so never serialize
-          // them into the outgoing message.
-          .filter((attachment) => attachment.localMetadata.uploadState !== 'blocked')
-          .map(localAttachmentToAttachment),
-      );
-
-      // prevent introducing attachments array into the payload sent to the server
-      if (!attachments.length) return forward();
-
-      return next({
-        ...state,
-        localMessage: {
-          ...state.localMessage,
-          attachments: [...attachments],
-        },
-        message: {
-          ...state.message,
-          attachments: [...attachments],
-        },
-      });
-    },
-  },
-  id: 'stream-io/message-composer-middleware/attachments',
-});
-
-export const createDraftAttachmentsCompositionMiddleware = (
-  composer: MessageComposer,
-): MessageDraftCompositionMiddleware => ({
-  handlers: {
-    compose: ({
-      state,
-      next,
-      forward,
-    }: MiddlewareHandlerParams<MessageDraftComposerMiddlewareValueState>) => {
-      const { attachmentManager } = composer;
-      if (!attachmentManager) return forward();
-
-      const attachments = (state.draft.attachments ?? []).concat(
-        attachmentManager.attachments
-          // Don't persist blocked attachments (e.g. over the size limit) into
-          // the draft — they are permanent validation failures.
-          .filter((attachment) => attachment.localMetadata.uploadState !== 'blocked')
-          .map(localAttachmentToAttachment),
-      );
-
-      return next({
-        ...state,
-        draft: {
-          ...state.draft,
-          attachments,
-        },
-      });
-    },
-  },
-  id: 'stream-io/message-composer-middleware/draft-attachments',
-});
-
+/**
+ * Supplies a local video's preview URI.
+ *
+ * Every other attachment type gets `localMetadata.previewUri` from `toLocalUploadAttachment`,
+ * which points it at the picked file itself. A video file is not renderable, so the preview has
+ * to be the thumbnail the native picker extracted (`thumb_url`) instead.
+ */
 const createVideoAttachmentPreviewMiddleware = (): AttachmentPreUploadMiddleware => ({
   id: 'stream-io/message-composer-ui-middleware/video-attachment-preview',
   handlers: {

package/src/mock-builders/DB/mock.ts

@@ -32,11 +32,20 @@ export const sqliteMock = {
         rmSync(testDbName, { force: true });
       },
       execute: async (queryInput: string, params: unknown[]) => {
-        const query = queryInput.trim().toLowerCase();
+        const query = queryInput.trim();
+        // Lower-cased COPY, used only to classify the statement and to parse PRAGMA tokens. The query
+        // itself must be executed with its original casing: SQL keywords are case-insensitive, but
+        // string literals are not — and `selectMessagesForChannels` builds its result rows with
+        // `json_object('extraData', a.extraData, ...)`, whose keys are literals. Lower-casing the whole
+        // statement renamed every one of those keys (`extradata`, `createdAt` -> `createdat`, ...), so
+        // `mapStorableToMessage`'s destructuring silently produced `undefined` for every camelCase
+        // field — including the `extraData` blob that carries `status`. op-sqlite runs the SQL as
+        // written, so this only ever misled tests.
+        const classifier = query.toLowerCase();
 
         const stmt = db.prepare(query);
         let result: unknown[] = [];
-        if (query.indexOf('select') === 0) {
+        if (classifier.indexOf('select') === 0) {
           const modifiedParams = params?.map((p) => (typeof p === 'boolean' ? Number(p) : p)) || [];
           result = await new Promise((resolve) => resolve(stmt.all(modifiedParams)));
 
@@ -47,8 +56,8 @@ export const sqliteMock = {
           };
         }
 
-        if (query.indexOf('pragma') === 0) {
-          const pragmaQueryTokens = query.split(' ');
+        if (classifier.indexOf('pragma') === 0) {
+          const pragmaQueryTokens = classifier.split(' ');
           if (pragmaQueryTokens[2] === '=') {
             db.pragma(`${pragmaQueryTokens[1]} = ${pragmaQueryTokens[3]}`);
           } else {