build: separate module for frontend

This allows us to simplify the webpack configuration and the gradle
build scripts.

4 files changed, 206 insertions, 0 deletions

diff --git a/subprojects/frontend/src/utils/ConditionVariable.ts b/subprojects/frontend/src/utils/ConditionVariable.ts
new file mode 100644
index 00000000..0910dfa6
--- /dev/null
+++ b/subprojects/frontend/src/utils/ConditionVariable.ts
@@ -0,0 +1,64 @@
+import { getLogger } from './logger';
+import { PendingTask } from './PendingTask';
+
+const log = getLogger('utils.ConditionVariable');
+
+export type Condition = () => boolean;
+
+export class ConditionVariable {
+  condition: Condition;
+
+  defaultTimeout: number;
+
+  listeners: PendingTask<void>[] = [];
+
+  constructor(condition: Condition, defaultTimeout = 0) {
+    this.condition = condition;
+    this.defaultTimeout = defaultTimeout;
+  }
+
+  async waitFor(timeoutMs: number | null = null): Promise<void> {
+    if (this.condition()) {
+      return;
+    }
+    const timeoutOrDefault = timeoutMs || this.defaultTimeout;
+    let nowMs = Date.now();
+    const endMs = nowMs + timeoutOrDefault;
+    while (!this.condition() && nowMs < endMs) {
+      const remainingMs = endMs - nowMs;
+      const promise = new Promise<void>((resolve, reject) => {
+        if (this.condition()) {
+          resolve();
+          return;
+        }
+        const task = new PendingTask(resolve, reject, remainingMs);
+        this.listeners.push(task);
+      });
+      // We must keep waiting until the update has completed,
+      // so the tasks can't be started in parallel.
+      // eslint-disable-next-line no-await-in-loop
+      await promise;
+      nowMs = Date.now();
+    }
+    if (!this.condition()) {
+      log.error('Condition still does not hold after', timeoutOrDefault, 'ms');
+      throw new Error('Failed to wait for condition');
+    }
+  }
+
+  notifyAll(): void {
+    this.clearListenersWith((listener) => listener.resolve());
+  }
+
+  rejectAll(error: unknown): void {
+    this.clearListenersWith((listener) => listener.reject(error));
+  }
+
+  private clearListenersWith(callback: (listener: PendingTask<void>) => void) {
+    // Copy `listeners` so that we don't get into a race condition
+    // if one of the listeners adds another listener.
+    const { listeners } = this;
+    this.listeners = [];
+    listeners.forEach(callback);
+  }
+}
diff --git a/subprojects/frontend/src/utils/PendingTask.ts b/subprojects/frontend/src/utils/PendingTask.ts
new file mode 100644
index 00000000..51b79fb0
--- /dev/null
+++ b/subprojects/frontend/src/utils/PendingTask.ts
@@ -0,0 +1,60 @@
+import { getLogger } from './logger';
+
+const log = getLogger('utils.PendingTask');
+
+export class PendingTask<T> {
+  private readonly resolveCallback: (value: T) => void;
+
+  private readonly rejectCallback: (reason?: unknown) => void;
+
+  private resolved = false;
+
+  private timeout: number | null;
+
+  constructor(
+    resolveCallback: (value: T) => void,
+    rejectCallback: (reason?: unknown) => void,
+    timeoutMs?: number,
+    timeoutCallback?: () => void,
+  ) {
+    this.resolveCallback = resolveCallback;
+    this.rejectCallback = rejectCallback;
+    if (timeoutMs) {
+      this.timeout = setTimeout(() => {
+        if (!this.resolved) {
+          this.reject(new Error('Request timed out'));
+          if (timeoutCallback) {
+            timeoutCallback();
+          }
+        }
+      }, timeoutMs);
+    } else {
+      this.timeout = null;
+    }
+  }
+
+  resolve(value: T): void {
+    if (this.resolved) {
+      log.warn('Trying to resolve already resolved promise');
+      return;
+    }
+    this.markResolved();
+    this.resolveCallback(value);
+  }
+
+  reject(reason?: unknown): void {
+    if (this.resolved) {
+      log.warn('Trying to reject already resolved promise');
+      return;
+    }
+    this.markResolved();
+    this.rejectCallback(reason);
+  }
+
+  private markResolved() {
+    this.resolved = true;
+    if (this.timeout !== null) {
+      clearTimeout(this.timeout);
+    }
+  }
+}
diff --git a/subprojects/frontend/src/utils/Timer.ts b/subprojects/frontend/src/utils/Timer.ts
new file mode 100644
index 00000000..8f653070
--- /dev/null
+++ b/subprojects/frontend/src/utils/Timer.ts
@@ -0,0 +1,33 @@
+export class Timer {
+  readonly callback: () => void;
+
+  readonly defaultTimeout: number;
+
+  timeout: number | null = null;
+
+  constructor(callback: () => void, defaultTimeout = 0) {
+    this.callback = () => {
+      this.timeout = null;
+      callback();
+    };
+    this.defaultTimeout = defaultTimeout;
+  }
+
+  schedule(timeout: number | null = null): void {
+    if (this.timeout === null) {
+      this.timeout = setTimeout(this.callback, timeout || this.defaultTimeout);
+    }
+  }
+
+  reschedule(timeout: number | null = null): void {
+    this.cancel();
+    this.schedule(timeout);
+  }
+
+  cancel(): void {
+    if (this.timeout !== null) {
+      clearTimeout(this.timeout);
+      this.timeout = null;
+    }
+  }
+}
diff --git a/subprojects/frontend/src/utils/logger.ts b/subprojects/frontend/src/utils/logger.ts
new file mode 100644
index 00000000..306d122c
--- /dev/null
+++ b/subprojects/frontend/src/utils/logger.ts
@@ -0,0 +1,49 @@
+import styles, { CSPair } from 'ansi-styles';
+import log from 'loglevel';
+import * as prefix from 'loglevel-plugin-prefix';
+
+const colors: Partial<Record<string, CSPair>> = {
+  TRACE: styles.magenta,
+  DEBUG: styles.cyan,
+  INFO: styles.blue,
+  WARN: styles.yellow,
+  ERROR: styles.red,
+};
+
+prefix.reg(log);
+
+if (DEBUG) {
+  log.setLevel(log.levels.DEBUG);
+} else {
+  log.setLevel(log.levels.WARN);
+}
+
+if ('chrome' in window) {
+  // Only Chromium supports console ANSI escape sequences.
+  prefix.apply(log, {
+    format(level, name, timestamp) {
+      const formattedTimestamp = `${styles.gray.open}[${timestamp.toString()}]${styles.gray.close}`;
+      const levelColor = colors[level.toUpperCase()] || styles.red;
+      const formattedLevel = `${levelColor.open}${level}${levelColor.close}`;
+      const formattedName = `${styles.green.open}(${name || 'root'})${styles.green.close}`;
+      return `${formattedTimestamp} ${formattedLevel} ${formattedName}`;
+    },
+  });
+} else {
+  prefix.apply(log, {
+    template: '[%t] %l (%n)',
+  });
+}
+
+const appLogger = log.getLogger(PACKAGE_NAME);
+
+appLogger.info('Version:', PACKAGE_NAME, PACKAGE_VERSION);
+appLogger.info('Debug mode:', DEBUG);
+
+export function getLoggerFromRoot(name: string | symbol): log.Logger {
+  return log.getLogger(name);
+}
+
+export function getLogger(name: string | symbol): log.Logger {
+  return getLoggerFromRoot(`${PACKAGE_NAME}.${name.toString()}`);
+}