@knocklabs/client 0.8.15 → 0.8.17

package/dist/cjs/clients/feed/feed.js

@@ -1,42 +1,28 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-
 var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
-
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
-
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var _eventemitter = require("eventemitter2");
-
 var _store = _interopRequireDefault(require("./store"));
-
 var _networkStatus = require("../../networkStatus");
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 // Default options to apply
 var feedClientDefaults = {
   archived: "exclude"
 };
-
+var DEFAULT_DISCONNECT_DELAY = 2000;
 var Feed = /*#__PURE__*/function () {
-  // The raw store instance, used for binding in React and other environments
   function Feed(knock, feedId, options) {
     var _this = this;
-
     (0, _classCallCheck2["default"])(this, Feed);
     this.knock = knock;
     this.feedId = feedId;
@@ -46,6 +32,8 @@ var Feed = /*#__PURE__*/function () {
     (0, _defineProperty2["default"])(this, "broadcaster", void 0);
     (0, _defineProperty2["default"])(this, "defaultOptions", void 0);
     (0, _defineProperty2["default"])(this, "broadcastChannel", void 0);
+    (0, _defineProperty2["default"])(this, "disconnectTimer", null);
+    // The raw store instance, used for binding in React and other environments
     (0, _defineProperty2["default"])(this, "store", void 0);
     this.apiClient = knock.client();
     this.feedId = feedId;
@@ -55,25 +43,28 @@ var Feed = /*#__PURE__*/function () {
       wildcard: true,
       delimiter: "."
     });
-    this.defaultOptions = _objectSpread(_objectSpread({}, feedClientDefaults), options); // In server environments we might not have a socket connection
+    this.defaultOptions = _objectSpread(_objectSpread({}, feedClientDefaults), options);
 
+    // In server environments we might not have a socket connection
     if (this.apiClient.socket) {
       this.channel = this.apiClient.socket.channel("feeds:".concat(this.userFeedId), this.defaultOptions);
       this.channel.on("new-message", function (resp) {
         return _this.onNewMessageReceived(resp);
       });
-    } // Attempt to bind to listen to other events from this feed in different tabs
-    // Note: here we ensure `self` is available (it's not in server rendered envs)
-
+    }
 
+    // Attempt to bind to listen to other events from this feed in different tabs
+    // Note: here we ensure `self` is available (it's not in server rendered envs)
     this.broadcastChannel = typeof self !== "undefined" && "BroadcastChannel" in self ? new BroadcastChannel("knock:feed:".concat(this.userFeedId)) : null;
+    if (options.auto_manage_socket_connection && this.apiClient.socket) {
+      this.setupAutoSocketManager(options.auto_manage_socket_connection_delay);
+    }
   }
+
   /**
    * Cleans up a feed instance by destroying the store and disconnecting
    * an open socket connection.
    */
-
-
   (0, _createClass2["default"])(Feed, [{
     key: "teardown",
     value: function teardown() {
@@ -81,36 +72,33 @@ var Feed = /*#__PURE__*/function () {
         this.channel.leave();
         this.channel.off("new-message");
       }
-
       this.broadcaster.removeAllListeners();
       this.store.destroy();
-
       if (this.broadcastChannel) {
         this.broadcastChannel.close();
       }
     }
+
     /*
       Initializes a real-time connection to Knock, connecting the websocket for the
       current ApiClient instance if the socket is not already connected.
     */
-
   }, {
     key: "listenForUpdates",
     value: function listenForUpdates() {
       var _this2 = this;
-
       // Connect the socket only if we don't already have a connection
       if (this.apiClient.socket && !this.apiClient.socket.isConnected()) {
         this.apiClient.socket.connect();
-      } // Only join the channel if we're not already in a joining state
-
+      }
 
+      // Only join the channel if we're not already in a joining state
       if (this.channel && ["closed", "errored"].includes(this.channel.state)) {
         this.channel.join();
-      } // Opt into receiving updates from _other tabs for the same user / feed_ via the broadcast
-      // channel (iff it's enabled and exists)
-
+      }
 
+      // Opt into receiving updates from _other tabs for the same user / feed_ via the broadcast
+      // channel (iff it's enabled and exists)
       if (this.broadcastChannel && this.defaultOptions.__experimentalCrossBrowserUpdates === true) {
         this.broadcastChannel.onmessage = function (e) {
           switch (e.data.type) {
@@ -128,15 +116,14 @@ var Feed = /*#__PURE__*/function () {
               // maybe do this optimistically without the fetch.
               return _this2.fetch();
               break;
-
             default:
               return null;
           }
         };
       }
     }
-    /* Binds a handler to be invoked when event occurs */
 
+    /* Binds a handler to be invoked when event occurs */
   }, {
     key: "on",
     value: function on(eventName, callback) {
@@ -158,27 +145,22 @@ var Feed = /*#__PURE__*/function () {
       var _markAsSeen = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee(itemOrItems) {
         var now;
         return _regenerator["default"].wrap(function _callee$(_context) {
-          while (1) {
-            switch (_context.prev = _context.next) {
-              case 0:
-                now = new Date().toISOString();
-                this.optimisticallyPerformStatusUpdate(itemOrItems, "seen", {
-                  seen_at: now
-                }, "unseen_count");
-                return _context.abrupt("return", this.makeStatusUpdate(itemOrItems, "seen"));
-
-              case 3:
-              case "end":
-                return _context.stop();
-            }
+          while (1) switch (_context.prev = _context.next) {
+            case 0:
+              now = new Date().toISOString();
+              this.optimisticallyPerformStatusUpdate(itemOrItems, "seen", {
+                seen_at: now
+              }, "unseen_count");
+              return _context.abrupt("return", this.makeStatusUpdate(itemOrItems, "seen"));
+            case 3:
+            case "end":
+              return _context.stop();
           }
         }, _callee, this);
       }));
-
       function markAsSeen(_x) {
         return _markAsSeen.apply(this, arguments);
       }
-
       return markAsSeen;
     }()
   }, {
@@ -186,79 +168,71 @@ var Feed = /*#__PURE__*/function () {
     value: function () {
       var _markAllAsSeen = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2() {
         var _this$store, getState, setState, _getState, metadata, items, isViewingOnlyUnseen, attrs, itemIds, result;
-
         return _regenerator["default"].wrap(function _callee2$(_context2) {
-          while (1) {
-            switch (_context2.prev = _context2.next) {
-              case 0:
-                // To mark all of the messages as seen we:
-                // 1. Optimistically update *everything* we have in the store
-                // 2. We decrement the `unseen_count` to zero optimistically
-                // 3. We issue the API call to the endpoint
-                //
-                // Note: there is the potential for a race condition here because the bulk
-                // update is an async method, so if a new message comes in during this window before
-                // the update has been processed we'll effectively reset the `unseen_count` to be what it was.
-                //
-                // Note: here we optimistically handle the case whereby the feed is scoped to show only `unseen`
-                // items by removing everything from view.
-                _this$store = this.store, getState = _this$store.getState, setState = _this$store.setState;
-                _getState = getState(), metadata = _getState.metadata, items = _getState.items;
-                isViewingOnlyUnseen = this.defaultOptions.status === "unseen"; // If we're looking at the unseen view, then we want to remove all of the items optimistically
-                // from the store given that nothing should be visible. We do this by resetting the store state
-                // and setting the current metadata counts to 0
-
-                if (isViewingOnlyUnseen) {
-                  setState(function (store) {
-                    return store.resetStore(_objectSpread(_objectSpread({}, metadata), {}, {
-                      total_count: 0,
-                      unseen_count: 0
-                    }));
-                  });
-                } else {
-                  // Otherwise we want to update the metadata and mark all of the items in the store as seen
-                  setState(function (store) {
-                    return store.setMetadata(_objectSpread(_objectSpread({}, metadata), {}, {
-                      unseen_count: 0
-                    }));
-                  });
-                  attrs = {
-                    seen_at: new Date().toISOString()
-                  };
-                  itemIds = items.map(function (item) {
-                    return item.id;
-                  });
-                  setState(function (store) {
-                    return store.setItemAttrs(itemIds, attrs);
-                  });
-                } // Issue the API request to the bulk status change API
-
-
-                _context2.next = 6;
-                return this.makeBulkStatusUpdate("seen");
-
-              case 6:
-                result = _context2.sent;
-                this.broadcaster.emit("items:all_seen", {
-                  items: items
+          while (1) switch (_context2.prev = _context2.next) {
+            case 0:
+              // To mark all of the messages as seen we:
+              // 1. Optimistically update *everything* we have in the store
+              // 2. We decrement the `unseen_count` to zero optimistically
+              // 3. We issue the API call to the endpoint
+              //
+              // Note: there is the potential for a race condition here because the bulk
+              // update is an async method, so if a new message comes in during this window before
+              // the update has been processed we'll effectively reset the `unseen_count` to be what it was.
+              //
+              // Note: here we optimistically handle the case whereby the feed is scoped to show only `unseen`
+              // items by removing everything from view.
+              _this$store = this.store, getState = _this$store.getState, setState = _this$store.setState;
+              _getState = getState(), metadata = _getState.metadata, items = _getState.items;
+              isViewingOnlyUnseen = this.defaultOptions.status === "unseen"; // If we're looking at the unseen view, then we want to remove all of the items optimistically
+              // from the store given that nothing should be visible. We do this by resetting the store state
+              // and setting the current metadata counts to 0
+              if (isViewingOnlyUnseen) {
+                setState(function (store) {
+                  return store.resetStore(_objectSpread(_objectSpread({}, metadata), {}, {
+                    total_count: 0,
+                    unseen_count: 0
+                  }));
+                });
+              } else {
+                // Otherwise we want to update the metadata and mark all of the items in the store as seen
+                setState(function (store) {
+                  return store.setMetadata(_objectSpread(_objectSpread({}, metadata), {}, {
+                    unseen_count: 0
+                  }));
                 });
-                this.broadcastOverChannel("items:all_seen", {
-                  items: items
+                attrs = {
+                  seen_at: new Date().toISOString()
+                };
+                itemIds = items.map(function (item) {
+                  return item.id;
                 });
-                return _context2.abrupt("return", result);
-
-              case 10:
-              case "end":
-                return _context2.stop();
-            }
+                setState(function (store) {
+                  return store.setItemAttrs(itemIds, attrs);
+                });
+              }
+
+              // Issue the API request to the bulk status change API
+              _context2.next = 6;
+              return this.makeBulkStatusUpdate("seen");
+            case 6:
+              result = _context2.sent;
+              this.broadcaster.emit("items:all_seen", {
+                items: items
+              });
+              this.broadcastOverChannel("items:all_seen", {
+                items: items
+              });
+              return _context2.abrupt("return", result);
+            case 10:
+            case "end":
+              return _context2.stop();
           }
         }, _callee2, this);
       }));
-
       function markAllAsSeen() {
         return _markAllAsSeen.apply(this, arguments);
       }
-
       return markAllAsSeen;
     }()
   }, {
@@ -266,26 +240,21 @@ var Feed = /*#__PURE__*/function () {
     value: function () {
       var _markAsUnseen = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee3(itemOrItems) {
         return _regenerator["default"].wrap(function _callee3$(_context3) {
-          while (1) {
-            switch (_context3.prev = _context3.next) {
-              case 0:
-                this.optimisticallyPerformStatusUpdate(itemOrItems, "unseen", {
-                  seen_at: null
-                }, "unseen_count");
-                return _context3.abrupt("return", this.makeStatusUpdate(itemOrItems, "unseen"));
-
-              case 2:
-              case "end":
-                return _context3.stop();
-            }
+          while (1) switch (_context3.prev = _context3.next) {
+            case 0:
+              this.optimisticallyPerformStatusUpdate(itemOrItems, "unseen", {
+                seen_at: null
+              }, "unseen_count");
+              return _context3.abrupt("return", this.makeStatusUpdate(itemOrItems, "unseen"));
+            case 2:
+            case "end":
+              return _context3.stop();
           }
         }, _callee3, this);
       }));
-
       function markAsUnseen(_x2) {
         return _markAsUnseen.apply(this, arguments);
       }
-
       return markAsUnseen;
     }()
   }, {
@@ -294,27 +263,22 @@ var Feed = /*#__PURE__*/function () {
       var _markAsRead = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee4(itemOrItems) {
         var now;
         return _regenerator["default"].wrap(function _callee4$(_context4) {
-          while (1) {
-            switch (_context4.prev = _context4.next) {
-              case 0:
-                now = new Date().toISOString();
-                this.optimisticallyPerformStatusUpdate(itemOrItems, "read", {
-                  read_at: now
-                }, "unread_count");
-                return _context4.abrupt("return", this.makeStatusUpdate(itemOrItems, "read"));
-
-              case 3:
-              case "end":
-                return _context4.stop();
-            }
+          while (1) switch (_context4.prev = _context4.next) {
+            case 0:
+              now = new Date().toISOString();
+              this.optimisticallyPerformStatusUpdate(itemOrItems, "read", {
+                read_at: now
+              }, "unread_count");
+              return _context4.abrupt("return", this.makeStatusUpdate(itemOrItems, "read"));
+            case 3:
+            case "end":
+              return _context4.stop();
           }
         }, _callee4, this);
       }));
-
       function markAsRead(_x3) {
         return _markAsRead.apply(this, arguments);
       }
-
       return markAsRead;
     }()
   }, {
@@ -322,79 +286,71 @@ var Feed = /*#__PURE__*/function () {
     value: function () {
       var _markAllAsRead = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee5() {
         var _this$store2, getState, setState, _getState2, metadata, items, isViewingOnlyUnread, attrs, itemIds, result;
-
         return _regenerator["default"].wrap(function _callee5$(_context5) {
-          while (1) {
-            switch (_context5.prev = _context5.next) {
-              case 0:
-                // To mark all of the messages as read we:
-                // 1. Optimistically update *everything* we have in the store
-                // 2. We decrement the `unread_count` to zero optimistically
-                // 3. We issue the API call to the endpoint
-                //
-                // Note: there is the potential for a race condition here because the bulk
-                // update is an async method, so if a new message comes in during this window before
-                // the update has been processed we'll effectively reset the `unread_count` to be what it was.
-                //
-                // Note: here we optimistically handle the case whereby the feed is scoped to show only `unread`
-                // items by removing everything from view.
-                _this$store2 = this.store, getState = _this$store2.getState, setState = _this$store2.setState;
-                _getState2 = getState(), metadata = _getState2.metadata, items = _getState2.items;
-                isViewingOnlyUnread = this.defaultOptions.status === "unread"; // If we're looking at the unread view, then we want to remove all of the items optimistically
-                // from the store given that nothing should be visible. We do this by resetting the store state
-                // and setting the current metadata counts to 0
-
-                if (isViewingOnlyUnread) {
-                  setState(function (store) {
-                    return store.resetStore(_objectSpread(_objectSpread({}, metadata), {}, {
-                      total_count: 0,
-                      unread_count: 0
-                    }));
-                  });
-                } else {
-                  // Otherwise we want to update the metadata and mark all of the items in the store as seen
-                  setState(function (store) {
-                    return store.setMetadata(_objectSpread(_objectSpread({}, metadata), {}, {
-                      unread_count: 0
-                    }));
-                  });
-                  attrs = {
-                    read_at: new Date().toISOString()
-                  };
-                  itemIds = items.map(function (item) {
-                    return item.id;
-                  });
-                  setState(function (store) {
-                    return store.setItemAttrs(itemIds, attrs);
-                  });
-                } // Issue the API request to the bulk status change API
-
-
-                _context5.next = 6;
-                return this.makeBulkStatusUpdate("read");
-
-              case 6:
-                result = _context5.sent;
-                this.broadcaster.emit("items:all_read", {
-                  items: items
+          while (1) switch (_context5.prev = _context5.next) {
+            case 0:
+              // To mark all of the messages as read we:
+              // 1. Optimistically update *everything* we have in the store
+              // 2. We decrement the `unread_count` to zero optimistically
+              // 3. We issue the API call to the endpoint
+              //
+              // Note: there is the potential for a race condition here because the bulk
+              // update is an async method, so if a new message comes in during this window before
+              // the update has been processed we'll effectively reset the `unread_count` to be what it was.
+              //
+              // Note: here we optimistically handle the case whereby the feed is scoped to show only `unread`
+              // items by removing everything from view.
+              _this$store2 = this.store, getState = _this$store2.getState, setState = _this$store2.setState;
+              _getState2 = getState(), metadata = _getState2.metadata, items = _getState2.items;
+              isViewingOnlyUnread = this.defaultOptions.status === "unread"; // If we're looking at the unread view, then we want to remove all of the items optimistically
+              // from the store given that nothing should be visible. We do this by resetting the store state
+              // and setting the current metadata counts to 0
+              if (isViewingOnlyUnread) {
+                setState(function (store) {
+                  return store.resetStore(_objectSpread(_objectSpread({}, metadata), {}, {
+                    total_count: 0,
+                    unread_count: 0
+                  }));
                 });
-                this.broadcastOverChannel("items:all_read", {
-                  items: items
+              } else {
+                // Otherwise we want to update the metadata and mark all of the items in the store as seen
+                setState(function (store) {
+                  return store.setMetadata(_objectSpread(_objectSpread({}, metadata), {}, {
+                    unread_count: 0
+                  }));
                 });
-                return _context5.abrupt("return", result);
-
-              case 10:
-              case "end":
-                return _context5.stop();
-            }
+                attrs = {
+                  read_at: new Date().toISOString()
+                };
+                itemIds = items.map(function (item) {
+                  return item.id;
+                });
+                setState(function (store) {
+                  return store.setItemAttrs(itemIds, attrs);
+                });
+              }
+
+              // Issue the API request to the bulk status change API
+              _context5.next = 6;
+              return this.makeBulkStatusUpdate("read");
+            case 6:
+              result = _context5.sent;
+              this.broadcaster.emit("items:all_read", {
+                items: items
+              });
+              this.broadcastOverChannel("items:all_read", {
+                items: items
+              });
+              return _context5.abrupt("return", result);
+            case 10:
+            case "end":
+              return _context5.stop();
           }
         }, _callee5, this);
       }));
-
       function markAllAsRead() {
         return _markAllAsRead.apply(this, arguments);
       }
-
       return markAllAsRead;
     }()
   }, {
@@ -402,26 +358,21 @@ var Feed = /*#__PURE__*/function () {
     value: function () {
       var _markAsUnread = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee6(itemOrItems) {
         return _regenerator["default"].wrap(function _callee6$(_context6) {
-          while (1) {
-            switch (_context6.prev = _context6.next) {
-              case 0:
-                this.optimisticallyPerformStatusUpdate(itemOrItems, "unread", {
-                  read_at: null
-                }, "unread_count");
-                return _context6.abrupt("return", this.makeStatusUpdate(itemOrItems, "unread"));
-
-              case 2:
-              case "end":
-                return _context6.stop();
-            }
+          while (1) switch (_context6.prev = _context6.next) {
+            case 0:
+              this.optimisticallyPerformStatusUpdate(itemOrItems, "unread", {
+                read_at: null
+              }, "unread_count");
+              return _context6.abrupt("return", this.makeStatusUpdate(itemOrItems, "unread"));
+            case 2:
+            case "end":
+              return _context6.stop();
           }
         }, _callee6, this);
       }));
-
       function markAsUnread(_x4) {
         return _markAsUnread.apply(this, arguments);
       }
-
       return markAsUnread;
     }()
   }, {
@@ -430,28 +381,23 @@ var Feed = /*#__PURE__*/function () {
       var _markAsInteracted = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee7(itemOrItems) {
         var now;
         return _regenerator["default"].wrap(function _callee7$(_context7) {
-          while (1) {
-            switch (_context7.prev = _context7.next) {
-              case 0:
-                now = new Date().toISOString();
-                this.optimisticallyPerformStatusUpdate(itemOrItems, "interacted", {
-                  read_at: now,
-                  interacted_at: now
-                }, "unread_count");
-                return _context7.abrupt("return", this.makeStatusUpdate(itemOrItems, "interacted"));
-
-              case 3:
-              case "end":
-                return _context7.stop();
-            }
+          while (1) switch (_context7.prev = _context7.next) {
+            case 0:
+              now = new Date().toISOString();
+              this.optimisticallyPerformStatusUpdate(itemOrItems, "interacted", {
+                read_at: now,
+                interacted_at: now
+              }, "unread_count");
+              return _context7.abrupt("return", this.makeStatusUpdate(itemOrItems, "interacted"));
+            case 3:
+            case "end":
+              return _context7.stop();
           }
         }, _callee7, this);
       }));
-
       function markAsInteracted(_x5) {
         return _markAsInteracted.apply(this, arguments);
       }
-
       return markAsInteracted;
     }()
     /*
@@ -460,154 +406,134 @@ var Feed = /*#__PURE__*/function () {
     - Remove the item from the feed list when the `archived` flag is "exclude" (default)
      TODO: how do we handle rollbacks?
     */
-
   }, {
     key: "markAsArchived",
-    value: function () {
+    value: (function () {
       var _markAsArchived = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee8(itemOrItems) {
         var _this$store3, getState, setState, state, shouldOptimisticallyRemoveItems, normalizedItems, itemIds, unseenCount, unreadCount, updatedMetadata, entriesToSet;
-
         return _regenerator["default"].wrap(function _callee8$(_context8) {
-          while (1) {
-            switch (_context8.prev = _context8.next) {
-              case 0:
-                _this$store3 = this.store, getState = _this$store3.getState, setState = _this$store3.setState;
-                state = getState();
-                shouldOptimisticallyRemoveItems = this.defaultOptions.archived === "exclude";
-                normalizedItems = Array.isArray(itemOrItems) ? itemOrItems : [itemOrItems];
-                itemIds = normalizedItems.map(function (item) {
-                  return item.id;
+          while (1) switch (_context8.prev = _context8.next) {
+            case 0:
+              _this$store3 = this.store, getState = _this$store3.getState, setState = _this$store3.setState;
+              state = getState();
+              shouldOptimisticallyRemoveItems = this.defaultOptions.archived === "exclude";
+              normalizedItems = Array.isArray(itemOrItems) ? itemOrItems : [itemOrItems];
+              itemIds = normalizedItems.map(function (item) {
+                return item.id;
+              });
+              /*
+                In the code here we want to optimistically update counts and items
+                that are persisted such that we can display updates immediately on the feed
+                without needing to make a network request.
+                 Note: right now this does *not* take into account offline handling or any extensive retry
+                logic, so rollbacks aren't considered. That probably needs to be a future consideration for
+                this library.
+                 Scenarios to consider:
+                 ## Feed scope to archived *only*
+                 - Counts should not be decremented
+                - Items should not be removed
+                 ## Feed scoped to exclude archived items (the default)
+                 - Counts should be decremented
+                - Items should be removed
+                 ## Feed scoped to include archived items as well
+                 - Counts should not be decremented
+                - Items should not be removed
+              */
+              if (shouldOptimisticallyRemoveItems) {
+                // If any of the items are unseen or unread, then capture as we'll want to decrement
+                // the counts for these in the metadata we have
+                unseenCount = normalizedItems.filter(function (i) {
+                  return !i.seen_at;
+                }).length;
+                unreadCount = normalizedItems.filter(function (i) {
+                  return !i.read_at;
+                }).length; // Build the new metadata
+                updatedMetadata = _objectSpread(_objectSpread({}, state.metadata), {}, {
+                  total_count: state.metadata.total_count - normalizedItems.length,
+                  unseen_count: state.metadata.unseen_count - unseenCount,
+                  unread_count: state.metadata.unread_count - unreadCount
+                }); // Remove the archiving entries
+                entriesToSet = state.items.filter(function (item) {
+                  return !itemIds.includes(item.id);
                 });
-                /*
-                  In the code here we want to optimistically update counts and items
-                  that are persisted such that we can display updates immediately on the feed
-                  without needing to make a network request.
-                   Note: right now this does *not* take into account offline handling or any extensive retry
-                  logic, so rollbacks aren't considered. That probably needs to be a future consideration for
-                  this library.
-                   Scenarios to consider:
-                   ## Feed scope to archived *only*
-                   - Counts should not be decremented
-                  - Items should not be removed
-                   ## Feed scoped to exclude archived items (the default)
-                   - Counts should be decremented
-                  - Items should be removed
-                   ## Feed scoped to include archived items as well
-                   - Counts should not be decremented
-                  - Items should not be removed
-                */
-
-                if (shouldOptimisticallyRemoveItems) {
-                  // If any of the items are unseen or unread, then capture as we'll want to decrement
-                  // the counts for these in the metadata we have
-                  unseenCount = normalizedItems.filter(function (i) {
-                    return !i.seen_at;
-                  }).length;
-                  unreadCount = normalizedItems.filter(function (i) {
-                    return !i.read_at;
-                  }).length; // Build the new metadata
-
-                  updatedMetadata = _objectSpread(_objectSpread({}, state.metadata), {}, {
-                    total_count: state.metadata.total_count - normalizedItems.length,
-                    unseen_count: state.metadata.unseen_count - unseenCount,
-                    unread_count: state.metadata.unread_count - unreadCount
-                  }); // Remove the archiving entries
-
-                  entriesToSet = state.items.filter(function (item) {
-                    return !itemIds.includes(item.id);
-                  });
-                  setState(function (state) {
-                    return state.setResult({
-                      entries: entriesToSet,
-                      meta: updatedMetadata,
-                      page_info: state.pageInfo
-                    });
-                  });
-                } else {
-                  // Mark all the entries being updated as archived either way so the state is correct
-                  state.setItemAttrs(itemIds, {
-                    archived_at: new Date().toISOString()
+                setState(function (state) {
+                  return state.setResult({
+                    entries: entriesToSet,
+                    meta: updatedMetadata,
+                    page_info: state.pageInfo
                   });
-                }
-
-                return _context8.abrupt("return", this.makeStatusUpdate(itemOrItems, "archived"));
-
-              case 7:
-              case "end":
-                return _context8.stop();
-            }
+                });
+              } else {
+                // Mark all the entries being updated as archived either way so the state is correct
+                state.setItemAttrs(itemIds, {
+                  archived_at: new Date().toISOString()
+                });
+              }
+              return _context8.abrupt("return", this.makeStatusUpdate(itemOrItems, "archived"));
+            case 7:
+            case "end":
+              return _context8.stop();
           }
         }, _callee8, this);
       }));
-
       function markAsArchived(_x6) {
         return _markAsArchived.apply(this, arguments);
       }
-
       return markAsArchived;
-    }()
+    }())
   }, {
     key: "markAllAsArchived",
     value: function () {
       var _markAllAsArchived = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee9() {
         var _this$store4, setState, getState, _getState3, items, shouldOptimisticallyRemoveItems, result;
-
         return _regenerator["default"].wrap(function _callee9$(_context9) {
-          while (1) {
-            switch (_context9.prev = _context9.next) {
-              case 0:
-                // Note: there is the potential for a race condition here because the bulk
-                // update is an async method, so if a new message comes in during this window before
-                // the update has been processed we'll effectively reset the `unseen_count` to be what it was.
-                _this$store4 = this.store, setState = _this$store4.setState, getState = _this$store4.getState;
-                _getState3 = getState(), items = _getState3.items; // Here if we're looking at a feed that excludes all of the archived items by default then we
-                // will want to optimistically remove all of the items from the feed as they are now all excluded
-
-                shouldOptimisticallyRemoveItems = this.defaultOptions.archived === "exclude";
-
-                if (shouldOptimisticallyRemoveItems) {
-                  // Reset the store to clear out all of items and reset the badge count
-                  setState(function (store) {
-                    return store.resetStore();
+          while (1) switch (_context9.prev = _context9.next) {
+            case 0:
+              // Note: there is the potential for a race condition here because the bulk
+              // update is an async method, so if a new message comes in during this window before
+              // the update has been processed we'll effectively reset the `unseen_count` to be what it was.
+              _this$store4 = this.store, setState = _this$store4.setState, getState = _this$store4.getState;
+              _getState3 = getState(), items = _getState3.items; // Here if we're looking at a feed that excludes all of the archived items by default then we
+              // will want to optimistically remove all of the items from the feed as they are now all excluded
+              shouldOptimisticallyRemoveItems = this.defaultOptions.archived === "exclude";
+              if (shouldOptimisticallyRemoveItems) {
+                // Reset the store to clear out all of items and reset the badge count
+                setState(function (store) {
+                  return store.resetStore();
+                });
+              } else {
+                // Mark all the entries being updated as archived either way so the state is correct
+                setState(function (store) {
+                  var itemIds = items.map(function (i) {
+                    return i.id;
                   });
-                } else {
-                  // Mark all the entries being updated as archived either way so the state is correct
-                  setState(function (store) {
-                    var itemIds = items.map(function (i) {
-                      return i.id;
-                    });
-                    store.setItemAttrs(itemIds, {
-                      archived_at: new Date().toISOString()
-                    });
+                  store.setItemAttrs(itemIds, {
+                    archived_at: new Date().toISOString()
                   });
-                } // Issue the API request to the bulk status change API
-
-
-                _context9.next = 6;
-                return this.makeBulkStatusUpdate("archive");
-
-              case 6:
-                result = _context9.sent;
-                this.broadcaster.emit("items:all_archived", {
-                  items: items
                 });
-                this.broadcastOverChannel("items:all_archived", {
-                  items: items
-                });
-                return _context9.abrupt("return", result);
-
-              case 10:
-              case "end":
-                return _context9.stop();
-            }
+              }
+
+              // Issue the API request to the bulk status change API
+              _context9.next = 6;
+              return this.makeBulkStatusUpdate("archive");
+            case 6:
+              result = _context9.sent;
+              this.broadcaster.emit("items:all_archived", {
+                items: items
+              });
+              this.broadcastOverChannel("items:all_archived", {
+                items: items
+              });
+              return _context9.abrupt("return", result);
+            case 10:
+            case "end":
+              return _context9.stop();
           }
         }, _callee9, this);
       }));
-
       function markAllAsArchived() {
         return _markAllAsArchived.apply(this, arguments);
       }
-
       return markAllAsArchived;
     }()
   }, {
@@ -615,243 +541,208 @@ var Feed = /*#__PURE__*/function () {
     value: function () {
       var _markAsUnarchived = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee10(itemOrItems) {
         return _regenerator["default"].wrap(function _callee10$(_context10) {
-          while (1) {
-            switch (_context10.prev = _context10.next) {
-              case 0:
-                this.optimisticallyPerformStatusUpdate(itemOrItems, "unarchived", {
-                  archived_at: null
-                });
-                return _context10.abrupt("return", this.makeStatusUpdate(itemOrItems, "unarchived"));
-
-              case 2:
-              case "end":
-                return _context10.stop();
-            }
+          while (1) switch (_context10.prev = _context10.next) {
+            case 0:
+              this.optimisticallyPerformStatusUpdate(itemOrItems, "unarchived", {
+                archived_at: null
+              });
+              return _context10.abrupt("return", this.makeStatusUpdate(itemOrItems, "unarchived"));
+            case 2:
+            case "end":
+              return _context10.stop();
           }
         }, _callee10, this);
       }));
-
       function markAsUnarchived(_x7) {
         return _markAsUnarchived.apply(this, arguments);
       }
-
       return markAsUnarchived;
-    }()
-    /* Fetches the feed content, appending it to the store */
-
+    }() /* Fetches the feed content, appending it to the store */
   }, {
     key: "fetch",
-    value: function () {
+    value: (function () {
       var _fetch = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee11() {
         var options,
-            _this$store5,
-            setState,
-            getState,
-            _getState4,
-            networkStatus,
-            queryParams,
-            result,
-            response,
-            opts,
-            _opts,
-            feedEventType,
-            eventPayload,
-            _args11 = arguments;
-
+          _this$store5,
+          setState,
+          getState,
+          _getState4,
+          networkStatus,
+          queryParams,
+          result,
+          response,
+          opts,
+          _opts,
+          feedEventType,
+          eventPayload,
+          _args11 = arguments;
         return _regenerator["default"].wrap(function _callee11$(_context11) {
-          while (1) {
-            switch (_context11.prev = _context11.next) {
-              case 0:
-                options = _args11.length > 0 && _args11[0] !== undefined ? _args11[0] : {};
-                _this$store5 = this.store, setState = _this$store5.setState, getState = _this$store5.getState;
-                _getState4 = getState(), networkStatus = _getState4.networkStatus; // If there's an existing request in flight, then do nothing
-
-                if (!(0, _networkStatus.isRequestInFlight)(networkStatus)) {
-                  _context11.next = 5;
-                  break;
-                }
-
-                return _context11.abrupt("return");
-
-              case 5:
-                // Set the loading type based on the request type it is
-                setState(function (store) {
-                  var _options$__loadingTyp;
-
-                  return store.setNetworkStatus((_options$__loadingTyp = options.__loadingType) !== null && _options$__loadingTyp !== void 0 ? _options$__loadingTyp : _networkStatus.NetworkStatus.loading);
-                }); // Always include the default params, if they have been set
-
-                queryParams = _objectSpread(_objectSpread(_objectSpread({}, this.defaultOptions), options), {}, {
-                  // Unset options that should not be sent to the API
-                  __loadingType: undefined,
-                  __fetchSource: undefined,
-                  __experimentalCrossBrowserUpdates: undefined
-                });
-                _context11.next = 9;
-                return this.apiClient.makeRequest({
-                  method: "GET",
-                  url: "/v1/users/".concat(this.knock.userId, "/feeds/").concat(this.feedId),
-                  params: queryParams
-                });
-
-              case 9:
-                result = _context11.sent;
-
-                if (!(result.statusCode === "error" || !result.body)) {
-                  _context11.next = 13;
-                  break;
-                }
-
-                setState(function (store) {
-                  return store.setNetworkStatus(_networkStatus.NetworkStatus.error);
-                });
-                return _context11.abrupt("return", {
-                  status: result.statusCode,
-                  data: result.error || result.body
-                });
-
-              case 13:
-                response = {
-                  entries: result.body.entries,
-                  meta: result.body.meta,
-                  page_info: result.body.page_info
+          while (1) switch (_context11.prev = _context11.next) {
+            case 0:
+              options = _args11.length > 0 && _args11[0] !== undefined ? _args11[0] : {};
+              _this$store5 = this.store, setState = _this$store5.setState, getState = _this$store5.getState;
+              _getState4 = getState(), networkStatus = _getState4.networkStatus; // If there's an existing request in flight, then do nothing
+              if (!(0, _networkStatus.isRequestInFlight)(networkStatus)) {
+                _context11.next = 5;
+                break;
+              }
+              return _context11.abrupt("return");
+            case 5:
+              // Set the loading type based on the request type it is
+              setState(function (store) {
+                var _options$__loadingTyp;
+                return store.setNetworkStatus((_options$__loadingTyp = options.__loadingType) !== null && _options$__loadingTyp !== void 0 ? _options$__loadingTyp : _networkStatus.NetworkStatus.loading);
+              });
+
+              // Always include the default params, if they have been set
+              queryParams = _objectSpread(_objectSpread(_objectSpread({}, this.defaultOptions), options), {}, {
+                // Unset options that should not be sent to the API
+                __loadingType: undefined,
+                __fetchSource: undefined,
+                __experimentalCrossBrowserUpdates: undefined
+              });
+              _context11.next = 9;
+              return this.apiClient.makeRequest({
+                method: "GET",
+                url: "/v1/users/".concat(this.knock.userId, "/feeds/").concat(this.feedId),
+                params: queryParams
+              });
+            case 9:
+              result = _context11.sent;
+              if (!(result.statusCode === "error" || !result.body)) {
+                _context11.next = 13;
+                break;
+              }
+              setState(function (store) {
+                return store.setNetworkStatus(_networkStatus.NetworkStatus.error);
+              });
+              return _context11.abrupt("return", {
+                status: result.statusCode,
+                data: result.error || result.body
+              });
+            case 13:
+              response = {
+                entries: result.body.entries,
+                meta: result.body.meta,
+                page_info: result.body.page_info
+              };
+              if (options.before) {
+                opts = {
+                  shouldSetPage: false,
+                  shouldAppend: true
                 };
-
-                if (options.before) {
-                  opts = {
-                    shouldSetPage: false,
-                    shouldAppend: true
-                  };
-                  setState(function (state) {
-                    return state.setResult(response, opts);
-                  });
-                } else if (options.after) {
-                  _opts = {
-                    shouldSetPage: true,
-                    shouldAppend: true
-                  };
-                  setState(function (state) {
-                    return state.setResult(response, _opts);
-                  });
-                } else {
-                  setState(function (state) {
-                    return state.setResult(response);
-                  });
-                } // Legacy `messages.new` event, should be removed in a future version
-
-
-                this.broadcast("messages.new", response); // Broadcast the appropriate event type depending on the fetch source
-
-                feedEventType = options.__fetchSource === "socket" ? "items.received.realtime" : "items.received.page";
-                eventPayload = {
-                  items: response.entries,
-                  metadata: response.meta,
-                  event: feedEventType
+                setState(function (state) {
+                  return state.setResult(response, opts);
+                });
+              } else if (options.after) {
+                _opts = {
+                  shouldSetPage: true,
+                  shouldAppend: true
                 };
-                this.broadcast(eventPayload.event, eventPayload);
-                return _context11.abrupt("return", {
-                  data: response,
-                  status: result.statusCode
+                setState(function (state) {
+                  return state.setResult(response, _opts);
                 });
-
-              case 20:
-              case "end":
-                return _context11.stop();
-            }
+              } else {
+                setState(function (state) {
+                  return state.setResult(response);
+                });
+              }
+
+              // Legacy `messages.new` event, should be removed in a future version
+              this.broadcast("messages.new", response);
+
+              // Broadcast the appropriate event type depending on the fetch source
+              feedEventType = options.__fetchSource === "socket" ? "items.received.realtime" : "items.received.page";
+              eventPayload = {
+                items: response.entries,
+                metadata: response.meta,
+                event: feedEventType
+              };
+              this.broadcast(eventPayload.event, eventPayload);
+              return _context11.abrupt("return", {
+                data: response,
+                status: result.statusCode
+              });
+            case 20:
+            case "end":
+              return _context11.stop();
           }
         }, _callee11, this);
       }));
-
       function fetch() {
         return _fetch.apply(this, arguments);
       }
-
       return fetch;
-    }()
+    }())
   }, {
     key: "fetchNextPage",
     value: function () {
       var _fetchNextPage = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee12() {
         var getState, _getState5, pageInfo;
-
         return _regenerator["default"].wrap(function _callee12$(_context12) {
-          while (1) {
-            switch (_context12.prev = _context12.next) {
-              case 0:
-                // Attempts to fetch the next page of results (if we have any)
-                getState = this.store.getState;
-                _getState5 = getState(), pageInfo = _getState5.pageInfo;
-
-                if (pageInfo.after) {
-                  _context12.next = 4;
-                  break;
-                }
-
-                return _context12.abrupt("return");
-
-              case 4:
-                this.fetch({
-                  after: pageInfo.after,
-                  __loadingType: _networkStatus.NetworkStatus.fetchMore
-                });
-
-              case 5:
-              case "end":
-                return _context12.stop();
-            }
+          while (1) switch (_context12.prev = _context12.next) {
+            case 0:
+              // Attempts to fetch the next page of results (if we have any)
+              getState = this.store.getState;
+              _getState5 = getState(), pageInfo = _getState5.pageInfo;
+              if (pageInfo.after) {
+                _context12.next = 4;
+                break;
+              }
+              return _context12.abrupt("return");
+            case 4:
+              this.fetch({
+                after: pageInfo.after,
+                __loadingType: _networkStatus.NetworkStatus.fetchMore
+              });
+            case 5:
+            case "end":
+              return _context12.stop();
           }
         }, _callee12, this);
       }));
-
       function fetchNextPage() {
         return _fetchNextPage.apply(this, arguments);
       }
-
       return fetchNextPage;
     }()
   }, {
     key: "broadcast",
     value: function broadcast(eventName, data) {
       this.broadcaster.emit(eventName, data);
-    } // Invoked when a new real-time message comes in from the socket
+    }
 
+    // Invoked when a new real-time message comes in from the socket
   }, {
     key: "onNewMessageReceived",
     value: function () {
       var _onNewMessageReceived = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee13(_ref) {
         var metadata, _this$store6, getState, setState, _getState6, items, currentHead;
-
         return _regenerator["default"].wrap(function _callee13$(_context13) {
-          while (1) {
-            switch (_context13.prev = _context13.next) {
-              case 0:
-                metadata = _ref.metadata;
-                // Handle the new message coming in
-                _this$store6 = this.store, getState = _this$store6.getState, setState = _this$store6.setState;
-                _getState6 = getState(), items = _getState6.items;
-                currentHead = items[0]; // Optimistically set the badge counts
-
-                setState(function (state) {
-                  return state.setMetadata(metadata);
-                }); // Fetch the items before the current head (if it exists)
-
-                this.fetch({
-                  before: currentHead === null || currentHead === void 0 ? void 0 : currentHead.__cursor,
-                  __fetchSource: "socket"
-                });
-
-              case 6:
-              case "end":
-                return _context13.stop();
-            }
+          while (1) switch (_context13.prev = _context13.next) {
+            case 0:
+              metadata = _ref.metadata;
+              // Handle the new message coming in
+              _this$store6 = this.store, getState = _this$store6.getState, setState = _this$store6.setState;
+              _getState6 = getState(), items = _getState6.items;
+              currentHead = items[0]; // Optimistically set the badge counts
+              setState(function (state) {
+                return state.setMetadata(metadata);
+              });
+              // Fetch the items before the current head (if it exists)
+              this.fetch({
+                before: currentHead === null || currentHead === void 0 ? void 0 : currentHead.__cursor,
+                __fetchSource: "socket"
+              });
+            case 6:
+            case "end":
+              return _context13.stop();
           }
         }, _callee13, this);
       }));
-
       function onNewMessageReceived(_x8) {
         return _onNewMessageReceived.apply(this, arguments);
       }
-
       return onNewMessageReceived;
     }()
   }, {
@@ -863,47 +754,43 @@ var Feed = /*#__PURE__*/function () {
     key: "optimisticallyPerformStatusUpdate",
     value: function optimisticallyPerformStatusUpdate(itemOrItems, type, attrs, badgeCountAttr) {
       var _this$store7 = this.store,
-          getState = _this$store7.getState,
-          setState = _this$store7.setState;
+        getState = _this$store7.getState,
+        setState = _this$store7.setState;
       var normalizedItems = Array.isArray(itemOrItems) ? itemOrItems : [itemOrItems];
       var itemIds = normalizedItems.map(function (item) {
         return item.id;
       });
-
       if (badgeCountAttr) {
         var _getState7 = getState(),
-            metadata = _getState7.metadata; // We only want to update the counts of items that have not already been counted towards the
-        // badge count total to avoid updating the badge count unnecessarily.
-
+          metadata = _getState7.metadata;
 
+        // We only want to update the counts of items that have not already been counted towards the
+        // badge count total to avoid updating the badge count unnecessarily.
         var itemsToUpdate = normalizedItems.filter(function (item) {
           switch (type) {
             case "seen":
               return item.seen_at === null;
-
             case "unseen":
               return item.seen_at !== null;
-
             case "read":
             case "interacted":
               return item.read_at === null;
-
             case "unread":
               return item.read_at !== null;
-
             default:
               return true;
           }
-        }); // Tnis is a hack to determine the direction of whether we're
-        // adding or removing from the badge count
+        });
 
+        // Tnis is a hack to determine the direction of whether we're
+        // adding or removing from the badge count
         var direction = type.startsWith("un") ? itemsToUpdate.length : -itemsToUpdate.length;
         setState(function (store) {
           return store.setMetadata(_objectSpread(_objectSpread({}, metadata), {}, (0, _defineProperty2["default"])({}, badgeCountAttr, Math.max(0, metadata[badgeCountAttr] + direction))));
         });
-      } // Update the items with the given attributes
-
+      }
 
+      // Update the items with the given attributes
       setState(function (store) {
         return store.setItemAttrs(itemIds, attrs);
       });
@@ -914,47 +801,41 @@ var Feed = /*#__PURE__*/function () {
       var _makeStatusUpdate = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee14(itemOrItems, type) {
         var items, itemIds, result;
         return _regenerator["default"].wrap(function _callee14$(_context14) {
-          while (1) {
-            switch (_context14.prev = _context14.next) {
-              case 0:
-                // Always treat items as a batch to use the corresponding batch endpoint
-                items = Array.isArray(itemOrItems) ? itemOrItems : [itemOrItems];
-                itemIds = items.map(function (item) {
-                  return item.id;
-                });
-                _context14.next = 4;
-                return this.apiClient.makeRequest({
-                  method: "POST",
-                  url: "/v1/messages/batch/".concat(type),
-                  data: {
-                    message_ids: itemIds
-                  }
-                });
-
-              case 4:
-                result = _context14.sent;
-                // Emit the event that these items had their statuses changed
-                // Note: we do this after the update to ensure that the server event actually completed
-                this.broadcaster.emit("items:".concat(type), {
-                  items: items
-                });
-                this.broadcastOverChannel("items:".concat(type), {
-                  items: items
-                });
-                return _context14.abrupt("return", result);
-
-              case 8:
-              case "end":
-                return _context14.stop();
-            }
+          while (1) switch (_context14.prev = _context14.next) {
+            case 0:
+              // Always treat items as a batch to use the corresponding batch endpoint
+              items = Array.isArray(itemOrItems) ? itemOrItems : [itemOrItems];
+              itemIds = items.map(function (item) {
+                return item.id;
+              });
+              _context14.next = 4;
+              return this.apiClient.makeRequest({
+                method: "POST",
+                url: "/v1/messages/batch/".concat(type),
+                data: {
+                  message_ids: itemIds
+                }
+              });
+            case 4:
+              result = _context14.sent;
+              // Emit the event that these items had their statuses changed
+              // Note: we do this after the update to ensure that the server event actually completed
+              this.broadcaster.emit("items:".concat(type), {
+                items: items
+              });
+              this.broadcastOverChannel("items:".concat(type), {
+                items: items
+              });
+              return _context14.abrupt("return", result);
+            case 8:
+            case "end":
+              return _context14.stop();
           }
         }, _callee14, this);
       }));
-
       function makeStatusUpdate(_x9, _x10) {
         return _makeStatusUpdate.apply(this, arguments);
       }
-
       return makeStatusUpdate;
     }()
   }, {
@@ -963,42 +844,36 @@ var Feed = /*#__PURE__*/function () {
       var _makeBulkStatusUpdate = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee15(type) {
         var options;
         return _regenerator["default"].wrap(function _callee15$(_context15) {
-          while (1) {
-            switch (_context15.prev = _context15.next) {
-              case 0:
-                // The base scope for the call should take into account all of the options currently
-                // set on the feed, as well as being scoped for the current user. We do this so that
-                // we ONLY make changes to the messages that are currently in view on this feed, and not
-                // all messages that exist.
-                options = {
-                  user_ids: [this.knock.userId],
-                  engagement_status: this.defaultOptions.status !== "all" ? this.defaultOptions.status : undefined,
-                  archived: this.defaultOptions.archived,
-                  has_tenant: this.defaultOptions.has_tenant,
-                  tenants: this.defaultOptions.tenant ? [this.defaultOptions.tenant] : undefined
-                };
-                _context15.next = 3;
-                return this.apiClient.makeRequest({
-                  method: "POST",
-                  url: "/v1/channels/".concat(this.feedId, "/messages/bulk/").concat(type),
-                  data: options
-                });
-
-              case 3:
-                return _context15.abrupt("return", _context15.sent);
-
-              case 4:
-              case "end":
-                return _context15.stop();
-            }
+          while (1) switch (_context15.prev = _context15.next) {
+            case 0:
+              // The base scope for the call should take into account all of the options currently
+              // set on the feed, as well as being scoped for the current user. We do this so that
+              // we ONLY make changes to the messages that are currently in view on this feed, and not
+              // all messages that exist.
+              options = {
+                user_ids: [this.knock.userId],
+                engagement_status: this.defaultOptions.status !== "all" ? this.defaultOptions.status : undefined,
+                archived: this.defaultOptions.archived,
+                has_tenant: this.defaultOptions.has_tenant,
+                tenants: this.defaultOptions.tenant ? [this.defaultOptions.tenant] : undefined
+              };
+              _context15.next = 3;
+              return this.apiClient.makeRequest({
+                method: "POST",
+                url: "/v1/channels/".concat(this.feedId, "/messages/bulk/").concat(type),
+                data: options
+              });
+            case 3:
+              return _context15.abrupt("return", _context15.sent);
+            case 4:
+            case "end":
+              return _context15.stop();
           }
         }, _callee15, this);
       }));
-
       function makeBulkStatusUpdate(_x11) {
         return _makeBulkStatusUpdate.apply(this, arguments);
       }
-
       return makeBulkStatusUpdate;
     }()
   }, {
@@ -1007,10 +882,10 @@ var Feed = /*#__PURE__*/function () {
       // The broadcastChannel may not be available in non-browser environments
       if (!this.broadcastChannel) {
         return;
-      } // Here we stringify our payload and try and send as JSON such that we
-      // don't get any `An object could not be cloned` errors when trying to broadcast
-
+      }
 
+      // Here we stringify our payload and try and send as JSON such that we
+      // don't get any `An object could not be cloned` errors when trying to broadcast
       try {
         var stringifiedPayload = JSON.parse(JSON.stringify(payload));
         this.broadcastChannel.postMessage({
@@ -1021,10 +896,42 @@ var Feed = /*#__PURE__*/function () {
         console.warn("Could not broadcast ".concat(type, ", got error: ").concat(e));
       }
     }
+
+    /**
+     * Listen for changes to document visibility and automatically disconnect
+     * or reconnect the socket after a delay
+     */
+  }, {
+    key: "setupAutoSocketManager",
+    value: function setupAutoSocketManager(autoManageSocketConnectionDelay) {
+      var _this3 = this;
+      var disconnectDelay = autoManageSocketConnectionDelay !== null && autoManageSocketConnectionDelay !== void 0 ? autoManageSocketConnectionDelay : DEFAULT_DISCONNECT_DELAY;
+      document.addEventListener("visibilitychange", function () {
+        if (document.visibilityState === "hidden") {
+          // When the tab is hidden, clean up the socket connection after a delay
+          _this3.disconnectTimer = setTimeout(function () {
+            _this3.apiClient.disconnectSocket();
+            _this3.disconnectTimer = null;
+          }, disconnectDelay);
+        } else if (document.visibilityState === "visible") {
+          var _this3$apiClient$sock;
+          // When the tab is visible, clear the disconnect timer if active to cancel disconnecting
+          // This handles cases where the tab is only briefly hidden to avoid unnecessary disconnects
+          if (_this3.disconnectTimer) {
+            clearTimeout(_this3.disconnectTimer);
+            _this3.disconnectTimer = null;
+          }
+
+          // If the socket is not connected, try to reconnect
+          if (!((_this3$apiClient$sock = _this3.apiClient.socket) !== null && _this3$apiClient$sock !== void 0 && _this3$apiClient$sock.isConnected())) {
+            _this3.apiClient.reconnectSocket();
+            _this3.fetch();
+          }
+        }
+      });
+    }
   }]);
   return Feed;
 }();
-
-var _default = Feed;
-exports["default"] = _default;
+var _default = exports["default"] = Feed;
 //# sourceMappingURL=feed.js.map