Permissions popup context iso

ts/context/NativeThemeListener.ts

@@ -1,51 +0,0 @@
-// Copyright 2021 Signal Messenger, LLC
-// SPDX-License-Identifier: AGPL-3.0-only
-/* eslint-disable no-restricted-syntax */
-
-import { NativeThemeState } from '../types/NativeThemeNotifier.d';
-
-export type Callback = (change: NativeThemeState) => void;
-
-export interface MinimalIPC {
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  sendSync(channel: string): any;
-
-  on(
-    channel: string,
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    listener: (event: unknown, ...args: ReadonlyArray<any>) => void
-  ): this;
-}
-
-export type SystemThemeHolder = { systemTheme: 'dark' | 'light' };
-
-export class NativeThemeListener {
-  private readonly subscribers = new Array<Callback>();
-
-  public theme: NativeThemeState;
-
-  constructor(ipc: MinimalIPC, private readonly holder: SystemThemeHolder) {
-    this.theme = ipc.sendSync('native-theme:init');
-    this.update();
-
-    ipc.on(
-      'native-theme:changed',
-      (_event: unknown, change: NativeThemeState) => {
-        this.theme = change;
-        this.update();
-
-        for (const fn of this.subscribers) {
-          fn(change);
-        }
-      }
-    );
-  }
-
-  public subscribe(fn: Callback): void {
-    this.subscribers.push(fn);
-  }
-
-  private update(): void {
-    this.holder.systemTheme = this.theme.shouldUseDarkColors ? 'dark' : 'light';
-  }
-}

ts/context/createNativeThemeListener.ts

@@ -0,0 +1,69 @@
+// Copyright 2021 Signal Messenger, LLC
+// SPDX-License-Identifier: AGPL-3.0-only
+/* eslint-disable no-restricted-syntax */
+
+import { NativeThemeState } from '../types/NativeThemeNotifier.d';
+
+export type Callback = (change: NativeThemeState) => void;
+
+export interface MinimalIPC {
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  sendSync(channel: string): any;
+
+  on(
+    channel: string,
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    listener: (event: unknown, ...args: ReadonlyArray<any>) => void
+  ): this;
+}
+
+type SystemThemeType = 'dark' | 'light';
+
+export type SystemThemeHolder = { systemTheme: SystemThemeType };
+
+type NativeThemeType = {
+  getSystemTheme: () => SystemThemeType;
+  subscribe: (fn: Callback) => void;
+  update: () => SystemThemeType;
+};
+
+export function createNativeThemeListener(
+  ipc: MinimalIPC,
+  holder: SystemThemeHolder
+): NativeThemeType {
+  const subscribers = new Array<Callback>();
+
+  let theme = ipc.sendSync('native-theme:init');
+  let systemTheme: SystemThemeType;
+
+  function update(): SystemThemeType {
+    const nextSystemTheme = theme.shouldUseDarkColors ? 'dark' : 'light';
+    // eslint-disable-next-line no-param-reassign
+    holder.systemTheme = nextSystemTheme;
+    return nextSystemTheme;
+  }
+
+  function subscribe(fn: Callback): void {
+    subscribers.push(fn);
+  }
+
+  ipc.on(
+    'native-theme:changed',
+    (_event: unknown, change: NativeThemeState) => {
+      theme = change;
+      systemTheme = update();
+
+      for (const fn of subscribers) {
+        fn(change);
+      }
+    }
+  );
+
+  systemTheme = update();
+
+  return {
+    getSystemTheme: () => systemTheme,
+    subscribe,
+    update,
+  };
+}

ts/context/index.ts

@@ -2,7 +2,10 @@
 // SPDX-License-Identifier: AGPL-3.0-only
 
 import { Bytes } from './Bytes';
-import { NativeThemeListener, MinimalIPC } from './NativeThemeListener';
+import {
+  createNativeThemeListener,
+  MinimalIPC,
+} from './createNativeThemeListener';
 
 export class Context {
   public readonly bytes = new Bytes();
@@ -10,6 +13,6 @@ export class Context {
   public readonly nativeThemeListener;
 
   constructor(ipc: MinimalIPC) {
-    this.nativeThemeListener = new NativeThemeListener(ipc, window);
+    this.nativeThemeListener = createNativeThemeListener(ipc, window);
   }
 }