First try getting focusstats in

src/app/pages/modus/focus/focus.service.ts

@@ -1,11 +1,14 @@
 import {FocusStats} from "./focus-stats";
 import {FocusState} from "./focus-state";
 import {Injectable} from "@angular/core";
+import {BehaviorSubject, Observable} from "rxjs";
 
 @Injectable({  providedIn: 'root',})
 export class FocusService {
   current: {state: FocusState, start: Date} = {state: FocusState.STOPPED, start: new Date()};
-  stats: FocusStats = new FocusStats();
+  private localStats = new FocusStats();
+  private statsSubject: BehaviorSubject<FocusStats> = new BehaviorSubject<FocusStats>(this.localStats);
+  $stats: Observable<FocusStats> = this.statsSubject.asObservable();
 
   private startState(state: FocusState) {
     this.current.state = state;
@@ -27,9 +30,11 @@ export class FocusService {
   stopCurrent(forced: boolean) {
     if (!forced) {
       const deltaInMs = new Date().getTime() - this.current.start.getTime();
-      this.stats.inc(this.current.state, deltaInMs);
+      this.localStats.inc(this.current.state, deltaInMs);
+      this.statsSubject.next(this.localStats);
     } else {
-      this.stats.inc(this.current.state);
+      this.localStats.inc(this.current.state);
+      this.statsSubject.next(this.localStats);
     }
   }
 
@@ -45,22 +50,22 @@ export class FocusService {
   }
 
   getFocusCycles(): number {
-    return this.stats.focusCycles;
+    return this.localStats.focusCycles;
   }
 
   getFocusTime(): string {
-    return this.formatDelta(this.stats.focusTimeInMs);
+    return this.formatDelta(this.localStats.focusTimeInMs);
   }
 
   getShortBreakCycles(): number {
-    return this.stats.shortBreakCycles;
+    return this.localStats.shortBreakCycles;
   }
 
   getLongBreakCycles(): number {
-    return this.stats.longBreakCycles;
+    return this.localStats.longBreakCycles;
   }
 
   getBreakTime(): string {
-    return this.formatDelta(this.stats.breakTimeInMs);
+    return this.formatDelta(this.localStats.breakTimeInMs);
   }
 }