[footer] dynamic CTA button based on login status
This commit is contained in:
parent
727d170c9c
commit
5846862d55
@ -34,7 +34,7 @@
|
||||
<h3 i18n="about.sponsors.enterprise.withRocket" class="mt-5">Support the Project</h3>
|
||||
|
||||
<div class="d-flex justify-content-center" style="max-width: 90%; margin: 35px auto 75px auto; column-gap: 15px">
|
||||
<a href="/sponsor" class="btn" style="background-color: rgba(152, 88, 255, 0.75); box-shadow: 0px 0px 50px 5px rgba(152, 88, 255, 0.75)">Become a Sponsor!</a>
|
||||
<a href="/enterprise" class="btn" style="background-color: rgba(152, 88, 255, 0.75); box-shadow: 0px 0px 50px 5px rgba(152, 88, 255, 0.75)">Become a Sponsor!</a>
|
||||
</div>
|
||||
|
||||
<div class="enterprise-sponsor" id="enterprise-sponsors">
|
||||
|
@ -14,8 +14,12 @@
|
||||
<app-rate-unit-selector></app-rate-unit-selector>
|
||||
</div>
|
||||
<ng-template #temporaryHidden>
|
||||
<a *ngIf="officialMempoolSpace" class="cta btn btn-purple sponsor" [routerLink]="['/signup' | relativeUrl]">Support the Project</a>
|
||||
<p *ngIf="officialMempoolSpace && env.BASE_MODULE === 'mempool'" class="cta-secondary"><a [routerLink]="['/signin' | relativeUrl]" i18n="shared.broadcast-transaction|Broadcast Transaction">Sign In</a></p>
|
||||
<div *ngIf="officialMempoolSpace" class="cta">
|
||||
<div *ngIf="loggedIn" class="mb-1"><small>Logged in<span *ngIf="username"> as {{ username}}</span></small></div>
|
||||
<a *ngIf="loggedIn" class="btn btn-purple sponsor" [routerLink]="['/login' | relativeUrl]">My account</a>
|
||||
<a *ngIf="!loggedIn" class="btn btn-purple sponsor" [routerLink]="['/sponsor' | relativeUrl]">Support the Project</a>
|
||||
</div>
|
||||
<p *ngIf="!loggedIn && env.BASE_MODULE === 'mempool'" class="cta-secondary"><a [routerLink]="['/login' | relativeUrl]">Sign In</a></p>
|
||||
</ng-template>
|
||||
<p class="cta-secondary"><a [routerLink]="['/tx/push' | relativeUrl]" i18n="shared.broadcast-transaction|Broadcast Transaction">Broadcast Transaction</a></p>
|
||||
<p *ngIf="officialMempoolSpace && env.LIGHTNING" class="cta-secondary"><a [routerLink]="['/lightning/group/the-mempool-open-source-project' | relativeUrl]" i18n="footer.connect-to-our-nodes">Connect to our Nodes</a></p>
|
||||
|
@ -1,10 +1,13 @@
|
||||
import { ChangeDetectionStrategy, Component, OnInit, Inject, LOCALE_ID } from '@angular/core';
|
||||
import { Observable, merge, of, Subject } from 'rxjs';
|
||||
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, OnInit, Inject, LOCALE_ID } from '@angular/core';
|
||||
import { ActivatedRoute } from '@angular/router';
|
||||
import { Observable, merge, of, Subject, Subscription } from 'rxjs';
|
||||
import { tap, takeUntil } from 'rxjs/operators';
|
||||
import { Env, StateService } from '../../../services/state.service';
|
||||
import { IBackendInfo } from '../../../interfaces/websocket.interface';
|
||||
import { LanguageService } from '../../../services/language.service';
|
||||
import { NavigationService } from '../../../services/navigation.service';
|
||||
import { StorageService } from '../../../services/storage.service';
|
||||
import { WebsocketService } from '../../../services/websocket.service';
|
||||
|
||||
@Component({
|
||||
selector: 'app-global-footer',
|
||||
@ -23,12 +26,19 @@ export class GlobalFooterComponent implements OnInit {
|
||||
network$: Observable<string>;
|
||||
networkPaths: { [network: string]: string };
|
||||
currentNetwork = '';
|
||||
loggedIn = false;
|
||||
username = null;
|
||||
urlSubscription: Subscription;
|
||||
|
||||
constructor(
|
||||
public stateService: StateService,
|
||||
private languageService: LanguageService,
|
||||
private navigationService: NavigationService,
|
||||
@Inject(LOCALE_ID) public locale: string,
|
||||
private storageService: StorageService,
|
||||
private route: ActivatedRoute,
|
||||
private cd: ChangeDetectorRef,
|
||||
private websocketService: WebsocketService
|
||||
) {}
|
||||
|
||||
ngOnInit(): void {
|
||||
@ -46,11 +56,23 @@ export class GlobalFooterComponent implements OnInit {
|
||||
this.network$.pipe(takeUntil(this.destroy$)).subscribe((network) => {
|
||||
this.currentNetwork = network;
|
||||
});
|
||||
|
||||
this.urlSubscription = this.route.url.subscribe((url) => {
|
||||
this.loggedIn = JSON.parse(this.storageService.getValue('auth')) !== null;
|
||||
const auth = JSON.parse(this.storageService.getValue('auth'));
|
||||
if (auth?.user?.username) {
|
||||
this.username = auth.user.username;
|
||||
} else {
|
||||
this.username = null;
|
||||
}
|
||||
this.cd.markForCheck();
|
||||
})
|
||||
}
|
||||
|
||||
ngOnDestroy(): void {
|
||||
this.destroy$.next(true);
|
||||
this.destroy$.complete();
|
||||
this.urlSubscription.unsubscribe();
|
||||
}
|
||||
|
||||
networkLink(network) {
|
||||
|
Loading…
x
Reference in New Issue
Block a user