@stream-io/feeds-client 0.2.9 → 0.2.10

package/src/feed/event-handlers/comment/{handle-comment-reaction.test.ts → handle-comment-reaction-added.test.ts}

@@ -1,18 +1,23 @@
 import { describe, it, expect, beforeEach } from 'vitest';
 import { Feed } from '../../../feed';
 import { FeedsClient } from '../../../feeds-client';
-import { handleCommentReaction } from './handle-comment-reaction';
+import { handleCommentReactionAdded } from './handle-comment-reaction-added';
 import {
   generateCommentResponse,
-  generateFeedReactionResponse,
   generateFeedResponse,
   generateOwnUser,
   getHumanId,
   generateCommentReactionAddedEvent,
-  generateCommentReactionDeletedEvent,
-} from '../../../test-utils/response-generators';
+  generateFeedReactionResponse,
+} from '../../../test-utils';
+import {
+  CommentResponse,
+  FeedsReactionResponse,
+} from '../../../gen/models';
+import { shouldUpdateState } from '../../../utils'
+import { EventPayload } from '../../../types-internal';
 
-describe(handleCommentReaction.name, () => {
+describe(handleCommentReactionAdded.name, () => {
   let feed: Feed;
   let client: FeedsClient;
   let currentUserId: string;
@@ -75,7 +80,7 @@ describe(handleCommentReaction.name, () => {
         ?.own_reactions,
     ).toHaveLength(0);
 
-    handleCommentReaction.call(feed, event);
+    handleCommentReactionAdded.call(feed, event);
 
     const stateAfter = feed.currentState;
     const [updated] = stateAfter.comments_by_entity_id[activityId]!.comments!;
@@ -117,7 +122,7 @@ describe(handleCommentReaction.name, () => {
       },
     });
 
-    handleCommentReaction.call(feed, event);
+    handleCommentReactionAdded.call(feed, event);
     const stateAfter = feed.currentState;
     const [updated] = stateAfter.comments_by_entity_id[activityId]!.comments!;
     expect(updated.own_reactions).toHaveLength(0);
@@ -125,101 +130,6 @@ describe(handleCommentReaction.name, () => {
     expect(updated.reaction_groups).toBe(event.comment.reaction_groups);
   });
 
-  it('removes from own_reactions when the target reaction belongs to the current user', () => {
-    const commentId = `comment-${getHumanId()}`;
-    const existingReaction = generateFeedReactionResponse({
-      type: 'heart',
-      user: { id: currentUserId },
-      activity_id: activityId,
-      comment_id: commentId,
-    });
-    const existingComment = generateCommentResponse({
-      id: commentId,
-      object_id: activityId,
-      own_reactions: [existingReaction],
-      latest_reactions: [],
-      reaction_groups: {},
-    });
-    feed.state.partialNext({
-      comments_by_entity_id: {
-        [activityId]: {
-          comments: [existingComment],
-          pagination: { sort: 'first' },
-        },
-      },
-    });
-
-    const event = generateCommentReactionDeletedEvent({
-      comment: {
-        ...existingComment,
-        latest_reactions: [],
-        reaction_groups: {},
-      },
-      reaction: {
-        type: 'heart',
-        user: { id: currentUserId },
-        activity_id: activityId,
-      },
-    });
-
-    const stateBefore = feed.currentState;
-    expect(
-      stateBefore.comments_by_entity_id[activityId]!.comments![0].own_reactions,
-    ).toHaveLength(1);
-    handleCommentReaction.call(feed, event);
-    const stateAfter = feed.currentState;
-    const [updated] = stateAfter.comments_by_entity_id[activityId]!.comments!;
-    expect(updated.own_reactions).toHaveLength(0);
-    expect(updated.latest_reactions).toBe(event.comment.latest_reactions);
-    expect(updated.reaction_groups).toBe(event.comment.reaction_groups);
-  });
-
-  it('does not remove from own_reactions when target reaction does not belong to the current user', () => {
-    const commentId = `comment-${getHumanId()}`;
-    const ownReaction = generateFeedReactionResponse({
-      type: 'wow',
-      user: { id: currentUserId },
-      activity_id: activityId,
-      comment_id: commentId,
-    });
-    const existingComment = generateCommentResponse({
-      id: commentId,
-      object_id: activityId,
-      own_reactions: [ownReaction],
-      latest_reactions: [],
-      reaction_groups: {},
-    });
-    feed.state.partialNext({
-      comments_by_entity_id: {
-        [activityId]: {
-          comments: [existingComment],
-          pagination: { sort: 'first' },
-        },
-      },
-    });
-
-    const event = generateCommentReactionDeletedEvent({
-      comment: {
-        ...existingComment,
-        latest_reactions: [],
-        reaction_groups: {},
-      },
-      reaction: {
-        type: 'wow',
-        user: { id: 'other-user' },
-        comment_id: existingComment.id,
-      },
-    });
-
-    handleCommentReaction.call(feed, event);
-    const stateAfter = feed.currentState;
-    const [updated] = stateAfter.comments_by_entity_id[activityId]!.comments!;
-    expect(updated.own_reactions).toHaveLength(1);
-    expect(updated.own_reactions[0]).toBe(ownReaction);
-    expect(updated.latest_reactions).toBe(event.comment.latest_reactions);
-    expect(updated.reaction_groups).toBe(event.comment.reaction_groups);
-  });
-
   it('does changes to the proper entity state (prefers parent_id)', () => {
     const parentId = `comment-${getHumanId()}`;
     const existingComment = generateCommentResponse({
@@ -254,43 +164,18 @@ describe(handleCommentReaction.name, () => {
       },
     });
 
-    const deletedEvent = generateCommentReactionDeletedEvent({
-      comment: {
-        id: existingComment.id,
-        object_id: activityId,
-        parent_id: parentId,
-        latest_reactions: [],
-        reaction_groups: {},
-      },
-      reaction: {
-        type: 'like',
-        user: { id: currentUserId },
-        activity_id: activityId,
-        comment_id: existingComment.id,
-      },
-    });
-
     const stateBefore = feed.currentState;
     expect(
       stateBefore.comments_by_entity_id[parentId]?.comments?.[0]?.own_reactions,
     ).toHaveLength(0);
 
-    handleCommentReaction.call(feed, addedEvent);
+    handleCommentReactionAdded.call(feed, addedEvent);
     const stateAfter1 = feed.currentState;
     const [updated1] = stateAfter1.comments_by_entity_id[parentId]!.comments!;
     expect(updated1.own_reactions).toHaveLength(1);
     expect(updated1.own_reactions[0]).toBe(addedEvent.reaction);
     expect(updated1.latest_reactions).toBe(addedEvent.comment.latest_reactions);
     expect(updated1.reaction_groups).toBe(addedEvent.comment.reaction_groups);
-
-    handleCommentReaction.call(feed, deletedEvent);
-    const stateAfter2 = feed.currentState;
-    const [updated2] = stateAfter2.comments_by_entity_id[parentId]!.comments!;
-    expect(updated2.own_reactions).toHaveLength(0);
-    expect(updated2.latest_reactions).toBe(
-      deletedEvent.comment.latest_reactions,
-    );
-    expect(updated2.reaction_groups).toBe(deletedEvent.comment.reaction_groups);
   });
 
   it('does nothing if comment is not found in state', () => {
@@ -298,18 +183,147 @@ describe(handleCommentReaction.name, () => {
       comment: { object_id: activityId },
       reaction: { user: { id: currentUserId } },
     });
-    const deletedEvent = generateCommentReactionDeletedEvent({
-      comment: { object_id: activityId },
-      reaction: { user: { id: currentUserId } },
-    });
     const stateBefore = feed.currentState;
 
-    handleCommentReaction.call(feed, addedEvent);
-    const stateAfter1 = feed.currentState;
-    expect(stateAfter1).toBe(stateBefore);
+    handleCommentReactionAdded.call(feed, addedEvent);
+    const stateAfter = feed.currentState;
+    expect(stateAfter).toBe(stateBefore);
+  });
+
+  describe(`Comment reaction added ${shouldUpdateState.name} integration`, () => {
+    let currentUserPayload: EventPayload<'feeds.comment.reaction.added'>;
+    let existingComment: CommentResponse;
+    let existingReaction: FeedsReactionResponse;
+    let newReaction: FeedsReactionResponse;
+    let commentId: string;
 
-    handleCommentReaction.call(feed, deletedEvent);
-    const stateAfter2 = feed.currentState;
-    expect(stateAfter2).toBe(stateBefore);
+    beforeEach(() => {
+      commentId = `comment-${getHumanId()}`;
+      existingReaction = generateFeedReactionResponse({
+        type: 'heart',
+        user: { id: currentUserId },
+        activity_id: activityId,
+        comment_id: commentId,
+      });
+      newReaction = generateFeedReactionResponse({
+        type: 'like',
+        user: { id: currentUserId },
+        activity_id: activityId,
+        comment_id: commentId,
+      });
+      existingComment = generateCommentResponse({
+        id: commentId,
+        object_id: activityId,
+        own_reactions: [existingReaction],
+      });
+
+      currentUserPayload = generateCommentReactionAddedEvent({
+        comment: existingComment,
+        reaction: newReaction,
+      });
+
+      feed.state.partialNext({
+        comments_by_entity_id: {
+          [activityId]: {
+            comments: [existingComment],
+            pagination: { sort: 'first' },
+          },
+        },
+      });
+      feed.state.partialNext({ watch: true });
+    });
+
+    it(`skips update if ${shouldUpdateState.name} returns false`, () => {
+      // 1. HTTP and then WS
+
+      handleCommentReactionAdded.call(feed, currentUserPayload, false);
+
+      let stateBefore = feed.currentState;
+
+      handleCommentReactionAdded.call(feed, currentUserPayload);
+
+      let stateAfter = feed.currentState;
+
+      expect(stateAfter).toBe(stateBefore);
+      // @ts-expect-error Using Feed internals for tests only
+      expect(feed.stateUpdateQueue.size).toEqual(0);
+
+      // 2. WS and the HTTP
+
+      handleCommentReactionAdded.call(feed, currentUserPayload);
+
+      stateBefore = feed.currentState;
+
+      handleCommentReactionAdded.call(feed, currentUserPayload, false);
+
+      stateAfter = feed.currentState;
+
+      expect(stateAfter).toBe(stateBefore);
+      // @ts-expect-error Using Feed internals for tests only
+      expect(feed.stateUpdateQueue.size).toEqual(0);
+    });
+
+    it('allows update again from WS after clearing the stateUpdateQueue', () => {
+      handleCommentReactionAdded.call(feed, currentUserPayload);
+
+      // Clear the queue
+      (feed as any).stateUpdateQueue.clear();
+
+      // Now update should be allowed from another WS event
+      handleCommentReactionAdded.call(feed, currentUserPayload);
+
+      const comments =
+        feed.currentState.comments_by_entity_id[activityId]?.comments;
+      const comment = comments?.find((a) => a.id === commentId);
+      const [latestReaction] = (comment?.own_reactions ?? []).toReversed();
+
+      expect(comment?.own_reactions.length).toEqual(3);
+      expect(latestReaction).toMatchObject(newReaction);
+    });
+
+    it('allows update again from HTTP response after clearing the stateUpdateQueue', () => {
+      handleCommentReactionAdded.call(feed, currentUserPayload, false);
+
+      // Clear the queue
+      (feed as any).stateUpdateQueue.clear();
+
+      // Now update should be allowed from another HTTP response
+      handleCommentReactionAdded.call(feed, currentUserPayload, false);
+
+      const comments =
+        feed.currentState.comments_by_entity_id[activityId]?.comments;
+      const comment = comments?.find((a) => a.id === commentId);
+      const [latestReaction] = (comment?.own_reactions ?? []).toReversed();
+
+      expect(comment?.own_reactions.length).toEqual(3);
+      expect(latestReaction).toMatchObject(newReaction);
+    });
+
+    it('should not insert anything into the stateUpdateQueue if the connected_user did not trigger the comment reaction deletion', () => {
+      const otherUserPayload = generateCommentReactionAddedEvent({
+        comment: existingComment,
+        reaction: {
+          ...existingReaction,
+          user: {
+            id: getHumanId(),
+          },
+        },
+      });
+
+      handleCommentReactionAdded.call(feed, otherUserPayload);
+
+      expect((feed as any).stateUpdateQueue).toEqual(new Set());
+
+      handleCommentReactionAdded.call(feed, otherUserPayload);
+
+      const comments =
+        feed.currentState.comments_by_entity_id[activityId]?.comments;
+      const comment = comments?.find((a) => a.id === commentId);
+      const [latestReaction] = comment?.own_reactions ?? [];
+
+      expect((feed as any).stateUpdateQueue).toEqual(new Set());
+      expect(comment?.own_reactions.length).toEqual(1);
+      expect(latestReaction).toMatchObject(existingReaction);
+    });
   });
 });

package/src/feed/event-handlers/comment/handle-comment-reaction-added.ts

@@ -0,0 +1,72 @@
+import { Feed } from '../../feed';
+import { EventPayload, type PartializeAllBut } from '../../../types-internal';
+import { getStateUpdateQueueId, shouldUpdateState } from '../../../utils';
+
+export type CommentReactionAddedPayload = PartializeAllBut<
+  EventPayload<'feeds.comment.reaction.added'>,
+  'comment' | 'reaction'
+>;
+
+export function handleCommentReactionAdded(
+  this: Feed,
+  payload: CommentReactionAddedPayload,
+  fromWs?: boolean,
+) {
+  const { comment, reaction } = payload;
+  const connectedUser = this.client.state.getLatestValue().connected_user;
+
+  const isOwnReaction = reaction.user.id === connectedUser?.id;
+
+  if (
+    !shouldUpdateState({
+      stateUpdateQueueId: getStateUpdateQueueId(
+        payload,
+        'comment-reaction-created',
+      ),
+      stateUpdateQueue: this.stateUpdateQueue,
+      watch: this.currentState.watch,
+      fromWs,
+      isTriggeredByConnectedUser: isOwnReaction,
+    })
+  ) {
+    return;
+  }
+
+  this.state.next((currentState) => {
+    const commentIndex = this.getCommentIndex(comment, currentState);
+
+    if (commentIndex === -1) return currentState;
+
+    const forId = comment.parent_id ?? comment.object_id;
+
+    const entityState = currentState.comments_by_entity_id[forId];
+
+    const newComments = entityState?.comments?.concat([]) ?? [];
+
+    let ownReactions = newComments[commentIndex].own_reactions;
+
+    if (isOwnReaction) {
+      ownReactions = ownReactions.concat(reaction) ?? [reaction];
+    }
+
+    newComments[commentIndex] = {
+      ...newComments[commentIndex],
+      reaction_count: comment.reaction_count ?? 0,
+      // TODO: FIXME this should be handled by the backend
+      latest_reactions: comment.latest_reactions ?? [],
+      reaction_groups: comment.reaction_groups ?? {},
+      own_reactions: ownReactions,
+    };
+
+    return {
+      ...currentState,
+      comments_by_entity_id: {
+        ...currentState.comments_by_entity_id,
+        [forId]: {
+          ...entityState,
+          comments: newComments,
+        },
+      },
+    };
+  });
+}