@plasmicapp/data-sources 1.0.0 → 1.0.2

package/dist/index.js

@@ -75,7 +75,6 @@ __export(src_exports, {
   makeCacheKey: () => makeCacheKey,
   makeQueryCacheKey: () => makeQueryCacheKey,
   normalizeData: () => normalizeData,
-  unstable_createDollarQueries: () => createDollarQueries,
   unstable_executePlasmicQueries: () => executePlasmicQueries,
   unstable_usePlasmicQueries: () => usePlasmicQueries,
   unstable_wrapDollarQueriesForMetadata: () => wrapDollarQueriesForMetadata,
@@ -429,16 +428,29 @@ var StatefulQueryResult = class {
   }
 };
 function safeExec(tryData, ifUndefined, ifError) {
+  const result = safeExecResult(tryData);
+  if ("promise" in result) {
+    return ifUndefined(result.promise);
+  } else if ("error" in result) {
+    return ifError(result.error);
+  } else {
+    return result.data;
+  }
+}
+function safeExecResult(tryData) {
   try {
-    return tryData();
+    return { data: tryData() };
   } catch (err) {
     if (isPlasmicUndefinedDataErrorPromise(err)) {
-      return ifUndefined(err);
+      return { promise: err };
     } else {
-      return ifError(err);
+      return { error: err };
     }
   }
 }
+function assertUnexpectedNodeType(x) {
+  throw new Error(`Unexpected node type: ${x}`);
+}
 function resolveParams(params) {
   return safeExec(
     () => ({
@@ -519,6 +531,19 @@ var SyncPromise = class {
     );
   }
 };
+function shallowEqualRecords(a, b) {
+  if (Object.is(a, b)) {
+    return true;
+  }
+  const aKeys = Object.keys(a);
+  const bKeys = Object.keys(b);
+  if (aKeys.length !== bKeys.length) {
+    return false;
+  }
+  return aKeys.every(
+    (key) => Object.prototype.hasOwnProperty.call(b, key) && Object.is(a[key], b[key])
+  );
+}
 var SettablePromise = class {
   constructor() {
     this.promise = new Promise((resolve, reject) => {
@@ -614,7 +639,31 @@ function sortObjectsDeep(value, visitedObjects) {
 
 // src/serverQueries/client.ts
 var GLOBAL_CACHE = /* @__PURE__ */ new Map();
-function usePlasmicQueries($queries, queries) {
+function usePlasmicQueries(tree, $props, $ctx, $state) {
+  const stableProps = useShallowStableRecord($props);
+  const stableCtx = useShallowStableRecord($ctx);
+  const $stateRef = React3.useRef($state != null ? $state : {});
+  $stateRef.current = $state != null ? $state : {};
+  const $queries = React3.useMemo(
+    () => createDollarQueries(Object.keys(tree.queries)),
+    [tree]
+  );
+  const queries = React3.useMemo(() => {
+    return mapRecords(
+      (_name, q) => ({
+        id: q.id,
+        fn: q.fn,
+        execParams: () => q.args({
+          $q: $queries,
+          $props: stableProps,
+          $ctx: stableCtx,
+          $state: $stateRef.current,
+          $scopedItemVars: {}
+        })
+      }),
+      tree.queries
+    );
+  }, [$queries, stableCtx, stableProps, tree]);
   const wrappedQueries = React3.useMemo(() => wrapQueries(queries), [queries]);
   const $queryStates = $queries;
   const { fallback: prefetchedCache, cache: swrCache } = (0, import_query2.usePlasmicDataConfig)();
@@ -681,13 +730,14 @@ function usePlasmicQueries($queries, queries) {
     },
     [wrappedQueries, $queryStates, settledCount]
   );
-  return mapRecords(
+  mapRecords(
     (_queryName, $query, query) => {
-      return usePlasmicQuery($query, query, settledCount);
+      usePlasmicQuery($query, query, settledCount);
     },
     $queryStates,
     wrappedQueries
   );
+  return $queries;
 }
 function wrapQueries(queries) {
   return mapRecords((_queryName, query) => {
@@ -812,24 +862,261 @@ function usePlasmicQuery($query, query, settledCount) {
   }
   return result;
 }
+function useShallowStableRecord(value) {
+  const ref = React3.useRef(value);
+  if (!shallowEqualRecords(ref.current, value)) {
+    ref.current = value;
+  }
+  return ref.current;
+}
 
 // src/serverQueries/server.ts
-function executePlasmicQueries($queries, queries) {
-  return __async(this, null, function* () {
-    const doneQueryResults = yield Promise.all(
-      mapRecordEntries(
-        (_queryName, $query, query) => {
-          return executePlasmicQuery($query, query);
-        },
-        $queries,
-        queries
-      )
+var ROOT_COMPONENT_KEY_PATH = "root";
+function appendKeyPath(currentKeyPath, currentInput) {
+  return currentKeyPath ? `${currentKeyPath}/${currentInput}` : currentInput;
+}
+function executeQueryTree(rootNode, options, queriesByComponent) {
+  const { $props, $ctx } = options;
+  const initialContext = {
+    $props,
+    $ctx,
+    $state: {},
+    $q: {},
+    $scopedItemVars: {}
+  };
+  return executeComponentNode(rootNode, {
+    context: initialContext,
+    parentKeyPath: "",
+    childIndex: 0,
+    queriesByComponent
+  });
+}
+function executeNode(node, params) {
+  const p = { node, params, type: node.type };
+  switch (p.type) {
+    case "component":
+      return executeComponentNode(p.node, p.params);
+    case "codeComponent":
+      return executeCodeComponentNode(p.node, p.params);
+    case "dataProvider":
+      return executeDataProviderNode(p.node, p.params);
+    case "visibility":
+      return executeVisibilityNode(p.node, p.params);
+    case "repeated":
+      return executeRepeatedNode(p.node, p.params);
+    default:
+      assertUnexpectedNodeType(p);
+  }
+}
+function executeComponentNode(node, params) {
+  const {
+    context: parentContext,
+    parentKeyPath,
+    childIndex,
+    queriesByComponent
+  } = params;
+  const isRoot = parentKeyPath === "";
+  let componentKeyPath;
+  let evaluatedProps;
+  if (isRoot) {
+    componentKeyPath = ROOT_COMPONENT_KEY_PATH;
+    evaluatedProps = parentContext.$props;
+  } else {
+    componentKeyPath = appendKeyPath(parentKeyPath, `c${childIndex}`);
+    evaluatedProps = {};
+    for (const [propName, propFn] of Object.entries(node.propsContext)) {
+      const result = safeExecResult(() => propFn(parentContext));
+      if (!("data" in result)) {
+        return [];
+      }
+      evaluatedProps[propName] = result.data;
+    }
+  }
+  let componentQueries = queriesByComponent.get(componentKeyPath);
+  if (!componentQueries) {
+    componentQueries = {};
+    queriesByComponent.set(componentKeyPath, componentQueries);
+  }
+  const componentContext = {
+    $props: evaluatedProps,
+    $ctx: parentContext.$ctx,
+    $state: parentContext.$state,
+    $q: componentQueries,
+    $scopedItemVars: parentContext.$scopedItemVars
+  };
+  const discovered = [];
+  for (const [queryName, query] of Object.entries(node.queries)) {
+    if (componentQueries[queryName]) {
+      continue;
+    }
+    const $query = new StatefulQueryResult();
+    componentQueries[queryName] = $query;
+    const capturedContext = componentContext;
+    const capturedArgsFn = query.args;
+    const plasmicQuery = {
+      id: query.id,
+      fn: query.fn,
+      execParams: () => capturedArgsFn(capturedContext)
+    };
+    discovered.push({ $query, query: plasmicQuery });
+  }
+  node.children.forEach((child, idx) => {
+    discovered.push(
+      ...executeNode(child, {
+        context: componentContext,
+        parentKeyPath: componentKeyPath,
+        childIndex: idx,
+        queriesByComponent
+      })
     );
-    return Object.fromEntries(
-      Object.values(doneQueryResults).map(($query) => [$query.key, $query.data])
+  });
+  return discovered;
+}
+function executeCodeComponentNode(node, params) {
+  if (node.serverRenderingConfig === false) {
+    return [];
+  }
+  const { context, parentKeyPath, childIndex, queriesByComponent } = params;
+  const nodeKeyPath = appendKeyPath(parentKeyPath, `cc${childIndex}`);
+  const evaluatedProps = {};
+  for (const [propName, propFn] of Object.entries(node.propsContext)) {
+    const result = safeExecResult(() => propFn(context));
+    if ("data" in result) {
+      evaluatedProps[propName] = result.data;
+    } else {
+      return [];
+    }
+  }
+  const childContext = {
+    $props: evaluatedProps,
+    $ctx: context.$ctx,
+    $state: context.$state,
+    $q: context.$q,
+    $scopedItemVars: context.$scopedItemVars
+  };
+  return node.children.flatMap(
+    (child, idx) => executeNode(child, {
+      context: childContext,
+      parentKeyPath: nodeKeyPath,
+      childIndex: idx,
+      queriesByComponent
+    })
+  );
+}
+function executeDataProviderNode(node, params) {
+  const { context, parentKeyPath, childIndex, queriesByComponent } = params;
+  const nodeKeyPath = appendKeyPath(parentKeyPath, `dp${childIndex}`);
+  const dataResult = safeExecResult(() => node.data(context));
+  if (!("data" in dataResult)) {
+    return [];
+  }
+  const childContext = {
+    $props: context.$props,
+    $ctx: __spreadProps(__spreadValues({}, context.$ctx), {
+      [node.name]: dataResult.data
+    }),
+    $state: context.$state,
+    $q: context.$q,
+    $scopedItemVars: context.$scopedItemVars
+  };
+  return node.children.flatMap(
+    (child, idx) => executeNode(child, {
+      context: childContext,
+      parentKeyPath: nodeKeyPath,
+      childIndex: idx,
+      queriesByComponent
+    })
+  );
+}
+function executeVisibilityNode(node, params) {
+  const { context, parentKeyPath, childIndex, queriesByComponent } = params;
+  const nodeKeyPath = appendKeyPath(parentKeyPath, `v${childIndex}`);
+  const visibilityResult = safeExecResult(() => node.visibilityExpr(context));
+  if (!("data" in visibilityResult) || !visibilityResult.data) {
+    return [];
+  }
+  return node.children.flatMap(
+    (child, idx) => executeNode(child, {
+      context,
+      parentKeyPath: nodeKeyPath,
+      childIndex: idx,
+      queriesByComponent
+    })
+  );
+}
+function executeRepeatedNode(node, params) {
+  const { context, parentKeyPath, childIndex, queriesByComponent } = params;
+  const nodeKeyPath = appendKeyPath(parentKeyPath, `r${childIndex}`);
+  const collectionResult = safeExecResult(() => node.collectionExpr(context));
+  if (!("data" in collectionResult) || !Array.isArray(collectionResult.data)) {
+    return [];
+  }
+  return collectionResult.data.flatMap((item, index) => {
+    const itemContext = {
+      $props: context.$props,
+      $ctx: context.$ctx,
+      $state: context.$state,
+      $q: context.$q,
+      $scopedItemVars: __spreadProps(__spreadValues({}, context.$scopedItemVars), {
+        [node.itemName]: item,
+        [node.indexName]: index
+      })
+    };
+    const itemKeyPath = appendKeyPath(nodeKeyPath, `i${index}`);
+    return node.children.flatMap(
+      (child, idx) => executeNode(child, {
+        context: itemContext,
+        parentKeyPath: itemKeyPath,
+        childIndex: idx,
+        queriesByComponent
+      })
     );
   });
 }
+function executePlasmicQueries(rootNode, options) {
+  return __async(this, null, function* () {
+    const queriesByComponent = /* @__PURE__ */ new Map();
+    const discoveredQueries = [];
+    while (true) {
+      const newQueries = executeQueryTree(rootNode, options, queriesByComponent);
+      if (newQueries.length === 0) {
+        break;
+      }
+      discoveredQueries.push(...newQueries);
+      yield Promise.all(
+        newQueries.map(
+          (d) => executePlasmicQuery(d.$query, d.query).catch(() => {
+          })
+        )
+      );
+    }
+    const cache = {};
+    for (const d of discoveredQueries) {
+      if ("data" in d.$query.current) {
+        cache[d.$query.current.key] = d.$query.current.data;
+      }
+    }
+    const queries = {};
+    const rootQueries = queriesByComponent.get(ROOT_COMPONENT_KEY_PATH);
+    if (rootQueries) {
+      for (const [name, $query] of Object.entries(rootQueries)) {
+        if ("data" in $query.current) {
+          queries[name] = {
+            key: $query.key,
+            data: $query.current.data,
+            isLoading: false
+          };
+        }
+      }
+    }
+    for (const d of discoveredQueries) {
+      if ("error" in d.$query.current) {
+        throw d.$query.current.error;
+      }
+    }
+    return { cache, queries };
+  });
+}
 function executePlasmicQuery($query, query) {
   return __async(this, null, function* () {
     if ($query.current.state === "loading" || $query.current.state === "done") {