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

package/src/mock-builders/generator/attachment.ts

@@ -6,13 +6,16 @@ const image_url = 'http://www.jackblack.com/tenac_iousd.bmp';
 export const generateAttachmentAction = (a?: Partial<Action>): Action => ({
   name: uuidv4(),
   text: uuidv4(),
+  type: 'button',
   value: uuidv4(),
   ...a,
 });
 
 export const generateVideoAttachment = (a?: Partial<Attachment>): Attachment => ({
   asset_url: 'http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4',
-  mime_type: 'video/mp4',
+  custom: {
+    mime_type: 'video/mp4',
+  },
   thumb_url:
     'https://commondatastorage.googleapis.com/gtv-videos-bucket/sample/images/BigBuckBunny.jpg',
   title: uuidv4(),
@@ -21,6 +24,7 @@ export const generateVideoAttachment = (a?: Partial<Attachment>): Attachment =>
 });
 
 export const generateImageAttachment = (a?: Partial<Attachment>): Attachment => ({
+  custom: {},
   image_url: uuidv4(),
   title: uuidv4(),
   type: 'image',
@@ -42,8 +46,11 @@ export const generateImageUploadPreview = (a?: Partial<UploadPreview>): UploadPr
   ...a,
 });
 
-export const generateAudioAttachment = (a?: Partial<Attachment>): Attachment => ({
+export const generateAudioAttachment = (
+  a?: Partial<Attachment> & { duration?: number; waveform_data?: number[] },
+): Attachment => ({
   asset_url: 'http://www.jackblack.com/tribute.mp3',
+  custom: {},
   image_url,
   text: uuidv4(),
   title: uuidv4(),
@@ -53,8 +60,10 @@ export const generateAudioAttachment = (a?: Partial<Attachment>): Attachment =>
 
 export const generateFileAttachment = (a?: Partial<Attachment>): Attachment => ({
   asset_url: 'https://www.w3.org/WAI/ER/tests/xhtml/testfiles/resources/pdf/dummy.pdf',
-  file_size: 1337,
-  mime_type: uuidv4(),
+  custom: {
+    file_size: 1337,
+    mime_type: uuidv4(),
+  },
   text: uuidv4(),
   title: uuidv4(),
   type: 'file',
@@ -73,6 +82,7 @@ export const generateFileUploadPreview = (a?: Partial<UploadPreview>): UploadPre
 });
 
 export const generateCardAttachment = (a?: Partial<Attachment>): Attachment => ({
+  custom: {},
   image_url,
   og_scrape_url: uuidv4(),
   text: uuidv4(),

package/src/mock-builders/generator/channel.ts

@@ -1,15 +1,17 @@
 import type {
   ChannelMemberResponse,
+  ChannelOwnCapability,
   ChannelResponse,
   LocalMessage,
   MessageResponse,
-  ReadResponse,
+  ReadStateResponse,
 } from 'stream-chat';
 import { v4 as uuidv4 } from 'uuid';
 
+import { convertDateToTimestamp } from './time';
 import { generateUser, getUserDefaults } from './user';
 
-const defaultCapabilities = [
+const defaultCapabilities: ChannelOwnCapability[] = [
   'ban-channel-members',
   'delete-any-message',
   'delete-own-message',
@@ -29,8 +31,8 @@ const defaultCapabilities = [
 ];
 
 const defaultConfig = {
-  automod: 'disabled',
-  automod_behavior: 'flag',
+  automod: 'disabled' as const,
+  automod_behavior: 'flag' as const,
   commands: [
     {
       args: '[text]',
@@ -40,7 +42,7 @@ const defaultConfig = {
     },
   ],
   connect_events: true,
-  created_at: '2020-04-24T11:36:43.859020368Z',
+  created_at: convertDateToTimestamp('2020-04-24T11:36:43.859020368Z'),
   max_message_length: 5000,
   message_retention: 'infinite',
   mutes: true,
@@ -51,7 +53,7 @@ const defaultConfig = {
   replies: true,
   search: true,
   typing_events: true,
-  updated_at: '2020-04-24T11:36:43.859022903Z',
+  updated_at: convertDateToTimestamp('2020-04-24T11:36:43.859022903Z'),
   uploads: true,
   url_enrichment: true,
 };
@@ -78,17 +80,19 @@ const getChannelDefaults = (opts: GeneratedChannelIdType = {}): GeneratedChannel
   return {
     channel: {
       cid: `${type}:${id}`,
+      // The mock config intentionally only supplies a subset of `ChannelConfigWithInfo`;
+      // cast to the declared `channel.config` type (which intersects it) for tests.
       config: {
         ...defaultConfig,
         name: type,
-      },
-      created_at: '2020-04-28T11:20:48.578147Z',
+      } as GeneratedChannel['channel']['config'],
+      created_at: convertDateToTimestamp('2020-04-28T11:20:48.578147Z'),
       created_by: getUserDefaults(),
       frozen: false,
       id,
       own_capabilities: defaultCapabilities,
       type,
-      updated_at: '2020-04-28T11:20:48.578147Z',
+      updated_at: convertDateToTimestamp('2020-04-28T11:20:48.578147Z'),
     },
     cid: `${type}:${id}`,
     id,
@@ -120,7 +124,7 @@ export type GeneratedChannelResponseCustomValues = {
   id?: string;
   messages?: ChannelResponseMessage[];
   members?: Partial<ChannelMemberResponse>[];
-  read?: Partial<ReadResponse>[];
+  read?: Partial<ReadStateResponse>[];
   type?: string;
 };
 

package/src/mock-builders/generator/channelState.ts

@@ -0,0 +1,56 @@
+import { StateStore } from '@stream-io/state-store';
+import { ChannelWatchStatus } from 'stream-chat';
+
+/**
+ * Builds a mock `channel.state` as a REAL `StateStore` — the shape v10 hooks require
+ * (`useStateStore(channel.state, selector)` calls `getLatestValue`/`subscribeWithSelector`).
+ *
+ * The real `ChannelState` exposes several slices BOTH as store keys (read via `getLatestValue`)
+ * and as convenience getters/properties (e.g. `channel.state.members`, `channel.state.membership`).
+ * This mirror installs getters for the commonly-read properties so both access styles work.
+ *
+ * Pass `overrides` to seed any slice, e.g. `generateChannelState({ ownCapabilities: ['x'] })`.
+ */
+const DEFAULTS: Record<string, unknown> = {
+  members: {},
+  memberCount: 0,
+  read: {},
+  typing: {},
+  watchers: {},
+  watcherCount: 0,
+  watchStatus: ChannelWatchStatus.Watching,
+  ownCapabilities: [],
+  membership: {},
+  muteStatus: { createdAt: null, expiresAt: null, muted: false },
+  data: undefined,
+  initialized: true,
+  offlineMode: false,
+  pendingDisposal: false,
+  active: false,
+};
+
+// slice key -> property name(s) the real ChannelState exposes as a getter over that key
+const PROPERTY_GETTERS: Record<string, string[]> = {
+  members: ['members'],
+  memberCount: ['member_count'],
+  read: ['read'],
+  typing: ['typing'],
+  watchers: ['watchers'],
+  watcherCount: ['watcher_count'],
+  membership: ['membership'],
+};
+
+export const generateChannelState = (overrides: Record<string, unknown> = {}) => {
+  const state = new StateStore({ ...DEFAULTS, ...overrides });
+
+  Object.entries(PROPERTY_GETTERS).forEach(([sliceKey, propNames]) => {
+    propNames.forEach((prop) => {
+      Object.defineProperty(state, prop, {
+        configurable: true,
+        get: () => (state.getLatestValue() as Record<string, unknown>)[sliceKey],
+      });
+    });
+  });
+
+  return state;
+};

package/src/mock-builders/generator/message.ts

@@ -2,34 +2,41 @@ import { fromPartial } from '@total-typescript/shoehorn';
 import type { LocalMessage } from 'stream-chat';
 import { v4 as uuidv4, v5 as uuidv5 } from 'uuid';
 
+import { convertDateToTimestamp } from './time';
 import { generateUser } from './user';
 
-type GenerateMessageOptions = Partial<LocalMessage> & { timestamp?: Date };
+type GenerateMessageOptions = Partial<LocalMessage> & {
+  timestamp?: Date | number | string;
+};
 
-// Returns a `LocalMessage`-shaped mock. Components across this SDK consume
-// `LocalMessage` (with `Date` objects for `created_at`/`updated_at`/`pinned_at`/
-// `deleted_at`), so the mock matches that shape. For tests that feed mock data
-// into an API response where the server returns `MessageResponse` (strings for
-// dates), cast at the call site — runtime values are the same either way.
+// Returns a `LocalMessage`-shaped mock. Every timestamp is the unix-nanosecond number the API puts
+// on the wire, because that is what the SDK now consumes — a mock carrying `Date` objects cannot
+// catch the bugs that unit exists to prevent, and `Partial<LocalMessage>` makes the compiler say so.
+// `timestamp` is the shorthand for seeding the message's own dates from one wall-clock value; for
+// any other field, convert at the call site with `convertDateToTimestamp`.
 export const generateMessage = (options: GenerateMessageOptions = {}): LocalMessage => {
-  const timestamp =
-    options.timestamp || new Date(new Date().getTime() - Math.floor(Math.random() * 100000));
+  const { timestamp: seed, ...overrides } = options;
+  const timestamp = convertDateToTimestamp(
+    seed ?? new Date(Date.now() - Math.floor(Math.random() * 100000)),
+  );
 
-  return fromPartial<LocalMessage>({
+  const message = fromPartial<LocalMessage>({
     attachments: [],
     created_at: timestamp,
-    deleted_at: null,
+    deleted_at: undefined,
     html: '<p>regular</p>',
     id: uuidv4(),
-    message_text_updated_at: timestamp.toISOString(),
-    pinned_at: null,
+    message_text_updated_at: timestamp,
+    pinned_at: undefined,
     status: 'received',
     text: uuidv4(),
     type: 'regular',
     updated_at: timestamp,
     user: generateUser(),
-    ...options,
+    ...overrides,
   });
+
+  return message;
 };
 
 const StreamReactNativeNamespace = '9b244ee4-7d69-4d7b-ae23-cf89e9f7b035';
@@ -38,11 +45,11 @@ export const generateStaticMessage = (
   options?: GenerateMessageOptions,
   date?: string | Date,
 ): LocalMessage => {
-  const staticDate = date ? new Date(date) : new Date('2020-04-27T13:39:49.331742Z');
+  const staticDate = convertDateToTimestamp(date ?? '2020-04-27T13:39:49.331742Z');
   return generateMessage({
     created_at: staticDate,
     id: uuidv5(seed, StreamReactNativeNamespace),
-    message_text_updated_at: staticDate.toISOString(),
+    message_text_updated_at: staticDate,
     text: seed,
     updated_at: staticDate,
     ...options,

package/src/mock-builders/generator/reaction.ts

@@ -1,12 +1,13 @@
 import { fromPartial } from '@total-typescript/shoehorn';
 import type { ReactionResponse } from 'stream-chat';
 
+import { convertDateToTimestamp } from './time';
 import { generateUser } from './user';
 
 export const generateReaction = (options: Partial<ReactionResponse> = {}): ReactionResponse => {
   const user = options.user || generateUser();
   return fromPartial<ReactionResponse>({
-    created_at: new Date() as unknown as string,
+    created_at: convertDateToTimestamp(),
     type: 'love',
     user,
     user_id: user.id,

package/src/mock-builders/generator/time.ts

@@ -0,0 +1,19 @@
+import { asTimestampNS, dateToNs, msToNs, nowNs } from 'stream-chat';
+import type { TimestampNS } from 'stream-chat';
+
+/**
+ * Normalizes whatever a test hands a generator into the unix-**nanosecond** number the API puts on
+ * the wire.
+ *
+ * Fixtures have to model the wire — a generator that emits `Date` objects or ISO strings cannot
+ * catch the bugs that unit exists to prevent — but a test reads far better written against a date
+ * literal. So the generators accept `Date`, an ISO string, or a raw wire number and convert here.
+ *
+ * A bare `number` is taken to be nanoseconds already, matching the SDK's unit everywhere else.
+ */
+export const convertDateToTimestamp = (value?: Date | number | string): TimestampNS => {
+  if (value === undefined) return nowNs();
+  if (value instanceof Date) return dateToNs(value);
+  if (typeof value === 'number') return asTimestampNS(value);
+  return msToNs(Date.parse(value));
+};

package/src/mock-builders/generator/user.ts

@@ -2,16 +2,18 @@ import { fromPartial } from '@total-typescript/shoehorn';
 import type { UserResponse } from 'stream-chat';
 import { v4 as uuidv4 } from 'uuid';
 
+import { convertDateToTimestamp } from './time';
+
 export const getUserDefaults = (): UserResponse =>
   fromPartial<UserResponse>({
     banned: false,
-    created_at: '2020-04-27T13:39:49.331742Z',
+    created_at: convertDateToTimestamp('2020-04-27T13:39:49.331742Z'),
     id: uuidv4(),
     image: uuidv4(),
     name: uuidv4(),
     online: false,
     role: 'user',
-    updated_at: '2020-04-27T13:39:49.332087Z',
+    updated_at: convertDateToTimestamp('2020-04-27T13:39:49.332087Z'),
   });
 
 export const generateUser = (options: Partial<UserResponse> = {}): UserResponse =>

package/src/mock-builders/mock.ts

@@ -8,27 +8,36 @@ const token = 'dummy_token';
 
 type MockClientOptions = { disableAppSettings?: boolean };
 
+// `UserResponse` became strict in v10 (~10 required fields), but tests routinely
+// connect a mock user with just `{ id }`. Accept an id plus any subset of the
+// remaining user fields — only `.id` is ever read at runtime.
+type MockUser = Pick<UserResponse, 'id'> & Partial<UserResponse>;
+
 // Tests reach into private/internal StreamChat fields to set up a mocked
 // authenticated client without going through the real network handshake.
 type MockableStreamChat = StreamChat & {
-  connectionId?: string;
   user?: OwnUserResponse;
   _user?: OwnUserResponse;
   userToken?: string;
-  setUser?: (user: UserResponse) => Promise<void>;
   wsPromise?: Promise<unknown>;
   _setToken?: (...args: unknown[]) => unknown;
   _setupConnection?: (...args: unknown[]) => unknown;
 };
 
-export const setUser = (client: StreamChat, user: UserResponse): Promise<void> =>
+export const setUser = (client: StreamChat, user: MockUser): Promise<void> =>
   new Promise<void>((resolve) => {
     const c = client as MockableStreamChat;
-    c.connectionId = 'dumm_connection_id';
+    // `userID` is now a read-only getter derived from `user.id`, so setting `user` is enough. Set
+    // before the socket opens, as `connectUser()` does.
     c.user = { ...user, mutes: [] } as unknown as OwnUserResponse;
     c._user = { ...c.user };
-    c.userID = user.id;
     c.userToken = token;
+    // A connected client means a live socket with a connection id. The id lives on its own manager
+    // now, and `channel.watch()` / `client.queryChannels()` await it rather than degrading to
+    // `watch: false` — with no timeout — so a fixture that leaves it unset hangs every one of them
+    // until the test itself times out. The socket status goes with it: both halves of "connected".
+    client.connectionIdManager.resolveConnectionId('dummy_connection_id');
+    client.wsConnection._setStatus({ isHealthy: true });
     resolve();
   });
 
@@ -36,15 +45,16 @@ function mockClient(client: StreamChat, options: MockClientOptions = {}): Stream
   const { disableAppSettings = true } = options;
   const c = client as MockableStreamChat;
 
-  type WithPrivates = { _setToken: () => void; _setupConnection: () => void };
+  type WithPrivates = { _setToken: () => void; openConnection: () => void };
   const withPrivates = c as unknown as WithPrivates;
   jest.spyOn(withPrivates, '_setToken').mockImplementation();
-  jest.spyOn(withPrivates, '_setupConnection').mockImplementation();
+  // v10 renamed the private `_setupConnection` to the public `openConnection`.
+  jest.spyOn(withPrivates, 'openConnection').mockImplementation();
   c.tokenManager = {
     getToken: jest.fn(() => token),
     tokenReady: jest.fn(() => true),
   } as unknown as StreamChat['tokenManager'];
-  c.setUser = setUser.bind(null, client);
+  c.setUser = setUser.bind(null, client) as unknown as StreamChat['setUser'];
 
   if (disableAppSettings) {
     c.getAppSettings = jest.fn(() => ({})) as unknown as StreamChat['getAppSettings'];
@@ -57,7 +67,7 @@ export const getTestClient = (options: MockClientOptions = {}): StreamChat =>
   mockClient(new StreamChat(apiKey), options);
 
 export const getTestClientWithUser = async (
-  user: UserResponse,
+  user: MockUser,
   options: MockClientOptions = {},
 ): Promise<StreamChat> => {
   const { disableAppSettings = true } = options;

package/src/state-store/__tests__/edit-channel-details-store.test.ts

@@ -1,6 +1,6 @@
 import { act, renderHook } from '@testing-library/react-native';
 
-import type { Channel } from 'stream-chat';
+import type { Channel, ChannelInput } from 'stream-chat';
 
 import { generateChannelResponse } from '../../mock-builders/generator/channel';
 import { getTestClientWithUser } from '../../mock-builders/mock';
@@ -21,8 +21,13 @@ const file: File = {
 
 const createChannel = async (data: { image?: string; name?: string } = {}) => {
   const client = await getTestClientWithUser({ id: 'me' });
-  const response = generateChannelResponse({ channel: data });
-  return client.channel('messaging', response.channel.id, response.channel) as Channel;
+  // `name`/`image` are custom channel fields, nested under `custom` in v10.
+  const response = generateChannelResponse({ channel: { custom: data } });
+  return client.channel(
+    'messaging',
+    response.channel.id,
+    response.channel as unknown as ChannelInput,
+  ) as Channel;
 };
 
 describe('EditChannelDetailsStore', () => {

package/src/state-store/__tests__/image-gallery-state-store.test.ts

@@ -1,10 +1,11 @@
-import type { Attachment, UserResponse } from 'stream-chat';
+import type { Attachment, LocalMessage, UserResponse } from 'stream-chat';
 
 import {
   generateImageAttachment,
   generateVideoAttachment,
 } from '../../mock-builders/generator/attachment';
 import { generateMessage } from '../../mock-builders/generator/message';
+import { getPlayableVideoUrl } from '../../utils/attachmentUrls';
 import { getUrlOfImageAttachment } from '../../utils/getUrlOfImageAttachment';
 import { ImageGalleryStateStore } from '../image-gallery-state-store';
 import { VideoPlayerPool } from '../video-player-pool';
@@ -30,6 +31,7 @@ const { isVideoPlayerAvailable } = jest.requireMock('../../native') as {
 };
 
 const createGiphyAttachment = (overrides: Partial<Attachment> = {}): Attachment => ({
+  custom: {},
   giphy: {
     fixed_height: {
       height: '200',
@@ -340,6 +342,7 @@ describe('ImageGalleryStateStore', () => {
       const store = new ImageGalleryStateStore();
       const fileAttachment: Attachment = {
         asset_url: 'https://example.com/file.pdf',
+        custom: {},
         type: 'file',
       };
       const message = generateMessage({ attachments: [fileAttachment], id: '1' });
@@ -476,6 +479,7 @@ describe('ImageGalleryStateStore', () => {
     it('should use custom giphyVersion from options', () => {
       const store = new ImageGalleryStateStore({ giphyVersion: 'original' });
       const giphyAttachment: Attachment = {
+        custom: {},
         giphy: {
           fixed_height: { height: '200', url: 'https://giphy.com/fixed.gif', width: '200' },
           original: { height: '400', url: 'https://giphy.com/original.gif', width: '400' },
@@ -491,6 +495,52 @@ describe('ImageGalleryStateStore', () => {
       );
     });
 
+    // An attachment whose upload has not resolved: no URL of its own, only `localMetadata`.
+    const pendingAttachment = (type: 'image' | 'video') =>
+      ({
+        localMetadata: {
+          file: { name: `clip.${type}`, uri: `file://local/${type}` },
+          id: `upload-${type}`,
+          // What `setupVideoAttachmentPreviewMiddleware` leaves for a video: the thumbnail.
+          previewUri: type === 'video' ? 'file://local/video-thumb.jpg' : `file://local/${type}`,
+          uploadState: 'uploading',
+        },
+        thumb_url: type === 'video' ? 'file://local/video-thumb.jpg' : undefined,
+        type,
+      }) as unknown as Attachment;
+
+    it('plays the local video file, not its thumbnail, while the upload is in flight', () => {
+      const store = new ImageGalleryStateStore();
+      store.messages = [generateMessage({ attachments: [pendingAttachment('video')], id: '1' })];
+
+      expect(store.assets[0].uri).toBe('file://local/video');
+      expect(store.assets[0].thumb_url).toBe('file://local/video-thumb.jpg');
+    });
+
+    it('shows the local preview of an image while the upload is in flight', () => {
+      const store = new ImageGalleryStateStore();
+      store.messages = [generateMessage({ attachments: [pendingAttachment('image')], id: '1' })];
+
+      expect(store.assets[0].uri).toBe('file://local/image');
+    });
+
+    it('selects a pending video by the url its gallery tile opens with', () => {
+      const store = new ImageGalleryStateStore();
+      const video = pendingAttachment('video');
+      store.messages = [
+        generateMessage({
+          attachments: [generateImageAttachment({ image_url: 'https://example.com/a.jpg' }), video],
+          id: '1',
+        }),
+      ];
+
+      // The tile is built from the attachment as `Message` hands it to the gallery — `image_url`
+      // rewritten to the playable source — while the store reads the raw one. Both must resolve to
+      // the same URL, or the tapped video is not the slide the gallery opens on.
+      const tileUrl = getUrlOfImageAttachment({ ...video, image_url: getPlayableVideoUrl(video) });
+      expect(store.assets.findIndex((asset) => asset.uri === tileUrl)).toBe(1);
+    });
+
     it('should handle messages with multiple attachments', () => {
       const store = new ImageGalleryStateStore();
       const message1 = generateMessage({
@@ -880,7 +930,7 @@ describe('ImageGalleryStateStore', () => {
           id: 'msg-1',
         }),
         user: undefined,
-      };
+      } as unknown as LocalMessage;
 
       store.messages = [message];
 

package/src/state-store/attachment-picker-store.ts

@@ -1,4 +1,4 @@
-import { StateStore } from 'stream-chat';
+import { StateStore } from '@stream-io/state-store';
 
 export type SelectedPickerType =
   | 'images'

package/src/state-store/audio-player-pool.ts

@@ -1,4 +1,4 @@
-import { StateStore } from 'stream-chat';
+import { StateStore } from '@stream-io/state-store';
 
 import { AudioPlayer, AudioPlayerOptions } from './audio-player';
 

package/src/state-store/audio-player.ts

@@ -1,4 +1,4 @@
-import { StateStore } from 'stream-chat';
+import { StateStore } from '@stream-io/state-store';
 
 import { AudioPlayerPool } from './audio-player-pool';
 

package/src/state-store/audio-recorder-manager.ts

@@ -1,6 +1,6 @@
 import { Platform } from 'react-native';
 
-import { StateStore } from 'stream-chat';
+import { StateStore } from '@stream-io/state-store';
 
 import { normalizeAudioLevel } from '../components/MessageInput/utils/normalizeAudioLevel';
 import {

package/src/state-store/edit-channel-details-store.ts

@@ -1,4 +1,5 @@
-import { Channel, StateStore } from 'stream-chat';
+import { StateStore } from '@stream-io/state-store';
+import { Channel } from 'stream-chat';
 
 import { useStateStore } from '../hooks/useStateStore';
 import type { File } from '../types/types';
@@ -34,8 +35,8 @@ export class EditChannelDetailsStore {
   public state: StateStore<EditChannelDetailsState>;
 
   constructor(channel: Channel) {
-    const initialName = channel.data?.name ?? '';
-    const initialImage = channel.data?.image;
+    const initialName = channel.data?.custom?.name ?? '';
+    const initialImage = channel.data?.custom?.image;
 
     this.state = new StateStore<EditChannelDetailsState>({
       currentName: initialName,

package/src/state-store/image-gallery-state-store.ts

@@ -1,6 +1,7 @@
 import { makeMutable, SharedValue } from 'react-native-reanimated';
 
-import { Attachment, LocalMessage, StateStore, Unsubscribe, UserResponse } from 'stream-chat';
+import { StateStore, Unsubscribe } from '@stream-io/state-store';
+import { Attachment, convertTimestampToDate, LocalMessage, UserResponse } from 'stream-chat';
 
 import { VideoPlayerPool } from './video-player-pool';
 
@@ -138,10 +139,10 @@ export class ImageGalleryStateStore {
 
         return {
           channelId: message?.cid,
-          created_at: message?.created_at,
+          created_at: convertTimestampToDate(message?.created_at),
           id: assetId,
           messageId: message?.id,
-          mime_type: attachment.type === 'giphy' ? giphyMimeType : attachment.mime_type,
+          mime_type: attachment.type === 'giphy' ? giphyMimeType : attachment.custom?.mime_type,
           original_height: attachment.original_height,
           original_width: attachment.original_width,
           thumb_url: attachment.thumb_url,

package/src/state-store/in-app-notifications-store.ts

@@ -1,4 +1,5 @@
-import { Notification, StateStore } from 'stream-chat';
+import { StateStore } from '@stream-io/state-store';
+import { Notification } from 'stream-chat';
 
 export type InAppNotificationsState = {
   notifications: Notification[];

package/src/state-store/message-input-height-store.ts

@@ -1,4 +1,4 @@
-import { StateStore } from 'stream-chat';
+import { StateStore } from '@stream-io/state-store';
 
 export type MessageInputHeightState = {
   height: number;

package/src/state-store/message-overlay-store.ts

@@ -2,7 +2,7 @@ import { useCallback, useEffect, useRef } from 'react';
 
 import { makeMutable, type SharedValue } from 'react-native-reanimated';
 
-import { StateStore } from 'stream-chat';
+import { StateStore } from '@stream-io/state-store';
 import { useSyncExternalStore } from 'use-sync-external-store/shim';
 
 import { useStateStore } from '../hooks';

package/src/state-store/selection-store.ts

@@ -1,6 +1,6 @@
 import { useCallback } from 'react';
 
-import { StateStore } from 'stream-chat';
+import { StateStore } from '@stream-io/state-store';
 
 import { useStateStore } from '../hooks/useStateStore';
 

package/src/state-store/signal-store.ts

@@ -1,4 +1,4 @@
-import { StateStore } from 'stream-chat';
+import { StateStore } from '@stream-io/state-store';
 
 export type SignalState = {
   signal: boolean;

package/src/state-store/video-player-pool.ts

@@ -1,4 +1,4 @@
-import { StateStore } from 'stream-chat';
+import { StateStore } from '@stream-io/state-store';
 
 import { VideoPlayer, VideoPlayerOptions } from './video-player';
 

package/src/state-store/video-player.ts

@@ -1,4 +1,4 @@
-import { StateStore } from 'stream-chat';
+import { StateStore } from '@stream-io/state-store';
 
 import { VideoPlayerPool } from './video-player-pool';