fix(town): list was not 100% width

client/src/app/app.component.ts

@@ -40,15 +40,17 @@ export class AppComponent {
       url: 'town',
       icon: 'town',
       indicator: combineLatest([
-        this.marketService.getClaimCoins().pipe(
-          map((coins: any) =>
-            (coins as number) > 0
-              ? {
-                  color: 'primary',
-                  icon: 'global-important',
-                  tooltip: `${coins.toLocaleString()} coins to take from the market!`,
-                }
-              : undefined,
+        timer(0, 1000).pipe(
+          switchMap(() =>
+            this.store.select((state) =>
+              state.market.claimCoins > 0
+                ? {
+                    color: 'primary',
+                    icon: 'global-important',
+                    tooltip: 'Crafting complete!',
+                  }
+                : undefined,
+            ),
           ),
         ),
         this.marketService.claimedCoins$,

client/src/app/pages/login/login.page.ts

@@ -3,7 +3,6 @@ import { FormControl, FormGroup, Validators } from '@angular/forms';
 import { Router } from '@angular/router';
 import { MenuController } from '@ionic/angular';
 import { AnnouncementService } from '@services/announcement.service';
-import { NotificationsService } from '@services/notifications.service';
 import { AuthService } from '../../services/auth.service';
 
 import { marked } from 'marked';
@@ -80,7 +79,6 @@ export class LoginPage implements OnInit {
   constructor(
     public menu: MenuController,
     private authService: AuthService,
-    private notificationService: NotificationsService,
     public announcementService: AnnouncementService,
     private router: Router,
   ) {}
@@ -129,8 +127,7 @@ export class LoginPage implements OnInit {
             return;
           }
 
-          this.router.navigate(['/']);
-          this.notificationService.getNotifications();
+          this.authService.postLoginActions();
         },
         error: () => {
           this.loginError = 'Invalid email or password.';
@@ -179,8 +176,7 @@ export class LoginPage implements OnInit {
                   return;
                 }
 
-                this.router.navigate(['/']);
-                this.notificationService.getNotifications();
+                this.authService.postLoginActions();
               },
               error: (err) => {
                 this.registerError = err.error.message;

client/src/app/services/auth.service.ts

@@ -2,6 +2,10 @@ import { HttpClient } from '@angular/common/http';
 import { Injectable } from '@angular/core';
 import { Router } from '@angular/router';
 import { JwtHelperService } from '@auth0/angular-jwt';
+import { Store } from '@ngxs/store';
+import { MarketService } from '@services/market.service';
+import { NotificationsService } from '@services/notifications.service';
+import { SetClaimCoins } from '@stores/market/market.actions';
 import { interval, tap } from 'rxjs';
 import { environment } from '../../environments/environment';
 
@@ -10,9 +14,12 @@ import { environment } from '../../environments/environment';
 })
 export class AuthService {
   constructor(
+    private store: Store,
     private router: Router,
     private http: HttpClient,
     private jwtHelper: JwtHelperService,
+    private notificationService: NotificationsService,
+    private marketService: MarketService,
   ) {}
 
   public init() {
@@ -32,6 +39,7 @@ export class AuthService {
 
     this.login(lastEmail, lastPassword).subscribe(() => {
       this.updateToken();
+      this.postLoginActionsAlways();
     });
   }
 
@@ -78,4 +86,18 @@ export class AuthService {
 
     this.router.navigate(['/login']);
   }
+
+  public postLoginActions() {
+    this.router.navigate(['/']);
+
+    this.postLoginActionsAlways();
+  }
+
+  private postLoginActionsAlways() {
+    this.notificationService.getNotifications();
+
+    this.marketService.getClaimCoins().subscribe((coins) => {
+      this.store.dispatch(new SetClaimCoins(coins as number));
+    });
+  }
 }

client/src/interfaces/market.ts

@@ -2,5 +2,6 @@ import { IMarketItemExpanded, IPagination } from '@interfaces';
 
 export interface IMarketStore {
   version: number;
+  claimCoins: number;
   marketData: IPagination<IMarketItemExpanded>;
 }

client/src/stores/market/market.actions.ts

@@ -14,3 +14,8 @@ export class RepriceMarketItem {
   static type = 'RepriceMarketItem';
   constructor(public listingId: string, public newPrice: number) {}
 }
+
+export class SetClaimCoins {
+  static type = '[Market] Set Claim Coins';
+  constructor(public coins: number) {}
+}

client/src/stores/market/market.attachments.ts

@@ -2,16 +2,19 @@ import { IAttachment } from '../../interfaces';
 import {
   RemoveMarketItem,
   RepriceMarketItem,
+  SetClaimCoins,
   SetMarketItems,
 } from './market.actions';
 import {
   removeMarketItem,
   repriceMarketItem,
+  setClaimCoins,
   setMarketItems,
 } from './market.functions';
 
 export const attachments: IAttachment[] = [
   { action: SetMarketItems, handler: setMarketItems },
   { action: RemoveMarketItem, handler: removeMarketItem },
   { action: RepriceMarketItem, handler: repriceMarketItem },
+  { action: SetClaimCoins, handler: setClaimCoins },
 ];

client/src/stores/market/market.functions.ts

@@ -4,11 +4,13 @@ import { patch, removeItem, updateItem } from '@ngxs/store/operators';
 import {
   RemoveMarketItem,
   RepriceMarketItem,
+  SetClaimCoins,
   SetMarketItems,
 } from './market.actions';
 
 export const defaultStore: () => IMarketStore = () => ({
   version: 0,
+  claimCoins: 0,
   marketData: {
     lastPage: 0,
     page: 0,
@@ -61,3 +63,14 @@ export function repriceMarketItem(
     }),
   );
 }
+
+export function setClaimCoins(
+  ctx: StateContext<IMarketStore>,
+  { coins }: SetClaimCoins,
+) {
+  ctx.setState(
+    patch({
+      claimCoins: coins,
+    }),
+  );
+}

client/src/stores/market/market.store.ts

@@ -23,6 +23,11 @@ export class MarketStore {
     });
   }
 
+  @Selector()
+  static claimCoins(state: IMarketStore) {
+    return state.claimCoins ?? 0;
+  }
+
   @Selector()
   static marketData(state: IMarketStore) {
     return state.marketData;

client/src/styles/ionic-overrides.scss

@@ -49,3 +49,7 @@ ion-chip.readonly {
 ion-icon {
   transition: color 0.3s ease-in-out;
 }
+
+ion-card ion-list {
+  width: 100%;
+}