Remember tab in upload page

2 files changed, 23 insertions, 7 deletions

diff --git a/client/src/app/+videos/+video-edit/video-add.component.html b/client/src/app/+videos/+video-edit/video-add.component.html
index dc8c2f21d..ac75d9ff8 100644
--- a/client/src/app/+videos/+video-edit/video-add.component.html
+++ b/client/src/app/+videos/+video-edit/video-add.component.html
@@ -20,8 +20,8 @@
     <ng-container *ngIf="secondStepType === 'upload'" i18n>Upload {{ videoName }}</ng-container>
   </div>
 
-  <div ngbNav #nav="ngbNav" class="nav-tabs video-add-nav" [ngClass]="{ 'hide-nav': secondStepType !== undefined }">
-    <ng-container ngbNavItem>
+  <div ngbNav #nav="ngbNav" class="nav-tabs video-add-nav" [activeId]="activeNav" (activeIdChange)="onNavChange($event)" [ngClass]="{ 'hide-nav': !!secondStepType }">
+    <ng-container ngbNavItem="upload">
       <a ngbNavLink>
         <span i18n>Upload a file</span>
       </a>
@@ -31,7 +31,7 @@
       </ng-template>
     </ng-container>
 
-    <ng-container ngbNavItem *ngIf="isVideoImportHttpEnabled()">
+    <ng-container ngbNavItem="import-url" *ngIf="isVideoImportHttpEnabled()">
       <a ngbNavLink>
         <span i18n>Import with URL</span>
       </a>
@@ -41,7 +41,7 @@
       </ng-template>
     </ng-container>
 
-    <ng-container ngbNavItem *ngIf="isVideoImportTorrentEnabled()">
+    <ng-container ngbNavItem="import-torrent" *ngIf="isVideoImportTorrentEnabled()">
       <a ngbNavLink>
         <span i18n>Import with torrent</span>
       </a>
@@ -51,7 +51,7 @@
       </ng-template>
     </ng-container>
 
-    <ng-container ngbNavItem *ngIf="isVideoLiveEnabled()">
+    <ng-container ngbNavItem="go-live" *ngIf="isVideoLiveEnabled()">
       <a ngbNavLink>
         <span i18n>Go live</span>
       </a>
diff --git a/client/src/app/+videos/+video-edit/video-add.component.ts b/client/src/app/+videos/+video-edit/video-add.component.ts
index 441d5a3db..d735c936c 100644
--- a/client/src/app/+videos/+video-edit/video-add.component.ts
+++ b/client/src/app/+videos/+video-edit/video-add.component.ts
@@ -1,4 +1,5 @@
 import { Component, HostListener, OnInit, ViewChild } from '@angular/core'
+import { ActivatedRoute, Router } from '@angular/router'
 import { AuthService, AuthUser, CanComponentDeactivate, ServerService } from '@app/core'
 import { ServerConfig } from '@shared/models'
 import { VideoEditType } from './shared/video-edit.type'
@@ -22,11 +23,16 @@ export class VideoAddComponent implements OnInit, CanComponentDeactivate {
 
   secondStepType: VideoEditType
   videoName: string
-  serverConfig: ServerConfig
+
+  activeNav: string
+
+  private serverConfig: ServerConfig
 
   constructor (
     private auth: AuthService,
-    private serverService: ServerService
+    private serverService: ServerService,
+    private route: ActivatedRoute,
+    private router: Router
   ) {}
 
   get userInformationLoaded () {
@@ -42,6 +48,16 @@ export class VideoAddComponent implements OnInit, CanComponentDeactivate {
       .subscribe(config => this.serverConfig = config)
 
     this.user = this.auth.getUser()
+
+    if (this.route.snapshot.fragment) {
+      this.onNavChange(this.route.snapshot.fragment)
+    }
+  }
+
+  onNavChange (newActiveNav: string) {
+    this.activeNav = newActiveNav
+
+    this.router.navigate([], { fragment: this.activeNav })
   }
 
   onFirstStepDone (type: VideoEditType, videoName: string) {