@stream-io/feeds-client 0.2.18 → 0.2.19

package/src/feeds-client/feeds-client.ts

@@ -14,6 +14,7 @@ import type {
   FollowBatchRequest,
   FollowRequest,
   ImageUploadRequest,
+  OwnCapabilitiesBatchRequest,
   OwnUser,
   PollResponse,
   PollVotesResponse,
@@ -66,15 +67,26 @@ import {
   handleWatchStopped,
 } from '../feed';
 import { handleUserUpdated } from './event-handlers';
-import type { SyncFailure } from '../common/real-time/event-models';
-import { UnhandledErrorType } from '../common/real-time/event-models';
+import {
+  type SyncFailure,
+  UnhandledErrorType,
+} from '../common/real-time/event-models';
 import { updateCommentCount } from '../feed/event-handlers/comment/utils';
 import { configureLoggers } from '../utils';
 import { handleCommentReactionUpdated } from '../feed/event-handlers/comment/handle-comment-reaction-updated';
+import {
+  throttle,
+  DEFAULT_BATCH_OWN_CAPABILITIES_THROTTLING_INTERVAL,
+  type GetBatchedOwnCapabilitiesThrottledCallback,
+  queueBatchedOwnCapabilities,
+  type ThrottledGetBatchedOwnCapabilities,
+  clearQueuedFeeds,
+} from '../utils/throttling';
 
 export type FeedsClientState = {
   connected_user: OwnUser | undefined;
   is_ws_connection_healthy: boolean;
+  own_capabilities_by_fid: Record<string, FeedResponse['own_capabilities']>;
 };
 
 type FID = string;
@@ -97,6 +109,10 @@ export class FeedsClient extends FeedsApi {
 
   private healthyConnectionChangedEventCount = 0;
 
+  protected throttledGetBatchOwnCapabilities!: ThrottledGetBatchedOwnCapabilities;
+  private cancelGetBatchOwnCapabilitiesTimer!: () => void;
+  private query_batch_own_capabilties_throttling_interval!: number;
+
   constructor(apiKey: string, options?: FeedsClientOptions) {
     const tokenManager = new TokenManager();
     const connectionIdManager = new ConnectionIdManager();
@@ -110,12 +126,17 @@ export class FeedsClient extends FeedsApi {
     this.state = new StateStore<FeedsClientState>({
       connected_user: undefined,
       is_ws_connection_healthy: false,
+      own_capabilities_by_fid: {},
     });
     this.moderation = new ModerationClient(apiClient);
     this.tokenManager = tokenManager;
     this.connectionIdManager = connectionIdManager;
     this.polls_by_id = new Map();
 
+    this.query_batch_own_capabilties_throttling_interval =
+      options?.query_batch_own_capabilties_throttling_interval ??
+      DEFAULT_BATCH_OWN_CAPABILITIES_THROTTLING_INTERVAL;
+
     configureLoggers(options?.configure_loggers_options);
 
     this.on('all', (event) => {
@@ -231,6 +252,32 @@ export class FeedsClient extends FeedsApi {
     });
   }
 
+  private setGetBatchOwnCapabilitiesThrottlingInterval = (
+    throttlingMs: number,
+  ) => {
+    const {
+      throttledFn: throttledGetBatchOwnCapabilities,
+      cancelTimer: cancel,
+    } = throttle<GetBatchedOwnCapabilitiesThrottledCallback>(
+      (feeds, callback) => {
+        this.ownCapabilitiesBatch({
+          feeds,
+        }).catch((error) => {
+          this.eventDispatcher.dispatch({
+            type: 'errors.unhandled',
+            error_type: UnhandledErrorType.FetchingOwnCapabilitiesOnNewActivity,
+            error,
+          });
+        });
+        callback(feeds);
+      },
+      throttlingMs,
+      { trailing: true },
+    );
+    this.throttledGetBatchOwnCapabilities = throttledGetBatchOwnCapabilities;
+    this.cancelGetBatchOwnCapabilitiesTimer = cancel;
+  };
+
   private recoverOnReconnect = async () => {
     this.healthyConnectionChangedEventCount++;
 
@@ -276,6 +323,34 @@ export class FeedsClient extends FeedsApi {
     }
   }
 
+  public hydrateCapabilitiesCache(
+    feedResponses: Array<Pick<FeedResponse, 'feed' | 'own_capabilities'>>,
+  ) {
+    let ownCapabilitiesCache =
+      this.state.getLatestValue().own_capabilities_by_fid;
+
+    const capabilitiesToFetchQueue: string[] = [];
+
+    for (const feedResponse of feedResponses) {
+      const { feed, own_capabilities } = feedResponse;
+
+      if (!Object.prototype.hasOwnProperty.call(ownCapabilitiesCache, feed)) {
+        if (own_capabilities) {
+          ownCapabilitiesCache = {
+            ...ownCapabilitiesCache,
+            [feed]: own_capabilities,
+          };
+        } else {
+          capabilitiesToFetchQueue.push(feed);
+        }
+      }
+    }
+
+    queueBatchedOwnCapabilities.bind(this)({ feeds: capabilitiesToFetchQueue });
+
+    this.state.partialNext({ own_capabilities_by_fid: ownCapabilitiesCache });
+  }
+
   connectUser = async (user: UserRequest, tokenProvider: TokenOrProvider) => {
     if (
       this.state.getLatestValue().connected_user !== undefined ||
@@ -286,6 +361,10 @@ export class FeedsClient extends FeedsApi {
 
     this.tokenManager.setTokenOrProvider(tokenProvider);
 
+    this.setGetBatchOwnCapabilitiesThrottlingInterval(
+      this.query_batch_own_capabilties_throttling_interval,
+    );
+
     try {
       addConnectionEventListeners(this.updateNetworkConnectionStatus);
       this.wsConnection = new StableWSConnection(
@@ -516,10 +595,18 @@ export class FeedsClient extends FeedsApi {
 
     this.connectionIdManager.reset();
     this.tokenManager.reset();
+
+    // clear all caches
+    this.polls_by_id.clear();
+
     this.state.partialNext({
       connected_user: undefined,
       is_ws_connection_healthy: false,
+      own_capabilities_by_fid: {},
     });
+
+    this.cancelGetBatchOwnCapabilitiesTimer();
+    clearQueuedFeeds();
   };
 
   on = this.eventDispatcher.on;
@@ -542,7 +629,9 @@ export class FeedsClient extends FeedsApi {
   async queryFeeds(request?: QueryFeedsRequest) {
     const response = await this._queryFeeds(request);
 
-    const feeds = response.feeds.map((feedResponse) =>
+    const feedResponses = response.feeds;
+
+    const feeds = feedResponses.map((feedResponse) =>
       this.getOrCreateActiveFeed(
         feedResponse.group_id,
         feedResponse.id,
@@ -551,6 +640,8 @@ export class FeedsClient extends FeedsApi {
       ),
     );
 
+    this.hydrateCapabilitiesCache(feedResponses);
+
     return {
       feeds,
       next: response.next,
@@ -560,6 +651,18 @@ export class FeedsClient extends FeedsApi {
     };
   }
 
+  async ownCapabilitiesBatch(request: OwnCapabilitiesBatchRequest) {
+    const response = await super.ownCapabilitiesBatch(request);
+    const feedResponses = Object.entries(response.capabilities).map(
+      ([feed, own_capabilities]) => ({
+        feed,
+        own_capabilities,
+      }),
+    );
+    this.hydrateCapabilitiesCache(feedResponses);
+    return response;
+  }
+
   updateNetworkConnectionStatus = (
     event: { type: 'online' | 'offline' } | Event,
   ) => {

package/src/utils/throttling/index.ts

@@ -0,0 +1,2 @@
+export * from './throttle';
+export * from './throttled-get-batched-own-capabilities'

package/src/utils/throttling/throttle.ts

@@ -0,0 +1,123 @@
+export type ThrottledCallback = (...args: unknown[]) => unknown;
+
+export type ThrottledFunction<T extends unknown[]> = (...args: T) => void;
+
+/**
+ * Throttle a function so it runs at most once per `timeout` ms.
+ *
+ * - `leading`: fire immediately when the window opens
+ * - `trailing`: remember the latest args/this and fire once when the window closes
+ *
+ * defaults: `{ leading: true, trailing: false }`
+ *
+ * notes:
+ * - make one throttled instance and reuse it; re-creating it resets internal state
+ *
+ * @typeParam T - the function type being throttled
+ * @param fn - function to throttle
+ * @param timeout - minimum time between invocations (ms)
+ * @param options - behavior switches
+ * @param options.leading - call on the leading edge (default: true)
+ * @param options.trailing - call once at the end of the window with the latest args (default: false)
+ * @returns a throttled function with the same call signature as `fn`
+ *
+ * @example
+ * const send = (payload: Data) => api.post('/endpoint', payload);
+ * const sendThrottled = throttle(send, 2000, { leading: true, trailing: true });
+ * // call `sendThrottled` freely; it won’t invoke `send` more than once every 2s
+ */
+export const throttle = <T extends unknown[]>(
+  fn: (...args: T) => void,
+  timeout = 200,
+  {
+    leading = true,
+    trailing = false,
+  }: { leading?: boolean; trailing?: boolean } = {},
+) => {
+  let timer: NodeJS.Timeout | null = null;
+  let storedArgs: T | null = null;
+  let storedThis: unknown = null;
+  let lastInvokeTime: number | undefined; // timestamp of last actual invocation
+
+  const invoke = (args: T, thisArg: unknown) => {
+    lastInvokeTime = Date.now();
+    fn.apply(thisArg, args);
+  };
+
+  const scheduleTrailing = (delay: number) => {
+    if (timer) return;
+    timer = setTimeout(() => {
+      timer = null;
+      if (trailing && storedArgs) {
+        invoke(storedArgs, storedThis);
+        storedArgs = null;
+        storedThis = null;
+      }
+    }, delay);
+  };
+
+  return {
+    throttledFn: function (this: unknown, ...args: T) {
+      const now = Date.now();
+
+      const hasBeenInvoked = lastInvokeTime != null;
+
+      // if we have never invoked and `leading` is `false`, treat `lastInvokeTime` as now
+      if (!hasBeenInvoked && !leading) lastInvokeTime = now;
+
+      const timeSinceLast = hasBeenInvoked ? now - lastInvokeTime! : timeout;
+      const remaining = timeout - timeSinceLast;
+
+      // capture latest args for possible trailing invocation
+      if (trailing) {
+        storedArgs = args;
+        // eslint-disable-next-line @typescript-eslint/no-this-alias
+        storedThis = this;
+      }
+
+      // if enough time has passed, invoke immediately
+      if (remaining <= 0) {
+        // if there's a pending timer, clear it because we're invoking now
+        if (timer) {
+          clearTimeout(timer);
+          timer = null;
+        }
+
+        // leading: call now
+        if (leading) {
+          // if trailing is also `true`, we've already stored args above;
+          // make sure we don't call the same args twice
+          if (trailing) {
+            // if the `storedArgs` are exactly the args we're about to call,
+            // clear storedArgs to avoid double invocation by trailing (comparing
+            // by reference is fine because the `args` array is new each call)
+            if (storedArgs === args) {
+              storedArgs = null;
+              storedThis = null;
+            }
+          }
+          invoke(args, this);
+        } else {
+          // not leading but trailing: schedule a trailing call after `timeout`
+          if (trailing) scheduleTrailing(timeout);
+        }
+
+        return;
+      }
+
+      // not enough time passed: we're in cooldown, so if
+      // trailing is requested, ensure a trailing invocation
+      // is scheduled at the end of the remaining time
+      if (trailing && !timer) {
+        scheduleTrailing(remaining);
+      }
+      // if `trailing` is `false`, we simply drop the call (throttle)
+    },
+    cancelTimer: () => {
+      if (timer) {
+        clearTimeout(timer);
+        timer = null;
+      }
+    },
+  };
+};

package/src/utils/throttling/throttled-get-batched-own-capabilities.ts

@@ -0,0 +1,42 @@
+import type { FeedsClient } from '@self';
+import type { ThrottledFunction } from './throttle';
+
+export type GetBatchedOwnCapabilities = {
+  feeds: string[];
+};
+
+export type GetBatchedOwnCapabilitiesThrottledCallback = [
+  feeds: string[],
+  callback: (feedsToClear: string[]) => void | Promise<void>,
+];
+
+export type ThrottledGetBatchedOwnCapabilities =
+  ThrottledFunction<GetBatchedOwnCapabilitiesThrottledCallback>;
+
+export const DEFAULT_BATCH_OWN_CAPABILITIES_THROTTLING_INTERVAL = 2000;
+
+const queuedFeeds: Set<string> = new Set();
+
+export function queueBatchedOwnCapabilities(
+  this: FeedsClient,
+  { feeds }: GetBatchedOwnCapabilities,
+) {
+  for (const feed of feeds) {
+    queuedFeeds.add(feed);
+  }
+
+  if (queuedFeeds.size > 0) {
+    this.throttledGetBatchOwnCapabilities(
+      [...queuedFeeds],
+      (feedsToClear: string[]) => {
+        for (const feed of feedsToClear) {
+          queuedFeeds.delete(feed);
+        }
+      },
+    );
+  }
+}
+
+export function clearQueuedFeeds() {
+  queuedFeeds.clear();
+}