From dc1f314efdae14f838c109ebbc1e8d69273d0319 Mon Sep 17 00:00:00 2001
From: Chocobozzz <me@florianbigard.com>
Date: Thu, 10 Dec 2020 10:20:04 +0100
Subject: [PATCH] Fix socket io with angular

---
 .../app/+videos/+video-watch/video-watch.component.html  | 8 ++------
 .../src/app/core/notification/peertube-socket.service.ts | 9 +++++++--
 2 files changed, 9 insertions(+), 8 deletions(-)

diff --git a/client/src/app/+videos/+video-watch/video-watch.component.html b/client/src/app/+videos/+video-watch/video-watch.component.html
index 9cabe3bbc..669fede43 100644
--- a/client/src/app/+videos/+video-watch/video-watch.component.html
+++ b/client/src/app/+videos/+video-watch/video-watch.component.html
@@ -66,12 +66,8 @@
             <div class="video-info-first-row-bottom">
               <div class="d-none d-md-block video-info-date-views">
                 <ng-container i18n>Published <my-date-toggle [date]="video.publishedAt"></my-date-toggle></ng-container>
-
-                <span i18n [title]="video.getExactNumberOfViews()" class="views">
-                  • {{ video.views | myNumberFormatter }}
-                  <ng-container *ngIf="!video.isLive">views</ng-container>
-                  <ng-container *ngIf="video.isLive">viewers</ng-container>
-                </span>
+                •
+                <my-video-views-counter [video]="video"></my-video-views-counter>
               </div>
 
               <div class="video-actions-rates">
diff --git a/client/src/app/core/notification/peertube-socket.service.ts b/client/src/app/core/notification/peertube-socket.service.ts
index 089276cfc..bc3f7b893 100644
--- a/client/src/app/core/notification/peertube-socket.service.ts
+++ b/client/src/app/core/notification/peertube-socket.service.ts
@@ -58,9 +58,12 @@ export class PeerTubeSocket {
       this.notificationSocket = this.io(environment.apiUrl + '/user-notifications', {
         query: { accessToken: this.auth.getAccessToken() }
       })
+
+      this.notificationSocket.on('new-notification', (n: UserNotificationServer) => {
+        this.ngZone.run(() => this.dispatchNotificationEvent('new', n))
+      })
     })
 
-    this.notificationSocket.on('new-notification', (n: UserNotificationServer) => this.dispatchNotificationEvent('new', n))
   }
 
   private async initLiveVideosSocket () {
@@ -76,7 +79,9 @@ export class PeerTubeSocket {
     const types: LiveVideoEventType[] = [ 'views-change', 'state-change' ]
 
     for (const type of types) {
-      this.liveVideosSocket.on(type, (payload: LiveVideoEventPayload) => this.dispatchLiveVideoEvent(type, payload))
+      this.liveVideosSocket.on(type, (payload: LiveVideoEventPayload) => {
+        this.ngZone.run(() => this.dispatchLiveVideoEvent(type, payload))
+      })
     }
   }