@netless/app-slide 0.2.106-beta.4 → 0.2.106

package/src/utils/freezer.ts

@@ -1,9 +1,10 @@
-import type { ReadonlyTeleBox, RegisterParams } from "@netless/window-manager";
-import { log } from "./logger";
+import type { AppContext, ReadonlyTeleBox, RegisterParams } from "@netless/window-manager";
+import { log, logger } from "./logger";
 
 export interface FreezableSlide {
-  freeze: () => void;
-  unfreeze: () => void;
+  freeze: () => void | Promise<void>;
+  unfreeze: () => void | Promise<void>;
+  context?: AppContext<any, any, any>;
 }
 
 export let useFreezer = false;
@@ -22,54 +23,121 @@ const inspect = (arr: string[]) => {
   return "[" + arr + "]";
 };
 
+const FreezerRetryDelay = 500;
+
 export const apps = {
   map: new Map<string, FreezableSlide>(),
   boxes: new Map<string, ReadonlyTeleBox>(),
   queue: [] as string[],
-  validateQueue() {
+  focusedAppId: undefined as string | undefined,
+  runTransition(
+    appId: string,
+    slide: FreezableSlide,
+    action: "freeze" | "unfreeze",
+    retried = false
+  ) {
+    try {
+      const result = action === "freeze" ? slide.freeze() : slide.unfreeze();
+      void Promise.resolve(result).catch(error =>
+        this.onTransitionFailure(appId, slide, action, error, retried)
+      );
+    } catch (error) {
+      void Promise.resolve().then(() =>
+        this.onTransitionFailure(appId, slide, action, error, retried)
+      );
+    }
+  },
+  onTransitionFailure(
+    appId: string,
+    slide: FreezableSlide,
+    action: "freeze" | "unfreeze",
+    error: unknown,
+    retried: boolean
+  ) {
+    logger.warn(`[Slide] freezer: ${action} failed`, appId, error);
+    if (this.map.get(appId) !== slide) return;
+    // A failed freeze still occupies a cache slot until a later validation succeeds.
+    if (action === "freeze" && !this.queue.includes(appId)) this.queue.push(appId);
+    if (retried) return;
+    if (action === "freeze" ? this.focusedAppId === appId : this.focusedAppId !== appId) return;
+    setTimeout(() => {
+      if (this.map.get(appId) !== slide) return;
+      if (action === "freeze") {
+        if (this.focusedAppId !== appId && this.queue.length > FreezerLength) {
+          this.validateQueue(true);
+        }
+      } else if (this.focusedAppId === appId) {
+        this.runTransition(appId, slide, action, true);
+      }
+    }, FreezerRetryDelay);
+  },
+  validateQueue(retried = false) {
     // queue = [5, 4, 3, 2, 1]
     this.queue.sort((a, b) => {
       const za = this.boxes.get(a)?.zIndex ?? 0;
       const zb = this.boxes.get(b)?.zIndex ?? 0;
       return -(za - zb);
     });
-    log("[Slide] freezer: validate", inspect(this.queue));
+    const validated = [...this.queue];
+    const frozen: string[] = [];
+    const missing: string[] = [];
     while (this.queue.length > FreezerLength) {
       const appId = this.queue.pop() as string;
       const slide = this.map.get(appId);
       if (slide) {
-        log("[Slide] freezer: validate-freeze", appId, inspect(this.queue));
-        slide.freeze();
+        this.runTransition(appId, slide, "freeze", retried);
+        frozen.push(appId);
+      } else {
+        missing.push(appId);
       }
     }
+    return { validated, frozen, missing };
   },
   set(appId: string, slide: FreezableSlide, box: ReadonlyTeleBox) {
-    log("[Slide] freezer: add", appId, inspect(this.queue));
     this.map.set(appId, slide);
     this.boxes.set(appId, box);
     if (!this.queue.includes(appId)) {
       this.queue.unshift(appId);
     }
-    this.validateQueue();
+    const { validated, frozen, missing } = this.validateQueue();
+    log(
+      "[Slide] freezer: add",
+      appId,
+      inspect(this.queue),
+      "validate",
+      inspect(validated),
+      ...(frozen.length ? ["freeze-requested", inspect(frozen)] : []),
+      ...(missing.length ? ["missing", inspect(missing)] : [])
+    );
   },
   delete(appId: string) {
     this.map.delete(appId);
     this.boxes.delete(appId);
     this.queue = this.queue.filter(id => id !== appId);
+    if (this.focusedAppId === appId) this.focusedAppId = undefined;
     log("[Slide] freezer: delete", appId, inspect(this.queue));
   },
   focus(appId: string) {
+    this.focusedAppId = appId;
     const slide = this.map.get(appId);
     const index = this.queue.indexOf(appId);
     if (index > -1) {
       this.queue.splice(index, 1);
     }
     this.queue.unshift(appId);
-    this.validateQueue();
-    log("[Slide] freezer: focus", appId, inspect(this.queue));
+    const { validated, frozen, missing } = this.validateQueue();
     if (slide) {
-      slide.unfreeze();
+      this.runTransition(appId, slide, "unfreeze");
     }
+    log(
+      slide ? "[Slide] freezer: focus" : "[Slide] freezer: focus-missing",
+      appId,
+      inspect(this.queue),
+      "validate",
+      inspect(validated),
+      ...(frozen.length ? ["freeze-requested", inspect(frozen)] : []),
+      ...(missing.length ? ["missing", inspect(missing)] : [])
+    );
   },
 };
 

package/src/utils/logger.ts

@@ -1,14 +1,35 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
-import type { AppContext, Displayer } from "@netless/window-manager";
+import type { AppContext } from "@netless/window-manager";
 import type { SlideController } from "../SlideController";
 import { isObj } from "./helpers";
 
 type DebugMessage = { slide: boolean | "__instance" | "__debug" };
 
-type RoomLogger = {
+type WindowManagerLogger = {
   debug: (...args: any) => void;
   info: (...args: any) => void;
   warn: (...args: any) => void;
+  error: (...args: any) => void;
+};
+
+type LogLevel = keyof WindowManagerLogger;
+
+const getAppLogger = (context: AppContext<any, any, any>): WindowManagerLogger | undefined => {
+  try {
+    return context.getWindowManager()?.Logger as WindowManagerLogger | undefined;
+  } catch {
+    return undefined;
+  }
+};
+
+const reportAppLog = (appLogger: WindowManagerLogger | null, level: LogLevel, ...args: any[]) => {
+  try {
+    if (appLogger) appLogger[level](...args);
+    else if (level === "info" || level === "debug") console.log(...args);
+    else console[level](...args);
+  } catch {
+    // Diagnostics must not affect App setup or resource cleanup.
+  }
 };
 
 class Logger {
@@ -33,7 +54,8 @@ class Logger {
 
   public level: "debug" | "verbose" = import.meta.env.DEV ? "verbose" : "debug";
 
-  public roomLogger: RoomLogger | null = null;
+  /** Legacy field name; the value comes from WindowManager.Logger. */
+  public roomLogger: WindowManagerLogger | null = null;
 
   constructor(public enable: boolean) {
     this.initialize();
@@ -48,27 +70,21 @@ class Logger {
   }
 
   log(...args: any[]) {
-    if (this.roomLogger) {
-      this.roomLogger.info(...args);
-    } else if (this.enable) {
-      console.log(...args);
-    }
+    if (this.roomLogger || this.enable) reportAppLog(this.roomLogger, "info", ...args);
   }
 
   verbose(...args: any[]) {
-    if (this.roomLogger) {
-      this.roomLogger.debug(...args);
-    } else if (this.enable && this.level === "verbose") {
-      console.log(...args);
+    if (this.roomLogger || (this.enable && this.level === "verbose")) {
+      reportAppLog(this.roomLogger, "debug", ...args);
     }
   }
 
   warn(...args: any[]) {
-    if (this.roomLogger) {
-      this.roomLogger.warn(...args);
-    } else {
-      console.warn(...args);
-    }
+    reportAppLog(this.roomLogger, "warn", ...args);
+  }
+
+  error(...args: any[]) {
+    reportAppLog(this.roomLogger, "error", ...args);
   }
 
   /**
@@ -101,6 +117,6 @@ class Logger {
 export const logger = /** @__PURE__ */ new Logger(import.meta.env.DEV);
 export const log = /** @__PURE__ */ logger.log.bind(logger);
 export const verbose = /** @__PURE__ */ logger.verbose.bind(logger);
-export const setRoomLogger = (displayer: Displayer) => {
-  logger.roomLogger = (displayer as any).logger;
+export const setRoomLogger = (context: AppContext<any, any, any>) => {
+  logger.roomLogger = getAppLogger(context) ?? null;
 };