Merge pull request #5244 from mempool/nymkappa/refresh-checkout-state-logout

[accelerator] refresh checkout state logout

frontend/src/app/components/accelerate-checkout/accelerate-checkout.component.ts

@@ -7,7 +7,7 @@ import { AudioService } from '../../services/audio.service';
 import { ETA, EtaService } from '../../services/eta.service';
 import { Transaction } from '../../interfaces/electrs.interface';
 import { MiningStats } from '../../services/mining.service';
-import { StorageService } from '../../services/storage.service';
+import { IAuth, AuthServiceMempool } from '../../services/auth.service';
 
 export type PaymentMethod = 'balance' | 'bitcoin' | 'cashapp';
 
@@ -71,7 +71,8 @@ export class AccelerateCheckout implements OnInit, OnDestroy {
   simpleMode: boolean = true;
   paymentMethod: 'cashapp' | 'btcpay';
 
-  user: any = undefined;
+  authSubscription$: Subscription;
+  auth: IAuth | null = null;
 
   // accelerator stuff
   square: { appId: string, locationId: string};
@@ -109,16 +110,22 @@ export class AccelerateCheckout implements OnInit, OnDestroy {
   constructor(
     public stateService: StateService,
     private servicesApiService: ServicesApiServices,
-    private storageService: StorageService,
     private etaService: EtaService,
     private audioService: AudioService,
-    private cd: ChangeDetectorRef
+    private cd: ChangeDetectorRef,
+    private authService: AuthServiceMempool
   ) {
     this.accelerationUUID = window.crypto.randomUUID();
   }
 
   ngOnInit() {
-    this.user = this.storageService.getAuth()?.user ?? null;
+    this.authSubscription$ = this.authService.getAuth$().subscribe((auth) => {
+      this.auth = auth;
+      this.estimate = null;
+      this.moveToStep('summary');
+    });
+    this.authService.refreshAuth$().subscribe();
+
     const urlParams = new URLSearchParams(window.location.search);
     if (urlParams.get('cash_request_id')) { // Redirected from cashapp
       this.moveToStep('processing');
@@ -146,6 +153,9 @@ export class AccelerateCheckout implements OnInit, OnDestroy {
     if (this.estimateSubscription) {
       this.estimateSubscription.unsubscribe();
     }
+    if (this.authSubscription$) {
+      this.authSubscription$.unsubscribe();
+    }
   }
 
   ngOnChanges(changes: SimpleChanges): void {
@@ -456,8 +466,7 @@ export class AccelerateCheckout implements OnInit, OnDestroy {
   }
 
   isLoggedIn(): boolean {
-    const auth = this.storageService.getAuth();
-    return auth !== null;
+    return this.auth !== null;
   }
 
   /**

frontend/src/app/components/master-page/master-page.component.html

@@ -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>
 

frontend/src/app/components/menu/menu.component.ts

@@ -5,6 +5,7 @@ import { StorageService } from '../../services/storage.service';
 import { Router, NavigationStart } from '@angular/router';
 import { StateService } from '../../services/state.service';
 import { IUser, ServicesApiServices } from '../../services/services-api.service';
+import { AuthServiceMempool } from '../../services/auth.service';
 
 @Component({
   selector: 'app-menu',
@@ -26,7 +27,8 @@ export class MenuComponent implements OnInit, OnDestroy {
     private servicesApiServices: ServicesApiServices,
     private storageService: StorageService,
     private router: Router,
-    private stateService: StateService
+    private stateService: StateService,
+    private authService: AuthServiceMempool
   ) {}
 
   ngOnInit(): void {
@@ -61,12 +63,19 @@ export class MenuComponent implements OnInit, OnDestroy {
       this.loggedOut.emit(true);
       if (this.stateService.env.GIT_COMMIT_HASH_MEMPOOL_SPACE) {
         this.userMenuGroups$ = this.servicesApiServices.getUserMenuGroups$();
-        this.router.navigateByUrl('/');
+        this.authService.logout();
+        if (window.location.toString().includes('services')) {
+          this.router.navigateByUrl('/login');
+        }
       }
     });
   }
 
   onLinkClick(link) {
+    if (link === 'logout') {
+      this.toggleMenu(false);
+      return;
+    }
     if (!this.isServicesPage || this.isSmallScreen()) {
       this.toggleMenu(false);
     }