@base44-preview/vite-plugin 0.2.25-pr.36.792e85b → 0.2.26-pr.43.056eecd

package/src/processors/collection-reference-field-processor.ts

@@ -0,0 +1,225 @@
+import type { NodePath } from "@babel/traverse";
+import type * as t from "@babel/types";
+import {
+  DATA_COLLECTION_FIELD_REFERENCE,
+  DATA_COLLECTION_REFERENCE,
+} from "../consts.js";
+import {
+  JSXAttributeUtils,
+  ExpressionAnalysisUtils,
+  TypeCheckUtils,
+} from "./shared-utils.js";
+
+export class ReferenceFieldProcessor {
+  private attributeUtils: JSXAttributeUtils;
+  private expressionUtils: ExpressionAnalysisUtils;
+  private typeCheckUtils: TypeCheckUtils;
+
+  constructor(private types: typeof t) {
+    this.attributeUtils = new JSXAttributeUtils(types);
+    this.expressionUtils = new ExpressionAnalysisUtils(types);
+    this.typeCheckUtils = new TypeCheckUtils(types);
+  }
+
+  process(path: NodePath<t.JSXOpeningElement>): void {
+    if (
+      this.attributeUtils.hasAttribute(path, DATA_COLLECTION_FIELD_REFERENCE)
+    ) {
+      return;
+    }
+
+    if (
+      this.isReturnedFromReferenceMap(path) ||
+      this.isInsideReferenceLogicalExpression(path) ||
+      this.isInReferencePropertyMapChain(path)
+    ) {
+      this.attributeUtils.addStringAttribute(
+        path,
+        DATA_COLLECTION_FIELD_REFERENCE,
+        "true"
+      );
+    }
+  }
+
+  /**
+   * Strategy A: Element is the direct return of a .map() callback
+   * whose array is a reference variable (initialized via type-check pattern).
+   */
+  private isReturnedFromReferenceMap(
+    path: NodePath<t.JSXOpeningElement>
+  ): boolean {
+    const jsxElement = path.parentPath;
+    if (!jsxElement?.isJSXElement()) return false;
+
+    const parent = jsxElement.parentPath;
+    if (!parent) return false;
+
+    const callbackFn = this.findEnclosingMapCallback(parent);
+    if (!callbackFn) return false;
+
+    const mapCall = callbackFn.parentPath;
+    if (!mapCall?.isCallExpression()) return false;
+
+    const callee = mapCall.get("callee");
+    if (!callee.isMemberExpression()) return false;
+
+    const arrayObj = callee.get("object") as NodePath<t.Expression>;
+    return this.isReferenceArray(arrayObj);
+  }
+
+  /**
+   * Strategy B: Element is inside a && expression where the left operand
+   * references a field name that appears in an ancestor's data-collection-reference.
+   */
+  private isInsideReferenceLogicalExpression(
+    path: NodePath<t.JSXOpeningElement>
+  ): boolean {
+    const jsxElement = path.parentPath;
+    if (!jsxElement?.isJSXElement()) return false;
+
+    const logicalParent = jsxElement.parentPath;
+    if (!logicalParent?.isLogicalExpression()) return false;
+    if (logicalParent.node.operator !== "&&") return false;
+
+    const left = logicalParent.node.left;
+    const fieldName = this.extractFieldNameFromExpression(left as t.Expression);
+    if (!fieldName) return false;
+
+    return this.isFieldInAncestorReference(path, fieldName);
+  }
+
+  /**
+   * Strategy C: Element is inside a .map() chain on a reference property.
+   * e.g. item.relatedProducts.map(...) or item.relatedProducts.filter(...).map(...)
+   */
+  private isInReferencePropertyMapChain(
+    path: NodePath<t.JSXOpeningElement>
+  ): boolean {
+    const jsxElement = path.parentPath;
+    if (!jsxElement?.isJSXElement()) return false;
+
+    let current: NodePath | null = jsxElement;
+    while (current) {
+      if (current.isCallExpression()) {
+        const callee = current.get("callee");
+        if (callee.isMemberExpression()) {
+          const fieldName = this.extractReferenceFieldFromMapChain(callee);
+          if (fieldName && this.isFieldInAncestorReference(path, fieldName)) {
+            return true;
+          }
+        }
+      }
+      current = current.parentPath;
+    }
+
+    return false;
+  }
+
+  private findEnclosingMapCallback(
+    path: NodePath
+  ): NodePath<t.Function> | null {
+    let current: NodePath | null = path;
+    while (current) {
+      if (current.isArrowFunctionExpression() || current.isFunctionExpression()) {
+        const parent = current.parentPath;
+        if (parent?.isCallExpression()) {
+          const callee = parent.get("callee");
+          if (callee.isMemberExpression()) {
+            const prop = callee.get("property") as NodePath;
+            if (
+              prop.isIdentifier() &&
+              (prop.node.name === "map" || prop.node.name === "flatMap")
+            ) {
+              return current as NodePath<t.Function>;
+            }
+          }
+        }
+      }
+      current = current.parentPath;
+    }
+    return null;
+  }
+
+  private isReferenceArray(path: NodePath<t.Expression>): boolean {
+    if (!path.isIdentifier()) return false;
+
+    const binding = path.scope.getBinding(path.node.name);
+    if (!binding?.path.isVariableDeclarator()) return false;
+
+    const init = binding.path.get("init");
+    if (!init.isConditionalExpression()) return false;
+
+    const test = init.node.test;
+    return this.typeCheckUtils.isReferenceTypeCheck(test as t.Expression);
+  }
+
+  private extractFieldNameFromExpression(
+    node: t.Expression
+  ): string | null {
+    if (this.types.isMemberExpression(node)) {
+      const prop = node.property;
+      if (this.types.isIdentifier(prop)) return prop.name;
+    }
+    if (this.types.isOptionalMemberExpression(node)) {
+      const prop = node.property;
+      if (this.types.isIdentifier(prop)) return prop.name;
+    }
+    return null;
+  }
+
+  private isFieldInAncestorReference(
+    path: NodePath,
+    fieldName: string
+  ): boolean {
+    const ancestor = this.attributeUtils.findAncestorWithAttribute(
+      path,
+      DATA_COLLECTION_REFERENCE
+    );
+    if (!ancestor) return false;
+
+    const refValue = this.attributeUtils.getAttributeStringValue(
+      ancestor,
+      DATA_COLLECTION_REFERENCE
+    );
+    if (!refValue) return false;
+
+    const references = refValue.split(",").map((r) => r.trim());
+    return references.includes(fieldName);
+  }
+
+  private extractReferenceFieldFromMapChain(
+    callee: NodePath<t.MemberExpression>
+  ): string | null {
+    const prop = callee.get("property") as NodePath;
+    if (!prop.isIdentifier()) return null;
+
+    const methodName = prop.node.name;
+    const obj = callee.get("object") as NodePath<t.Expression>;
+
+    if (methodName === "map" || methodName === "flatMap") {
+      if (obj.isMemberExpression()) {
+        const fieldProp = obj.get("property") as NodePath;
+        if (fieldProp.isIdentifier()) return fieldProp.node.name;
+      }
+    }
+
+    if (methodName === "map" || methodName === "flatMap") {
+      if (obj.isCallExpression()) {
+        const innerCallee = obj.get("callee");
+        if (innerCallee.isMemberExpression()) {
+          return this.extractReferenceFieldFromMapChain(innerCallee);
+        }
+      }
+    }
+
+    if (
+      ["filter", "sort", "slice"].includes(methodName) &&
+      obj.isMemberExpression()
+    ) {
+      const fieldProp = obj.get("property") as NodePath;
+      if (fieldProp.isIdentifier()) return fieldProp.node.name;
+    }
+
+    return null;
+  }
+}

package/src/processors/collection-tracing-utils.ts

@@ -0,0 +1,436 @@
+import type { NodePath } from "@babel/traverse";
+import type * as t from "@babel/types";
+import type { CollectionInfo } from "../types.js";
+import {
+  ExpressionAnalysisUtils,
+  BindingUtils,
+  CallExpressionUtils,
+} from "./shared-utils.js";
+
+export class CollectionTracingUtils {
+  private expressionUtils: ExpressionAnalysisUtils;
+  private bindingUtils: BindingUtils;
+  private callUtils: CallExpressionUtils;
+  private visitedSetters = new Set<string>();
+  private visitedGetByIdSetters = new Set<string>();
+
+  constructor(private types: typeof t) {
+    this.expressionUtils = new ExpressionAnalysisUtils(types);
+    this.bindingUtils = new BindingUtils(types);
+    this.callUtils = new CallExpressionUtils(types);
+  }
+
+  resetVisited(): void {
+    this.visitedSetters.clear();
+    this.visitedGetByIdSetters.clear();
+  }
+
+  traceCollectionSource(
+    path: NodePath<t.Expression>
+  ): CollectionInfo | null {
+    this.resetVisited();
+    return this.traceExpression(path);
+  }
+
+  private traceExpression(
+    path: NodePath<t.Expression>
+  ): CollectionInfo | null {
+    if (path.isIdentifier()) {
+      return this.traceIdentifierToCollection(path);
+    }
+
+    if (path.isMemberExpression()) {
+      return this.traceMemberExpression(path);
+    }
+
+    if (path.isCallExpression()) {
+      return this.traceCallExpression(path);
+    }
+
+    if (path.isAwaitExpression()) {
+      const argument = path.get("argument");
+      if (argument.isExpression()) {
+        return this.traceExpression(argument);
+      }
+    }
+
+    if (path.isArrayExpression()) {
+      return this.traceArrayExpression(path);
+    }
+
+    return null;
+  }
+
+  private traceIdentifierToCollection(
+    path: NodePath<t.Identifier>
+  ): CollectionInfo | null {
+    const name = path.node.name;
+    const binding = path.scope.getBinding(name);
+    if (!binding) return null;
+
+    if (binding.path.isVariableDeclarator()) {
+      return this.traceVariableDeclarator(binding.path, name);
+    }
+
+    if (this.bindingUtils.isFunctionParameter(name, path)) {
+      return this.traceParameterToCollection(name, path);
+    }
+
+    return null;
+  }
+
+  private traceVariableDeclarator(
+    declaratorPath: NodePath<t.VariableDeclarator>,
+    variableName: string
+  ): CollectionInfo | null {
+    const init = declaratorPath.get("init");
+
+    if (init.isCallExpression()) {
+      const directResult = this.checkDirectServiceCall(init);
+      if (directResult) return directResult;
+
+      const useStateInfo = this.bindingUtils.isUseStateCall(init);
+      if (useStateInfo?.setterName) {
+        return this.traceUseStateSetter(useStateInfo.setterName, declaratorPath);
+      }
+    }
+
+    if (init.isAwaitExpression()) {
+      const awaitArg = init.get("argument");
+      if (awaitArg.isCallExpression()) {
+        const directResult = this.checkDirectServiceCall(awaitArg);
+        if (directResult) return directResult;
+      }
+      return this.traceExpression(init);
+    }
+
+    if (init.isMemberExpression()) {
+      return this.traceExpression(init);
+    }
+
+    if (init.isIdentifier()) {
+      return this.traceExpression(init);
+    }
+
+    if (init.isCallExpression()) {
+      return this.traceExpression(init);
+    }
+
+    const id = declaratorPath.get("id");
+
+    if (id.isArrayPattern()) {
+      return this.traceArrayDestructuring(declaratorPath, id, variableName);
+    }
+
+    if (id.isObjectPattern()) {
+      return this.traceObjectDestructuring(declaratorPath, id, variableName);
+    }
+
+    return null;
+  }
+
+  private traceUseStateSetter(
+    setterName: string,
+    declaratorPath: NodePath<t.VariableDeclarator>
+  ): CollectionInfo | null {
+    if (this.visitedSetters.has(setterName)) return null;
+    this.visitedSetters.add(setterName);
+
+    const functionScope = declaratorPath.getFunctionParent() ?? declaratorPath.scope.path;
+    const setterCall = this.bindingUtils.findSetterCallInScope(
+      setterName,
+      functionScope
+    );
+
+    if (!setterCall) return null;
+
+    const args = setterCall.get("arguments");
+    const firstArg = args[0];
+    if (!firstArg || !firstArg.isExpression()) return null;
+
+    return this.traceExpression(firstArg);
+  }
+
+  private traceMemberExpression(
+    path: NodePath<t.MemberExpression>
+  ): CollectionInfo | null {
+    const property = path.get("property");
+    const object = path.get("object");
+
+    if (
+      property.isIdentifier() &&
+      property.node.name === "items"
+    ) {
+      if (object.isExpression()) {
+        return this.traceExpression(object);
+      }
+    }
+
+    if (object.isIdentifier()) {
+      const objResult = this.traceIdentifierToCollection(object);
+      if (objResult && property.isIdentifier()) {
+        if (objResult.references.includes(property.node.name)) {
+          return { id: property.node.name, references: [] };
+        }
+      }
+      return objResult;
+    }
+
+    if (object.isExpression()) {
+      return this.traceExpression(object);
+    }
+
+    return null;
+  }
+
+  private traceCallExpression(
+    path: NodePath<t.CallExpression>
+  ): CollectionInfo | null {
+    const directResult = this.checkDirectServiceCall(path);
+    if (directResult) return directResult;
+
+    if (this.callUtils.isChainedArrayMethod(path.node)) {
+      const callee = path.get("callee");
+      if (callee.isMemberExpression()) {
+        const obj = callee.get("object") as NodePath<t.Expression>;
+        return this.traceExpression(obj);
+      }
+    }
+
+    return null;
+  }
+
+  private checkDirectServiceCall(
+    path: NodePath<t.CallExpression>
+  ): CollectionInfo | null {
+    const getAllInfo = this.callUtils.isGetAllCall(path.node);
+    if (getAllInfo) {
+      return {
+        id: getAllInfo.collectionName,
+        references: getAllInfo.references,
+      };
+    }
+
+    const getByIdInfo = this.callUtils.isGetByIdCall(path.node);
+    if (getByIdInfo) {
+      return {
+        id: getByIdInfo.collectionName,
+        references: getByIdInfo.multiRefFields,
+      };
+    }
+
+    return null;
+  }
+
+  private traceArrayDestructuring(
+    declaratorPath: NodePath<t.VariableDeclarator>,
+    pattern: NodePath<t.ArrayPattern>,
+    variableName: string
+  ): CollectionInfo | null {
+    const elements = pattern.get("elements");
+    const index = elements.findIndex(
+      (el) => el.isIdentifier() && el.node.name === variableName
+    );
+
+    if (index === -1) return null;
+
+    const init = declaratorPath.get("init");
+
+    if (init.hasNode() && this.bindingUtils.isPromiseAllCall(init as NodePath<t.Node>)) {
+      return this.tracePromiseAllElement(init as NodePath<t.Node>, index);
+    }
+
+    if (init.isCallExpression()) {
+      const useStateInfo = this.bindingUtils.isUseStateCall(init);
+      if (useStateInfo && index === 0 && useStateInfo.setterName) {
+        return this.traceUseStateSetter(useStateInfo.setterName, declaratorPath);
+      }
+    }
+
+    return null;
+  }
+
+  private traceObjectDestructuring(
+    declaratorPath: NodePath<t.VariableDeclarator>,
+    pattern: NodePath<t.ObjectPattern>,
+    variableName: string
+  ): CollectionInfo | null {
+    const init = declaratorPath.get("init");
+    if (!init.isExpression()) return null;
+
+    const prop = pattern.node.properties.find(
+      (p) =>
+        this.types.isObjectProperty(p) &&
+        this.types.isIdentifier(p.value) &&
+        p.value.name === variableName
+    );
+
+    if (!prop || !this.types.isObjectProperty(prop)) return null;
+
+    const key = prop.key;
+    const propertyName = this.types.isIdentifier(key)
+      ? key.name
+      : this.types.isStringLiteral(key)
+        ? key.value
+        : null;
+
+    if (propertyName === "items") {
+      return this.traceExpression(init);
+    }
+
+    return this.traceExpression(init);
+  }
+
+  private tracePromiseAllElement(
+    init: NodePath<t.Node>,
+    index: number
+  ): CollectionInfo | null {
+    let callExpr: NodePath<t.CallExpression>;
+
+    if (init.isAwaitExpression()) {
+      const arg = init.get("argument");
+      if (!arg.isCallExpression()) return null;
+      callExpr = arg;
+    } else if (init.isCallExpression()) {
+      callExpr = init;
+    } else {
+      return null;
+    }
+
+    const args = callExpr.get("arguments");
+    const firstArg = args[0];
+    if (!firstArg?.isArrayExpression()) return null;
+
+    const elements = firstArg.get("elements");
+    const targetElement = elements[index];
+    if (!targetElement || !targetElement.isExpression()) return null;
+
+    return this.traceExpression(targetElement);
+  }
+
+  private traceParameterToCollection(
+    paramName: string,
+    path: NodePath
+  ): CollectionInfo | null {
+    const fn = path.getFunctionParent();
+    if (!fn) return null;
+
+    const fnName = this.getFunctionName(fn);
+    if (!fnName) return null;
+
+    const programPath = fn.findParent((p) => p.isProgram());
+    if (!programPath) return null;
+
+    let result: CollectionInfo | null = null;
+
+    programPath.traverse({
+      JSXOpeningElement: (jsxPath: NodePath<t.JSXOpeningElement>) => {
+        if (result) return;
+
+        const elementName = this.getJSXElementName(jsxPath.node);
+        if (elementName !== fnName) return;
+
+        for (const attr of jsxPath.node.attributes) {
+          if (!this.types.isJSXAttribute(attr)) continue;
+          if (!this.types.isJSXIdentifier(attr.name)) continue;
+          if (attr.name.name !== paramName) continue;
+
+          if (
+            attr.value &&
+            this.types.isJSXExpressionContainer(attr.value) &&
+            this.types.isExpression(attr.value.expression)
+          ) {
+            const exprPath = jsxPath
+              .get("attributes")
+              .find(
+                (a) =>
+                  a.isJSXAttribute() &&
+                  this.types.isJSXIdentifier(a.node.name) &&
+                  a.node.name.name === paramName
+              );
+
+            if (exprPath && exprPath.isJSXAttribute()) {
+              const valPath = exprPath.get("value");
+              if (
+                valPath.isJSXExpressionContainer()
+              ) {
+                const expr = valPath.get("expression");
+                if (expr.isExpression()) {
+                  result = this.traceExpression(expr);
+                }
+              }
+            }
+          }
+        }
+      },
+    });
+
+    return result;
+  }
+
+  private traceArrayExpression(
+    path: NodePath<t.ArrayExpression>
+  ): CollectionInfo | null {
+    const elements = path.get("elements");
+    for (const el of elements) {
+      if (el.isSpreadElement()) {
+        const arg = el.get("argument");
+        if (arg.isExpression()) {
+          const result = this.traceExpression(arg);
+          if (result) return result;
+        }
+      }
+    }
+    return null;
+  }
+
+  private getFunctionName(fn: NodePath<t.Function>): string | null {
+    if (fn.isFunctionDeclaration() && fn.node.id) {
+      return fn.node.id.name;
+    }
+
+    const parent = fn.parentPath;
+    if (parent?.isVariableDeclarator()) {
+      const id = parent.get("id");
+      if (id.isIdentifier()) return id.node.name;
+    }
+
+    return null;
+  }
+
+  private getJSXElementName(node: t.JSXOpeningElement): string | null {
+    if (this.types.isJSXIdentifier(node.name)) {
+      return node.name.name;
+    }
+    return null;
+  }
+
+  traceGetByIdSource(
+    path: NodePath
+  ): CollectionInfo | null {
+    this.visitedGetByIdSetters.clear();
+    return this.findGetByIdInScope(path);
+  }
+
+  private findGetByIdInScope(
+    path: NodePath
+  ): CollectionInfo | null {
+    const fn = path.getFunctionParent() ?? path.scope.path;
+    let result: CollectionInfo | null = null;
+
+    fn.traverse({
+      CallExpression: (callPath: NodePath<t.CallExpression>) => {
+        if (result) return;
+        const info = this.callUtils.isGetByIdCall(callPath.node);
+        if (info) {
+          result = {
+            id: info.collectionName,
+            references: info.multiRefFields,
+          };
+        }
+      },
+    });
+
+    return result;
+  }
+}