[footer] refresh auth state in real time

This commit is contained in:
nymkappa 2024-07-01 14:33:19 +09:00
parent 7ed35b955d
commit b91f195955
No known key found for this signature in database
GPG Key ID: 92358FC85D9645DE
4 changed files with 17 additions and 10 deletions

View File

@ -129,7 +129,7 @@
</main>
<div class="flex-grow-1"></div>
<app-global-footer *ngIf="footerVisible"></app-global-footer>
<app-global-footer *ngIf="footerVisible" [user]="user"></app-global-footer>
</div>
</div>

View File

@ -1,6 +1,6 @@
import { Router, NavigationStart } from '@angular/router';
import { Injectable } from '@angular/core';
import { HttpClient, HttpParams } from '@angular/common/http';
import { HttpClient } from '@angular/common/http';
import { StateService } from './state.service';
import { StorageService } from './storage.service';
import { MenuGroup } from '../interfaces/services.interface';

View File

@ -33,8 +33,8 @@
</div>
}
<a *ngIf="stateService.isMempoolSpaceBuild" class="btn btn-purple sponsor d-none d-sm-flex justify-content-center" [routerLink]="['/login']">
<span *ngIf="loggedIn" i18n="shared.my-account" class="nowrap">My Account</span>
<span *ngIf="!loggedIn" i18n="shared.sign-in" class="nowrap">Sign In</span>
<span *ngIf="user" i18n="shared.my-account" class="nowrap">My Account</span>
<span *ngIf="!user" i18n="shared.sign-in" class="nowrap">Sign In</span>
</a>
</div>
@if (!env.customize?.theme) {
@ -44,8 +44,8 @@
}
@if (!enterpriseInfo?.footer_img) {
<a *ngIf="stateService.isMempoolSpaceBuild" class="btn btn-purple sponsor d-flex d-sm-none justify-content-center ml-auto mr-auto mt-0 mb-2" [routerLink]="['/login']">
<span *ngIf="loggedIn" i18n="shared.my-account" class="nowrap">My Account</span>
<span *ngIf="!loggedIn" i18n="shared.sign-in" class="nowrap">Sign In</span>
<span *ngIf="user" i18n="shared.my-account" class="nowrap">My Account</span>
<span *ngIf="!user" i18n="shared.sign-in" class="nowrap">Sign In</span>
</a>
<p class="explore-tagline-desktop">
<ng-container i18n="@@7deec1c1520f06170e1f8e8ddfbe4532312f638f">Explore the full Bitcoin ecosystem</ng-container>

View File

@ -1,4 +1,4 @@
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, OnInit, Inject, LOCALE_ID, HostListener, OnDestroy } from '@angular/core';
import { Input, ChangeDetectionStrategy, ChangeDetectorRef, Component, OnInit, OnChanges, SimpleChanges, Inject, LOCALE_ID, OnDestroy } from '@angular/core';
import { Router, ActivatedRoute } from '@angular/router';
import { Observable, merge, of, Subject, Subscription } from 'rxjs';
import { tap, takeUntil } from 'rxjs/operators';
@ -16,7 +16,9 @@ import { EnterpriseService } from '../../../services/enterprise.service';
styleUrls: ['./global-footer.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class GlobalFooterComponent implements OnInit, OnDestroy {
export class GlobalFooterComponent implements OnInit, OnDestroy, OnChanges {
@Input() user: any = undefined;
private destroy$: Subject<any> = new Subject<any>();
env: Env;
officialMempoolSpace = this.stateService.env.OFFICIAL_MEMPOOL_SPACE;
@ -29,7 +31,6 @@ export class GlobalFooterComponent implements OnInit, OnDestroy {
network$: Observable<string>;
networkPaths: { [network: string]: string };
currentNetwork = '';
loggedIn = false;
urlSubscription: Subscription;
isServicesPage = false;
@ -72,11 +73,17 @@ export class GlobalFooterComponent implements OnInit, OnDestroy {
});
this.urlSubscription = this.route.url.subscribe((url) => {
this.loggedIn = this.storageService.getAuth() !== null;
this.user = this.storageService.getAuth();
this.cd.markForCheck();
})
}
ngOnChanges(changes: SimpleChanges): void {
if (changes.user) {
this.user = this.storageService.getAuth();
}
}
ngOnDestroy(): void {
this.destroy$.next(true);
this.destroy$.complete();