diff options
author | Chocobozzz <me@florianbigard.com> | 2018-08-14 16:01:54 +0200 |
---|---|---|
committer | Chocobozzz <me@florianbigard.com> | 2018-08-14 18:01:22 +0200 |
commit | 65b247ddc75aa9f131af86dde21c8d958f7f4b39 (patch) | |
tree | f93b5796aba61e6b2ac23f4d02afe6845ecc9662 /client/src/app/+admin | |
parent | eed24d26db4c8363d5e5874841ee0c4f5fa275a8 (diff) | |
download | PeerTube-65b247ddc75aa9f131af86dde21c8d958f7f4b39.tar.gz PeerTube-65b247ddc75aa9f131af86dde21c8d958f7f4b39.tar.zst PeerTube-65b247ddc75aa9f131af86dde21c8d958f7f4b39.zip |
Improve follow component routing
Diffstat (limited to 'client/src/app/+admin')
-rw-r--r-- | client/src/app/+admin/follows/follows.component.html | 14 | ||||
-rw-r--r-- | client/src/app/+admin/follows/follows.component.ts | 58 |
2 files changed, 8 insertions, 64 deletions
diff --git a/client/src/app/+admin/follows/follows.component.html b/client/src/app/+admin/follows/follows.component.html index 8eabb3392..21d477132 100644 --- a/client/src/app/+admin/follows/follows.component.html +++ b/client/src/app/+admin/follows/follows.component.html | |||
@@ -1,15 +1,13 @@ | |||
1 | <div class="admin-sub-header"> | 1 | <div class="admin-sub-header"> |
2 | <div i18n class="form-sub-title">Manage follows</div> | 2 | <div i18n class="form-sub-title">Manage follows</div> |
3 | 3 | ||
4 | <ngb-tabset #followsMenuTabs type="pills"> | 4 | <div class="admin-sub-nav"> |
5 | <a i18n routerLink="following-list" routerLinkActive="active">Following</a> | ||
5 | 6 | ||
6 | <ngb-tab *ngFor="let link of links"> | 7 | <a i18n routerLink="following-add" routerLinkActive="active">Follow</a> |
7 | <ng-template ngbTabTitle> | ||
8 | <a class="tab-link" [routerLink]="link.path">{{ link.title }}</a> | ||
9 | </ng-template> | ||
10 | </ngb-tab> | ||
11 | 8 | ||
12 | </ngb-tabset> | 9 | <a i18n routerLink="followers-list" routerLinkActive="active">Followers</a> |
10 | </div> | ||
13 | </div> | 11 | </div> |
14 | 12 | ||
15 | <router-outlet></router-outlet> | 13 | <router-outlet></router-outlet> \ No newline at end of file |
diff --git a/client/src/app/+admin/follows/follows.component.ts b/client/src/app/+admin/follows/follows.component.ts index b6f7715b3..1ec7e598b 100644 --- a/client/src/app/+admin/follows/follows.component.ts +++ b/client/src/app/+admin/follows/follows.component.ts | |||
@@ -1,62 +1,8 @@ | |||
1 | import { AfterViewInit, Component, OnInit, ViewChild } from '@angular/core' | 1 | import { Component } from '@angular/core' |
2 | import { NavigationEnd, Router } from '@angular/router' | ||
3 | import { I18n } from '@ngx-translate/i18n-polyfill' | ||
4 | import { NgbTabset } from '@ng-bootstrap/ng-bootstrap' | ||
5 | 2 | ||
6 | @Component({ | 3 | @Component({ |
7 | templateUrl: './follows.component.html', | 4 | templateUrl: './follows.component.html', |
8 | styleUrls: [ './follows.component.scss' ] | 5 | styleUrls: [ './follows.component.scss' ] |
9 | }) | 6 | }) |
10 | export class FollowsComponent implements OnInit, AfterViewInit { | 7 | export class FollowsComponent { |
11 | @ViewChild('followsMenuTabs') followsMenuTabs: NgbTabset | ||
12 | |||
13 | links: { path: string, title: string }[] = [] | ||
14 | |||
15 | constructor ( | ||
16 | private i18n: I18n, | ||
17 | private router: Router | ||
18 | ) { | ||
19 | this.links = [ | ||
20 | { | ||
21 | path: 'following-list', | ||
22 | title: this.i18n('Following') | ||
23 | }, | ||
24 | { | ||
25 | path: 'following-add', | ||
26 | title: this.i18n('Follow') | ||
27 | }, | ||
28 | { | ||
29 | path: 'followers-list', | ||
30 | title: this.i18n('Followers') | ||
31 | } | ||
32 | ] | ||
33 | } | ||
34 | |||
35 | ngOnInit () { | ||
36 | this.router.events.subscribe( | ||
37 | event => { | ||
38 | if (event instanceof NavigationEnd) { | ||
39 | this.updateActiveTab() | ||
40 | } | ||
41 | } | ||
42 | ) | ||
43 | } | ||
44 | |||
45 | ngAfterViewInit () { | ||
46 | // Avoid issue with change detector | ||
47 | setTimeout(() => this.updateActiveTab()) | ||
48 | } | ||
49 | |||
50 | private updateActiveTab () { | ||
51 | const url = window.location.pathname | ||
52 | |||
53 | for (let i = 0; i < this.links.length; i++) { | ||
54 | const path = this.links[i].path | ||
55 | |||
56 | if (url.endsWith(path) === true) { | ||
57 | this.followsMenuTabs.select(path) | ||
58 | return | ||
59 | } | ||
60 | } | ||
61 | } | ||
62 | } | 8 | } |