Hide generic channel display name and avatar on watch view (#2988)

* Hide generic channel display name on watch view

* Hide generic channel avatar on watch view

* Add Default username channel as a generic channel display-name

Co-authored-by: kimsible <kimsible@users.noreply.github.com>

2 files changed, 29 insertions, 6 deletions

diff --git a/client/src/app/shared/shared-main/account/avatar.component.html b/client/src/app/shared/shared-main/account/avatar.component.html
index 09871fca4..310cc926f 100644
--- a/client/src/app/shared/shared-main/account/avatar.component.html
+++ b/client/src/app/shared/shared-main/account/avatar.component.html
@@ -1,8 +1,26 @@
 <div class="wrapper" [ngClass]="'avatar-' + size">
-  <a [routerLink]="[ '/video-channels', video.byVideoChannel ]" [title]="channelLinkTitle">
-    <img [src]="video.videoChannelAvatarUrl" i18n-alt alt="Channel avatar" />
-  </a>
-  <a [routerLink]="[ '/accounts', video.byAccount ]" [title]="accountLinkTitle">
-    <img [src]="video.accountAvatarUrl" i18n-alt alt="Account avatar" />
-  </a>
+  <ng-container *ngIf="!isChannelAvatarNull() && !genericChannel">
+    <a [routerLink]="[ '/video-channels', video.byVideoChannel ]" [title]="channelLinkTitle">
+      <img [src]="video.videoChannelAvatarUrl" i18n-alt alt="Channel avatar" />
+    </a>
+    <a [routerLink]="[ '/accounts', video.byAccount ]" [title]="accountLinkTitle">
+      <img [src]="video.accountAvatarUrl" i18n-alt alt="Account avatar" />
+    </a>
+  </ng-container>
+
+  <ng-container *ngIf="!isChannelAvatarNull() && genericChannel">
+    <a [routerLink]="[ '/accounts', video.byAccount ]" [title]="accountLinkTitle">
+      <img [src]="video.accountAvatarUrl" i18n-alt alt="Account avatar" />
+    </a>
+
+    <a [routerLink]="[ '/video-channels', video.byVideoChannel ]" [title]="channelLinkTitle">
+      <img [src]="video.videoChannelAvatarUrl" i18n-alt alt="Channel avatar" />
+    </a>
+  </ng-container>
+
+  <ng-container *ngIf="isChannelAvatarNull()">
+    <a [routerLink]="[ '/accounts', video.byAccount ]" [title]="accountLinkTitle">
+      <img [src]="video.accountAvatarUrl" i18n-alt alt="Account avatar" />
+    </a>
+  </ng-container>
 </div>
diff --git a/client/src/app/shared/shared-main/account/avatar.component.ts b/client/src/app/shared/shared-main/account/avatar.component.ts
index 31f39c200..73c145ef9 100644
--- a/client/src/app/shared/shared-main/account/avatar.component.ts
+++ b/client/src/app/shared/shared-main/account/avatar.component.ts
@@ -10,6 +10,7 @@ import { I18n } from '@ngx-translate/i18n-polyfill'
 export class AvatarComponent implements OnInit {
   @Input() video: Video
   @Input() size: 'md' | 'sm' = 'md'
+  @Input() genericChannel: boolean
 
   channelLinkTitle = ''
   accountLinkTitle = ''
@@ -28,4 +29,8 @@ export class AvatarComponent implements OnInit {
       { name: this.video.account.name, handle: this.video.byAccount }
     )
   }
+
+  isChannelAvatarNull () {
+    return this.video.channel.avatar === null
+  }
 }