@codeyam/codeyam-cli 0.1.0-staging.1669d45 → 0.1.0-staging.323686

package/analyzer-template/packages/ai/src/lib/astScopes/processExpression.ts

@@ -23,6 +23,7 @@ import {
   extractConditionalEffectsFromTernary,
   findUseStateSetters,
 } from './conditionalEffectsExtractor';
+import { detectArrayDerivedPattern } from './arrayDerivationDetector';
 
 /**
  * Extracts the component name from a JSX element.
@@ -368,6 +369,149 @@ function getSourceLocation(
   };
 }
 
+/**
+ * Extracts the root array path from an expression that ends with .map().
+ * Handles chained methods like .filter().map(), .slice().map(), etc.
+ *
+ * Examples:
+ * - items.map(...) → "items"
+ * - data.users.map(...) → "data.users"
+ * - items.filter(...).map(...) → "items"
+ * - items.slice(0, 5).map(...) → "items"
+ */
+function extractArrayPathFromMapCall(
+  expr: ts.CallExpression,
+  sourceFile: ts.SourceFile,
+): string | null {
+  // Walk up the chain to find the root array
+  let current: ts.Expression = expr.expression;
+
+  while (ts.isPropertyAccessExpression(current)) {
+    const methodName = current.name.getText(sourceFile);
+
+    // Common array methods that return arrays (so we keep going up)
+    const arrayReturningMethods = [
+      'map',
+      'filter',
+      'slice',
+      'concat',
+      'flat',
+      'flatMap',
+      'reverse',
+      'sort',
+      'toReversed',
+      'toSorted',
+      'toSpliced',
+    ];
+
+    if (arrayReturningMethods.includes(methodName)) {
+      const objectExpr = current.expression;
+
+      // If the object is a call expression (chained method), keep going
+      if (ts.isCallExpression(objectExpr)) {
+        current = objectExpr.expression;
+      } else {
+        // Found the root - it's an identifier or property access
+        const path = StructuredPath.fromNode(objectExpr, sourceFile);
+        return path ? path.toString() : null;
+      }
+    } else {
+      // Not an array method we recognize
+      break;
+    }
+  }
+
+  return null;
+}
+
+/**
+ * Extracts JSX rendering usages from a JSX expression.
+ * Detects:
+ * - array.map() calls → 'array-map' type
+ * - string interpolations (identifiers/property access) → 'text-interpolation' type
+ *
+ * Recursively searches inside && chains and ternary expressions.
+ *
+ * @param expr The expression inside {expr}
+ * @param context The analysis context
+ */
+function extractJsxRenderingUsage(
+  expr: ts.Expression,
+  context: AnalysisContext,
+): void {
+  const unwrapped = unwrapExpression(expr);
+  const sourceLocation = getSourceLocation(expr, context.sourceFile);
+
+  // Detect array.map() calls
+  if (ts.isCallExpression(unwrapped)) {
+    const calleeExpr = unwrapped.expression;
+
+    if (ts.isPropertyAccessExpression(calleeExpr)) {
+      const methodName = calleeExpr.name.getText(context.sourceFile);
+
+      if (methodName === 'map') {
+        const arrayPath = extractArrayPathFromMapCall(
+          unwrapped,
+          context.sourceFile,
+        );
+
+        if (arrayPath) {
+          context.addJsxRenderingUsage({
+            path: arrayPath,
+            renderingType: 'array-map',
+            valueType: 'array',
+            sourceLocation,
+          });
+        }
+      }
+    }
+  }
+  // Detect simple string interpolations: {title} or {user.name}
+  else if (
+    ts.isIdentifier(unwrapped) ||
+    ts.isPropertyAccessExpression(unwrapped)
+  ) {
+    const path = StructuredPath.fromNode(unwrapped, context.sourceFile);
+
+    if (path) {
+      const pathStr = path.toString();
+      const typeInfo = context.getTypeInfo(path);
+
+      // Only track as text interpolation if it's a string type
+      // Check for 'string' type, or types that contain 'string' (but not 'string[]')
+      if (
+        typeInfo === 'string' ||
+        (typeInfo &&
+          typeInfo.includes('string') &&
+          !typeInfo.includes('string[]'))
+      ) {
+        context.addJsxRenderingUsage({
+          path: pathStr,
+          renderingType: 'text-interpolation',
+          valueType: 'string',
+          sourceLocation,
+        });
+      }
+    }
+  }
+  // Recursively search inside && chains: {showList && items.map(...)}
+  else if (
+    ts.isBinaryExpression(unwrapped) &&
+    unwrapped.operatorToken.kind === ts.SyntaxKind.AmpersandAmpersandToken
+  ) {
+    // Check the right side of the && chain (where .map() typically appears)
+    const rightSide = unwrapExpression(unwrapped.right);
+    extractJsxRenderingUsage(rightSide, context);
+    // Also check nested && chains on the left
+    extractJsxRenderingUsage(unwrapped.left, context);
+  }
+  // Recursively search inside ternaries: {isEmpty ? null : items.map(...)}
+  else if (ts.isConditionalExpression(unwrapped)) {
+    extractJsxRenderingUsage(unwrapped.whenTrue, context);
+    extractJsxRenderingUsage(unwrapped.whenFalse, context);
+  }
+}
+
 /**
  * Counts the number of conditions in an && chain (excluding JSX consequence)
  */
@@ -404,6 +548,12 @@ interface ChainInfo {
   chainExpression: string;
   currentPosition: number;
   compound: CompoundConditional;
+  /**
+   * When processing OR expressions within an && chain, this tracks the
+   * current OR group ID. Conditions added while this is set will be marked
+   * as OR alternatives (only one needs to be true).
+   */
+  currentOrGroupId?: string;
 }
 
 /**
@@ -460,6 +610,10 @@ function extractConditionalsFromJsx(
     if (ts.isJsxExpression(child) && child.expression) {
       const expr = unwrapExpression(child.expression);
 
+      // Extract JSX rendering usages (array.map, text interpolation)
+      // This handles direct usages like {items.map(...)} or {user.name}
+      extractJsxRenderingUsage(expr, context);
+
       // If the expression is an && chain, extract its conditional usages
       if (
         ts.isBinaryExpression(expr) &&
@@ -766,8 +920,42 @@ function extractConditionalsFromJsx(
     }
     // Recursively process nested JSX elements - Fix 32: pass parent conditions
     else if (ts.isJsxElement(child)) {
+      // Check if this is a user-defined component (vs intrinsic element like div)
+      // If it's a component AND there are parent conditions, record the gating conditions
+      const componentName = getComponentNameFromJsx(child);
+      if (componentName && parentConditions.length > 0) {
+        for (const condition of parentConditions) {
+          context.addChildBoundaryGatingCondition(componentName, {
+            path: condition.path,
+            conditionType: 'truthiness',
+            location: 'ternary',
+            sourceLocation: condition.sourceLocation,
+            controlsJsxRendering: true,
+            isNegated: condition.isNegated,
+          });
+        }
+      }
       extractConditionalsFromJsx(child, context, parentConditions);
     }
+    // Handle self-closing JSX elements (e.g., <ScenarioViewer />)
+    else if (ts.isJsxSelfClosingElement(child)) {
+      // Check if this is a user-defined component (vs intrinsic element like div)
+      // If it's a component AND there are parent conditions, record the gating conditions
+      const componentName = getComponentNameFromJsx(child);
+      if (componentName && parentConditions.length > 0) {
+        for (const condition of parentConditions) {
+          context.addChildBoundaryGatingCondition(componentName, {
+            path: condition.path,
+            conditionType: 'truthiness',
+            location: 'ternary',
+            sourceLocation: condition.sourceLocation,
+            controlsJsxRendering: true,
+            isNegated: condition.isNegated,
+          });
+        }
+      }
+      // Self-closing elements have no children, so no recursion needed
+    }
     // Recursively process nested JSX fragments - Fix 32: pass parent conditions
     else if (ts.isJsxFragment(child)) {
       extractConditionalsFromJsx(child, context, parentConditions);
@@ -870,14 +1058,37 @@ export function extractConditionalUsage(
     }
 
     // Handle binary expressions with || (logical OR)
-    // OR breaks the chain - each side is independent
+    // When OR is inside an && chain, we need to continue chain tracking
+    // and mark conditions as OR alternatives
     if (
       ts.isBinaryExpression(unwrapped) &&
       unwrapped.operatorToken.kind === ts.SyntaxKind.BarBarToken
     ) {
-      // Both sides of || are independent conditional checks (no chain tracking)
-      extractWithChainTracking(unwrapped.left, null, false);
-      extractWithChainTracking(unwrapped.right, null, false);
+      if (chainInfo) {
+        // We're inside an && chain - continue tracking but mark as OR alternatives
+        // Generate an orGroupId so conditions from both sides can be grouped
+        const orGroupId =
+          chainInfo.currentOrGroupId ?? `or_${crypto.randomUUID().slice(0, 8)}`;
+
+        // Process left side with OR group tracking
+        const leftChainInfo = {
+          ...chainInfo,
+          currentOrGroupId: orGroupId,
+        };
+        extractWithChainTracking(unwrapped.left, leftChainInfo, false);
+
+        // Process right side with same OR group
+        // Note: we use leftChainInfo's currentPosition which may have been updated
+        const rightChainInfo = {
+          ...leftChainInfo,
+          currentPosition: chainInfo.currentPosition,
+        };
+        extractWithChainTracking(unwrapped.right, rightChainInfo, false);
+      } else {
+        // Not inside a chain - OR breaks into independent conditional checks
+        extractWithChainTracking(unwrapped.left, null, false);
+        extractWithChainTracking(unwrapped.right, null, false);
+      }
       return;
     }
 
@@ -922,6 +1133,7 @@ export function extractConditionalUsage(
         conditionType: 'comparison' | 'truthiness',
         comparedValues?: string[],
         requiredValue?: string | boolean,
+        sourceExpr?: ts.Expression,
       ) => {
         const usage: ConditionalUsage = {
           path,
@@ -933,6 +1145,17 @@ export function extractConditionalUsage(
           controlsJsxRendering,
         };
 
+        // Check for inline array-derived patterns (.length) on the source expression
+        if (sourceExpr) {
+          const arrayDerived = detectArrayDerivedPattern(sourceExpr);
+          if (arrayDerived) {
+            usage.derivedFrom = {
+              operation: arrayDerived.operation,
+              sourcePath: arrayDerived.sourcePath,
+            };
+          }
+        }
+
         // Add chain info if part of a compound conditional
         if (chainInfo) {
           usage.chainId = chainInfo.chainId;
@@ -948,6 +1171,9 @@ export function extractConditionalUsage(
             comparedValues,
             isNegated,
             requiredValue,
+            ...(chainInfo.currentOrGroupId && {
+              orGroupId: chainInfo.currentOrGroupId,
+            }),
           });
         }
 
@@ -962,6 +1188,7 @@ export function extractConditionalUsage(
           'comparison',
           literalValue !== undefined ? [literalValue] : undefined,
           getRequiredValue(literalValue, isNegated),
+          unwrapped.left, // Pass source expression for array derivation detection
         );
         return;
       }
@@ -974,16 +1201,29 @@ export function extractConditionalUsage(
           'comparison',
           literalValue !== undefined ? [literalValue] : undefined,
           getRequiredValue(literalValue, isNegated),
+          unwrapped.right, // Pass source expression for array derivation detection
         );
         return;
       }
 
       // Both sides are variables - record both as comparisons without specific values
       if (leftPath) {
-        addCondition(leftPath.toLeftHandSideString(), 'comparison');
+        addCondition(
+          leftPath.toLeftHandSideString(),
+          'comparison',
+          undefined,
+          undefined,
+          unwrapped.left,
+        );
       }
       if (rightPath) {
-        addCondition(rightPath.toLeftHandSideString(), 'comparison');
+        addCondition(
+          rightPath.toLeftHandSideString(),
+          'comparison',
+          undefined,
+          undefined,
+          unwrapped.right,
+        );
       }
       return;
     }
@@ -1012,6 +1252,16 @@ export function extractConditionalUsage(
         controlsJsxRendering,
       };
 
+      // Check for inline array-derived patterns (.some(), .every(), .includes(), .length)
+      // This populates derivedFrom so downstream code can resolve to the base array path
+      const arrayDerived = detectArrayDerivedPattern(unwrapped);
+      if (arrayDerived) {
+        usage.derivedFrom = {
+          operation: arrayDerived.operation,
+          sourcePath: arrayDerived.sourcePath,
+        };
+      }
+
       // Add chain info if part of a compound conditional
       if (chainInfo) {
         usage.chainId = chainInfo.chainId;
@@ -1027,6 +1277,9 @@ export function extractConditionalUsage(
           conditionType: 'truthiness',
           isNegated,
           requiredValue: !isNegated,
+          ...(chainInfo.currentOrGroupId && {
+            orGroupId: chainInfo.currentOrGroupId,
+          }),
         });
       }
 
@@ -1686,15 +1939,31 @@ export function processExpression({
             );
           }
         } else if (operatorKind === ts.SyntaxKind.BarBarToken) {
-          // For ||, also create an equivalence to the left side
+          // For ||, create equivalences to BOTH sides
           // This enables data flow tracing through fallback expressions
+          // e.g., `const item = items.find(...) || null` should trace to both:
+          //   - items[] (from the find result)
+          //   - null (from the fallback)
           if (targetPath) {
+            // Process left side recursively to capture its full equivalency chain
+            processExpression({
+              node: unwrappedNode.left,
+              context,
+              targetPath,
+            });
+            // Process right side recursively for completeness
+            processExpression({
+              node: unwrappedNode.right,
+              context,
+              targetPath,
+            });
+            // Set resultPath to left side for type inference
             resultPath = StructuredPath.fromNode(
               unwrappedNode.left,
               context.sourceFile,
             );
           }
-          // Note: Unlike ??, we don't set targetPath when there's no target
+          // Note: When there's no targetPath, we don't recursively process
           // because || is often used in boolean contexts where the full expression matters
         }
       } else if (operatorKind === ts.SyntaxKind.InstanceOfKeyword) {

package/analyzer-template/packages/ai/src/lib/astScopes/types.ts

@@ -217,6 +217,7 @@ export interface ConditionalEffect {
  * - equals/notEquals: value comparisons (x === 'value', x !== 'value')
  * - or/and: logical combinations (a || b, a && b)
  * - arrayIncludes/arraySome/arrayEvery: array predicate methods
+ * - arrayLength: array.length property access
  */
 export type DerivedVariableOperation =
   | 'notNull'
@@ -227,7 +228,8 @@ export type DerivedVariableOperation =
   | 'and'
   | 'arrayIncludes'
   | 'arraySome'
-  | 'arrayEvery';
+  | 'arrayEvery'
+  | 'arrayLength';
 
 /**
  * Information about how a variable was derived from other variables.
@@ -244,6 +246,43 @@ export interface DerivedVariableInfo {
   comparedValue?: string;
 }
 
+/**
+ * Represents a JSX rendering usage where arrays or strings are rendered directly.
+ * Used to generate execution flows for array sizes and text lengths
+ * even without explicit conditionals.
+ *
+ * Examples:
+ * - `{items.map(i => <Item {...i} />)}` → array-map usage for 'items'
+ * - `{user.name}` → text-interpolation usage for 'user.name'
+ */
+export interface JsxRenderingUsage {
+  /**
+   * The path to the rendered value (e.g., "items", "data.users", "user.name")
+   */
+  path: string;
+
+  /**
+   * Type of rendering:
+   * - 'array-map': Array rendered via .map() method
+   * - 'text-interpolation': String rendered directly in JSX
+   */
+  renderingType: 'array-map' | 'text-interpolation';
+
+  /**
+   * The detected type of the value being rendered
+   */
+  valueType?: 'array' | 'string' | 'unknown';
+
+  /**
+   * Source location information
+   */
+  sourceLocation?: {
+    lineNumber: number;
+    column: number;
+    codeSnippet: string;
+  };
+}
+
 export interface AstScopeAnalysisResult {
   // Variable structure map (variable path -> type)
   structure: Record<string, string>;
@@ -274,6 +313,11 @@ export interface AstScopeAnalysisResult {
   // Example: {hasAnalysis && <ScenarioViewer />} → { ScenarioViewer: [{ path: 'hasAnalysis', ... }] }
   childBoundaryGatingConditions?: Record<string, ConditionalUsage[]>;
 
+  // JSX rendering usages - tracks arrays rendered via .map() and strings interpolated in JSX
+  // Used to generate execution flows for array sizes and text lengths without explicit conditionals
+  // Example: {items.map(i => <Item {...i} />)} → array-map usage for 'items'
+  jsxRenderingUsages?: JsxRenderingUsage[];
+
   // Whether the analysis is complete enough to skip LLM calls
   isComplete: boolean;
 
@@ -355,6 +399,19 @@ export interface ConditionalUsage {
     /** For comparison operations, the value being compared to */
     comparedValue?: string;
   };
+
+  /**
+   * The full original expression as a semantic constraint for LLM reasoning.
+   * Used when the path contains complex operations (filter, map, etc.) that
+   * can't be simply resolved to a mock value.
+   *
+   * Examples:
+   * - `scenarios.filter(s => s.active).length > 1`
+   * - `users.some(u => u.role === 'admin' && u.active)`
+   *
+   * The LLM can interpret this constraint to generate appropriate mock data.
+   */
+  constraintExpression?: string;
 }
 
 /**
@@ -374,6 +431,14 @@ export interface CompoundConditional {
     isNegated: boolean;
     /** Required value for this condition to be true */
     requiredValue?: string | boolean;
+    /**
+     * When conditions are part of an OR expression within an && chain,
+     * they share the same orGroupId. Conditions with the same orGroupId
+     * are alternatives - only ONE needs to be satisfied.
+     * Example: `A && (B || C)` creates conditions where B and C share an orGroupId.
+     * This allows flow generation to expand into separate flows: A&&B and A&&C.
+     */
+    orGroupId?: string;
   }[];
   /** Where this compound conditional occurs */
   location: 'if' | 'ternary' | 'logical-and' | 'switch';
@@ -553,4 +618,11 @@ export interface AnalysisContext {
 
   // Get all conditional effects
   getConditionalEffects(): ConditionalEffect[];
+
+  // Add a JSX rendering usage (array.map() or text interpolation)
+  // Called when we see patterns like: {items.map(i => <Item />)} or {user.name}
+  addJsxRenderingUsage(usage: JsxRenderingUsage): void;
+
+  // Get all JSX rendering usages
+  getJsxRenderingUsages(): JsxRenderingUsage[];
 }