@knocklabs/client 0.14.5 → 0.14.7

package/dist/esm/clients/feed/index.mjs

@@ -1,31 +1,47 @@
-var a = Object.defineProperty;
-var c = (s, e, n) => e in s ? a(s, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : s[e] = n;
-var t = (s, e, n) => c(s, typeof e != "symbol" ? e + "" : e, n);
-import f from "./feed.mjs";
-class d {
+var i = Object.defineProperty;
+var c = (n, e, t) => e in n ? i(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t;
+var s = (n, e, t) => c(n, typeof e != "symbol" ? e + "" : e, t);
+import o from "./feed.mjs";
+import { FeedSocketManager as r } from "./socket-manager.mjs";
+class k {
   constructor(e) {
-    t(this, "instance");
-    t(this, "feedInstances", []);
+    s(this, "instance");
+    s(this, "feedInstances", []);
+    s(this, "socketManager");
     this.instance = e;
   }
-  initialize(e, n = {}) {
-    const i = new f(this.instance, e, n);
-    return this.feedInstances.push(i), i;
+  initialize(e, t = {}) {
+    this.initSocketManager();
+    const a = new o(
+      this.instance,
+      e,
+      t,
+      this.socketManager
+    );
+    return this.feedInstances.push(a), a;
   }
   removeInstance(e) {
-    this.feedInstances = this.feedInstances.filter((n) => n !== e);
+    this.feedInstances = this.feedInstances.filter((t) => t !== e);
   }
   teardownInstances() {
     for (const e of this.feedInstances)
       e.teardown();
   }
   reinitializeInstances() {
-    for (const e of this.feedInstances)
-      e.reinitialize();
+    var e;
+    for (const t of this.feedInstances)
+      (e = this.socketManager) == null || e.leave(t);
+    this.socketManager = void 0, this.initSocketManager();
+    for (const t of this.feedInstances)
+      t.reinitialize(this.socketManager);
+  }
+  initSocketManager() {
+    const e = this.instance.client().socket;
+    e && !this.socketManager && (this.socketManager = new r(e));
   }
 }
 export {
-  f as Feed,
-  d as default
+  o as Feed,
+  k as default
 };
 //# sourceMappingURL=index.mjs.map

package/dist/esm/clients/feed/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../../../src/clients/feed/index.ts"],"sourcesContent":["import Knock from \"../../knock\";\n\nimport Feed from \"./feed\";\nimport { FeedClientOptions } from \"./interfaces\";\n\nclass FeedClient {\n  private instance: Knock;\n  private feedInstances: Feed[] = [];\n\n  constructor(instance: Knock) {\n    this.instance = instance;\n  }\n\n  initialize(feedChannelId: string, options: FeedClientOptions = {}) {\n    const feedInstance = new Feed(this.instance, feedChannelId, options);\n    this.feedInstances.push(feedInstance);\n\n    return feedInstance;\n  }\n\n  removeInstance(feed: Feed) {\n    this.feedInstances = this.feedInstances.filter((f) => f !== feed);\n  }\n\n  teardownInstances() {\n    for (const feed of this.feedInstances) {\n      feed.teardown();\n    }\n  }\n\n  reinitializeInstances() {\n    for (const feed of this.feedInstances) {\n      feed.reinitialize();\n    }\n  }\n}\n\nexport { Feed };\nexport default FeedClient;\n"],"names":["FeedClient","instance","__publicField","feedChannelId","options","feedInstance","Feed","feed","f"],"mappings":";;;;AAKA,MAAMA,EAAW;AAAA,EAIf,YAAYC,GAAiB;AAHrB,IAAAC,EAAA;AACA,IAAAA,EAAA,uBAAwB,CAAC;AAG/B,SAAK,WAAWD;AAAA,EAAA;AAAA,EAGlB,WAAWE,GAAuBC,IAA6B,IAAI;AACjE,UAAMC,IAAe,IAAIC,EAAK,KAAK,UAAUH,GAAeC,CAAO;AAC9D,gBAAA,cAAc,KAAKC,CAAY,GAE7BA;AAAA,EAAA;AAAA,EAGT,eAAeE,GAAY;AACzB,SAAK,gBAAgB,KAAK,cAAc,OAAO,CAACC,MAAMA,MAAMD,CAAI;AAAA,EAAA;AAAA,EAGlE,oBAAoB;AACP,eAAAA,KAAQ,KAAK;AACtB,MAAAA,EAAK,SAAS;AAAA,EAChB;AAAA,EAGF,wBAAwB;AACX,eAAAA,KAAQ,KAAK;AACtB,MAAAA,EAAK,aAAa;AAAA,EACpB;AAEJ;"}
+{"version":3,"file":"index.mjs","sources":["../../../../src/clients/feed/index.ts"],"sourcesContent":["import Knock from \"../../knock\";\n\nimport Feed from \"./feed\";\nimport { FeedClientOptions } from \"./interfaces\";\nimport { FeedSocketManager } from \"./socket-manager\";\n\nclass FeedClient {\n  private instance: Knock;\n  private feedInstances: Feed[] = [];\n  private socketManager: FeedSocketManager | undefined;\n\n  constructor(instance: Knock) {\n    this.instance = instance;\n  }\n\n  initialize(feedChannelId: string, options: FeedClientOptions = {}) {\n    this.initSocketManager();\n\n    const feedInstance = new Feed(\n      this.instance,\n      feedChannelId,\n      options,\n      this.socketManager,\n    );\n    this.feedInstances.push(feedInstance);\n    return feedInstance;\n  }\n\n  removeInstance(feed: Feed) {\n    this.feedInstances = this.feedInstances.filter((f) => f !== feed);\n  }\n\n  teardownInstances() {\n    for (const feed of this.feedInstances) {\n      feed.teardown();\n    }\n  }\n\n  reinitializeInstances() {\n    for (const feed of this.feedInstances) {\n      this.socketManager?.leave(feed);\n    }\n\n    // The API client has a new socket once it's reinitialized,\n    // so we need to set up a new socket manager\n    this.socketManager = undefined;\n    this.initSocketManager();\n\n    for (const feed of this.feedInstances) {\n      feed.reinitialize(this.socketManager);\n    }\n  }\n\n  private initSocketManager() {\n    const socket = this.instance.client().socket;\n    if (socket && !this.socketManager) {\n      this.socketManager = new FeedSocketManager(socket);\n    }\n  }\n}\n\nexport { Feed };\nexport default FeedClient;\n"],"names":["FeedClient","instance","__publicField","feedChannelId","options","feedInstance","Feed","feed","f","_a","socket","FeedSocketManager"],"mappings":";;;;;AAMA,MAAMA,EAAW;AAAA,EAKf,YAAYC,GAAiB;AAJrB,IAAAC,EAAA;AACA,IAAAA,EAAA,uBAAwB,CAAC;AACzB,IAAAA,EAAA;AAGN,SAAK,WAAWD;AAAA,EAAA;AAAA,EAGlB,WAAWE,GAAuBC,IAA6B,IAAI;AACjE,SAAK,kBAAkB;AAEvB,UAAMC,IAAe,IAAIC;AAAA,MACvB,KAAK;AAAA,MACLH;AAAA,MACAC;AAAA,MACA,KAAK;AAAA,IACP;AACK,gBAAA,cAAc,KAAKC,CAAY,GAC7BA;AAAA,EAAA;AAAA,EAGT,eAAeE,GAAY;AACzB,SAAK,gBAAgB,KAAK,cAAc,OAAO,CAACC,MAAMA,MAAMD,CAAI;AAAA,EAAA;AAAA,EAGlE,oBAAoB;AACP,eAAAA,KAAQ,KAAK;AACtB,MAAAA,EAAK,SAAS;AAAA,EAChB;AAAA,EAGF,wBAAwB;;AACX,eAAAA,KAAQ,KAAK;AACjB,OAAAE,IAAA,KAAA,kBAAA,QAAAA,EAAe,MAAMF;AAK5B,SAAK,gBAAgB,QACrB,KAAK,kBAAkB;AAEZ,eAAAA,KAAQ,KAAK;AACjB,MAAAA,EAAA,aAAa,KAAK,aAAa;AAAA,EACtC;AAAA,EAGM,oBAAoB;AAC1B,UAAMG,IAAS,KAAK,SAAS,OAAS,EAAA;AAClC,IAAAA,KAAU,CAAC,KAAK,kBACb,KAAA,gBAAgB,IAAIC,EAAkBD,CAAM;AAAA,EACnD;AAEJ;"}

package/dist/esm/clients/feed/socket-manager.mjs

@@ -0,0 +1,81 @@
+var f = Object.defineProperty;
+var u = (c, s, e) => s in c ? f(c, s, { enumerable: !0, configurable: !0, writable: !0, value: e }) : c[s] = e;
+var h = (c, s, e) => u(c, typeof s != "symbol" ? s + "" : s, e);
+import { Store as k } from "@tanstack/store";
+const S = {
+  NewMessage: "new-message"
+}, m = [S.NewMessage];
+class x {
+  constructor(s) {
+    // Mapping of live channels by topic. Note, there can be one or more feed
+    // client(s) that can subscribe.
+    h(this, "channels");
+    // Mapping of query params for each feeds client, partitioned by reference id,
+    // and grouped by channel topic. It's a double nested object that looks like:
+    //  {
+    //    "feeds:<channel_1>:<user_1>": {
+    //      "ref-1": {
+    //        "tenant": "foo",
+    //      },
+    //      "ref-2": {
+    //        "tenant": "bar",
+    //      },
+    //    },
+    //    "feeds:<channel_2>:<user_1>": {
+    //      "ref-3": {
+    //        "tenant": "baz",
+    //      },
+    //    }
+    //  }
+    //
+    // Each time a new feed client joins a channel, we send all cumulated
+    // params such that the socket API can apply filtering rules and figure out
+    // which feed clients should be notified based on reference ids in
+    // "attn" field of the event payload when sending out an event.
+    h(this, "params");
+    // A reactive store that captures a new socket event, that notifies any feed
+    // clients that have subscribed.
+    h(this, "inbox");
+    this.socket = s, this.channels = {}, this.params = {}, this.inbox = new k({});
+  }
+  join(s) {
+    const e = s.socketChannelTopic, t = s.referenceId, a = s.defaultOptions;
+    this.socket.isConnected() || this.socket.connect(), this.params[e] || (this.params[e] = {});
+    const n = this.params[e][t], p = !n || JSON.stringify(n) !== JSON.stringify(a);
+    if (p && (this.params[e] = { ...this.params[e], [t]: a }), !this.channels[e] || p) {
+      const o = this.socket.channel(e, this.params[e]);
+      for (const l of m)
+        o.on(l, (b) => this.setInbox(b));
+      this.channels[e] = o;
+    }
+    const i = this.channels[e];
+    return ["closed", "errored"].includes(i.state) && i.join(), this.inbox.subscribe(() => {
+      const o = this.inbox.state[t];
+      o && s.handleSocketEvent(o);
+    });
+  }
+  leave(s) {
+    var o;
+    (o = s.unsubscribeFromSocketEvents) == null || o.call(s);
+    const e = s.socketChannelTopic, t = s.referenceId, a = { ...this.params }, n = a[e] || {};
+    n[t] && delete n[t];
+    const i = { ...this.channels }, r = i[e];
+    if (r && Object.keys(n).length === 0) {
+      for (const l of m)
+        r.off(l);
+      r.leave(), delete i[e];
+    }
+    this.params = a, this.channels = i;
+  }
+  setInbox(s) {
+    const { attn: e, ...t } = s;
+    this.inbox.setState(
+      () => e.reduce((a, n) => ({ ...a, [n]: t }), {})
+    );
+  }
+}
+export {
+  x as FeedSocketManager,
+  S as SocketEventType
+};
+//# sourceMappingURL=socket-manager.mjs.map

package/dist/esm/clients/feed/socket-manager.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"socket-manager.mjs","sources":["../../../../src/clients/feed/socket-manager.ts"],"sourcesContent":["import { Store } from \"@tanstack/store\";\nimport { Channel, Socket } from \"phoenix\";\n\nimport Feed from \"./feed\";\nimport type { FeedClientOptions, FeedMetadata } from \"./interfaces\";\n\nexport const SocketEventType = {\n  NewMessage: \"new-message\",\n} as const;\n\nconst SOCKET_EVENT_TYPES = [SocketEventType.NewMessage];\n\ntype ClientQueryParams = FeedClientOptions;\n\n// e.g. feeds:<channel_id>:<user_id>\ntype ChannelTopic = string;\n\n// Unique reference id of a feed client\ntype ClientReferenceId = string;\n\ntype NewMessageEventPayload = {\n  event: typeof SocketEventType.NewMessage;\n  /**\n   * @deprecated Top-level feed metadata. Exists for legacy reasons.\n   */\n  metadata: FeedMetadata;\n  /** Feed metadata, keyed by client reference id. */\n  data: Record<ClientReferenceId, { metadata: FeedMetadata }>;\n};\n\nexport type SocketEventPayload = NewMessageEventPayload;\n\n// \"attn\" field contains a list of client reference ids that should be notified\n// of a socket event.\ntype WithAttn<P> = P & { attn: ClientReferenceId[] };\n\ntype FeedSocketInbox = Record<ClientReferenceId, SocketEventPayload>;\n\n/*\n * Manages socket subscriptions for feeds, allowing multiple feed clients\n * to listen for real time updates from the socket API via a single socket\n * connection.\n */\nexport class FeedSocketManager {\n  // Mapping of live channels by topic. Note, there can be one or more feed\n  // client(s) that can subscribe.\n  private channels: Record<ChannelTopic, Channel>;\n\n  // Mapping of query params for each feeds client, partitioned by reference id,\n  // and grouped by channel topic. It's a double nested object that looks like:\n  //  {\n  //    \"feeds:<channel_1>:<user_1>\": {\n  //      \"ref-1\": {\n  //        \"tenant\": \"foo\",\n  //      },\n  //      \"ref-2\": {\n  //        \"tenant\": \"bar\",\n  //      },\n  //    },\n  //    \"feeds:<channel_2>:<user_1>\": {\n  //      \"ref-3\": {\n  //        \"tenant\": \"baz\",\n  //      },\n  //    }\n  //  }\n  //\n  // Each time a new feed client joins a channel, we send all cumulated\n  // params such that the socket API can apply filtering rules and figure out\n  // which feed clients should be notified based on reference ids in\n  // \"attn\" field of the event payload when sending out an event.\n  private params: Record<\n    ChannelTopic,\n    Record<ClientReferenceId, ClientQueryParams>\n  >;\n\n  // A reactive store that captures a new socket event, that notifies any feed\n  // clients that have subscribed.\n  private inbox: Store<\n    FeedSocketInbox,\n    (cb: FeedSocketInbox) => FeedSocketInbox\n  >;\n\n  constructor(readonly socket: Socket) {\n    this.channels = {};\n    this.params = {};\n    this.inbox = new Store<FeedSocketInbox>({});\n  }\n\n  join(feed: Feed) {\n    const topic = feed.socketChannelTopic;\n    const referenceId = feed.referenceId;\n    const params = feed.defaultOptions;\n\n    // Ensure a live socket connection if not yet connected.\n    if (!this.socket.isConnected()) {\n      this.socket.connect();\n    }\n\n    // If a new feed client joins, or has updated query params, then\n    // track the updated params and (re)join with the latest query params.\n    // Note, each time we send combined params of all feed clients that\n    // have subscribed for a given feed channel and user, grouped by\n    // client's reference id.\n    if (!this.params[topic]) {\n      this.params[topic] = {};\n    }\n\n    const maybeParams = this.params[topic][referenceId];\n    const hasNewOrUpdatedParams =\n      !maybeParams || JSON.stringify(maybeParams) !== JSON.stringify(params);\n\n    if (hasNewOrUpdatedParams) {\n      // Tracks all subscribed clients' params by reference id and by topic.\n      this.params[topic] = { ...this.params[topic], [referenceId]: params };\n    }\n\n    if (!this.channels[topic] || hasNewOrUpdatedParams) {\n      const newChannel = this.socket.channel(topic, this.params[topic]);\n      for (const eventType of SOCKET_EVENT_TYPES) {\n        newChannel.on(eventType, (payload) => this.setInbox(payload));\n      }\n      // Tracks live channels by channel topic.\n      this.channels[topic] = newChannel;\n    }\n\n    const channel = this.channels[topic];\n\n    // Join the channel if not already joined or joining or leaving.\n    if ([\"closed\", \"errored\"].includes(channel.state)) {\n      channel.join();\n    }\n\n    // Let the feed client subscribe to the \"inbox\", so it can be notified\n    // when there's a new socket event that is relevant to it\n    const unsub = this.inbox.subscribe(() => {\n      const payload = this.inbox.state[referenceId];\n      if (!payload) return;\n\n      feed.handleSocketEvent(payload);\n    });\n\n    return unsub;\n  }\n\n  leave(feed: Feed) {\n    feed.unsubscribeFromSocketEvents?.();\n\n    const topic = feed.socketChannelTopic;\n    const referenceId = feed.referenceId;\n\n    const partitionedParams = { ...this.params };\n    const paramsForTopic = partitionedParams[topic] || {};\n    const paramsForReferenceClient = paramsForTopic[referenceId];\n\n    if (paramsForReferenceClient) {\n      delete paramsForTopic[referenceId];\n    }\n\n    const channels = { ...this.channels };\n    const channelForTopic = channels[topic];\n    if (channelForTopic && Object.keys(paramsForTopic).length === 0) {\n      for (const eventType of SOCKET_EVENT_TYPES) {\n        channelForTopic.off(eventType);\n      }\n      channelForTopic.leave();\n      delete channels[topic];\n    }\n\n    this.params = partitionedParams;\n    this.channels = channels;\n  }\n\n  private setInbox(payload: WithAttn<SocketEventPayload>) {\n    const { attn, ...rest } = payload;\n\n    // Set the incoming socket event into the inbox, keyed by relevant client\n    // reference ids provided by the server (via attn field), so we can notify\n    // only the clients that need to be notified.\n    this.inbox.setState(() =>\n      attn.reduce((acc, referenceId) => {\n        return { ...acc, [referenceId]: rest };\n      }, {}),\n    );\n  }\n}\n"],"names":["SocketEventType","SOCKET_EVENT_TYPES","FeedSocketManager","socket","__publicField","Store","feed","topic","referenceId","params","maybeParams","hasNewOrUpdatedParams","newChannel","eventType","payload","channel","_a","partitionedParams","paramsForTopic","channels","channelForTopic","attn","rest","acc"],"mappings":";;;;AAMO,MAAMA,IAAkB;AAAA,EAC7B,YAAY;AACd,GAEMC,IAAqB,CAACD,EAAgB,UAAU;AAiC/C,MAAME,EAAkB;AAAA,EAuC7B,YAAqBC,GAAgB;AApC7B;AAAA;AAAA,IAAAC,EAAA;AAwBA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAAAA,EAAA;AAOA;AAAA;AAAA,IAAAA,EAAA;AAKa,SAAA,SAAAD,GACnB,KAAK,WAAW,CAAC,GACjB,KAAK,SAAS,CAAC,GACf,KAAK,QAAQ,IAAIE,EAAuB,EAAE;AAAA,EAAA;AAAA,EAG5C,KAAKC,GAAY;AACf,UAAMC,IAAQD,EAAK,oBACbE,IAAcF,EAAK,aACnBG,IAASH,EAAK;AAGpB,IAAK,KAAK,OAAO,iBACf,KAAK,OAAO,QAAQ,GAQjB,KAAK,OAAOC,CAAK,MACf,KAAA,OAAOA,CAAK,IAAI,CAAC;AAGxB,UAAMG,IAAc,KAAK,OAAOH,CAAK,EAAEC,CAAW,GAC5CG,IACJ,CAACD,KAAe,KAAK,UAAUA,CAAW,MAAM,KAAK,UAAUD,CAAM;AAOvE,QALIE,MAEF,KAAK,OAAOJ,CAAK,IAAI,EAAE,GAAG,KAAK,OAAOA,CAAK,GAAG,CAACC,CAAW,GAAGC,EAAO,IAGlE,CAAC,KAAK,SAASF,CAAK,KAAKI,GAAuB;AAC5C,YAAAC,IAAa,KAAK,OAAO,QAAQL,GAAO,KAAK,OAAOA,CAAK,CAAC;AAChE,iBAAWM,KAAaZ;AACtB,QAAAW,EAAW,GAAGC,GAAW,CAACC,MAAY,KAAK,SAASA,CAAO,CAAC;AAGzD,WAAA,SAASP,CAAK,IAAIK;AAAA,IAAA;AAGnB,UAAAG,IAAU,KAAK,SAASR,CAAK;AAGnC,WAAI,CAAC,UAAU,SAAS,EAAE,SAASQ,EAAQ,KAAK,KAC9CA,EAAQ,KAAK,GAKD,KAAK,MAAM,UAAU,MAAM;AACvC,YAAMD,IAAU,KAAK,MAAM,MAAMN,CAAW;AAC5C,MAAKM,KAELR,EAAK,kBAAkBQ,CAAO;AAAA,IAAA,CAC/B;AAAA,EAEM;AAAA,EAGT,MAAMR,GAAY;;AAChB,KAAAU,IAAAV,EAAK,gCAAL,QAAAU,EAAA,KAAAV;AAEA,UAAMC,IAAQD,EAAK,oBACbE,IAAcF,EAAK,aAEnBW,IAAoB,EAAE,GAAG,KAAK,OAAO,GACrCC,IAAiBD,EAAkBV,CAAK,KAAK,CAAC;AAGpD,IAFiCW,EAAeV,CAAW,KAGzD,OAAOU,EAAeV,CAAW;AAGnC,UAAMW,IAAW,EAAE,GAAG,KAAK,SAAS,GAC9BC,IAAkBD,EAASZ,CAAK;AACtC,QAAIa,KAAmB,OAAO,KAAKF,CAAc,EAAE,WAAW,GAAG;AAC/D,iBAAWL,KAAaZ;AACtB,QAAAmB,EAAgB,IAAIP,CAAS;AAE/B,MAAAO,EAAgB,MAAM,GACtB,OAAOD,EAASZ,CAAK;AAAA,IAAA;AAGvB,SAAK,SAASU,GACd,KAAK,WAAWE;AAAA,EAAA;AAAA,EAGV,SAASL,GAAuC;AACtD,UAAM,EAAE,MAAAO,GAAM,GAAGC,EAAA,IAASR;AAK1B,SAAK,MAAM;AAAA,MAAS,MAClBO,EAAK,OAAO,CAACE,GAAKf,OACT,EAAE,GAAGe,GAAK,CAACf,CAAW,GAAGc,EAAK,IACpC,CAAE,CAAA;AAAA,IACP;AAAA,EAAA;AAEJ;"}

package/dist/types/clients/feed/feed.d.ts

@@ -2,25 +2,28 @@ import { GenericData } from '@knocklabs/types';
 import { StoreApi } from 'zustand';
 import { default as Knock } from '../../knock';
 import { FeedClientOptions, FetchFeedOptions } from './interfaces';
+import { FeedSocketManager, SocketEventPayload } from './socket-manager';
 import { BindableFeedEvent, FeedEventCallback, FeedItemOrItems, FeedRealTimeCallback, FeedStoreState } from './types';
 declare class Feed {
     readonly knock: Knock;
     readonly feedId: string;
+    readonly defaultOptions: FeedClientOptions;
+    readonly referenceId: string;
+    unsubscribeFromSocketEvents: (() => void) | undefined;
+    private socketManager;
     private userFeedId;
-    private channel?;
     private broadcaster;
-    private defaultOptions;
     private broadcastChannel;
     private disconnectTimer;
     private hasSubscribedToRealTimeUpdates;
     private visibilityChangeHandler;
     private visibilityChangeListenerConnected;
     store: StoreApi<FeedStoreState>;
-    constructor(knock: Knock, feedId: string, options: FeedClientOptions);
+    constructor(knock: Knock, feedId: string, options: FeedClientOptions, socketManager: FeedSocketManager | undefined);
     /**
      * Used to reinitialize a current feed instance, which is useful when reauthenticating users
      */
-    reinitialize(): void;
+    reinitialize(socketManager?: FeedSocketManager): void;
     /**
      * Cleans up a feed instance by destroying the store and disconnecting
      * an open socket connection.
@@ -48,6 +51,7 @@ declare class Feed {
         data: any;
     } | undefined>;
     fetchNextPage(options?: FetchFeedOptions): Promise<void>;
+    get socketChannelTopic(): string;
     private broadcast;
     private onNewMessageReceived;
     private buildUserFeedId;
@@ -57,12 +61,13 @@ declare class Feed {
     private setupBroadcastChannel;
     private broadcastOverChannel;
     private initializeRealtimeConnection;
+    handleSocketEvent(payload: SocketEventPayload): Promise<void>;
     /**
      * Listen for changes to document visibility and automatically disconnect
      * or reconnect the socket after a delay
      */
-    private setupAutoSocketManager;
-    private teardownAutoSocketManager;
+    private setUpVisibilityListeners;
+    private tearDownVisibilityListeners;
     private emitEvent;
     private handleVisibilityChange;
 }

package/dist/types/clients/feed/feed.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"feed.d.ts","sourceRoot":"","sources":["../../../../src/clients/feed/feed.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAG/C,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAGxC,OAAO,KAAK,MAAM,aAAa,CAAC;AAOhC,OAAO,EACL,iBAAiB,EAIjB,gBAAgB,EAEjB,MAAM,cAAc,CAAC;AAEtB,OAAO,EACL,iBAAiB,EAEjB,iBAAiB,EAEjB,eAAe,EAEf,oBAAoB,EACpB,cAAc,EACf,MAAM,SAAS,CAAC;AAUjB,cAAM,IAAI;IAeN,QAAQ,CAAC,KAAK,EAAE,KAAK;IACrB,QAAQ,CAAC,MAAM,EAAE,MAAM;IAfzB,OAAO,CAAC,UAAU,CAAS;IAC3B,OAAO,CAAC,OAAO,CAAC,CAAU;IAC1B,OAAO,CAAC,WAAW,CAAe;IAClC,OAAO,CAAC,cAAc,CAAoB;IAC1C,OAAO,CAAC,gBAAgB,CAA2B;IACnD,OAAO,CAAC,eAAe,CAA8C;IACrE,OAAO,CAAC,8BAA8B,CAAkB;IACxD,OAAO,CAAC,uBAAuB,CAAwB;IACvD,OAAO,CAAC,iCAAiC,CAAkB;IAGpD,KAAK,EAAE,QAAQ,CAAC,cAAc,CAAC,CAAC;gBAG5B,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,MAAM,EACvB,OAAO,EAAE,iBAAiB;IAyB5B;;OAEG;IACH,YAAY;IAWZ;;;OAGG;IACH,QAAQ;IAoBR,2EAA2E;IAC3E,OAAO;IAWP,gBAAgB;IA2BhB,EAAE,CACA,SAAS,EAAE,iBAAiB,EAC5B,QAAQ,EAAE,iBAAiB,GAAG,oBAAoB;IAKpD,GAAG,CACD,SAAS,EAAE,iBAAiB,EAC5B,QAAQ,EAAE,iBAAiB,GAAG,oBAAoB;IAKpD,QAAQ;IAIF,UAAU,CAAC,WAAW,EAAE,eAAe;IAYvC,aAAa;IA0Cb,YAAY,CAAC,WAAW,EAAE,eAAe;IAWzC,UAAU,CAAC,WAAW,EAAE,eAAe;IAYvC,aAAa;IA0Cb,YAAY,CAAC,WAAW,EAAE,eAAe;IAWzC,gBAAgB,CACpB,WAAW,EAAE,eAAe,EAC5B,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;IAwB7B,cAAc,CAAC,WAAW,EAAE,eAAe;IAuE3C,iBAAiB;IA2BjB,qBAAqB;IA0CrB,gBAAgB,CAAC,WAAW,EAAE,eAAe;IAS7C,KAAK,CAAC,OAAO,GAAE,gBAAqB;;;;IA0FpC,aAAa,CAAC,OAAO,GAAE,gBAAqB;IAgBlD,OAAO,CAAC,SAAS;YAQH,oBAAoB;IAalC,OAAO,CAAC,eAAe;IAIvB,OAAO,CAAC,iCAAiC;YAiD3B,gBAAgB;YAsBhB,oBAAoB;IA2BlC,OAAO,CAAC,qBAAqB;IAoC7B,OAAO,CAAC,oBAAoB;IAoB5B,OAAO,CAAC,4BAA4B;IA0BpC;;;OAGG;IACH,OAAO,CAAC,sBAAsB;IAa9B,OAAO,CAAC,yBAAyB;IAUjC,OAAO,CAAC,SAAS;IAkBjB,OAAO,CAAC,sBAAsB;CA2B/B;AAED,eAAe,IAAI,CAAC"}
+{"version":3,"file":"feed.d.ts","sourceRoot":"","sources":["../../../../src/clients/feed/feed.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAG/C,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAGxC,OAAO,KAAK,MAAM,aAAa,CAAC;AAOhC,OAAO,EACL,iBAAiB,EAIjB,gBAAgB,EAEjB,MAAM,cAAc,CAAC;AACtB,OAAO,EACL,iBAAiB,EACjB,kBAAkB,EAEnB,MAAM,kBAAkB,CAAC;AAE1B,OAAO,EACL,iBAAiB,EAEjB,iBAAiB,EAEjB,eAAe,EAEf,oBAAoB,EACpB,cAAc,EACf,MAAM,SAAS,CAAC;AAYjB,cAAM,IAAI;IAiBN,QAAQ,CAAC,KAAK,EAAE,KAAK;IACrB,QAAQ,CAAC,MAAM,EAAE,MAAM;IAjBzB,SAAgB,cAAc,EAAE,iBAAiB,CAAC;IAClD,SAAgB,WAAW,EAAE,MAAM,CAAC;IAC7B,2BAA2B,EAAE,CAAC,MAAM,IAAI,CAAC,GAAG,SAAS,CAAa;IACzE,OAAO,CAAC,aAAa,CAAgC;IACrD,OAAO,CAAC,UAAU,CAAS;IAC3B,OAAO,CAAC,WAAW,CAAe;IAClC,OAAO,CAAC,gBAAgB,CAA2B;IACnD,OAAO,CAAC,eAAe,CAA8C;IACrE,OAAO,CAAC,8BAA8B,CAAkB;IACxD,OAAO,CAAC,uBAAuB,CAAwB;IACvD,OAAO,CAAC,iCAAiC,CAAkB;IAGpD,KAAK,EAAE,QAAQ,CAAC,cAAc,CAAC,CAAC;gBAG5B,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,MAAM,EACvB,OAAO,EAAE,iBAAiB,EAC1B,aAAa,EAAE,iBAAiB,GAAG,SAAS;IA2B9C;;OAEG;IACH,YAAY,CAAC,aAAa,CAAC,EAAE,iBAAiB;IAa9C;;;OAGG;IACH,QAAQ;IAiBR,2EAA2E;IAC3E,OAAO;IAWP,gBAAgB;IAiBhB,EAAE,CACA,SAAS,EAAE,iBAAiB,EAC5B,QAAQ,EAAE,iBAAiB,GAAG,oBAAoB;IAKpD,GAAG,CACD,SAAS,EAAE,iBAAiB,EAC5B,QAAQ,EAAE,iBAAiB,GAAG,oBAAoB;IAKpD,QAAQ;IAIF,UAAU,CAAC,WAAW,EAAE,eAAe;IAYvC,aAAa;IA0Cb,YAAY,CAAC,WAAW,EAAE,eAAe;IAWzC,UAAU,CAAC,WAAW,EAAE,eAAe;IAYvC,aAAa;IA0Cb,YAAY,CAAC,WAAW,EAAE,eAAe;IAWzC,gBAAgB,CACpB,WAAW,EAAE,eAAe,EAC5B,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;IAwB7B,cAAc,CAAC,WAAW,EAAE,eAAe;IAuE3C,iBAAiB;IA2BjB,qBAAqB;IA0CrB,gBAAgB,CAAC,WAAW,EAAE,eAAe;IAS7C,KAAK,CAAC,OAAO,GAAE,gBAAqB;;;;IA0FpC,aAAa,CAAC,OAAO,GAAE,gBAAqB;IAgBlD,IAAI,kBAAkB,IAAI,MAAM,CAE/B;IAED,OAAO,CAAC,SAAS;YAQH,oBAAoB;IAiBlC,OAAO,CAAC,eAAe;IAIvB,OAAO,CAAC,iCAAiC;YAiD3B,gBAAgB;YAsBhB,oBAAoB;IA2BlC,OAAO,CAAC,qBAAqB;IAoC7B,OAAO,CAAC,oBAAoB;IAoB5B,OAAO,CAAC,4BAA4B;IAe9B,iBAAiB,CAAC,OAAO,EAAE,kBAAkB;IAYnD;;;OAGG;IACH,OAAO,CAAC,wBAAwB;IAahC,OAAO,CAAC,2BAA2B;IAUnC,OAAO,CAAC,SAAS;IAkBjB,OAAO,CAAC,sBAAsB;CA2B/B;AAED,eAAe,IAAI,CAAC"}

package/dist/types/clients/feed/index.d.ts

@@ -4,11 +4,13 @@ import { FeedClientOptions } from './interfaces';
 declare class FeedClient {
     private instance;
     private feedInstances;
+    private socketManager;
     constructor(instance: Knock);
     initialize(feedChannelId: string, options?: FeedClientOptions): Feed;
     removeInstance(feed: Feed): void;
     teardownInstances(): void;
     reinitializeInstances(): void;
+    private initSocketManager;
 }
 export { Feed };
 export default FeedClient;

package/dist/types/clients/feed/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/clients/feed/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,aAAa,CAAC;AAEhC,OAAO,IAAI,MAAM,QAAQ,CAAC;AAC1B,OAAO,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AAEjD,cAAM,UAAU;IACd,OAAO,CAAC,QAAQ,CAAQ;IACxB,OAAO,CAAC,aAAa,CAAc;gBAEvB,QAAQ,EAAE,KAAK;IAI3B,UAAU,CAAC,aAAa,EAAE,MAAM,EAAE,OAAO,GAAE,iBAAsB;IAOjE,cAAc,CAAC,IAAI,EAAE,IAAI;IAIzB,iBAAiB;IAMjB,qBAAqB;CAKtB;AAED,OAAO,EAAE,IAAI,EAAE,CAAC;AAChB,eAAe,UAAU,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/clients/feed/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,aAAa,CAAC;AAEhC,OAAO,IAAI,MAAM,QAAQ,CAAC;AAC1B,OAAO,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AAGjD,cAAM,UAAU;IACd,OAAO,CAAC,QAAQ,CAAQ;IACxB,OAAO,CAAC,aAAa,CAAc;IACnC,OAAO,CAAC,aAAa,CAAgC;gBAEzC,QAAQ,EAAE,KAAK;IAI3B,UAAU,CAAC,aAAa,EAAE,MAAM,EAAE,OAAO,GAAE,iBAAsB;IAajE,cAAc,CAAC,IAAI,EAAE,IAAI;IAIzB,iBAAiB;IAMjB,qBAAqB;IAerB,OAAO,CAAC,iBAAiB;CAM1B;AAED,OAAO,EAAE,IAAI,EAAE,CAAC;AAChB,eAAe,UAAU,CAAC"}

package/dist/types/clients/feed/socket-manager.d.ts

@@ -0,0 +1,31 @@
+import { Socket } from 'phoenix';
+import { default as Feed } from './feed';
+import { FeedMetadata } from './interfaces';
+export declare const SocketEventType: {
+    readonly NewMessage: "new-message";
+};
+type ClientReferenceId = string;
+type NewMessageEventPayload = {
+    event: typeof SocketEventType.NewMessage;
+    /**
+     * @deprecated Top-level feed metadata. Exists for legacy reasons.
+     */
+    metadata: FeedMetadata;
+    /** Feed metadata, keyed by client reference id. */
+    data: Record<ClientReferenceId, {
+        metadata: FeedMetadata;
+    }>;
+};
+export type SocketEventPayload = NewMessageEventPayload;
+export declare class FeedSocketManager {
+    readonly socket: Socket;
+    private channels;
+    private params;
+    private inbox;
+    constructor(socket: Socket);
+    join(feed: Feed): () => void;
+    leave(feed: Feed): void;
+    private setInbox;
+}
+export {};
+//# sourceMappingURL=socket-manager.d.ts.map

package/dist/types/clients/feed/socket-manager.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"socket-manager.d.ts","sourceRoot":"","sources":["../../../../src/clients/feed/socket-manager.ts"],"names":[],"mappings":"AACA,OAAO,EAAW,MAAM,EAAE,MAAM,SAAS,CAAC;AAE1C,OAAO,IAAI,MAAM,QAAQ,CAAC;AAC1B,OAAO,KAAK,EAAqB,YAAY,EAAE,MAAM,cAAc,CAAC;AAEpE,eAAO,MAAM,eAAe;;CAElB,CAAC;AAUX,KAAK,iBAAiB,GAAG,MAAM,CAAC;AAEhC,KAAK,sBAAsB,GAAG;IAC5B,KAAK,EAAE,OAAO,eAAe,CAAC,UAAU,CAAC;IACzC;;OAEG;IACH,QAAQ,EAAE,YAAY,CAAC;IACvB,mDAAmD;IACnD,IAAI,EAAE,MAAM,CAAC,iBAAiB,EAAE;QAAE,QAAQ,EAAE,YAAY,CAAA;KAAE,CAAC,CAAC;CAC7D,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG,sBAAsB,CAAC;AAaxD,qBAAa,iBAAiB;IAuChB,QAAQ,CAAC,MAAM,EAAE,MAAM;IApCnC,OAAO,CAAC,QAAQ,CAAgC;IAwBhD,OAAO,CAAC,MAAM,CAGZ;IAIF,OAAO,CAAC,KAAK,CAGX;gBAEmB,MAAM,EAAE,MAAM;IAMnC,IAAI,CAAC,IAAI,EAAE,IAAI;IAwDf,KAAK,CAAC,IAAI,EAAE,IAAI;IA4BhB,OAAO,CAAC,QAAQ;CAYjB"}

package/dist/types/clients/feed/types.d.ts

@@ -1,6 +1,7 @@
 import { GenericData, PageInfo } from '@knocklabs/types';
 import { NetworkStatus } from '../../networkStatus';
 import { FeedItem, FeedMetadata, FeedResponse } from './interfaces';
+import { SocketEventPayload, SocketEventType } from './socket-manager';
 export type StoreFeedResultOptions = {
     shouldSetPage?: boolean;
     shouldAppend?: boolean;
@@ -17,9 +18,9 @@ export interface FeedStoreState {
     setItemAttrs: (itemIds: string[], attrs: object) => void;
     resetStore: (metadata?: FeedMetadata) => void;
 }
-export interface FeedMessagesReceivedPayload {
-    metadata: FeedMetadata;
-}
+export type FeedMessagesReceivedPayload = Extract<SocketEventPayload, {
+    event: typeof SocketEventType.NewMessage;
+}>;
 export type FeedRealTimeEvent = "messages.new";
 export type FeedEvent = FeedRealTimeEvent | "items.received.page" | "items.received.realtime" | "items.archived" | "items.unarchived" | "items.seen" | "items.unseen" | "items.read" | "items.unread" | "items.all_archived" | "items.all_read" | "items.all_seen";
 export type BindableFeedEvent = FeedEvent | "items.received.*" | "items.*";

package/dist/types/clients/feed/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/clients/feed/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEzD,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAEpD,OAAO,EAAE,QAAQ,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAEpE,MAAM,MAAM,sBAAsB,GAAG;IACnC,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB,CAAC;AAEF,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,QAAQ,EAAE,CAAC;IAClB,QAAQ,EAAE,QAAQ,CAAC;IACnB,QAAQ,EAAE,YAAY,CAAC;IACvB,OAAO,EAAE,OAAO,CAAC;IACjB,aAAa,EAAE,aAAa,CAAC;IAC7B,SAAS,EAAE,CAAC,QAAQ,EAAE,YAAY,EAAE,IAAI,CAAC,EAAE,sBAAsB,KAAK,IAAI,CAAC;IAC3E,WAAW,EAAE,CAAC,QAAQ,EAAE,YAAY,KAAK,IAAI,CAAC;IAC9C,gBAAgB,EAAE,CAAC,aAAa,EAAE,aAAa,KAAK,IAAI,CAAC;IACzD,YAAY,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzD,UAAU,EAAE,CAAC,QAAQ,CAAC,EAAE,YAAY,KAAK,IAAI,CAAC;CAC/C;AAED,MAAM,WAAW,2BAA2B;IAC1C,QAAQ,EAAE,YAAY,CAAC;CACxB;AAQD,MAAM,MAAM,iBAAiB,GAAG,cAAc,CAAC;AAE/C,MAAM,MAAM,SAAS,GACjB,iBAAiB,GACjB,qBAAqB,GACrB,yBAAyB,GACzB,gBAAgB,GAChB,kBAAkB,GAClB,YAAY,GACZ,cAAc,GACd,YAAY,GACZ,cAAc,GACd,oBAAoB,GACpB,gBAAgB,GAChB,gBAAgB,CAAC;AAGrB,MAAM,MAAM,iBAAiB,GAAG,SAAS,GAAG,kBAAkB,GAAG,SAAS,CAAC;AAE3E,MAAM,WAAW,gBAAgB,CAAC,CAAC,GAAG,WAAW;IAC/C,KAAK,EAAE,IAAI,CAAC,SAAS,EAAE,cAAc,CAAC,CAAC;IACvC,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC;IACrB,QAAQ,EAAE,YAAY,CAAC;CACxB;AAED,MAAM,MAAM,oBAAoB,GAAG,CAAC,IAAI,EAAE,YAAY,KAAK,IAAI,CAAC;AAEhE,MAAM,MAAM,iBAAiB,GAAG,CAAC,OAAO,EAAE,gBAAgB,KAAK,IAAI,CAAC;AAEpE,MAAM,MAAM,eAAe,GAAG,QAAQ,GAAG,QAAQ,EAAE,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/clients/feed/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEzD,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAEpD,OAAO,EAAE,QAAQ,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AACpE,OAAO,EAAE,kBAAkB,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AAEvE,MAAM,MAAM,sBAAsB,GAAG;IACnC,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB,CAAC;AAEF,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,QAAQ,EAAE,CAAC;IAClB,QAAQ,EAAE,QAAQ,CAAC;IACnB,QAAQ,EAAE,YAAY,CAAC;IACvB,OAAO,EAAE,OAAO,CAAC;IACjB,aAAa,EAAE,aAAa,CAAC;IAC7B,SAAS,EAAE,CAAC,QAAQ,EAAE,YAAY,EAAE,IAAI,CAAC,EAAE,sBAAsB,KAAK,IAAI,CAAC;IAC3E,WAAW,EAAE,CAAC,QAAQ,EAAE,YAAY,KAAK,IAAI,CAAC;IAC9C,gBAAgB,EAAE,CAAC,aAAa,EAAE,aAAa,KAAK,IAAI,CAAC;IACzD,YAAY,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzD,UAAU,EAAE,CAAC,QAAQ,CAAC,EAAE,YAAY,KAAK,IAAI,CAAC;CAC/C;AAED,MAAM,MAAM,2BAA2B,GAAG,OAAO,CAC/C,kBAAkB,EAClB;IAAE,KAAK,EAAE,OAAO,eAAe,CAAC,UAAU,CAAA;CAAE,CAC7C,CAAC;AAQF,MAAM,MAAM,iBAAiB,GAAG,cAAc,CAAC;AAE/C,MAAM,MAAM,SAAS,GACjB,iBAAiB,GACjB,qBAAqB,GACrB,yBAAyB,GACzB,gBAAgB,GAChB,kBAAkB,GAClB,YAAY,GACZ,cAAc,GACd,YAAY,GACZ,cAAc,GACd,oBAAoB,GACpB,gBAAgB,GAChB,gBAAgB,CAAC;AAGrB,MAAM,MAAM,iBAAiB,GAAG,SAAS,GAAG,kBAAkB,GAAG,SAAS,CAAC;AAE3E,MAAM,WAAW,gBAAgB,CAAC,CAAC,GAAG,WAAW;IAC/C,KAAK,EAAE,IAAI,CAAC,SAAS,EAAE,cAAc,CAAC,CAAC;IACvC,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC;IACrB,QAAQ,EAAE,YAAY,CAAC;CACxB;AAED,MAAM,MAAM,oBAAoB,GAAG,CAAC,IAAI,EAAE,YAAY,KAAK,IAAI,CAAC;AAEhE,MAAM,MAAM,iBAAiB,GAAG,CAAC,OAAO,EAAE,gBAAgB,KAAK,IAAI,CAAC;AAEpE,MAAM,MAAM,eAAe,GAAG,QAAQ,GAAG,QAAQ,EAAE,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@knocklabs/client",
-  "version": "0.14.5",
+  "version": "0.14.7",
   "description": "The clientside library for interacting with Knock",
   "homepage": "https://github.com/knocklabs/javascript/tree/main/packages/client",
   "author": "@knocklabs",
@@ -52,7 +52,7 @@
     "@babel/plugin-proposal-class-properties": "^7.16.7",
     "@babel/plugin-proposal-object-rest-spread": "^7.16.7",
     "@babel/plugin-transform-runtime": "^7.25.4",
-    "@babel/preset-env": "^7.26.0",
+    "@babel/preset-env": "^7.27.1",
     "@babel/preset-typescript": "^7.27.0",
     "@types/jsonwebtoken": "^9.0.9",
     "@typescript-eslint/eslint-plugin": "^8.19.1",
@@ -65,7 +65,7 @@
     "rimraf": "^6.0.1",
     "rollup": "^4.34.8",
     "typescript": "^5.8.3",
-    "vite": "^5.4.18",
+    "vite": "^5.4.19",
     "vitest": "^3.1.1"
   },
   "dependencies": {
@@ -77,6 +77,7 @@
     "axios-retry": "^4.5.0",
     "eventemitter2": "^6.4.5",
     "jwt-decode": "^4.0.0",
+    "nanoid": "^3.3.11",
     "phoenix": "1.7.19",
     "urlpattern-polyfill": "^10.0.0",
     "zustand": "^4.5.6"

package/src/clients/feed/feed.ts

@@ -1,6 +1,6 @@
 import { GenericData } from "@knocklabs/types";
 import EventEmitter from "eventemitter2";
-import { Channel } from "phoenix";
+import { nanoid } from "nanoid";
 import type { StoreApi } from "zustand";
 
 import { isValidUuid } from "../../helpers";
@@ -19,6 +19,11 @@ import {
   FetchFeedOptions,
   FetchFeedOptionsForRequest,
 } from "./interfaces";
+import {
+  FeedSocketManager,
+  SocketEventPayload,
+  SocketEventType,
+} from "./socket-manager";
 import createStore from "./store";
 import {
   BindableFeedEvent,
@@ -39,11 +44,15 @@ const feedClientDefaults: Pick<FeedClientOptions, "archived"> = {
 
 const DEFAULT_DISCONNECT_DELAY = 2000;
 
+const CLIENT_REF_ID_PREFIX = "client_";
+
 class Feed {
+  public readonly defaultOptions: FeedClientOptions;
+  public readonly referenceId: string;
+  public unsubscribeFromSocketEvents: (() => void) | undefined = undefined;
+  private socketManager: FeedSocketManager | undefined;
   private userFeedId: string;
-  private channel?: Channel;
   private broadcaster: EventEmitter;
-  private defaultOptions: FeedClientOptions;
   private broadcastChannel!: BroadcastChannel | null;
   private disconnectTimer: ReturnType<typeof setTimeout> | null = null;
   private hasSubscribedToRealTimeUpdates: boolean = false;
@@ -57,6 +66,7 @@ class Feed {
     readonly knock: Knock,
     readonly feedId: string,
     options: FeedClientOptions,
+    socketManager: FeedSocketManager | undefined,
   ) {
     if (!feedId || !isValidUuid(feedId)) {
       this.knock.log(
@@ -67,6 +77,8 @@ class Feed {
 
     this.feedId = feedId;
     this.userFeedId = this.buildUserFeedId();
+    this.referenceId = CLIENT_REF_ID_PREFIX + nanoid();
+    this.socketManager = socketManager;
     this.store = createStore();
     this.broadcaster = new EventEmitter({ wildcard: true, delimiter: "." });
     this.defaultOptions = {
@@ -84,7 +96,9 @@ class Feed {
   /**
    * Used to reinitialize a current feed instance, which is useful when reauthenticating users
    */
-  reinitialize() {
+  reinitialize(socketManager?: FeedSocketManager) {
+    this.socketManager = socketManager;
+
     // Reinitialize the user feed id incase the userId changed
     this.userFeedId = this.buildUserFeedId();
 
@@ -102,12 +116,9 @@ class Feed {
   teardown() {
     this.knock.log("[Feed] Tearing down feed instance");
 
-    if (this.channel) {
-      this.channel.leave();
-      this.channel.off("new-message");
-    }
+    this.socketManager?.leave(this);
 
-    this.teardownAutoSocketManager();
+    this.tearDownVisibilityListeners();
 
     if (this.disconnectTimer) {
       clearTimeout(this.disconnectTimer);
@@ -144,17 +155,7 @@ class Feed {
       return;
     }
 
-    const maybeSocket = this.knock.client().socket;
-
-    // Connect the socket only if we don't already have a connection
-    if (maybeSocket && !maybeSocket.isConnected()) {
-      maybeSocket.connect();
-    }
-
-    // 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();
-    }
+    this.unsubscribeFromSocketEvents = this.socketManager?.join(this);
   }
 
   /* Binds a handler to be invoked when event occurs */
@@ -587,6 +588,10 @@ class Feed {
     });
   }
 
+  get socketChannelTopic(): string {
+    return `feeds:${this.userFeedId}`;
+  }
+
   private broadcast(
     eventName: FeedEvent,
     data: FeedResponse | FeedEventPayload,
@@ -595,15 +600,19 @@ class Feed {
   }
 
   // Invoked when a new real-time message comes in from the socket
-  private async onNewMessageReceived({
-    metadata,
-  }: FeedMessagesReceivedPayload) {
+  private async onNewMessageReceived({ data }: FeedMessagesReceivedPayload) {
     this.knock.log("[Feed] Received new real-time message");
+
     // Handle the new message coming in
     const { items, ...state } = this.store.getState();
     const currentHead: FeedItem | undefined = items[0];
+
     // Optimistically set the badge counts
-    state.setMetadata(metadata);
+    const metadata = data[this.referenceId]?.metadata;
+    if (metadata) {
+      state.setMetadata(metadata);
+    }
+
     // Fetch the items before the current head (if it exists)
     this.fetch({ before: currentHead?.__cursor, __fetchSource: "socket" });
   }
@@ -767,28 +776,29 @@ class Feed {
   }
 
   private initializeRealtimeConnection() {
-    const { socket: maybeSocket } = this.knock.client();
-
     // In server environments we might not have a socket connection
-    if (!maybeSocket) return;
-
-    // Reinitialize channel connections incase the socket changed
-    this.channel = maybeSocket.channel(
-      `feeds:${this.userFeedId}`,
-      this.defaultOptions,
-    );
-
-    this.channel.on("new-message", (resp) => this.onNewMessageReceived(resp));
+    if (!this.socketManager) return;
 
     if (this.defaultOptions.auto_manage_socket_connection) {
-      this.setupAutoSocketManager();
+      this.setUpVisibilityListeners();
     }
 
     // If we're initializing but they have previously opted to listen to real-time updates
     // then we will automatically reconnect on their behalf
     if (this.hasSubscribedToRealTimeUpdates && this.knock.isAuthenticated()) {
-      if (!maybeSocket.isConnected()) maybeSocket.connect();
-      this.channel.join();
+      this.unsubscribeFromSocketEvents = this.socketManager?.join(this);
+    }
+  }
+
+  async handleSocketEvent(payload: SocketEventPayload) {
+    switch (payload.event) {
+      case SocketEventType.NewMessage:
+        this.onNewMessageReceived(payload);
+        return;
+      default: {
+        const _exhaustiveCheck: never = payload.event;
+        return;
+      }
     }
   }
 
@@ -796,7 +806,7 @@ class Feed {
    * Listen for changes to document visibility and automatically disconnect
    * or reconnect the socket after a delay
    */
-  private setupAutoSocketManager() {
+  private setUpVisibilityListeners() {
     if (
       typeof document === "undefined" ||
       this.visibilityChangeListenerConnected
@@ -809,7 +819,7 @@ class Feed {
     document.addEventListener("visibilitychange", this.visibilityChangeHandler);
   }
 
-  private teardownAutoSocketManager() {
+  private tearDownVisibilityListeners() {
     if (typeof document === "undefined") return;
 
     document.removeEventListener(
@@ -860,7 +870,7 @@ class Feed {
 
       // If the socket is not connected, try to reconnect
       if (!client.socket?.isConnected()) {
-        this.initializeRealtimeConnection();
+        client.socket?.connect();
       }
     }
   }

package/src/clients/feed/index.ts

@@ -2,19 +2,27 @@ import Knock from "../../knock";
 
 import Feed from "./feed";
 import { FeedClientOptions } from "./interfaces";
+import { FeedSocketManager } from "./socket-manager";
 
 class FeedClient {
   private instance: Knock;
   private feedInstances: Feed[] = [];
+  private socketManager: FeedSocketManager | undefined;
 
   constructor(instance: Knock) {
     this.instance = instance;
   }
 
   initialize(feedChannelId: string, options: FeedClientOptions = {}) {
-    const feedInstance = new Feed(this.instance, feedChannelId, options);
+    this.initSocketManager();
+
+    const feedInstance = new Feed(
+      this.instance,
+      feedChannelId,
+      options,
+      this.socketManager,
+    );
     this.feedInstances.push(feedInstance);
-
     return feedInstance;
   }
 
@@ -30,7 +38,23 @@ class FeedClient {
 
   reinitializeInstances() {
     for (const feed of this.feedInstances) {
-      feed.reinitialize();
+      this.socketManager?.leave(feed);
+    }
+
+    // The API client has a new socket once it's reinitialized,
+    // so we need to set up a new socket manager
+    this.socketManager = undefined;
+    this.initSocketManager();
+
+    for (const feed of this.feedInstances) {
+      feed.reinitialize(this.socketManager);
+    }
+  }
+
+  private initSocketManager() {
+    const socket = this.instance.client().socket;
+    if (socket && !this.socketManager) {
+      this.socketManager = new FeedSocketManager(socket);
     }
   }
 }