stream-chat 9.2.0-offline-support-beta.2 → 9.2.0

package/dist/cjs/index.browser.cjs

@@ -2550,7 +2550,7 @@ var RESERVED_UPDATED_MESSAGE_FIELDS = {
 };
 var LOCAL_MESSAGE_FIELDS = { error: true };
 var DEFAULT_QUERY_CHANNELS_RETRY_COUNT = 3;
-var DEFAULT_QUERY_CHANNELS_SECONDS_BETWEEN_RETRIES = 1;
+var DEFAULT_QUERY_CHANNELS_MS_BETWEEN_RETRIES = 1e3;
 
 // src/utils.ts
 function logChatPromiseExecution(promise, name) {
@@ -3254,16 +3254,17 @@ var promoteChannel = ({
 };
 var isDate2 = (value) => !!value.getTime;
 var isLocalMessage = (message) => isDate2(message.created_at);
-var waitSeconds = (seconds) => new Promise((resolve) => {
-  setTimeout(resolve, seconds * 1e3);
-});
 var runDetached = (callback, options) => {
   const { context, onSuccessCallback = () => void 0, onErrorCallback } = options ?? {};
   const defaultOnError = (error) => {
     console.log(`An error has occurred in context ${context}: ${error}`);
   };
   const onError = onErrorCallback ?? defaultOnError;
-  callback.then(onSuccessCallback).catch(onError);
+  let promise = callback;
+  if (onSuccessCallback) {
+    promise = promise.then(onSuccessCallback);
+  }
+  promise.catch(onError);
 };
 
 // src/channel_state.ts
@@ -3539,12 +3540,14 @@ var ChannelState = class {
     };
     this._updateMessage(updateData, (msg) => {
       if (messageWithReaction) {
+        const updatedMessage = { ...messageWithReaction };
         messageWithReaction.own_reactions = this._addOwnReactionToMessage(
           msg.own_reactions,
           reaction,
           enforce_unique
         );
-        return this.formatMessage(messageWithReaction);
+        updatedMessage.own_reactions = this._channel.getClient().userID === reaction.user_id ? messageWithReaction.own_reactions : msg.own_reactions;
+        return this.formatMessage(updatedMessage);
       }
       if (messageFromState) {
         return this._addReactionToState(messageFromState, reaction, enforce_unique);
@@ -3599,16 +3602,15 @@ var ChannelState = class {
     return messageFromState;
   }
   _addOwnReactionToMessage(ownReactions, reaction, enforce_unique) {
-    if (this._channel.getClient().userID !== reaction.user_id) {
-      return ownReactions;
-    }
     if (enforce_unique) {
       ownReactions = [];
     } else {
       ownReactions = this._removeOwnReactionFromMessage(ownReactions, reaction);
     }
     ownReactions = ownReactions || [];
-    ownReactions.push(reaction);
+    if (this._channel.getClient().userID === reaction.user_id) {
+      ownReactions.push(reaction);
+    }
     return ownReactions;
   }
   _removeOwnReactionFromMessage(ownReactions, reaction) {
@@ -3727,9 +3729,8 @@ var ChannelState = class {
           (msg) => msg.id === message.id
         );
         if (msgIndex !== -1) {
-          this.messageSets[messageSetIndex].messages[msgIndex] = updateFunc(
-            this.messageSets[messageSetIndex].messages[msgIndex]
-          );
+          const upMsg = updateFunc(this.messageSets[messageSetIndex].messages[msgIndex]);
+          this.messageSets[messageSetIndex].messages[msgIndex] = upMsg;
         }
       }
     }
@@ -3989,7 +3990,7 @@ var isFile2 = (fileLike) => !!fileLike.lastModified && !("uri" in fileLike);
 var isFileList2 = (obj) => {
   if (obj === null || obj === void 0) return false;
   if (typeof obj !== "object") return false;
-  return obj instanceof FileList || "item" in obj && "length" in obj && !Array.isArray(obj);
+  return typeof FileList !== "undefined" && obj instanceof FileList || "item" in obj && "length" in obj && !Array.isArray(obj);
 };
 var isBlobButNotFile = (obj) => obj instanceof Blob && !(obj instanceof File);
 var isFileReference = (obj) => obj !== null && typeof obj === "object" && !isFile2(obj) && !isBlobButNotFile(obj) && typeof obj.name === "string" && typeof obj.uri === "string" && typeof obj.size === "number" && typeof obj.type === "string";
@@ -4476,29 +4477,51 @@ var AttachmentManager = class {
       const attachmentsById = this.attachmentsById;
       return this.attachments.indexOf(attachmentsById[localId]);
     };
+    this.prepareAttachmentUpdate = (attachmentToUpdate) => {
+      const stateAttachments = this.attachments;
+      const attachments = [...this.attachments];
+      const attachmentIndex = this.getAttachmentIndex(attachmentToUpdate.localMetadata.id);
+      if (attachmentIndex === -1) return null;
+      const merged = mergeWithDiff(
+        stateAttachments[attachmentIndex],
+        attachmentToUpdate
+      );
+      const updatesOnMerge = merged.diff && Object.keys(merged.diff.children).length;
+      if (updatesOnMerge) {
+        const localAttachment = ensureIsLocalAttachment(merged.result);
+        if (localAttachment) {
+          attachments.splice(attachmentIndex, 1, localAttachment);
+          return attachments;
+        }
+      }
+      return null;
+    };
+    this.updateAttachment = (attachmentToUpdate) => {
+      const updatedAttachments = this.prepareAttachmentUpdate(attachmentToUpdate);
+      if (updatedAttachments) {
+        this.state.partialNext({ attachments: updatedAttachments });
+      }
+    };
     this.upsertAttachments = (attachmentsToUpsert) => {
       if (!attachmentsToUpsert.length) return;
-      const currentAttachments = this.attachments;
-      const newAttachments = [...currentAttachments];
+      let attachments = [...this.attachments];
+      let hasUpdates = false;
       attachmentsToUpsert.forEach((attachment) => {
-        const targetAttachmentIndex = this.getAttachmentIndex(attachment.localMetadata?.id);
-        if (targetAttachmentIndex < 0) {
-          const localAttachment = ensureIsLocalAttachment(attachment);
-          if (localAttachment) newAttachments.push(localAttachment);
+        const updatedAttachments = this.prepareAttachmentUpdate(attachment);
+        if (updatedAttachments) {
+          attachments = updatedAttachments;
+          hasUpdates = true;
         } else {
-          const merged = mergeWithDiff(
-            currentAttachments[targetAttachmentIndex],
-            attachment
-          );
-          const updatesOnMerge = merged.diff && Object.keys(merged.diff.children).length;
-          if (updatesOnMerge) {
-            const localAttachment = ensureIsLocalAttachment(merged.result);
-            if (localAttachment)
-              newAttachments.splice(targetAttachmentIndex, 1, localAttachment);
+          const localAttachment = ensureIsLocalAttachment(attachment);
+          if (localAttachment) {
+            attachments.push(localAttachment);
+            hasUpdates = true;
           }
         }
       });
-      this.state.partialNext({ attachments: newAttachments });
+      if (hasUpdates) {
+        this.state.partialNext({ attachments });
+      }
     };
     this.removeAttachments = (localAttachmentIds) => {
       this.state.partialNext({
@@ -4526,7 +4549,7 @@ var AttachmentManager = class {
       } = uploadConfig;
       const sizeLimit = size_limit || DEFAULT_UPLOAD_SIZE_LIMIT_BYTES;
       const mimeType = fileLike.type;
-      if (isFile2(fileLike)) {
+      if (isFile2(fileLike) || isFileReference(fileLike)) {
         if (allowed_file_extensions?.length && !allowed_file_extensions.some(
           (ext) => fileLike.name.toLowerCase().endsWith(ext.toLowerCase())
         )) {
@@ -4672,7 +4695,7 @@ var AttachmentManager = class {
             uploadState: "failed"
           }
         };
-        this.upsertAttachments([failedAttachment]);
+        this.updateAttachment(failedAttachment);
         return failedAttachment;
       }
       if (!response) {
@@ -4698,7 +4721,7 @@ var AttachmentManager = class {
       if (response.thumb_url) {
         uploadedAttachment.thumb_url = response.thumb_url;
       }
-      this.upsertAttachments([uploadedAttachment]);
+      this.updateAttachment(uploadedAttachment);
       return uploadedAttachment;
     };
     this.uploadFiles = async (files) => {
@@ -7648,7 +7671,7 @@ var _MessageComposer = class _MessageComposer extends WithSubscriptions {
       this.addUnsubscribeFunction(this.subscribeCustomDataManagerStateChanged());
       this.addUnsubscribeFunction(this.subscribeMessageComposerStateChanged());
       this.addUnsubscribeFunction(this.subscribeMessageComposerConfigStateChanged());
-      return this.unregisterSubscriptions;
+      return this.unregisterSubscriptions.bind(this);
     };
     this.subscribeMessageUpdated = () => {
       const eventTypes = [
@@ -8372,10 +8395,12 @@ var Channel = class {
           type: reactionType,
           user_id: this.getClient().userID ?? user_id
         };
-        await offlineDb.deleteReaction({
-          message,
-          reaction
-        });
+        if (message) {
+          await offlineDb.deleteReaction({
+            message,
+            reaction
+          });
+        }
         return await offlineDb.queueTask({
           task: {
             channelId: this.id,
@@ -8847,7 +8872,7 @@ var Channel = class {
     });
   }
   _isTypingIndicatorsEnabled() {
-    if (!this.getConfig()?.typing_events) {
+    if (!this.getConfig()?.typing_events || !this.getClient().wsConnection?.isHealthy) {
       return false;
     }
     return this.getClient().user?.privacy_settings?.typing_indicators?.enabled ?? true;
@@ -11726,7 +11751,7 @@ var ChannelManager = class extends WithSubscriptions {
     this.setOptions = (options = {}) => {
       this.options = { ...DEFAULT_CHANNEL_MANAGER_OPTIONS, ...options };
     };
-    this.queryChannelsRequest = async (payload, retryCount = 0) => {
+    this.executeChannelsQuery = async (payload, retryCount = 0) => {
       const { filters, sort, options, stateOptions } = payload;
       const { offset, limit } = {
         ...DEFAULT_CHANNEL_MANAGER_PAGINATION_OPTIONS,
@@ -11770,8 +11795,8 @@ var ChannelManager = class extends WithSubscriptions {
           this.state.partialNext({ error: wrappedError });
           return;
         }
-        await waitSeconds(DEFAULT_QUERY_CHANNELS_SECONDS_BETWEEN_RETRIES);
-        return this.queryChannelsRequest(payload, retryCount + 1);
+        await sleep(DEFAULT_QUERY_CHANNELS_MS_BETWEEN_RETRIES);
+        return this.executeChannelsQuery(payload, retryCount + 1);
       }
     };
     this.queryChannels = async (filters, sort = [], options = {}, stateOptions = {}) => {
@@ -11779,10 +11804,12 @@ var ChannelManager = class extends WithSubscriptions {
         pagination: { isLoading, filters: filtersFromState },
         initialized
       } = this.state.getLatestValue();
-      if (isLoading && !this.options.abortInFlightQuery && JSON.stringify(filtersFromState) === JSON.stringify(filters)) {
+      if (isLoading && !this.options.abortInFlightQuery && // TODO: Figure a proper way to either deeply compare these or
+      //       create hashes from each.
+      JSON.stringify(filtersFromState) === JSON.stringify(filters)) {
         return;
       }
-      const queryChannelsRequestPayload = { filters, sort, options, stateOptions };
+      const executeChannelsQueryPayload = { filters, sort, options, stateOptions };
       try {
         this.stateOptions = stateOptions;
         this.state.next((currentState) => ({
@@ -11817,13 +11844,13 @@ var ChannelManager = class extends WithSubscriptions {
             this.client.offlineDb.syncManager.scheduleSyncStatusChangeCallback(
               this.id,
               async () => {
-                await this.queryChannelsRequest(queryChannelsRequestPayload);
+                await this.executeChannelsQuery(executeChannelsQueryPayload);
               }
             );
             return;
           }
         }
-        await this.queryChannelsRequest(queryChannelsRequestPayload);
+        await this.executeChannelsQuery(executeChannelsQueryPayload);
       } catch (error) {
         this.client.logger("error", error.message);
         this.state.next((currentState) => ({
@@ -13166,13 +13193,11 @@ var StreamChat = class _StreamChat {
     if (event.type === "notification.mutes_updated" && event.me?.mutes) {
       this.mutedUsers = event.me.mutes;
     }
-    if (event.type === "notification.mark_read") {
-      if (event.unread_channels === 0) {
-        const activeChannelKeys = Object.keys(this.activeChannels);
-        activeChannelKeys.forEach(
-          (activeChannelKey) => this.activeChannels[activeChannelKey].state.unreadCount = 0
-        );
-      }
+    if (event.type === "notification.mark_read" && event.unread_channels === 0) {
+      const activeChannelKeys = Object.keys(this.activeChannels);
+      activeChannelKeys.forEach(
+        (activeChannelKey) => this.activeChannels[activeChannelKey].state.unreadCount = 0
+      );
     }
     if ((event.type === "channel.deleted" || event.type === "notification.channel_deleted") && event.cid) {
       const { cid } = event;
@@ -14050,7 +14075,7 @@ var StreamChat = class _StreamChat {
       data
     );
   }
-  deleteChannelType(channelType) {
+  DBDeleteChannelType(channelType) {
     return this.delete(
       this.baseURL + `/channeltypes/${encodeURIComponent(channelType)}`
     );
@@ -14391,7 +14416,7 @@ var StreamChat = class _StreamChat {
     if (this.userAgent) {
       return this.userAgent;
     }
-    const version = "9.2.0-offline-support-beta.2";
+    const version = "9.2.0";
     const clientBundle = "browser-cjs";
     let userAgentString = "";
     if (this.sdkIdentifier) {
@@ -15567,9 +15592,154 @@ var BuiltinPermissions = {
   UseFrozenChannel: "Send messages and reactions to frozen channels"
 };
 
-// src/offline_support_api.ts
+// src/offline-support/offline_sync_manager.ts
+var OfflineDBSyncManager = class {
+  constructor({
+    client,
+    offlineDb
+  }) {
+    this.syncStatus = false;
+    this.connectionChangedListener = null;
+    this.syncStatusListeners = [];
+    this.scheduledSyncStatusCallbacks = /* @__PURE__ */ new Map();
+    /**
+     * Initializes the sync manager. Should only be called once per session.
+     *
+     * Cleans up old listeners if re-initialized to avoid memory leaks.
+     * Starts syncing immediately if already connected, otherwise waits for reconnection.
+     */
+    this.init = async () => {
+      try {
+        if (this.client.user?.id && this.client.wsConnection?.isHealthy) {
+          await this.syncAndExecutePendingTasks();
+          await this.invokeSyncStatusListeners(true);
+        }
+        if (this.connectionChangedListener) {
+          this.connectionChangedListener.unsubscribe();
+        }
+        this.connectionChangedListener = this.client.on(
+          "connection.changed",
+          async (event) => {
+            if (event.online) {
+              await this.syncAndExecutePendingTasks();
+              await this.invokeSyncStatusListeners(true);
+            } else {
+              await this.invokeSyncStatusListeners(false);
+            }
+          }
+        );
+      } catch (error) {
+        console.log("Error in DBSyncManager.init: ", error);
+      }
+    };
+    /**
+     * Registers a listener that is called whenever the sync status changes.
+     *
+     * @param listener - A callback invoked with the new sync status (`true` or `false`).
+     * @returns An object with an `unsubscribe` function to remove the listener.
+     */
+    this.onSyncStatusChange = (listener) => {
+      this.syncStatusListeners.push(listener);
+      return {
+        unsubscribe: () => {
+          this.syncStatusListeners = this.syncStatusListeners.filter(
+            (el) => el !== listener
+          );
+        }
+      };
+    };
+    /**
+     * Schedules a one-time callback to be invoked after the next successful sync.
+     *
+     * @param tag - A unique key to identify and manage the callback.
+     * @param callback - An async function to run after sync.
+     */
+    this.scheduleSyncStatusChangeCallback = (tag, callback) => {
+      this.scheduledSyncStatusCallbacks.set(tag, callback);
+    };
+    /**
+     * Invokes all registered sync status listeners and executes any scheduled sync callbacks.
+     *
+     * @param status - The new sync status (`true` or `false`).
+     */
+    this.invokeSyncStatusListeners = async (status) => {
+      this.syncStatus = status;
+      this.syncStatusListeners.forEach((l) => l(status));
+      if (status) {
+        const promises = Array.from(this.scheduledSyncStatusCallbacks.values()).map(
+          (cb) => cb()
+        );
+        await Promise.all(promises);
+        this.scheduledSyncStatusCallbacks.clear();
+      }
+    };
+    /**
+     * Performs synchronization with the Stream backend.
+     *
+     * This includes downloading events since the last sync, updating the local DB,
+     * and handling sync failures (e.g., if syncing beyond the allowed retention window).
+     */
+    this.sync = async () => {
+      if (!this.client?.user) {
+        return;
+      }
+      try {
+        const cids = await this.offlineDb.getAllChannelCids();
+        if (cids.length === 0) {
+          return;
+        }
+        const lastSyncedAt = await this.offlineDb.getLastSyncedAt({
+          userId: this.client.user.id
+        });
+        if (lastSyncedAt) {
+          const lastSyncedAtDate = new Date(lastSyncedAt);
+          const nowDate = /* @__PURE__ */ new Date();
+          const diff = Math.floor(
+            (nowDate.getTime() - lastSyncedAtDate.getTime()) / (1e3 * 60 * 60 * 24)
+          );
+          if (diff > 30) {
+            await this.offlineDb.resetDB();
+          } else {
+            const result = await this.client.sync(cids, lastSyncedAtDate.toISOString());
+            const queryPromises = result.events.map(
+              (event) => this.offlineDb.handleEvent({ event, execute: false })
+            );
+            const queriesArray = await Promise.all(queryPromises);
+            const queries = queriesArray.flat();
+            if (queries.length) {
+              await this.offlineDb.executeSqlBatch(queries);
+            }
+          }
+        }
+        await this.offlineDb.upsertUserSyncStatus({
+          userId: this.client.user.id,
+          lastSyncedAt: (/* @__PURE__ */ new Date()).toString()
+        });
+      } catch (e) {
+        console.log("An error has occurred while syncing the DB.", e);
+        await this.offlineDb.resetDB();
+      }
+    };
+    /**
+     * Executes any tasks that were queued while offline and then performs a sync.
+     */
+    this.syncAndExecutePendingTasks = async () => {
+      await this.offlineDb.executePendingTasks();
+      await this.sync();
+    };
+    this.client = client;
+    this.offlineDb = offlineDb;
+  }
+};
+
+// src/offline-support/offline_support_api.ts
 var AbstractOfflineDB = class {
   constructor({ client }) {
+    /**
+     * Initializes the DB as well as its syncManager for a given userId.
+     * It will update the DBs reactive state with initialization values.
+     * @param userId - the user ID for which we want to initialize
+     */
     this.init = async (userId) => {
       try {
         if (!this.shouldInitialize(userId)) {
@@ -15586,6 +15756,15 @@ var AbstractOfflineDB = class {
         console.log("Error Initializing DB:", error);
       }
     };
+    /**
+     * A utility method used to execute a query in a detached manner. The callback
+     * passed uses a reference to the DB itself and will handle errors gracefully
+     * and silently. Only really meant to be used for write queries that need to
+     * be run in synchronous functions.
+     * @param queryCallback - a callback wrapping all query logic that is to be executed
+     * @param method - a utility parameter used for proper logging (will make sure the method
+     * is logged on failure)
+     */
     this.executeQuerySafely = (queryCallback, { method }) => {
       const { initialized } = this.state.getLatestValue();
       if (!initialized) {
@@ -15593,6 +15772,24 @@ var AbstractOfflineDB = class {
       }
       runDetached(queryCallback(this), { context: `OfflineDB(${method})` });
     };
+    /**
+     * A utility method used to guard a certain DB query with the possible non-existance
+     * of a channel inside of the DB. If the channel we want to guard against does not exist
+     * in the DB yet, it will try to:
+     *
+     * 1. Use the channel from the WS event
+     * 2. Use the channel from state
+     *
+     * and upsert the channels in the DB.
+     *
+     * If both fail, it will not execute the query as it would result in a foreign key constraint
+     * error.
+     *
+     * @param event - the WS event we are trying to process
+     * @param execute - whether to immediately execute the operation.
+     * @param forceUpdate - whether to upsert the channel data anyway
+     * @param createQueries - a callback function to creation of the queries that we want to execute
+     */
     this.queriesWithChannelGuard = async ({
       event,
       execute = true,
@@ -15630,7 +15827,7 @@ var AbstractOfflineDB = class {
             return newQueries;
           } else {
             console.warn(
-              `Couldnt create channel queries on ${type} event for an initialized channel that is not in DB, skipping event`,
+              `Couldn't create channel queries on ${type} event for an initialized channel that is not in DB, skipping event`,
               { event }
             );
             return [];
@@ -15645,8 +15842,14 @@ var AbstractOfflineDB = class {
       }
       return await createQueries(execute);
     };
-    // TODO: Check why this isn't working properly for read state - something is not
-    //       getting populated as it should :'(
+    /**
+     * Handles a message.new event. Will always use a channel guard for the inner queries
+     * and it is going to make sure that both messages and reads are upserted. It will not
+     * try to fetch the reads from the DB first and it will rely on channel.state to handle
+     * the number of unreads.
+     * @param event - the WS event we are trying to process
+     * @param execute - whether to immediately execute the operation.
+     */
     this.handleNewMessage = async ({
       event,
       execute = true
@@ -15692,6 +15895,12 @@ var AbstractOfflineDB = class {
       }
       return finalQueries;
     };
+    /**
+     * A handler for message deletion. It provides a channel guard and determines whether
+     * it should hard delete or soft delete the message.
+     * @param event - the WS event we are trying to process
+     * @param execute - whether to immediately execute the operation.
+     */
     this.handleDeleteMessage = async ({
       event,
       execute = true
@@ -15707,12 +15916,11 @@ var AbstractOfflineDB = class {
       return [];
     };
     /**
-     * TODO: Write docs. Here and in all other places in the API.
-     * This method is used for removing a message that has already failed from the
-     * state as well as the DB. We want to drop all pending tasks as well as finally
-     * hard delete the message from the DB.
-     * @param messageId
-     * @param execute
+     * A utility method used for removing a message that has already failed from the
+     * state as well as the DB. We want to drop all pending tasks and finally hard
+     * delete the message from the DB.
+     * @param messageId - the message id of the message we want to remove
+     * @param execute - whether to immediately execute the operation.
      */
     this.handleRemoveMessage = async ({
       messageId,
@@ -15732,6 +15940,16 @@ var AbstractOfflineDB = class {
       }
       return queries;
     };
+    /**
+     * A utility method to handle read events. It will calculate the state of the reads if
+     * present in the event, or optionally rely on the hard override in unreadMessages.
+     * The unreadMessages argument is useful for cases where we know the exact number of unreads
+     * (for example reading an entire channel), but `unread_messages` might not necessarily exist
+     * in the event (or it exists with a stale value if we know what we want to ultimately update to).
+     * @param event - the WS event we are trying to process
+     * @param unreadMessages - an override of unread_messages that will be preferred when upserting reads
+     * @param execute - whether to immediately execute the operation.
+     */
     this.handleRead = async ({
       event,
       unreadMessages,
@@ -15764,6 +15982,13 @@ var AbstractOfflineDB = class {
       }
       return [];
     };
+    /**
+     * A utility method used to handle member events. It guards the processing
+     * of each event with a channel guard and also forces an update of member_count
+     * for the respective channel if applicable.
+     * @param event - the WS event we are trying to process
+     * @param execute - whether to immediately execute the operation.
+     */
     this.handleMemberEvent = async ({
       event,
       execute = true
@@ -15786,6 +16011,12 @@ var AbstractOfflineDB = class {
       }
       return [];
     };
+    /**
+     * A utility method used to handle message.updated events. It guards each
+     * event handler within a channel guard.
+     * @param event - the WS event we are trying to process
+     * @param execute - whether to immediately execute the operation.
+     */
     this.handleMessageUpdatedEvent = async ({
       event,
       execute = true
@@ -15803,8 +16034,10 @@ var AbstractOfflineDB = class {
      * An event handler for channel.visible and channel.hidden events. We need a separate
      * handler because event.channel.hidden does not arrive with the baseline event, so a
      * simple upsertion is not enough.
-     * @param event
-     * @param execute
+     * It will update the hidden property of a channel to true if handling the `channel.hidden`
+     * event and to false if handling `channel.visible`.
+     * @param event - the WS event we are trying to process
+     * @param execute - whether to immediately execute the operation.
      */
     this.handleChannelVisibilityEvent = async ({
       event,
@@ -15820,6 +16053,13 @@ var AbstractOfflineDB = class {
       }
       return [];
     };
+    /**
+     * A utility handler used to handle channel.truncated events. It handles both
+     * removing all messages and relying on truncated_at as well. It will also upsert
+     * reads adequately (and calculate the correct unread messages when truncating).
+     * @param event - the WS event we are trying to process
+     * @param execute - whether to immediately execute the operation.
+     */
     this.handleChannelTruncatedEvent = async ({
       event,
       execute = true
@@ -15861,6 +16101,15 @@ var AbstractOfflineDB = class {
       }
       return [];
     };
+    /**
+     * A utility handler for all reaction events. It wraps the inner queries
+     * within a channel guard and maps them like so:
+     * - reaction.new -> insertReaction
+     * - reaction.updated -> updateReaction
+     * - reaction.deleted -> deleteReaction
+     * @param event - the WS event we are trying to process
+     * @param execute - whether to immediately execute the operation.
+     */
     this.handleReactionEvent = async ({
       event,
       execute = true
@@ -15889,6 +16138,13 @@ var AbstractOfflineDB = class {
         (executeOverride) => reactionMethod({ message, reaction, execute: executeOverride })
       );
     };
+    /**
+     * A generic event handler that decides which DB API to invoke based on
+     * event.type for all events we are currently handling. It is used to both
+     * react on WS events as well as process the sync API events.
+     * @param event - the WS event we are trying to process
+     * @param execute - whether to immediately execute the operation.
+     */
     this.handleEvent = async ({
       event,
       execute = true
@@ -15929,9 +16185,24 @@ var AbstractOfflineDB = class {
       }
       return [];
     };
+    /**
+     * A method used to enqueue a pending task if the execution of it fails.
+     * It will try to do the following:
+     *
+     * 1. Execute the task immediately
+     * 2. If this fails, checks if the failure was due to something valid for a pending task
+     * 3. If it is, it will insert the task in the pending tasks table
+     *
+     * It will return the response from the execution if it succeeded.
+     * @param task - the pending task we want to execute
+     */
     this.queueTask = async ({ task }) => {
       let response;
       try {
+        if (!this.client.wsConnection?.isHealthy) {
+          await this.addPendingTask(task);
+          return;
+        }
         response = await this.executeTask({ task });
       } catch (e) {
         if (!this.shouldSkipQueueingTask(e)) {
@@ -15941,9 +16212,26 @@ var AbstractOfflineDB = class {
       }
       return response;
     };
-    // Error code 4 - bad request data
-    // Error code 17 - missing own_capabilities to execute the task
+    /**
+     * A utility method that determines if a failed task should be added to the
+     * queue based on its error.
+     * Error code 4 - bad request data
+     * Error code 17 - missing own_capabilities to execute the task
+     * @param error
+     */
     this.shouldSkipQueueingTask = (error) => error?.response?.data?.code === 4 || error?.response?.data?.code === 17;
+    /**
+     * Executes a task from the list of supported pending tasks. Currently supported pending tasks
+     * are:
+     * - Deleting a message
+     * - Sending a reaction
+     * - Removing a reaction
+     * - Sending a message
+     * It will throw if we try to execute a pending task that is not supported.
+     * @param task - The task we want to execute
+     * @param isPendingTask - a control value telling us if it's an actual pending task being executed
+     * or delayed execution
+     */
     this.executeTask = async ({ task }, isPendingTask = false) => {
       if (task.type === "delete-message") {
         return await this.client._deleteMessage(...task.payload);
@@ -15951,9 +16239,6 @@ var AbstractOfflineDB = class {
       const { channelType, channelId } = task;
       if (channelType && channelId) {
         const channel = this.client.channel(channelType, channelId);
-        if (!channel.initialized) {
-          await channel.watch();
-        }
         if (task.type === "send-reaction") {
           return await channel._sendReaction(...task.payload);
         }
@@ -15961,17 +16246,30 @@ var AbstractOfflineDB = class {
           return await channel._deleteReaction(...task.payload);
         }
         if (task.type === "send-message") {
-          const newMessage = await channel._sendMessage(...task.payload);
-          if (isPendingTask) {
-            channel.state.addMessageSorted(newMessage.message, true);
+          const newMessageResponse = await channel._sendMessage(...task.payload);
+          const newMessage = newMessageResponse?.message;
+          if (isPendingTask && newMessage) {
+            if (newMessage?.parent_id) {
+              this.client.threads.threadsById[newMessage.parent_id]?.upsertReplyLocally({
+                message: newMessage,
+                timestampChanged: true
+              });
+            }
+            channel.state.addMessageSorted(newMessage, true);
           }
-          return newMessage;
+          return newMessageResponse;
         }
       }
       throw new Error(
         `Tried to execute invalid pending task type (${task.type}) while synchronizing the database.`
       );
     };
+    /**
+     * A utility method used to execute all pending tasks. As each task succeeds execution,
+     * it is going to be removed from the DB. If the execution failed due to a valid reason
+     * it is going to remove the pending task from the DB even if execution fails, otherwise
+     * it will keep it for the next time we try to execute all pending taks.
+     */
     this.executePendingTasks = async () => {
       const queue = await this.getPendingTasks();
       for (const task of queue) {
@@ -16003,133 +16301,15 @@ var AbstractOfflineDB = class {
       userId: this.client.userID
     });
   }
+  /**
+   * Checks whether the DB should be initialized or if it has been initialized already.
+   * @param {string} userId - the user ID for which we want to check initialization
+   */
   shouldInitialize(userId) {
     const { userId: userIdFromState, initialized } = this.state.getLatestValue();
     return userId === userIdFromState && initialized;
   }
 };
-var OfflineDBSyncManager = class {
-  constructor({
-    client,
-    offlineDb
-  }) {
-    this.syncStatus = false;
-    this.connectionChangedListener = null;
-    this.syncStatusListeners = [];
-    this.scheduledSyncStatusCallbacks = /* @__PURE__ */ new Map();
-    /**
-     * Initializes the OfflineDBSyncManager. This function should be called only once
-     * throughout the lifetime of SDK. If it is performed more than once for whatever
-     * reason, it will run cleanup on its listeners to prevent memory leaks.
-     */
-    this.init = async () => {
-      try {
-        if (this.client.user?.id && this.client.wsConnection?.isHealthy) {
-          await this.syncAndExecutePendingTasks();
-          await this.invokeSyncStatusListeners(true);
-        }
-        if (this.connectionChangedListener) {
-          this.connectionChangedListener.unsubscribe();
-        }
-        this.connectionChangedListener = this.client.on(
-          "connection.changed",
-          async (event) => {
-            if (event.online) {
-              await this.syncAndExecutePendingTasks();
-              await this.invokeSyncStatusListeners(true);
-            } else {
-              await this.invokeSyncStatusListeners(false);
-            }
-          }
-        );
-      } catch (error) {
-        console.log("Error in DBSyncManager.init: ", error);
-      }
-    };
-    /**
-     * Subscribes a listener for sync status change.
-     *
-     * @param listener {function}
-     * @returns {function} to unsubscribe the listener.
-     */
-    this.onSyncStatusChange = (listener) => {
-      this.syncStatusListeners.push(listener);
-      return {
-        unsubscribe: () => {
-          this.syncStatusListeners = this.syncStatusListeners.filter(
-            (el) => el !== listener
-          );
-        }
-      };
-    };
-    this.scheduleSyncStatusChangeCallback = (tag, callback) => {
-      this.scheduledSyncStatusCallbacks.set(tag, callback);
-    };
-    this.invokeSyncStatusListeners = async (status) => {
-      this.syncStatus = status;
-      this.syncStatusListeners.forEach((l) => l(status));
-      if (status) {
-        const promises = Array.from(this.scheduledSyncStatusCallbacks.values()).map(
-          (cb) => cb()
-        );
-        await Promise.all(promises);
-        this.scheduledSyncStatusCallbacks.clear();
-      }
-    };
-    this.sync = async () => {
-      if (!this.client?.user) {
-        return;
-      }
-      const cids = await this.offlineDb.getAllChannelCids();
-      if (cids.length === 0) {
-        return;
-      }
-      console.log("MIDWAY MARK :D");
-      const lastSyncedAt = await this.offlineDb.getLastSyncedAt({
-        userId: this.client.user.id
-      });
-      console.log("LAST SYNC AT: ", lastSyncedAt);
-      if (lastSyncedAt) {
-        const lastSyncedAtDate = new Date(lastSyncedAt);
-        const nowDate = /* @__PURE__ */ new Date();
-        const diff = Math.floor(
-          (nowDate.getTime() - lastSyncedAtDate.getTime()) / (1e3 * 60 * 60 * 24)
-        );
-        console.log("DIFF: ", diff);
-        if (diff > 30) {
-          await this.offlineDb.resetDB();
-        } else {
-          try {
-            console.log("ABOUT TO CALL SYNC API");
-            const result = await this.client.sync(cids, lastSyncedAtDate.toISOString());
-            console.log("CALLED SYNC API", result.events);
-            const queryPromises = result.events.map(
-              (event) => this.offlineDb.handleEvent({ event, execute: false })
-            );
-            const queriesArray = await Promise.all(queryPromises);
-            const queries = queriesArray.flat();
-            if (queries.length) {
-              await this.offlineDb.executeSqlBatch(queries);
-            }
-          } catch (e) {
-            console.log("An error has occurred while syncing the DB.", e);
-            await this.offlineDb.resetDB();
-          }
-        }
-      }
-      await this.offlineDb.upsertUserSyncStatus({
-        userId: this.client.user.id,
-        lastSyncedAt: (/* @__PURE__ */ new Date()).toString()
-      });
-    };
-    this.syncAndExecutePendingTasks = async () => {
-      await this.offlineDb.executePendingTasks();
-      await this.sync();
-    };
-    this.client = client;
-    this.offlineDb = offlineDb;
-  }
-};
 
 // src/utils/FixedSizeQueueCache.ts
 var FixedSizeQueueCache = class {