client/src/app/+admin/follows/follows.component.ts

   1 import { AfterViewInit, Component, OnInit, ViewChild } from '@angular/core'
   2 import { NavigationEnd, Router } from '@angular/router'
   3 import { TabsetComponent } from 'ngx-bootstrap/tabs'
   4
   5 @Component({
   6   templateUrl: './follows.component.html',
   7   styleUrls: [ './follows.component.scss' ]
   8 })
   9 export class FollowsComponent implements OnInit, AfterViewInit {
  10   @ViewChild('followsMenuTabs') followsMenuTabs: TabsetComponent
  11
  12   links = [
  13     {
  14       path: 'following-list',
  15       title: 'Following'
  16     },
  17     {
  18       path: 'following-add',
  19       title: 'Follow'
  20     },
  21     {
  22       path: 'followers-list',
  23       title: 'Followers'
  24     }
  25   ]
  26
  27   constructor (private router: Router) {}
  28
  29   ngOnInit () {
  30     this.router.events.subscribe(
  31       event => {
  32         if (event instanceof NavigationEnd) {
  33           this.updateActiveTab()
  34         }
  35       }
  36     )
  37   }
  38
  39   ngAfterViewInit () {
  40     // Avoid issue with change detector
  41     setTimeout(() => this.updateActiveTab())
  42   }
  43
  44   private updateActiveTab () {
  45     const url = window.location.pathname
  46
  47     for (let i = 0; i < this.links.length; i++) {
  48       const path = this.links[i].path
  49
  50       if (url.endsWith(path) === true) {
  51         this.followsMenuTabs.tabs[i].active = true
  52         return
  53       }
  54     }
  55   }
  56 }