Add channel avatar to overviews

client/src/app/videos/video-list/video-overview.component.html

@@ -22,9 +22,13 @@
     </div>
   </div>
 
-  <div class="section" *ngFor="let object of overview.channels">
+  <div class="section channel" *ngFor="let object of overview.channels">
     <div class="section-title" i18n>
-      <a [routerLink]="[ '/video-channels', buildVideoChannelBy(object) ]">Channel {{ object.channel.displayName }}</a>
+      <a [routerLink]="[ '/video-channels', buildVideoChannelBy(object) ]">
+        <img [src]="buildVideoChannelAvatarUrl(object)" alt="Avatar" />
+
+        <div>{{ object.channel.displayName }}</div>
+      </a>
     </div>
 
     <div>

client/src/app/videos/video-list/video-overview.component.scss

@@ -20,3 +20,17 @@
     color: #000;
   }
 }
+
+.channel {
+  .section-title a {
+    display: flex;
+    width: fit-content;
+    align-items: center;
+
+    img {
+      @include avatar(30px);
+
+      margin-right: 10px;
+    }
+  }
+}

client/src/app/videos/video-list/video-overview.component.ts

@@ -53,4 +53,8 @@ export class VideoOverviewComponent implements OnInit {
   buildVideoChannelBy (object: { videos: Video[] }) {
     return object.videos[0].byVideoChannel
   }
+
+  buildVideoChannelAvatarUrl (object: { videos: Video[] }) {
+    return object.videos[0].videoChannelAvatarUrl
+  }
 }

server/initializers/constants.ts

@@ -473,7 +473,7 @@ const TORRENT_MIMETYPE_EXT = {
 
 const OVERVIEWS = {
   VIDEOS: {
-    SAMPLE_THRESHOLD: 4,
+    SAMPLE_THRESHOLD: 6,
     SAMPLES_COUNT: 2
   }
 }