add rxjs :/

package.json

@@ -63,6 +63,7 @@
     "inferno-helmet": "^5.2.1",
     "inferno-hydrate": "^8.1.1",
     "inferno-i18next-dess": "0.0.2",
+    "inferno-mobx": "^8.2.2",
     "inferno-router": "^8.1.1",
     "inferno-server": "^8.1.1",
     "isomorphic-cookie": "^1.2.4",
@@ -78,6 +79,7 @@
     "markdown-it-sub": "^1.0.0",
     "markdown-it-sup": "^1.0.0",
     "mini-css-extract-plugin": "^2.7.5",
+    "mobx": "^6.9.0",
     "register-service-worker": "^1.7.2",
     "run-node-webpack-plugin": "^1.3.0",
     "sanitize-html": "^2.10.0",

src/shared/components/app/navbar.tsx

@@ -44,6 +44,12 @@ export class Navbar extends Component<NavbarProps, NavbarState> {
     this.handleOutsideMenuClick = this.handleOutsideMenuClick.bind(this);
   }
 
+  componentWillMount(): void {
+    InboxService.observable.subscribe(() => {
+      this.render();
+    });
+  }
+
   componentDidMount() {
     // Subscribe to jwt changes
     if (isBrowser()) {

src/shared/services/InboxService.ts

@@ -7,6 +7,7 @@ import {
   GetUnreadCountResponse,
   GetUnreadRegistrationApplicationCountResponse,
 } from "lemmy-js-client";
+import { Observable, Subscriber } from "rxjs";
 import { updateUnreadCountsInterval } from "../config";
 import { HttpService, UserService } from "../services";
 import { RequestState } from "../services/HttpService";
@@ -17,11 +18,20 @@ export class InboxService {
   unreadReportCountRes: RequestState<GetReportCountResponse>;
   unreadApplicationCountRes: RequestState<GetUnreadRegistrationApplicationCountResponse>;
 
+  observable: Observable<unknown>;
+  subscriber: Subscriber<unknown> | null;
+
   private constructor() {
     this.unreadInboxCountRes = { state: "empty" };
     this.unreadReportCountRes = { state: "empty" };
     this.unreadApplicationCountRes = { state: "empty" };
 
+    this.observable = new Observable(s => {
+      this.subscriber = s;
+    });
+
+    this.subscriber = null;
+
     this.startPoll();
     this.fetchUnreadCounts();
   }
@@ -72,6 +82,10 @@ export class InboxService {
     return this.#Instance.unreadApplicationCount();
   }
 
+  public static get observable(): Observable<unknown> {
+    return this.#Instance.observable;
+  }
+
   get isModerator(): boolean {
     const mods = UserService.Instance.myUserInfo?.moderates;
     const moderates = (mods && mods.length > 0) || false;
@@ -113,6 +127,8 @@ export class InboxService {
           });
       }
     }
+
+    this.subscriber?.next();
   }
 
   public static fetchUnreadCounts() {