Add button in subscriptions to go to subscriptions list

diff --git a/client/src/app/shared/video/abstract-video-list.html b/client/src/app/shared/video/abstract-video-list.html
index 13aedcc74279859fbe38837f8270a060149e8bd5..3abc4312f43163dfbe09f60a34e29e6735d22981 100644 (file)
--- 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 98b80fdfd10d1ac9897a63fb4552af5df1c028ab..3c7a4b1fcb9492726a9863097966efc0a13bd94b 100644 (file)
--- 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 3e3583a70c049c1311dd5b8d25328e9edb31c51a..06d4ed43d5cd705c782d277037e47171edbfaf70 100644 (file)
--- 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 b36c857666f9217cc3c31f42f2a24c255bad5ae7..0cd67db29dd8a690623695142d694a4dce63a3b5 100644 (file)
--- 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 () {