[menu] fix json.parse on missing auth in localstorage

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

@@ -5,6 +5,7 @@ import { LanguageService } from '../../services/language.service';
 import { EnterpriseService } from '../../services/enterprise.service';
 import { NavigationService } from '../../services/navigation.service';
 import { MenuComponent } from '../menu/menu.component';
+import { StorageService } from '../../services/storage.service';
 
 @Component({
   selector: 'app-master-page',
@@ -37,6 +38,7 @@ export class MasterPageComponent implements OnInit {
     private languageService: LanguageService,
     private enterpriseService: EnterpriseService,
     private navigationService: NavigationService,
+    private storageService: StorageService
   ) { }
 
   ngOnInit(): void {
@@ -74,12 +76,12 @@ export class MasterPageComponent implements OnInit {
     this.stateService.resetScroll$.next(true);
   }
 
-  onLoggedOut() {
+  onLoggedOut(): void {
     this.refreshAuth();
   }
 
   refreshAuth(): void {
-    this.userAuth = JSON.parse(localStorage.getItem('auth') || '') ?? null;
+    this.userAuth = this.storageService.getAuth();
   }
 
   hamburgerClick(): void {

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

@@ -2,6 +2,7 @@ import { Component, OnInit, Output, EventEmitter } from '@angular/core';
 import { Observable } from 'rxjs';
 import { ApiService } from '../../services/api.service';
 import { MenuGroup } from '../../interfaces/services.interface';
+import { StorageService } from '../../services/storage.service';
 
 @Component({
   selector: 'app-menu',
@@ -16,11 +17,12 @@ export class MenuComponent implements OnInit {
   @Output() loggedOut = new EventEmitter<boolean>();
 
   constructor(
-    private apiService: ApiService
+    private apiService: ApiService,
+    private storageService: StorageService
   ) {}
 
   ngOnInit(): void {
-    this.userAuth = JSON.parse(localStorage.getItem('auth') || '') ?? null;
+    this.userAuth = this.storageService.getAuth();
     this.userMenuGroups$ = this.apiService.getUserMenuGroups$();
   }
 

frontend/src/app/services/api.service.ts

@@ -8,6 +8,7 @@ import { WebsocketResponse } from '../interfaces/websocket.interface';
 import { Outspend, Transaction } from '../interfaces/electrs.interface';
 import { Conversion } from './price.service';
 import { MenuGroup } from '../interfaces/services.interface';
+import { StorageService } from './storage.service';
 
 // Todo - move to config.json
 const SERVICES_API_PREFIX = `/api/v1/services`;
@@ -22,6 +23,7 @@ export class ApiService {
   constructor(
     private httpClient: HttpClient,
     private stateService: StateService,
+    private storageService: StorageService
   ) {
     this.apiBaseUrl = ''; // use relative URL by default
     if (!stateService.isBrowser) { // except when inside AU SSR process
@@ -336,7 +338,7 @@ export class ApiService {
   /**
    * Services
    */
-  
+
   getNodeOwner$(publicKey: string): Observable<any> {
     let params = new HttpParams()
       .set('node_public_key', publicKey);
@@ -344,7 +346,7 @@ export class ApiService {
   }
 
   getUserMenuGroups$(): Observable<MenuGroup[]> {
-    const auth = JSON.parse(localStorage.getItem('auth') || '');
+    const auth = this.storageService.getAuth();
     if (!auth) {
       return of(null);
     }
@@ -354,10 +356,10 @@ export class ApiService {
     });
   }
 
-  logout$() {
-    const auth = JSON.parse(localStorage.getItem('auth') || '');
+  logout$(): Observable<any> {
+    const auth = this.storageService.getAuth();
     if (!auth) {
-      return;
+      return of(null);
     }
 
     localStorage.setItem('auth', null);

frontend/src/app/services/storage.service.ts

@@ -56,4 +56,12 @@ export class StorageService {
       console.log(e);
     }
   }
+
+  getAuth(): any | null {
+    try {
+      return JSON.parse(localStorage.getItem('auth'));
+    } catch(e) {
+      return null;
+    }
+  }
 }