stream-chat-react-native-core 7.0.1 → 7.1.0

package/src/components/MessageMenu/hooks/useFetchReactions.ts

@@ -3,7 +3,6 @@ import { useCallback, useEffect, useMemo, useState } from 'react';
 import { LocalMessage, ReactionResponse, ReactionSort } from 'stream-chat';
 
 import { useChatContext } from '../../../contexts/chatContext/ChatContext';
-import { getReactionsForFilterSort } from '../../../store/apis/getReactionsforFilterSort';
 
 export type UseFetchReactionParams = {
   limit?: number;
@@ -28,25 +27,10 @@ export const useFetchReactions = ({
   const sortString = useMemo(() => JSON.stringify(sort), [sort]);
 
   const fetchReactions = useCallback(async () => {
-    const loadOfflineReactions = async () => {
-      if (!messageId) {
-        return;
-      }
-      const reactionsFromDB = await getReactionsForFilterSort({
-        currentMessageId: messageId,
-        filters: reactionType ? { type: reactionType } : {},
-        sort,
-      });
-      if (reactionsFromDB) {
-        setReactions(reactionsFromDB);
-        setLoading(false);
-      }
-    };
-
-    const loadOnlineReactions = async () => {
-      if (!messageId) {
-        return;
-      }
+    if (!messageId) {
+      return;
+    }
+    try {
       const response = await client.queryReactions(
         messageId,
         reactionType ? { type: reactionType } : {},
@@ -54,38 +38,87 @@ export const useFetchReactions = ({
         { limit, next },
       );
       if (response) {
+        setReactions((prevReactions) =>
+          next ? [...prevReactions, ...response.reactions] : response.reactions,
+        );
         setNext(response.next);
-        setReactions((prevReactions) => [...prevReactions, ...response.reactions]);
         setLoading(false);
       }
-    };
-
-    try {
-      // TODO: Threads are not supported for the offline use case as we don't store the thread messages currently, and this will change in the future.
-      if (enableOfflineSupport && !message?.parent_id) {
-        await loadOfflineReactions();
-      } else {
-        await loadOnlineReactions();
-      }
     } catch (error) {
       console.log('Error fetching reactions: ', error);
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [client, messageId, reactionType, sortString, next, enableOfflineSupport]);
+  }, [client, messageId, reactionType, sortString, next, limit, enableOfflineSupport]);
 
   const loadNextPage = useCallback(async () => {
     if (next) {
       await fetchReactions();
     }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [fetchReactions]);
+  }, [fetchReactions, next]);
 
   useEffect(() => {
     setReactions([]);
     setNext(undefined);
     fetchReactions();
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [messageId, reactionType, sortString]);
+  }, [fetchReactions, messageId, reactionType, sortString]);
+
+  useEffect(() => {
+    const listeners: ReturnType<typeof client.on>[] = [];
+    listeners.push(
+      client.on('offline_reactions.queried', (event) => {
+        const { offlineReactions } = event;
+        if (offlineReactions) {
+          setReactions(offlineReactions);
+          setLoading(false);
+          setNext(undefined);
+        }
+      }),
+    );
+
+    listeners.push(
+      client.on('reaction.new', (event) => {
+        const { reaction } = event;
+
+        if (reaction && reaction.type === reactionType) {
+          setReactions((prevReactions) => [reaction, ...prevReactions]);
+        }
+      }),
+    );
+
+    listeners.push(
+      client.on('reaction.updated', (event) => {
+        const { reaction } = event;
+
+        if (reaction) {
+          if (reaction.type === reactionType) {
+            setReactions((prevReactions) => [reaction, ...prevReactions]);
+          } else {
+            setReactions((prevReactions) =>
+              prevReactions.filter((r) => r.user_id !== reaction.user_id),
+            );
+          }
+        }
+      }),
+    );
+
+    listeners.push(
+      client.on('reaction.deleted', (event) => {
+        const { reaction } = event;
+
+        if (reaction && reaction.type === reactionType) {
+          setReactions((prevReactions) =>
+            prevReactions.filter((r) => r.user_id !== reaction.user_id),
+          );
+        }
+      }),
+    );
+
+    return () => {
+      listeners.forEach((listener) => {
+        listener?.unsubscribe();
+      });
+    };
+  }, [client, reactionType]);
 
   return { loading, loadNextPage, reactions };
 };

package/src/contexts/messagesContext/MessagesContext.tsx

@@ -107,7 +107,7 @@ export type MessagesContextValue = Pick<MessageContextValue, 'isMessageAIGenerat
    * Defaults to: [DateHeader](https://github.com/GetStream/stream-chat-react-native/blob/main/package/src/components/MessageList/DateHeader.tsx)
    **/
   DateHeader: React.ComponentType<DateHeaderProps>;
-  deleteMessage: (message: LocalMessage) => Promise<void>;
+  deleteMessage: (message: LocalMessage, hardDelete?: boolean) => Promise<void>;
   deleteReaction: (type: string, messageId: string) => Promise<void>;
 
   /** Should keyboard be dismissed when messaged is touched */

package/src/index.ts

@@ -29,6 +29,7 @@ export { default as trTranslations } from './i18n/tr.json';
 export { default as heTranslations } from './i18n/he.json';
 
 export { SqliteClient } from './store/SqliteClient';
+export { OfflineDB } from './store/OfflineDB';
 export { version } from './version.json';
 
 import { NativeHandlers } from './native';

package/src/mock-builders/event/channelVisible.js

@@ -0,0 +1,7 @@
+export default (client, channel = {}) => {
+  client.dispatchEvent({
+    channel,
+    cid: channel.cid,
+    type: 'channel.visible',
+  });
+};

package/src/mock-builders/event/memberAdded.js

@@ -1,8 +1,10 @@
 export default (client, member, channel = {}) => {
   client.dispatchEvent({
-    channel,
+    channel_id: channel.id,
+    channel_type: channel.type,
     cid: channel.cid,
     member,
     type: 'member.added',
+    user: member.user,
   });
 };

package/src/mock-builders/event/memberRemoved.js

@@ -4,5 +4,6 @@ export default (client, member, channel = {}) => {
     cid: channel.cid,
     member,
     type: 'member.removed',
+    user: member.user,
   });
 };

package/src/mock-builders/event/memberUpdated.js

@@ -4,5 +4,6 @@ export default (client, member, channel = {}) => {
     cid: channel.cid,
     member,
     type: 'member.updated',
+    user: member.user,
   });
 };

package/src/mock-builders/event/messageNew.js

@@ -6,5 +6,6 @@ export default (client, newMessage, channel = {}) => {
     cid: channel.cid,
     message: newMessage,
     type: 'message.new',
+    ...(newMessage.user ? { user: newMessage.user } : {}),
   });
 };

package/src/mock-builders/event/messageRead.js

@@ -1,10 +1,13 @@
-export default (client, user, channel = {}) => {
+export default (client, user, channel = {}, payload = {}) => {
+  const newDate = new Date();
   const event = {
     channel,
     cid: channel.cid,
-    received_at: new Date(),
+    created_at: newDate,
+    received_at: newDate,
     type: 'message.read',
     user,
+    ...payload,
   };
   client.dispatchEvent(event);
 

package/src/mock-builders/event/notificationMarkUnread.js

@@ -1,7 +1,10 @@
 export default (client, channel = {}, payload = {}, user = {}) => {
+  const newDate = new Date();
   client.dispatchEvent({
     channel,
     cid: channel.cid,
+    created_at: newDate,
+    received_at: newDate,
     type: 'notification.mark_unread',
     user,
     ...payload,

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

@@ -97,10 +97,20 @@ export const generateChannelResponse = (
     channel?: Record<string, any>;
     id?: string;
     messages?: Record<string, any>[];
+    members?: Record<string, any>[];
+    read?: Record<string, any>[];
     type?: string;
-  } = { channel: {}, id: uuidv4(), messages: [], type: 'messaging' },
+  } = { channel: {}, id: uuidv4(), members: [], messages: [], read: [], type: 'messaging' },
 ) => {
-  const { channel = {}, id = uuidv4(), messages = [], type = 'messaging', ...rest } = customValues;
+  const {
+    channel = {},
+    id = uuidv4(),
+    messages = [],
+    members = [],
+    read,
+    type = 'messaging',
+    ...rest
+  } = customValues;
 
   const defaults = getChannelDefaults();
   return {
@@ -110,12 +120,14 @@ export const generateChannelResponse = (
         cid: `${type}:${id}`,
         ...channel,
         id,
+        member_count: members.length,
         type,
         user: generateUser(),
       },
     },
-    members: [],
+    members,
     messages,
+    read,
     ...rest,
   };
 };

package/src/store/OfflineDB.ts

@@ -0,0 +1,93 @@
+import { AbstractOfflineDB, StreamChat } from 'stream-chat';
+import type {
+  DBGetAppSettingsType,
+  DBGetChannelsForQueryType,
+  DBGetChannelsType,
+  DBGetLastSyncedAtType,
+  DBUpsertAppSettingsType,
+  DBUpsertUserSyncStatusType,
+} from 'stream-chat';
+
+import * as api from './apis';
+import { SqliteClient } from './SqliteClient';
+
+export class OfflineDB extends AbstractOfflineDB {
+  constructor({ client }: { client: StreamChat }) {
+    super({ client });
+  }
+
+  upsertCidsForQuery = api.upsertCidsForQuery;
+
+  upsertChannels = api.upsertChannels;
+
+  // TODO: Rename currentUserId -> userId in the next major version as it is technically breaking.
+  upsertUserSyncStatus = ({ userId, lastSyncedAt, execute }: DBUpsertUserSyncStatusType) =>
+    api.upsertUserSyncStatus({ currentUserId: userId, execute, lastSyncedAt });
+
+  // TODO: Rename currentUserId -> userId in the next major version as it is technically breaking.
+  upsertAppSettings = ({ appSettings, userId, execute }: DBUpsertAppSettingsType) =>
+    api.upsertAppSettings({ appSettings, currentUserId: userId, execute });
+
+  upsertPoll = api.upsertPoll;
+
+  upsertChannelData = api.upsertChannelData;
+
+  upsertReads = api.upsertReads;
+
+  upsertMessages = api.upsertMessages;
+
+  upsertMembers = api.upsertMembers;
+
+  updateMessage = api.updateMessage;
+
+  // TODO: Rename currentUserId -> userId in the next major version as it is technically breaking.
+  getChannels = ({ cids, userId }: DBGetChannelsType) =>
+    api.getChannels({ channelIds: cids, currentUserId: userId });
+
+  // TODO: Rename currentUserId -> userId in the next major version as it is technically breaking.
+  getChannelsForQuery = ({ userId, filters, sort }: DBGetChannelsForQueryType) =>
+    api.getChannelsForFilterSort({ currentUserId: userId, filters, sort });
+
+  getAllChannelCids = api.getAllChannelIds;
+
+  // TODO: Rename currentUserId -> userId in the next major version as it is technically breaking.
+  getLastSyncedAt = ({ userId }: DBGetLastSyncedAtType) =>
+    api.getLastSyncedAt({ currentUserId: userId });
+
+  getAppSettings = ({ userId }: DBGetAppSettingsType) =>
+    api.getAppSettings({ currentUserId: userId });
+
+  getReactions = api.getReactionsForFilterSort;
+
+  addPendingTask = api.addPendingTask;
+
+  deletePendingTask = api.deletePendingTask;
+
+  deleteReaction = api.deleteReaction;
+
+  deleteMember = api.deleteMember;
+
+  deleteChannel = api.deleteChannel;
+
+  deleteMessagesForChannel = api.deleteMessagesForChannel;
+
+  dropPendingTasks = api.dropPendingTasks;
+
+  hardDeleteMessage = api.deleteMessage;
+
+  softDeleteMessage = api.softDeleteMessage;
+
+  getPendingTasks = api.getPendingTasks;
+
+  updateReaction = api.updateReaction;
+
+  insertReaction = api.insertReaction;
+
+  channelExists = api.channelExists;
+
+  resetDB = SqliteClient.resetDB;
+
+  executeSqlBatch = SqliteClient.executeSqlBatch;
+
+  initializeDB = SqliteClient.initializeDatabase;
+}

package/src/store/SqliteClient.ts

@@ -28,7 +28,7 @@ import type { PreparedBatchQueries, PreparedQueries, Scalar, Table } from './typ
  * This way usage @op-engineering/op-sqlite package is scoped to a single class/file.
  */
 export class SqliteClient {
-  static dbVersion = 8;
+  static dbVersion = 9;
 
   static dbName = DB_NAME;
   static dbLocation = DB_LOCATION;
@@ -96,6 +96,7 @@ export class SqliteClient {
       });
       await this.db.executeBatch(finalQueries);
     } catch (e) {
+      this.db?.execute('ROLLBACK');
       this.logger?.('error', 'SqlBatch queries failed', {
         error: e,
         queries,
@@ -164,6 +165,7 @@ export class SqliteClient {
         await SqliteClient.dropTables();
         await SqliteClient.updateUserPragmaVersion(SqliteClient.dbVersion);
       }
+
       SqliteClient.logger?.('info', 'create tables if not exists', {
         tables: Object.keys(tables),
       });
@@ -176,6 +178,8 @@ export class SqliteClient {
       );
 
       await SqliteClient.executeSqlBatch(q);
+
+      return true;
     } catch (e) {
       console.log('Error initializing DB', e);
       this.logger?.('error', 'Error initializing DB', {
@@ -183,6 +187,8 @@ export class SqliteClient {
         dbname: SqliteClient.dbName,
         error: e,
       });
+
+      return false;
     }
   };
 

package/src/store/apis/addPendingTask.ts

@@ -1,8 +1,9 @@
+import type { PendingTask } from 'stream-chat';
+
 import { mapTaskToStorable } from '../mappers/mapTaskToStorable';
 import { createDeleteQuery } from '../sqlite-utils/createDeleteQuery';
 import { createUpsertQuery } from '../sqlite-utils/createUpsertQuery';
 import { SqliteClient } from '../SqliteClient';
-import type { PendingTask } from '../types';
 
 /*
  * addPendingTask - Adds a pending task to the database

package/src/store/apis/channelExists.ts

@@ -0,0 +1,14 @@
+import { SqliteClient } from '../SqliteClient';
+
+export const channelExists = async ({ cid }: { cid: string }) => {
+  const channels = await SqliteClient.executeSql(
+    'SELECT EXISTS(SELECT 1 FROM channels WHERE cid = ?)',
+    [cid],
+  );
+
+  SqliteClient.logger?.('info', 'channelExists', {
+    cid,
+  });
+
+  return channels.length > 0;
+};

package/src/store/apis/deleteChannel.ts

@@ -1,17 +1,23 @@
 import { createDeleteQuery } from '../sqlite-utils/createDeleteQuery';
 import { SqliteClient } from '../SqliteClient';
 
-export const deleteChannel = async ({ cid, flush = true }: { cid: string; flush?: boolean }) => {
+export const deleteChannel = async ({
+  cid,
+  execute = true,
+}: {
+  cid: string;
+  execute?: boolean;
+}) => {
   const query = createDeleteQuery('channels', {
     cid,
   });
 
   SqliteClient.logger?.('info', 'deleteChannel', {
     cid,
-    flush,
+    execute,
   });
 
-  if (flush) {
+  if (execute) {
     await SqliteClient.executeSql.apply(null, query);
   }
 

package/src/store/apis/deleteMember.ts

@@ -5,12 +5,12 @@ import { SqliteClient } from '../SqliteClient';
 
 export const deleteMember = async ({
   cid,
-  flush = true,
+  execute = true,
   member,
 }: {
   cid: string;
   member: ChannelMemberResponse;
-  flush?: boolean;
+  execute?: boolean;
 }) => {
   const query = createDeleteQuery('members', {
     cid,
@@ -19,11 +19,11 @@ export const deleteMember = async ({
 
   SqliteClient.logger?.('info', 'deleteMember', {
     cid,
-    flush,
+    execute,
     userId: member.user_id,
   });
 
-  if (flush) {
+  if (execute) {
     await SqliteClient.executeSql.apply(null, query);
   }
 

package/src/store/apis/deleteMessage.ts

@@ -1,19 +1,29 @@
 import { createDeleteQuery } from '../sqlite-utils/createDeleteQuery';
 import { SqliteClient } from '../SqliteClient';
 
-export const deleteMessage = async ({ flush = true, id }: { id: string; flush?: boolean }) => {
-  const query = createDeleteQuery('messages', {
-    id,
-  });
+export const deleteMessage = async ({ execute = true, id }: { id: string; execute?: boolean }) => {
+  const queries = [];
+
+  queries.push(
+    createDeleteQuery('reactions', {
+      messageId: id,
+    }),
+  );
+
+  queries.push(
+    createDeleteQuery('messages', {
+      id,
+    }),
+  );
 
   SqliteClient.logger?.('info', 'deleteMessage', {
-    flush,
+    execute,
     id,
   });
 
-  if (flush) {
-    await SqliteClient.executeSql.apply(null, query);
+  if (execute) {
+    await SqliteClient.executeSqlBatch(queries);
   }
 
-  return [query];
+  return queries;
 };

package/src/store/apis/deleteMessagesForChannel.ts

@@ -1,23 +1,27 @@
-import { createDeleteQuery } from '../sqlite-utils/createDeleteQuery';
 import { SqliteClient } from '../SqliteClient';
 
 export const deleteMessagesForChannel = async ({
   cid,
-  flush = true,
+  truncated_at,
+  execute = true,
 }: {
   cid: string;
-  flush?: boolean;
+  truncated_at?: string;
+  execute?: boolean;
 }) => {
-  const query = createDeleteQuery('messages', {
-    cid,
-  });
+  const timestamp = truncated_at ? new Date(truncated_at).toISOString() : new Date().toISOString();
+  const query: [string, (string | number)[]] = [
+    `DELETE FROM messages WHERE cid = ? AND createdAt <= ?`,
+    [cid, timestamp],
+  ];
 
   SqliteClient.logger?.('info', 'deleteMessagesForChannel', {
     cid,
-    flush,
+    execute,
+    truncated_at,
   });
 
-  if (flush) {
+  if (execute) {
     await SqliteClient.executeSql.apply(null, query);
   }
 

package/src/store/apis/deleteReaction.ts

@@ -1,32 +1,52 @@
+import { FormatMessageResponse, MessageResponse, ReactionResponse } from 'stream-chat';
+
 import { createDeleteQuery } from '../sqlite-utils/createDeleteQuery';
+import { createUpdateQuery } from '../sqlite-utils/createUpdateQuery';
 import { SqliteClient } from '../SqliteClient';
+import { PreparedQueries } from '../types';
 
 export const deleteReaction = async ({
-  flush = true,
-  messageId,
-  reactionType,
-  userId,
+  execute = true,
+  message,
+  reaction,
 }: {
-  messageId: string;
-  reactionType: string;
-  userId: string;
-  flush?: boolean;
+  reaction: ReactionResponse;
+  message?: MessageResponse | FormatMessageResponse;
+  execute?: boolean;
 }) => {
-  const query = createDeleteQuery('reactions', {
-    messageId,
-    type: reactionType,
-    userId,
-  });
+  const queries: PreparedQueries[] = [];
+
+  if (!message) {
+    return [];
+  }
+
+  queries.push(
+    createDeleteQuery('reactions', {
+      messageId: reaction.message_id,
+      type: reaction.type,
+      userId: reaction.user_id,
+    }),
+  );
+
+  const stringifiedNewReactionGroups = JSON.stringify(message.reaction_groups);
+
+  queries.push(
+    createUpdateQuery(
+      'messages',
+      {
+        reactionGroups: stringifiedNewReactionGroups,
+      },
+      { id: message.id },
+    ),
+  );
 
   SqliteClient.logger?.('info', 'deleteReaction', {
-    messageId,
-    type: reactionType,
-    userId,
+    reaction,
   });
 
-  if (flush) {
-    await SqliteClient.executeSql.apply(null, query);
+  if (execute) {
+    await SqliteClient.executeSqlBatch(queries);
   }
 
-  return [query];
+  return queries;
 };

package/src/store/apis/deleteReactions.ts

@@ -2,20 +2,20 @@ import { createDeleteQuery } from '../sqlite-utils/createDeleteQuery';
 import { SqliteClient } from '../SqliteClient';
 
 export const deleteReactionsForMessage = async ({
-  flush = true,
+  execute = true,
   messageId,
 }: {
   messageId: string;
-  flush?: boolean;
+  execute?: boolean;
 }) => {
   const query = createDeleteQuery('reactions', {
     messageId,
   });
   console.log('deleteReactionsForMessage', {
-    flush,
+    execute,
     messageId,
   });
-  if (flush) {
+  if (execute) {
     await SqliteClient.executeSql.apply(null, query);
   }