@stream-io/feeds-client 0.1.4 → 0.1.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stream-io/feeds-client",
-  "version": "0.1.4",
+  "version": "0.1.5",
   "packageManager": "yarn@3.2.4",
   "main": "./dist/index.node.js",
   "exports": {
@@ -61,6 +61,7 @@
   "devDependencies": {
     "@rollup/plugin-replace": "^6.0.1",
     "@rollup/plugin-typescript": "^12.1.0",
+    "@stream-io/node-sdk": "https://github.com/GetStream/stream-node.git#feeds-api",
     "@types/react": "^19.1.8",
     "dotenv": "^16.4.5",
     "react": "19.0.0",

package/src/Feed.ts

@@ -14,6 +14,8 @@ import {
   BookmarkAddedEvent,
   BookmarkDeletedEvent,
   BookmarkUpdatedEvent,
+  QueryFeedMembersRequest,
+  SortParamRequest,
 } from './gen/models';
 import { Patch, StateStore } from './common/StateStore';
 import { EventDispatcher } from './common/EventDispatcher';
@@ -43,6 +45,7 @@ import type {
   PagerResponseWithLoadingStates,
 } from './types';
 import type { FromArray } from './types-internal';
+import { checkHasAnotherPage, Constants } from './utils';
 
 export type FeedState = Omit<
   Partial<GetOrCreateFeedResponse & FeedResponse>,
@@ -103,16 +106,15 @@ export type FeedState = Omit<
     | undefined
   >;
 
-  followers_pagination?: LoadingStates & { sort?: string };
+  followers_pagination?: LoadingStates & { sort?: SortParamRequest[] };
 
-  following_pagination?: LoadingStates & { sort?: string };
+  following_pagination?: LoadingStates & { sort?: SortParamRequest[] };
+
+  member_pagination?: LoadingStates & { sort?: SortParamRequest[] };
 
   last_get_or_create_request_config?: GetOrCreateFeedRequest;
 };
 
-const END_OF_LIST = 'eol' as const;
-const DEFAULT_COMMENT_PAGINATION = 'first' as const;
-
 type EventHandlerByEventType = {
   [Key in NonNullable<WSEvent['type']>]: Key extends Extract<
     WSEvent,
@@ -221,7 +223,10 @@ export class Feed extends FeedApi {
 
         if (
           entityState?.pagination?.sort === 'last' &&
-          entityState?.pagination.next === END_OF_LIST
+          !checkHasAnotherPage(
+            entityState.comments,
+            entityState?.pagination.next,
+          )
         ) {
           newComments.unshift(comment);
         } else if (entityState?.pagination?.sort === 'first') {
@@ -320,7 +325,12 @@ export class Feed extends FeedApi {
             ...event.follow.source_feed,
           };
 
-          if (currentState.following_pagination?.next === END_OF_LIST) {
+          if (
+            !checkHasAnotherPage(
+              currentState.following,
+              currentState.following_pagination?.next,
+            )
+          ) {
             // TODO: respect sort
             newState.following = currentState.following
               ? currentState.following.concat(event.follow)
@@ -345,7 +355,12 @@ export class Feed extends FeedApi {
               : [event.follow];
           }
 
-          if (currentState.followers_pagination?.next === END_OF_LIST) {
+          if (
+            !checkHasAnotherPage(
+              currentState.followers,
+              currentState.followers_pagination?.next,
+            )
+          ) {
             // TODO: respect sort
             newState.followers = currentState.followers
               ? currentState.followers.concat(event.follow)
@@ -400,49 +415,87 @@ export class Feed extends FeedApi {
       this.handleCommentReactionEvent.bind(this),
     'feeds.comment.reaction.updated': Feed.noop,
     'feeds.feed_member.added': (event) => {
-      const { member } = event;
-
-      // do not add a member if the pagination has reached the end of the list
-      if (this.currentState.member_pagination?.next !== END_OF_LIST) return;
+      const { connectedUser } = this.client.state.getLatestValue();
 
       this.state.next((currentState) => {
-        return {
-          ...currentState,
-          // TODO: respect sort
-          members: currentState.members
-            ? currentState.members.concat(member)
-            : [member],
-        };
+        let newState: FeedState | undefined;
+
+        if (
+          !checkHasAnotherPage(
+            currentState.members,
+            currentState.member_pagination?.next,
+          )
+        ) {
+          newState ??= {
+            ...currentState,
+          };
+
+          newState.members = newState.members?.concat(event.member) ?? [
+            event.member,
+          ];
+        }
+
+        if (connectedUser?.id === event.member.user.id) {
+          newState ??= {
+            ...currentState,
+          };
+
+          newState.own_membership = event.member;
+        }
+
+        return newState ?? currentState;
       });
     },
     'feeds.feed_member.removed': (event) => {
+      const { connectedUser } = this.client.state.getLatestValue();
+
       this.state.next((currentState) => {
-        return {
+        const newState = {
           ...currentState,
           members: currentState.members?.filter(
             (member) => member.user.id !== event.user?.id,
           ),
         };
+
+        if (connectedUser?.id === event.member_id) {
+          delete newState.own_membership;
+        }
+
+        return newState;
       });
     },
     'feeds.feed_member.updated': (event) => {
+      const { connectedUser } = this.client.state.getLatestValue();
+
       this.state.next((currentState) => {
         const memberIndex =
           currentState.members?.findIndex(
             (member) => member.user.id === event.member.user.id,
           ) ?? -1;
 
+        let newState: FeedState | undefined;
+
         if (memberIndex !== -1) {
+          // if there's an index, there's a member to update
           const newMembers = [...currentState.members!];
           newMembers[memberIndex] = event.member;
 
-          return {
+          newState ??= {
+            ...currentState,
+          };
+
+          newState.members = newMembers;
+        }
+
+        if (connectedUser?.id === event.member.user.id) {
+          newState ??= {
             ...currentState,
-            members: newMembers,
           };
+
+          newState.own_membership = event.member;
         }
 
-        return currentState;
+        return newState ?? currentState;
       });
     },
     // the poll events should be removed from here
@@ -614,38 +667,6 @@ export class Feed extends FeedApi {
             ...responseCopy,
           };
 
-          // if there is no next cursor, set it to END_OF_LIST
-          // request has to have a limit set for this to work
-          if (
-            (request?.followers_pagination?.limit ?? 0) > 0 &&
-            typeof nextState.followers_pagination?.next === 'undefined'
-          ) {
-            nextState.followers_pagination = {
-              ...nextState.followers_pagination,
-              next: END_OF_LIST,
-            };
-          }
-
-          if (
-            (request?.following_pagination?.limit ?? 0) > 0 &&
-            typeof nextState.following_pagination?.next === 'undefined'
-          ) {
-            nextState.following_pagination = {
-              ...nextState.following_pagination,
-              next: END_OF_LIST,
-            };
-          }
-
-          if (
-            (request?.member_pagination?.limit ?? 0) > 0 &&
-            typeof nextState.member_pagination?.next === 'undefined'
-          ) {
-            nextState.member_pagination = {
-              ...nextState.member_pagination,
-              next: END_OF_LIST,
-            };
-          }
-
           if (!request?.followers_pagination?.limit) {
             delete nextState.followers;
           }
@@ -796,6 +817,8 @@ export class Feed extends FeedApi {
     sort: string;
     base: () => Promise<PagerResponse & { comments: CommentResponse[] }>;
   }) {
+    let error: unknown;
+
     try {
       this.state.next((currentState) => ({
         ...currentState,
@@ -811,7 +834,7 @@ export class Feed extends FeedApi {
         },
       }));
 
-      const { next: newNextCursor = END_OF_LIST, comments } = await base();
+      const { next: newNextCursor, comments } = await base();
 
       this.state.next((currentState) => {
         const newPagination = {
@@ -840,9 +863,8 @@ export class Feed extends FeedApi {
           },
         };
       });
-    } catch (error) {
-      console.error(error);
-      // TODO: figure out how to handle errorss
+    } catch (e) {
+      error = e;
     } finally {
       this.state.next((currentState) => ({
         ...currentState,
@@ -858,6 +880,10 @@ export class Feed extends FeedApi {
         },
       }));
     }
+
+    if (error) {
+      throw error;
+    }
   }
 
   public async loadNextPageActivityComments(
@@ -866,15 +892,22 @@ export class Feed extends FeedApi {
       Omit<GetCommentsRequest, 'object_id' | 'object_type' | 'next'>
     >,
   ) {
-    const pagination =
-      this.currentState.comments_by_entity_id[activity.id]?.pagination;
-    const currentNextCursor = pagination?.next;
-    const currentSort = pagination?.sort;
-    const isLoading = pagination?.loading_next_page;
-
-    const sort = currentSort ?? request?.sort ?? DEFAULT_COMMENT_PAGINATION;
-
-    if (isLoading || currentNextCursor === END_OF_LIST) return;
+    const currentEntityState =
+      this.currentState.comments_by_entity_id[activity.id];
+    const currentPagination = currentEntityState?.pagination;
+    const currentNextCursor = currentPagination?.next;
+    const currentSort = currentPagination?.sort;
+    const isLoading = currentPagination?.loading_next_page;
+
+    const sort =
+      currentSort ?? request?.sort ?? Constants.DEFAULT_COMMENT_PAGINATION;
+
+    if (
+      isLoading ||
+      !checkHasAnotherPage(currentEntityState?.comments, currentNextCursor)
+    ) {
+      return;
+    }
 
     await this.loadNextPageComments({
       forId: activity.id,
@@ -894,15 +927,22 @@ export class Feed extends FeedApi {
     comment: CommentResponse,
     request?: Partial<Omit<GetCommentsRepliesRequest, 'comment_id' | 'next'>>,
   ) {
-    const pagination =
-      this.currentState.comments_by_entity_id[comment.id]?.pagination;
-    const currentNextCursor = pagination?.next;
-    const currentSort = pagination?.sort;
-    const isLoading = pagination?.loading_next_page;
-
-    const sort = currentSort ?? request?.sort ?? DEFAULT_COMMENT_PAGINATION;
-
-    if (isLoading || currentNextCursor === END_OF_LIST) return;
+    const currentEntityState =
+      this.currentState.comments_by_entity_id[comment.id];
+    const currentPagination = currentEntityState?.pagination;
+    const currentNextCursor = currentPagination?.next;
+    const currentSort = currentPagination?.sort;
+    const isLoading = currentPagination?.loading_next_page;
+
+    const sort =
+      currentSort ?? request?.sort ?? Constants.DEFAULT_COMMENT_PAGINATION;
+
+    if (
+      isLoading ||
+      !checkHasAnotherPage(currentEntityState?.comments, currentNextCursor)
+    ) {
+      return;
+    }
 
     await this.loadNextPageComments({
       forId: comment.id,
@@ -911,7 +951,10 @@ export class Feed extends FeedApi {
           ...request,
           comment_id: comment.id,
           // use known sort first (prevents broken pagination)
-          sort: currentSort ?? request?.sort ?? DEFAULT_COMMENT_PAGINATION,
+          sort:
+            currentSort ??
+            request?.sort ??
+            Constants.DEFAULT_COMMENT_PAGINATION,
           next: currentNextCursor,
         }),
       parentId: comment.parent_id ?? comment.object_id,
@@ -921,15 +964,20 @@ export class Feed extends FeedApi {
 
   private async loadNextPageFollows(
     type: 'followers' | 'following',
-    request: Pick<QueryFollowsRequest, 'limit'>,
+    request: Pick<QueryFollowsRequest, 'limit' | 'sort'>,
   ) {
     const paginationKey = `${type}_pagination` as const;
     const method = `query${capitalize(type)}` as const;
 
+    const currentFollows = this.currentState[type];
     const currentNextCursor = this.currentState[paginationKey]?.next;
     const isLoading = this.currentState[paginationKey]?.loading_next_page;
+    const sort = this.currentState[paginationKey]?.sort ?? request.sort;
+    let error: unknown;
 
-    if (isLoading || currentNextCursor === END_OF_LIST) return;
+    if (isLoading || !checkHasAnotherPage(currentFollows, currentNextCursor)) {
+      return;
+    }
 
     try {
       this.state.next((currentState) => {
@@ -942,12 +990,11 @@ export class Feed extends FeedApi {
         };
       });
 
-      const { next: newNextCursor = END_OF_LIST, follows } = await this[method](
-        {
-          ...request,
-          next: currentNextCursor,
-        },
-      );
+      const { next: newNextCursor, follows } = await this[method]({
+        ...request,
+        next: currentNextCursor,
+        sort,
+      });
 
       this.state.next((currentState) => ({
         ...currentState,
@@ -957,11 +1004,11 @@ export class Feed extends FeedApi {
         [paginationKey]: {
           ...currentState[paginationKey],
           next: newNextCursor,
+          sort,
         },
       }));
-    } catch (error) {
-      console.error(error);
-      // TODO: figure out how to handle errorss
+    } catch (e) {
+      error = e;
     } finally {
       this.state.next((currentState) => {
         return {
@@ -973,6 +1020,10 @@ export class Feed extends FeedApi {
         };
       });
     }
+
+    if (error) {
+      throw error;
+    }
   }
 
   async loadNextPageFollowers(request: Pick<QueryFollowsRequest, 'limit'>) {
@@ -983,6 +1034,66 @@ export class Feed extends FeedApi {
     await this.loadNextPageFollows('following', request);
   }
 
+  async loadNextPageMembers(
+    request: Omit<QueryFeedMembersRequest, 'next' | 'prev'>,
+  ) {
+    const currentMembers = this.currentState.members;
+    const currentNextCursor = this.currentState.member_pagination?.next;
+    const isLoading = this.currentState.member_pagination?.loading_next_page;
+    const sort = this.currentState.member_pagination?.sort ?? request.sort;
+    let error: unknown;
+
+    if (isLoading || !checkHasAnotherPage(currentMembers, currentNextCursor)) {
+      return;
+    }
+
+    try {
+      this.state.next((currentState) => ({
+        ...currentState,
+        member_pagination: {
+          ...currentState.member_pagination,
+          loading_next_page: true,
+        },
+      }));
+
+      const { next: newNextCursor, members } =
+        await this.client.queryFeedMembers({
+          ...request,
+          sort,
+          feed_id: this.id,
+          feed_group_id: this.group,
+          next: currentNextCursor,
+        });
+
+      this.state.next((currentState) => ({
+        ...currentState,
+        members: currentState.members
+          ? currentState.members.concat(members)
+          : members,
+        member_pagination: {
+          ...currentState.member_pagination,
+          next: newNextCursor,
+          // set sort if not defined yet
+          sort: currentState.member_pagination?.sort ?? request.sort,
+        },
+      }));
+    } catch (e) {
+      error = e;
+    } finally {
+      this.state.next((currentState) => ({
+        ...currentState,
+        member_pagination: {
+          ...currentState.member_pagination,
+          loading_next_page: false,
+        },
+      }));
+    }
+
+    if (error) {
+      throw error;
+    }
+  }
+
   /**
    * Method which queries followers of this feed (feeds which target this feed).
    *

package/src/FeedsClient.ts

@@ -12,7 +12,7 @@ import {
   UserRequest,
   WSEvent,
 } from './gen/models';
-import { FeedsEvent, TokenOrProvider } from './types';
+import { FeedsEvent, StreamFile, TokenOrProvider } from './types';
 import { StateStore } from './common/StateStore';
 import { TokenManager } from './common/TokenManager';
 import { ConnectionIdManager } from './common/ConnectionIdManager';
@@ -22,6 +22,7 @@ import { ApiClient } from './common/ApiClient';
 import {
   addConnectionEventListeners,
   removeConnectionEventListeners,
+  streamDevToken,
 } from './common/utils';
 import { decodeWSEvent } from './gen/model-decoders/event-decoder-mapping';
 import { Feed } from './Feed';
@@ -243,6 +244,10 @@ export class FeedsClient extends FeedsApi {
     }
   };
 
+  devToken = (userId: string) => {
+    return streamDevToken(userId);
+  };
+
   closePoll = async (request: {
     poll_id: string;
   }): Promise<StreamResponse<PollResponse>> => {
@@ -255,7 +260,7 @@ export class FeedsClient extends FeedsApi {
   };
 
   // @ts-expect-error API spec says file should be a string
-  uploadFile = (request: Omit<FileUploadRequest, 'file'> & { file: File }) => {
+  uploadFile = (request: Omit<FileUploadRequest, 'file'> & { file: StreamFile }) => {
     return super.uploadFile({
       // @ts-expect-error API spec says file should be a string
       file: request.file,
@@ -264,7 +269,7 @@ export class FeedsClient extends FeedsApi {
 
   // @ts-expect-error API spec says file should be a string
   uploadImage = (
-    request: Omit<ImageUploadRequest, 'file'> & { file: File },
+    request: Omit<ImageUploadRequest, 'file'> & { file: StreamFile },
   ) => {
     return super.uploadImage({
       // @ts-expect-error API spec says file should be a string

package/src/common/real-time/StableWSConnection.ts

@@ -487,7 +487,10 @@ export class StableWSConnection {
   onmessage = (wsID: number, event: MessageEvent) => {
     if (this.wsID !== wsID) return;
 
-    this._log('onmessage() - onmessage callback', { event, wsID });
+    this._log('onmessage() - onmessage callback', {
+      event: { ...event, data: JSON.parse(event.data) },
+      wsID,
+    });
     let data = typeof event.data === 'string' ? JSON.parse(event.data) : null;
     this.decoders.forEach((decode) => {
       data = decode(data);

package/src/types.ts

@@ -1,6 +1,13 @@
 import { ConnectionChangedEvent } from './common/real-time/event-models';
 import { NetworkChangedEvent } from './common/types';
-import { PagerResponse, WSEvent } from './gen/models';
+import {
+  PagerResponse,
+  WSEvent,
+} from './gen/models';
+import type {
+  ActivityResponse,
+  CommentResponse,
+} from './gen/models';
 import { FeedsClient } from './FeedsClient';
 
 export type FeedsEvent = WSEvent | ConnectionChangedEvent | NetworkChangedEvent;
@@ -22,3 +29,7 @@ export type LoadingStates = {
 export type TokenOrProvider = string | TokenProvider;
 
 export type TokenProvider = () => Promise<string>;
+
+export type StreamFile = File | { name: string, uri: string, type: string }
+
+export type CommentParent = ActivityResponse | CommentResponse;

package/src/utils.ts

@@ -1,4 +1,28 @@
-export const isImageFile = (file: File) => {
+import { CommentParent, StreamFile } from './types';
+import type { CommentResponse } from './gen/models';
+
+export const isImageFile = (file: StreamFile) => {
   // photoshop files begin with 'image/'
   return file.type.startsWith('image/') && !file.type.endsWith('.photoshop');
 };
+
+export const isVideoFile = (file: StreamFile) => {
+  return file.type.startsWith('video/');
+};
+
+export const checkHasAnotherPage = <T extends unknown | undefined>(
+  v: T,
+  cursor: string | undefined,
+) =>
+  (typeof v === 'undefined' && typeof cursor === 'undefined') ||
+  typeof cursor === 'string';
+
+export const isCommentResponse = (
+  entity: CommentParent,
+): entity is CommentResponse => {
+  return typeof (entity as CommentResponse)?.object_id === 'string';
+};
+
+export const Constants = {
+  DEFAULT_COMMENT_PAGINATION: 'first',
+} as const;

package/dist/@react-bindings/hooks/clientStateHooks.d.ts

@@ -1,10 +0,0 @@
-/**
- * A React hook that returns the currently connected user on a `FeedsClient` instance and null otherwise.
- */
-export declare const useClientConnectedUser: () => import("../..").OwnUser | undefined;
-/**
- * A React hook that returns the websocket connection state of `FeedsClient`.
- */
-export declare const useWsConnectionState: () => {
-    isHealthy: boolean | undefined;
-};

package/dist/@react-bindings/hooks/useComments.d.ts

@@ -1,12 +0,0 @@
-import type { ActivityResponse, CommentResponse } from '../../src/gen/models';
-import type { Feed } from '../../src/Feed';
-export declare const useComments: (feed: Feed, 
-/**
- * The parent (activity or comment) for which to fetch comments.
- */
-parent: ActivityResponse | CommentResponse) => {
-    comments: CommentResponse[];
-    comment_pagination: (import("../../src/gen/models").PagerResponse & import("../..").LoadingStates & {
-        sort?: string;
-    }) | undefined;
-};