Merge branch 'master' into theming-v2

Author: szuperaz

projects/stream-chat-angular/src/lib/attachment-list/attachment-list.component.spec.ts

@@ -327,15 +327,20 @@ describe('AttachmentListComponent', () => {
     } as any as Attachment<DefaultStreamChatGenerics>;
     component.messageId = 'message-id';
     component.attachments = [attachment];
+    component.parentMessageId = 'parent-id';
     component.ngOnChanges();
     fixture.detectChanges();
 
     const actions = queryActions();
     actions[1].click();
 
-    expect(sendAction).toHaveBeenCalledWith('message-id', {
-      image_action: 'shuffle',
-    });
+    expect(sendAction).toHaveBeenCalledWith(
+      'message-id',
+      {
+        image_action: 'shuffle',
+      },
+      'parent-id'
+    );
   });
 
   describe('should display image attachment', () => {

projects/stream-chat-angular/src/lib/attachment-list/attachment-list.component.ts

@@ -28,6 +28,10 @@ export class AttachmentListComponent implements OnChanges {
    * The id of the message the attachments belong to
    */
   @Input() messageId: string | undefined;
+  /**
+   * The parent id of the message the attachments belong to
+   */
+  @Input() parentMessageId: string | undefined;
   /**
    * The attachments to display
    */
@@ -132,9 +136,13 @@ export class AttachmentListComponent implements OnChanges {
   }
 
   sendAction(action: Action) {
-    void this.channelService.sendAction(this.messageId!, {
-      [action.name!]: action.value!,
-    });
+    void this.channelService.sendAction(
+      this.messageId!,
+      {
+        [action.name!]: action.value!,
+      },
+      this.parentMessageId
+    );
   }
 
   trackByActionValue(_: number, item: Action) {

projects/stream-chat-angular/src/lib/attachment.service.spec.ts

@@ -297,6 +297,7 @@ describe('AttachmentService', () => {
   it('should create attachmentUploads from attachments', () => {
     const imageFile = { name: 'flower.png' };
     const dataFile = { name: 'note.txt', size: 3272969 };
+    const videoFile = { name: 'cute.mov', size: 45367543 };
     const result = [
       {
         file: imageFile,
@@ -310,6 +311,12 @@ describe('AttachmentService', () => {
         url: 'url/to/data',
         type: 'file',
       },
+      {
+        file: videoFile,
+        state: 'success',
+        url: 'url/to/video',
+        type: 'video',
+      },
     ];
     const attachments = [
       { fallback: 'flower.png', image_url: 'url/to/img', type: 'image' },
@@ -319,6 +326,12 @@ describe('AttachmentService', () => {
         asset_url: 'url/to/data',
         type: 'file',
       },
+      {
+        title: 'cute.mov',
+        file_size: 45367543,
+        asset_url: 'url/to/video',
+        type: 'video',
+      },
     ];
     const spy = jasmine.createSpy();
     service.attachmentUploads$.subscribe(spy);

projects/stream-chat-angular/src/lib/attachment.service.ts

@@ -177,15 +177,15 @@ export class AttachmentService {
             name: attachment.fallback,
           } as File,
         });
-      } else if (attachment.type === 'file') {
+      } else if (attachment.type === 'file' || attachment.type === 'video') {
         attachmentUploads.push({
           url: attachment.asset_url,
           state: 'success',
           file: {
             name: attachment.title,
             size: attachment.file_size,
           } as File,
-          type: 'file',
+          type: attachment.type,
         });
       }
     });

projects/stream-chat-angular/src/lib/channel.service.spec.ts

@@ -455,9 +455,8 @@ describe('ChannelService', () => {
     spy.calls.reset();
     let activeChannel!: Channel<DefaultStreamChatGenerics>;
     service.activeChannel$.subscribe((c) => (activeChannel = c!));
-    const message = {
-      ...activeChannel.state.messages[activeChannel.state.messages.length - 1],
-    };
+    const message =
+      activeChannel.state.messages[activeChannel.state.messages.length - 1];
     message.deleted_at = new Date().toISOString();
     (activeChannel as MockChannel).handleEvent('message.deleted', { message });
 
@@ -1002,7 +1001,10 @@ describe('ChannelService', () => {
     spyOn(channel.state, 'removeMessage');
     await service.sendAction('1', { image_action: 'send' });
 
-    expect(channel.state.removeMessage).toHaveBeenCalledWith({ id: '1' });
+    expect(channel.state.removeMessage).toHaveBeenCalledWith({
+      id: '1',
+      parent_id: undefined,
+    });
   });
 
   it('should update message', () => {

projects/stream-chat-angular/src/lib/channel.service.thread.spec.ts

@@ -529,12 +529,17 @@ describe('ChannelService - threads', () => {
       {} as any as SendMessageAPIResponse<DefaultStreamChatGenerics>
     );
     spyOn(channel.state, 'removeMessage');
-    await service.sendAction(replies[replies.length - 1].id, {
-      image_action: 'send',
-    });
+    await service.sendAction(
+      replies[replies.length - 1].id,
+      {
+        image_action: 'send',
+      },
+      parentMessage.id
+    );
 
     expect(channel.state.removeMessage).toHaveBeenCalledWith({
       id: replies[replies.length - 1].id,
+      parent_id: parentMessage.id,
     });
   });
 

projects/stream-chat-angular/src/lib/channel.service.ts

@@ -705,8 +705,13 @@ export class ChannelService<
    * [Runs a message action](https://getstream.io/chat/docs/rest/#messages-runmessageaction) in the current channel. Updates the message list based on the action result (if no message is returned, the message will be removed from the message list).
    * @param messageId
    * @param formData
+   * @param parentMessageId
    */
-  async sendAction(messageId: string, formData: Record<string, string>) {
+  async sendAction(
+    messageId: string,
+    formData: Record<string, string>,
+    parentMessageId?: string
+  ) {
     const channel = this.activeChannelSubject.getValue()!;
     const response = await channel.sendAction(messageId, formData);
     if (response?.message) {
@@ -721,21 +726,16 @@ export class ChannelService<
           ])
         : this.activeChannelMessagesSubject.next([...channel.state.messages]);
     } else {
-      channel.state.removeMessage({ id: messageId });
-      if (
-        this.activeChannelMessagesSubject
-          .getValue()
-          .find((m) => m.id === messageId)
-      ) {
-        this.activeChannelMessagesSubject.next([...channel.state.messages]);
-      } else if (
-        this.activeThreadMessagesSubject
-          .getValue()
-          .find((m) => m.id === messageId)
-      ) {
+      channel.state.removeMessage({
+        id: messageId,
+        parent_id: parentMessageId,
+      });
+      if (parentMessageId) {
         this.activeThreadMessagesSubject.next(
           channel.state.threads[this.activeParentMessageIdSubject.getValue()!]
         );
+      } else {
+        this.activeChannelMessagesSubject.next([...channel.state.messages]);
       }
     }
   }
@@ -1007,14 +1007,21 @@ export class ChannelService<
   private messageUpdated(event: Event<T>) {
     this.ngZone.run(() => {
       const isThreadReply = event.message && event.message.parent_id;
-      const messages = isThreadReply
-        ? this.activeThreadMessagesSubject.getValue()
-        : this.activeChannelMessagesSubject.getValue();
+      const channel = this.activeChannelSubject.getValue();
+      if (!channel) {
+        return;
+      }
+      // Get messages from state as message order could change, and message could've been deleted
+      const messages: FormatMessageResponse<T>[] = isThreadReply
+        ? channel.state.threads[event?.message?.parent_id || '']
+        : channel.state.messages;
+      if (!messages) {
+        return;
+      }
       const messageIndex = messages.findIndex(
-        (m) => m.id === event.message?.id
+        (m) => m.id === event?.message?.id
       );
-      if (messageIndex !== -1 && event.message) {
-        messages[messageIndex] = event.message;
+      if (messageIndex !== -1) {
         isThreadReply
           ? this.activeThreadMessagesSubject.next([...messages])
           : this.activeChannelMessagesSubject.next([...messages]);

projects/stream-chat-angular/src/lib/chat-client.service.spec.ts

@@ -29,7 +29,28 @@ describe('ChatClientService', () => {
     await service.init(apiKey, userId, userToken);
   });
 
-  it('should connect user', () => {
+  it('should connect user', async () => {
+    mockChatClient.connectUser.calls.reset();
+    await service.init(apiKey, userId, userToken);
+
+    expect(StreamChat.getInstance).toHaveBeenCalledWith(apiKey);
+    const spy = jasmine.createSpy();
+    service.appSettings$.subscribe(spy);
+    const userSpy = jasmine.createSpy();
+    service.user$.subscribe(userSpy);
+
+    expect(spy).toHaveBeenCalledWith(undefined);
+    expect(userSpy).toHaveBeenCalledWith(mockCurrentUser());
+    expect(mockChatClient.connectUser).toHaveBeenCalledWith(
+      { id: userId },
+      userToken
+    );
+  });
+
+  it('should connect user - guest user', async () => {
+    mockChatClient.connectUser.calls.reset();
+    await service.init(apiKey, userId, 'guest');
+
     expect(StreamChat.getInstance).toHaveBeenCalledWith(apiKey);
     const spy = jasmine.createSpy();
     service.appSettings$.subscribe(spy);
@@ -38,6 +59,8 @@ describe('ChatClientService', () => {
 
     expect(spy).toHaveBeenCalledWith(undefined);
     expect(userSpy).toHaveBeenCalledWith(mockCurrentUser());
+    expect(mockChatClient.connectUser).not.toHaveBeenCalled();
+    expect(mockChatClient.setGuestUser).toHaveBeenCalledWith({ id: userId });
   });
 
   it(`should notify if connection wasn't successful`, async () => {

projects/stream-chat-angular/src/lib/chat-client.service.ts

@@ -83,27 +83,31 @@ export class ChatClientService<
    * Creates a [`StreamChat`](https://github.com/GetStream/stream-chat-js/blob/668b3e5521339f4e14fc657834531b4c8bf8176b/src/client.ts#L124) instance using the provided `apiKey`, and connects a user with the given meta data and token. More info about [connecting users](https://getstream.io/chat/docs/javascript/init_and_users/?language=javascript) can be found in the platform documentation.
    * @param apiKey
    * @param userOrId
-   * @param userTokenOrProvider
+   * @param userTokenOrProvider You can provide a token, or the keyword 'guest' to connect as [guest user](https://getstream.io/chat/docs/javascript/authless_users/?language=javascript#guest-users)
    */
   async init(
     apiKey: string,
     userOrId: string | OwnUserResponse<T> | UserResponse<T>,
-    userTokenOrProvider: TokenOrProvider
+    userTokenOrProvider: TokenOrProvider | 'guest'
   ): ConnectAPIResponse<T> {
     this.chatClient = StreamChat.getInstance<T>(apiKey);
     this.chatClient.devToken;
     let result;
     await this.ngZone.runOutsideAngular(async () => {
       const user = typeof userOrId === 'string' ? { id: userOrId } : userOrId;
       try {
-        result = await this.chatClient.connectUser(user, userTokenOrProvider);
+        result =
+          userTokenOrProvider === 'guest'
+            ? await this.chatClient.setGuestUser(user)
+            : await this.chatClient.connectUser(user, userTokenOrProvider);
       } catch (error) {
         this.notificationService.addPermanentNotification(
           'streamChat.Error connecting to chat, refresh the page to try again.',
           'error'
         );
         throw error;
       }
+      this.userSubject.next(this.chatClient.user);
       this.chatClient.setUserAgent(
         `stream-chat-angular-${version}-${this.chatClient.getUserAgent()}`
       );

projects/stream-chat-angular/src/lib/message-actions-box/message-actions-box.component.spec.ts

@@ -176,7 +176,7 @@ describe('MessageActionsBoxComponent', () => {
     expect(spy).toHaveBeenCalledWith(component.message);
   });
 
-  it('should disable quote action, if message already has a quoted message', () => {
+  it(`shouldn't disable quote action, if message already has a quoted message`, () => {
     component.message = {
       ...component.message!,
       quoted_message: mockMessage() as any as MessageResponseBase,
@@ -188,7 +188,7 @@ describe('MessageActionsBoxComponent', () => {
     });
     fixture.detectChanges();
 
-    expect(queryQuoteAction()).toBeNull();
+    expect(queryQuoteAction()).not.toBeNull();
   });
 
   // eslint-disable-next-line jasmine/no-disabled-tests