Merge branch 'master' of https://git.loafle.net/ucap-web/next-ucap-messenger

projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.ts

@@ -290,6 +290,8 @@ export class MessagesComponent implements OnInit, OnDestroy, AfterViewInit {
               this.store.dispatch(EventStore.infoIntervalClear({}));
             }, 1000);
           }
+
+          this.readyToReply();
         }
 
         this.roomInfoSubject.next(roomInfo);
@@ -378,7 +380,6 @@ export class MessagesComponent implements OnInit, OnDestroy, AfterViewInit {
         } else {
           if (!!infoList && infoList.length > 0) {
             this.baseEventSeq = infoList[0].seq;
-            this.readyToReply();
           }
         }
       });

projects/ucap-webmessenger-ui-chat/src/lib/components/messages.component.ts

@@ -28,10 +28,11 @@ import { VersionInfo2Response } from '@ucap-webmessenger/api-public';
 import moment from 'moment';
 import { FileDownloadItem } from '@ucap-webmessenger/api';
 import { TranslateService } from '@ngx-translate/core';
-import { Observable, Subscription } from 'rxjs';
+import { Observable, Subscription, timer } from 'rxjs';
 import { VirtualScrollerComponent, IPageInfo } from 'ngx-virtual-scroller';
 import { MessageBoxComponent } from './message-box.component';
 import { PerfectScrollbarDirective } from 'ngx-perfect-scrollbar';
+import { debounce } from 'rxjs/operators';
 
 @Component({
   selector: 'ucap-chat-messages',
@@ -181,15 +182,13 @@ export class MessagesComponent implements OnInit, OnDestroy {
       this.existReadToHereEvent = true;
       /** [E] initializing by changed room */
 
-      if (
+      if (!this.roomInfo || this.roomInfo.roomSeq !== roomInfo.roomSeq) {
-        !!this.roomInfo &&
-        !!roomInfo &&
-        this.roomInfo.roomSeq !== roomInfo.roomSeq
-      ) {
         this.initEventMore();
       }
     });
-    this.eventListSubscription = this.eventList$.subscribe(eventList => {
+    this.eventListSubscription = this.eventList$
+      .pipe(debounce(() => timer(100)))
+      .subscribe(eventList => {
         this.eventList = eventList;
 
         if (!!eventList && eventList.length > 0) {
@@ -517,33 +516,30 @@ export class MessagesComponent implements OnInit, OnDestroy {
           () => {
             this.firstCheckReadHere = false;
           },
-          true,
-          false
-        );
-      } else {
-        if (
-          this.virtualScroller.viewPortInfo.endIndex ===
-          this.eventList.length - 2
-        ) {
-          this.swapScrollTo(
-            this.eventList[this.eventList.length - 1],
-            () => {},
-            () => {},
           false,
           false
         );
       } else {
+        const lastEvent =
+          !!this.eventList && 0 < this.eventList.length
+            ? this.eventList[this.eventList.length - 1]
+            : undefined;
+
+        if (undefined === lastEvent) {
+          return;
+        }
+        const isInViewPortItems = this.isInViewPortItems(lastEvent.seq);
         this.swapScrollTo(
           this.eventList[this.eventList.length - 1],
           () => {},
           () => {},
-            true,
+          -1 === this.virtualScroller.viewPortInfo.endIndex ||
-            false
+            !isInViewPortItems,
+          !isInViewPortItems
         );
       }
     }
   }
-  }
 
   initEventMore() {
     // 방정보가 바뀌면 이전대화 보기 관련 값들을 초기화 한다.
@@ -555,9 +551,7 @@ export class MessagesComponent implements OnInit, OnDestroy {
   clear() {}
 
   gotoPosition(eventSeq: number) {
-    const viewPortItemIndex = this.virtualScroller.viewPortItems.findIndex(
+    const isInViewPortItems = this.isInViewPortItems(eventSeq);
-      v => v.seq === eventSeq
-    );
 
     if (!!this.virtualScroller) {
       const e = this.eventList.find(v => v.seq === eventSeq);
@@ -572,13 +566,28 @@ export class MessagesComponent implements OnInit, OnDestroy {
             chatMessageBox.shake();
           }
         },
-        -1 === viewPortItemIndex,
+        !isInViewPortItems,
-        -1 === viewPortItemIndex,
+        !isInViewPortItems,
         50
       );
     }
   }
 
+  isInViewPortItems(eventSeq: number): boolean {
+    if (undefined === eventSeq) {
+      return false;
+    }
+    const viewPortItemIndex = this.virtualScroller.viewPortItems.findIndex(
+      v => v.seq === eventSeq
+    );
+
+    const newEvent =
+      !!this.newEventList &&
+      -1 !== this.newEventList.findIndex(e => e.seq === eventSeq);
+
+    return -1 !== viewPortItemIndex || newEvent;
+  }
+
   onClickOpenProfile(userSeq: number) {
     this.openProfile.emit(userSeq);
   }