@player-ui/async-node-plugin 0.8.0-next.3 → 0.8.0-next.4

package/src/index.ts

@@ -8,6 +8,7 @@ import type {
   Parser,
   ViewPlugin,
   Resolver,
+  Resolve,
 } from "@player-ui/player";
 import { AsyncParallelBailHook } from "tapable-ts";
 import queueMicrotask from "queue-microtask";
@@ -24,7 +25,7 @@ export interface AsyncNodeViewPlugin extends ViewPlugin {
   /** Use this to tap into the async node plugin hooks */
   applyPlugin: (asyncNodePlugin: AsyncNodePlugin) => void;
 
-  asyncNode: AsyncParallelBailHook<[Node.Async], any>;
+  asyncNode: AsyncParallelBailHook<[Node.Async, (result: any) => void], any>;
 }
 
 /**
@@ -44,7 +45,10 @@ export class AsyncNodePlugin implements PlayerPlugin {
   }
 
   public readonly hooks = {
-    onAsyncNode: new AsyncParallelBailHook<[Node.Async], any>(),
+    onAsyncNode: new AsyncParallelBailHook<
+      [Node.Async, (result: any) => void],
+      any
+    >(),
   };
 
   name = "AsyncNode";
@@ -61,7 +65,10 @@ export class AsyncNodePlugin implements PlayerPlugin {
 }
 
 export class AsyncNodePluginPlugin implements AsyncNodeViewPlugin {
-  public asyncNode = new AsyncParallelBailHook<[Node.Async], any>();
+  public asyncNode = new AsyncParallelBailHook<
+    [Node.Async, (result: any) => void],
+    any
+  >();
   private basePlugin: AsyncNodePlugin | undefined;
 
   name = "AsyncNode";
@@ -70,6 +77,67 @@ export class AsyncNodePluginPlugin implements AsyncNodeViewPlugin {
 
   private currentView: ViewInstance | undefined;
 
+  /**
+   * Updates the node asynchronously based on the result provided.
+   * This method is responsible for handling the update logic of asynchronous nodes.
+   * It checks if the node needs to be updated based on the new result and updates the mapping accordingly.
+   * If an update is necessary, it triggers an asynchronous update on the view.
+   * @param node The asynchronous node that might be updated.
+   * @param result The result obtained from resolving the async node. This could be any data structure or value.
+   * @param options Options provided for node resolution, including a potential parseNode function to process the result.
+   * @param view The view instance where the node resides. This can be undefined if the view is not currently active.
+   */
+  private handleAsyncUpdate(
+    node: Node.Async,
+    result: any,
+    options: Resolve.NodeResolveOptions,
+    view: ViewInstance | undefined,
+  ) {
+    const parsedNode =
+      options.parseNode && result ? options.parseNode(result) : undefined;
+
+    if (this.resolvedMapping.get(node.id) !== parsedNode) {
+      this.resolvedMapping.set(node.id, parsedNode ? parsedNode : node);
+      view?.updateAsync();
+    }
+  }
+
+  /**
+   * Handles the asynchronous API integration for resolving nodes.
+   * This method sets up a hook on the resolver's `beforeResolve` event to process async nodes.
+   * @param resolver The resolver instance to attach the hook to.
+   * @param view
+   */
+  applyResolver(resolver: Resolver) {
+    resolver.hooks.beforeResolve.tap(this.name, (node, options) => {
+      let resolvedNode;
+      if (this.isAsync(node)) {
+        const mappedValue = this.resolvedMapping.get(node.id);
+        if (mappedValue) {
+          resolvedNode = mappedValue;
+        }
+      } else {
+        resolvedNode = null;
+      }
+
+      const newNode = resolvedNode || node;
+      if (!resolvedNode && node?.type === NodeType.Async) {
+        queueMicrotask(async () => {
+          const result = await this.basePlugin?.hooks.onAsyncNode.call(
+            node,
+            (result) => {
+              this.handleAsyncUpdate(node, result, options, this.currentView);
+            },
+          );
+          this.handleAsyncUpdate(node, result, options, this.currentView);
+        });
+
+        return node;
+      }
+      return newNode;
+    });
+  }
+
   private isAsync(node: Node.Node | null): node is Node.Async {
     return node?.type === NodeType.Async;
   }
@@ -112,71 +180,10 @@ export class AsyncNodePluginPlugin implements AsyncNodeViewPlugin {
     );
   }
 
-  applyResolverHooks(resolver: Resolver) {
-    resolver.hooks.beforeResolve.tap(this.name, (node, options) => {
-      let resolvedNode;
-      if (this.isAsync(node)) {
-        const mappedValue = this.resolvedMapping.get(node.id);
-        if (mappedValue) {
-          resolvedNode = mappedValue;
-        }
-      } else {
-        resolvedNode = null;
-      }
-
-      const newNode = resolvedNode || node;
-      if (!resolvedNode && node?.type === NodeType.Async) {
-        queueMicrotask(async () => {
-          const result = await this.basePlugin?.hooks.onAsyncNode.call(node);
-          const parsedNode =
-            options.parseNode && result ? options.parseNode(result) : undefined;
-
-          if (parsedNode) {
-            this.resolvedMapping.set(node.id, parsedNode);
-            this.currentView?.updateAsync();
-          }
-        });
-
-        return node;
-      }
-
-      return newNode;
-    });
-  }
-
   apply(view: ViewInstance): void {
-    view.hooks.parser.tap("template", this.applyParser.bind(this));
-    view.hooks.resolver.tap("template", (resolver) => {
-      resolver.hooks.beforeResolve.tap(this.name, (node, options) => {
-        let resolvedNode;
-        if (this.isAsync(node)) {
-          const mappedValue = this.resolvedMapping.get(node.id);
-          if (mappedValue) {
-            resolvedNode = mappedValue;
-          }
-        } else {
-          resolvedNode = null;
-        }
-
-        const newNode = resolvedNode || node;
-        if (!resolvedNode && node?.type === NodeType.Async) {
-          queueMicrotask(async () => {
-            const result = await this.basePlugin?.hooks.onAsyncNode.call(node);
-            const parsedNode =
-              options.parseNode && result
-                ? options.parseNode(result)
-                : undefined;
-
-            this.resolvedMapping.set(node.id, parsedNode ? parsedNode : node);
-            view.updateAsync();
-          });
-
-          return node;
-        }
-
-        return newNode;
-      });
-    });
+    this.currentView = view;
+    view.hooks.parser.tap("async", this.applyParser.bind(this));
+    view.hooks.resolver.tap("async", this.applyResolver.bind(this));
   }
 
   applyPlugin(asyncNodePlugin: AsyncNodePlugin): void {

package/types/index.d.ts

@@ -8,7 +8,7 @@ export interface AsyncNodePluginOptions {
 export interface AsyncNodeViewPlugin extends ViewPlugin {
     /** Use this to tap into the async node plugin hooks */
     applyPlugin: (asyncNodePlugin: AsyncNodePlugin) => void;
-    asyncNode: AsyncParallelBailHook<[Node.Async], any>;
+    asyncNode: AsyncParallelBailHook<[Node.Async, (result: any) => void], any>;
 }
 /**
  * Async node plugin used to resolve async nodes in the content
@@ -18,20 +18,37 @@ export declare class AsyncNodePlugin implements PlayerPlugin {
     private plugins;
     constructor(options: AsyncNodePluginOptions);
     readonly hooks: {
-        onAsyncNode: AsyncParallelBailHook<[Node.Async], any, Record<string, any>>;
+        onAsyncNode: AsyncParallelBailHook<[Node.Async, (result: any) => void], any, Record<string, any>>;
     };
     name: string;
     apply(player: Player): void;
 }
 export declare class AsyncNodePluginPlugin implements AsyncNodeViewPlugin {
-    asyncNode: AsyncParallelBailHook<[Node.Async], any, Record<string, any>>;
+    asyncNode: AsyncParallelBailHook<[Node.Async, (result: any) => void], any, Record<string, any>>;
     private basePlugin;
     name: string;
     private resolvedMapping;
     private currentView;
+    /**
+     * Updates the node asynchronously based on the result provided.
+     * This method is responsible for handling the update logic of asynchronous nodes.
+     * It checks if the node needs to be updated based on the new result and updates the mapping accordingly.
+     * If an update is necessary, it triggers an asynchronous update on the view.
+     * @param node The asynchronous node that might be updated.
+     * @param result The result obtained from resolving the async node. This could be any data structure or value.
+     * @param options Options provided for node resolution, including a potential parseNode function to process the result.
+     * @param view The view instance where the node resides. This can be undefined if the view is not currently active.
+     */
+    private handleAsyncUpdate;
+    /**
+     * Handles the asynchronous API integration for resolving nodes.
+     * This method sets up a hook on the resolver's `beforeResolve` event to process async nodes.
+     * @param resolver The resolver instance to attach the hook to.
+     * @param view
+     */
+    applyResolver(resolver: Resolver): void;
     private isAsync;
     applyParser(parser: Parser): void;
-    applyResolverHooks(resolver: Resolver): void;
     apply(view: ViewInstance): void;
     applyPlugin(asyncNodePlugin: AsyncNodePlugin): void;
 }