Move video watch playlist in its own component

2 files changed, 13 insertions, 9 deletions

diff --git a/client/src/app/shared/video-playlist/video-playlist-element-miniature.component.scss b/client/src/app/shared/video-playlist/video-playlist-element-miniature.component.scss
index f8a068cbc..cb7072d7f 100644
--- a/client/src/app/shared/video-playlist/video-playlist-element-miniature.component.scss
+++ b/client/src/app/shared/video-playlist/video-playlist-element-miniature.component.scss
@@ -2,6 +2,13 @@
 @import '_mixins';
 @import '_miniature';
 
+my-video-thumbnail {
+  @include thumbnail-size-component(130px, 72px);
+
+  display: flex; // Avoids an issue with line-height that adds space below the element
+  margin-right: 10px;
+}
+
 .video {
   display: flex;
   align-items: center;
@@ -44,13 +51,6 @@
       }
     }
 
-    my-video-thumbnail {
-      @include thumbnail-size-component(130px, 72px);
-
-      display: flex; // Avoids an issue with line-height that adds space below the element
-      margin-right: 10px;
-    }
-
     .video-info {
       display: flex;
       flex-direction: column;
diff --git a/client/src/app/shared/video/video-actions-dropdown.component.ts b/client/src/app/shared/video/video-actions-dropdown.component.ts
index b2d77a9e6..c1da0eba6 100644
--- a/client/src/app/shared/video/video-actions-dropdown.component.ts
+++ b/client/src/app/shared/video/video-actions-dropdown.component.ts
@@ -1,4 +1,4 @@
-import { AfterContentInit, AfterViewInit, Component, EventEmitter, Input, OnChanges, OnInit, Output, ViewChild } from '@angular/core'
+import { AfterViewInit, Component, EventEmitter, Input, OnChanges, Output, ViewChild } from '@angular/core'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { DropdownAction, DropdownButtonSize, DropdownDirection } from '@app/shared/buttons/action-dropdown.component'
 import { AuthService, ConfirmService, Notifier, ServerService } from '@app/core'
@@ -133,6 +133,10 @@ export class VideoActionsDropdownComponent implements AfterViewInit, OnChanges {
     return this.video.isUnblacklistableBy(this.user)
   }
 
+  isVideoDownloadable () {
+    return this.video && this.video instanceof VideoDetails && this.video.downloadEnabled
+  }
+
   /* Action handlers */
 
   async unblacklistVideo () {
@@ -202,7 +206,7 @@ export class VideoActionsDropdownComponent implements AfterViewInit, OnChanges {
         {
           label: this.i18n('Download'),
           handler: () => this.showDownloadModal(),
-          isDisplayed: () => this.displayOptions.download,
+          isDisplayed: () => this.displayOptions.download && this.isVideoDownloadable(),
           iconName: 'download'
         },
         {