Add button in subscriptions to go to subscriptions list

4 files changed, 36 insertions, 7 deletions

diff --git a/client/src/app/shared/video/abstract-video-list.html b/client/src/app/shared/video/abstract-video-list.html
index 13aedcc74..3abc4312f 100644
--- a/client/src/app/shared/video/abstract-video-list.html
+++ b/client/src/app/shared/video/abstract-video-list.html
@@ -4,9 +4,17 @@
       <div placement="bottom" [ngbTooltip]="titleTooltip" container="body">
         {{ titlePage }}
       </div>
+      <my-feed *ngIf="titlePage" [syndicationItems]="syndicationItems"></my-feed>
     </div>
 
-    <my-feed *ngIf="titlePage" [syndicationItems]="syndicationItems"></my-feed>
+    <div class="action-block" *ngIf="actions.length > 0">
+      <a [routerLink]="action.routerLink" routerLinkActive="active" *ngFor="let action of actions">
+        <button class="btn">
+          <my-global-icon [iconName]="action.iconName"></my-global-icon>
+          <span i18n>{{ action.label }}</span>
+        </button>
+      </a>
+    </div>
 
     <div class="moderation-block" *ngIf="displayModerationBlock">
       <my-peertube-checkbox
diff --git a/client/src/app/shared/video/abstract-video-list.scss b/client/src/app/shared/video/abstract-video-list.scss
index 98b80fdfd..3c7a4b1fc 100644
--- a/client/src/app/shared/video/abstract-video-list.scss
+++ b/client/src/app/shared/video/abstract-video-list.scss
@@ -3,17 +3,27 @@
 
 .videos-header {
   display: flex;
+  justify-content: space-between;
   height: 80px;
-  align-items: center;
+  align-items: baseline;
 
   .title-page.title-page-single {
-    margin: 0 5px 0 0;
+    display: flex;
+
+    my-feed {
+      display: inline-block;
+      top: 1px;
+      margin-left: 5px;
+      width: max-content;
+    }
   }
 
-  my-feed {
-    display: inline-block;
-    top: 1px;
-    min-width: 60px;
+  .action-block {
+    a button {
+      @include peertube-button;
+      @include grey-button;
+      @include button-with-icon(18px, 3px, -1px);
+    }
   }
 
   .moderation-block {
diff --git a/client/src/app/shared/video/abstract-video-list.ts b/client/src/app/shared/video/abstract-video-list.ts
index 3e3583a70..06d4ed43d 100644
--- a/client/src/app/shared/video/abstract-video-list.ts
+++ b/client/src/app/shared/video/abstract-video-list.ts
@@ -59,6 +59,12 @@ export abstract class AbstractVideoList implements OnInit, OnDestroy, DisableFor
     blacklistInfo: false
   }
 
+  actions: {
+    routerLink: string
+    iconName: string
+    label: string
+  }[] = []
+
   onDataSubject = new Subject<any[]>()
 
   protected serverConfig: ServerConfig
diff --git a/client/src/app/videos/video-list/video-user-subscriptions.component.ts b/client/src/app/videos/video-list/video-user-subscriptions.component.ts
index b36c85766..0cd67db29 100644
--- a/client/src/app/videos/video-list/video-user-subscriptions.component.ts
+++ b/client/src/app/videos/video-list/video-user-subscriptions.component.ts
@@ -36,6 +36,11 @@ export class VideoUserSubscriptionsComponent extends AbstractVideoList implement
     super()
 
     this.titlePage = i18n('Videos from your subscriptions')
+    this.actions.push({
+      routerLink: '/my-account/subscriptions',
+      label: i18n('Subscriptions'),
+      iconName: 'cog'
+    })
   }
 
   ngOnInit () {