import { AfterViewInit , ChangeDetectionStrategy , ChangeDetectorRef , Component , EventEmitter , Inject , Injector , Input , OnDestroy , Output , QueryList , TemplateRef , ViewChildren } from '@angular/core' ; import { Router } from '@angular/router' ; import { Observable , Subscription } from 'rxjs' ; import { TuiDialogService } from '@taiga-ui/core' ; import { TranslateService } from '@ngx-translate/core' ; import { UserInterface } from 'src/app/core/services/auth/models/user.interface' ; import { AuthService } from 'src/app/core/services/auth/auth.service' ; import { BlockchainData } from '@shared/models/blockchain/blockchain-data' ; import { WalletConnectorService } from 'src/app/core/services/blockchain/wallets/wallet-connector-service/wallet-connector.service' ; import { NavigationItem } from 'src/app/core/header/components/header/components/rubic-menu/models/navigation-item' ; import { CounterNotificationsService } from 'src/app/core/services/counter-notifications/counter-notifications.service' ; import { QueryParamsService } from 'src/app/core/services/query-params/query-params.service' ; import { SwapFormService } from 'src/app/features/swaps/services/swaps-form-service/swap-form.service' ; import { WINDOW } from '@ng-web-apis/common' ; import { HeaderStore } from '../../../../services/header.store' ; import { NAVIGATION_LIST } from '@core/header/components/header/components/rubic-menu/models/navigation-list' ; @ Component ( { selector : 'app-rubic-menu' , templateUrl : './rubic-menu.component.html' , styleUrls : [ './rubic-menu.component.scss' ] , changeDetection : ChangeDetectionStrategy . OnPush } ) export class RubicMenuComponent implements AfterViewInit , OnDestroy { @ Input ( ) public swapActive : boolean ; @ Input ( ) public bridgeActive : boolean ; @ Input ( ) public crossChainActive : boolean ; @ Output ( ) public readonly swapClick : EventEmitter < void > ; @ Output ( ) public readonly bridgeClick : EventEmitter < void > ; @ Output ( ) public readonly crossChainClick : EventEmitter < void > ; @ ViewChildren ( 'dropdownOptionTemplate' ) dropdownOptionsTemplates : QueryList < TemplateRef < never > > ; public isOpened = false ; public currentUser$ : Observable < UserInterface > ; public countUnread$ : Observable < number > ; public currentBlockchain : BlockchainData ; private _onNetworkChanges$ : Subscription ; private _onAddressChanges$ : Subscription ; public readonly navigationList : NavigationItem [ ] ; constructor ( private router , private headerStore , private authService , private readonly cdr , private readonly walletConnectorService , private translateService , private readonly counterNotificationsService , private readonly queryParamsService , private readonly swapFormService , @ Inject ( TuiDialogService ) private readonly dialogService , @ Inject ( Injector ) private injector , @ Inject ( WINDOW ) private window ) { this . currentUser$ = this . authService . getCurrentUser ( ) ; this . countUnread$ = this . counterNotificationsService . unread$ ; this . navigationList = NAVIGATION_LIST ; this . bridgeClick = new EventEmitter < void > ( ) ; this . swapClick = new EventEmitter < void > ( ) ; this . crossChainClick = new EventEmitter < void > ( ) ; } public ngAfterViewInit ( ) { this . cdr . detectChanges ( ) ; this . _onNetworkChanges$ = this . walletConnectorService . networkChange$ . subscribe ( network => { this . currentBlockchain = network ; this . cdr . detectChanges ( ) ; } ) ; this . _onAddressChanges$ = this . walletConnectorService . addressChange$ . subscribe ( ( ) => this . cdr . detectChanges ( ) ) ; } public ngOnDestroy ( ) { this . _onNetworkChanges$ . unsubscribe ( ) ; this . _onAddressChanges$ . unsubscribe ( ) ; } public getDropdownStatus ( opened ) { this . isOpened = opened ; } public closeMenu ( ) { this . isOpened = false ; } public menuClickHandler ( linkType ) { this . closeMenu ( ) ; switch ( linkType ) { case 'swaps' : this . swapClick . emit ( ) ; case 'bridge' : this . bridgeClick . emit ( ) ; case 'cross-chain' : this . crossChainClick . emit ( ) ; } } public logout ( ) { this . authService . signOut ( ) . subscribe ( ) ; } isLinkActive ( url ) { return this . window . location . pathname === url ; } }