@codeyam/codeyam-cli 0.1.0-staging.8aea589 → 0.1.0-staging.8df382d

package/analyzer-template/packages/ai/src/lib/generateExecutionFlowsFromJsxUsages.ts

@@ -0,0 +1,239 @@
+/**
+ * Generates execution flows from JSX rendering usages.
+ *
+ * This module creates variation flows for arrays and strings that are rendered
+ * directly in JSX, even without explicit conditionals:
+ * - Arrays rendered via .map() → empty, few, many flows
+ * - Strings rendered via interpolation → normal, long flows
+ *
+ * Only controllable paths (from props, hooks, or external data) produce flows.
+ */
+
+import type { ExecutionFlow } from '~codeyam/types';
+import type { JsxRenderingUsage } from './astScopes/types';
+import resolvePathToControllable from './resolvePathToControllable';
+
+export interface GenerateFlowsFromJsxUsagesArgs {
+  /** JSX rendering usages extracted from AST analysis */
+  jsxRenderingUsages: JsxRenderingUsage[];
+  /** Map of controllable paths to their types */
+  attributesMap: Record<string, string>;
+  /** Map from local variable names to data sources */
+  equivalentSignatureVariables: Record<string, string | string[]>;
+  /** Map from full paths to short paths */
+  fullToShortPathMap: Record<string, string>;
+  /** Structure map for type lookup */
+  structure: Record<string, string>;
+}
+
+/**
+ * Generate a slug from a path for use in exclusive groups
+ */
+function pathToSlug(path: string): string {
+  return path
+    .replace(/\[\d+\]/g, '')
+    .replace(/\[\]/g, '')
+    .replace(/\(\)/g, '')
+    .replace(/\.functionCallReturnValue/g, '')
+    .replace(/[<>]/g, '')
+    .replace(/\./g, '-')
+    .toLowerCase();
+}
+
+/**
+ * Generate a human-readable name from a path.
+ */
+function generateNameFromPath(path: string): string {
+  const cleanPath = path
+    .replace(/\(\)/g, '')
+    .replace(/\.functionCallReturnValue/g, '');
+  const parts = cleanPath.split('.');
+  const lastPart = parts[parts.length - 1];
+
+  // Convert camelCase to Title Case
+  return lastPart
+    .replace(/([A-Z])/g, ' $1')
+    .replace(/^./, (str) => str.toUpperCase())
+    .trim();
+}
+
+/**
+ * Generate execution flows from JSX rendering usages.
+ *
+ * For arrays: generates empty (0), few (1-3), many (10+) flows
+ * For strings: generates normal and long text flows
+ */
+export default function generateExecutionFlowsFromJsxUsages(
+  args: GenerateFlowsFromJsxUsagesArgs,
+): ExecutionFlow[] {
+  const {
+    jsxRenderingUsages,
+    attributesMap,
+    equivalentSignatureVariables,
+    fullToShortPathMap,
+  } = args;
+
+  const flows: ExecutionFlow[] = [];
+  const seenPaths = new Set<string>();
+
+  for (const usage of jsxRenderingUsages) {
+    // Resolve the path to a controllable data source
+    const resolution = resolvePathToControllable(
+      usage.path,
+      attributesMap,
+      equivalentSignatureVariables,
+      fullToShortPathMap,
+    );
+
+    if (!resolution.isControllable || !resolution.resolvedPath) {
+      // Path is not controllable - skip
+      continue;
+    }
+
+    const resolvedPath = resolution.resolvedPath;
+
+    // Deduplicate by resolved path + rendering type
+    const dedupeKey = `${resolvedPath}:${usage.renderingType}`;
+    if (seenPaths.has(dedupeKey)) {
+      continue;
+    }
+    seenPaths.add(dedupeKey);
+
+    const baseName = generateNameFromPath(resolvedPath);
+    const pathSlug = pathToSlug(resolvedPath);
+
+    if (usage.renderingType === 'array-map') {
+      // Generate 3 mutually exclusive flows for array sizes
+      const exclusiveGroup = `array-length-${pathSlug}`;
+
+      // Empty array flow
+      flows.push({
+        id: `${pathSlug}-empty-array`,
+        name: `${baseName} Empty`,
+        description: `When ${baseName.toLowerCase()} array is empty`,
+        requiredValues: [
+          {
+            attributePath: resolvedPath,
+            value: '0',
+            comparison: 'length<',
+            valueType: 'array',
+          },
+        ],
+        impact: 'medium',
+        exclusiveGroup,
+        sourceLocation: usage.sourceLocation
+          ? {
+              lineNumber: usage.sourceLocation.lineNumber,
+              column: usage.sourceLocation.column,
+            }
+          : undefined,
+        codeSnippet: usage.sourceLocation?.codeSnippet,
+      });
+
+      // Few items flow (1-3)
+      flows.push({
+        id: `${pathSlug}-few-items`,
+        name: `${baseName} Few Items`,
+        description: `When ${baseName.toLowerCase()} array has 1-3 items`,
+        requiredValues: [
+          {
+            attributePath: resolvedPath,
+            value: '3',
+            comparison: 'length<',
+            valueType: 'array',
+          },
+        ],
+        impact: 'low', // Baseline case
+        exclusiveGroup,
+        sourceLocation: usage.sourceLocation
+          ? {
+              lineNumber: usage.sourceLocation.lineNumber,
+              column: usage.sourceLocation.column,
+            }
+          : undefined,
+        codeSnippet: usage.sourceLocation?.codeSnippet,
+      });
+
+      // Many items flow (10+)
+      flows.push({
+        id: `${pathSlug}-many-items`,
+        name: `${baseName} Many Items`,
+        description: `When ${baseName.toLowerCase()} array has 10+ items`,
+        requiredValues: [
+          {
+            attributePath: resolvedPath,
+            value: '10',
+            comparison: 'length>',
+            valueType: 'array',
+          },
+        ],
+        impact: 'medium',
+        exclusiveGroup,
+        sourceLocation: usage.sourceLocation
+          ? {
+              lineNumber: usage.sourceLocation.lineNumber,
+              column: usage.sourceLocation.column,
+            }
+          : undefined,
+        codeSnippet: usage.sourceLocation?.codeSnippet,
+      });
+    } else if (
+      usage.renderingType === 'text-interpolation' &&
+      usage.valueType === 'string'
+    ) {
+      // Only generate text flows for strings (not numbers or other types)
+      // Generate 2 mutually exclusive flows for text lengths
+      const exclusiveGroup = `text-length-${pathSlug}`;
+
+      // Normal text flow
+      flows.push({
+        id: `${pathSlug}-normal-text`,
+        name: `${baseName} Normal`,
+        description: `When ${baseName.toLowerCase()} has normal length text`,
+        requiredValues: [
+          {
+            attributePath: resolvedPath,
+            value: 'normal',
+            comparison: 'equals',
+            valueType: 'string',
+          },
+        ],
+        impact: 'low',
+        exclusiveGroup,
+        sourceLocation: usage.sourceLocation
+          ? {
+              lineNumber: usage.sourceLocation.lineNumber,
+              column: usage.sourceLocation.column,
+            }
+          : undefined,
+        codeSnippet: usage.sourceLocation?.codeSnippet,
+      });
+
+      // Long text flow
+      flows.push({
+        id: `${pathSlug}-long-text`,
+        name: `${baseName} Long Text`,
+        description: `When ${baseName.toLowerCase()} has long text that might overflow`,
+        requiredValues: [
+          {
+            attributePath: resolvedPath,
+            value: 'long',
+            comparison: 'equals',
+            valueType: 'string',
+          },
+        ],
+        impact: 'low',
+        exclusiveGroup,
+        sourceLocation: usage.sourceLocation
+          ? {
+              lineNumber: usage.sourceLocation.lineNumber,
+              column: usage.sourceLocation.column,
+            }
+          : undefined,
+        codeSnippet: usage.sourceLocation?.codeSnippet,
+      });
+    }
+  }
+
+  return flows;
+}

package/analyzer-template/packages/ai/src/lib/generateStatementAnalysis.ts

@@ -4,7 +4,7 @@ import { saveLlmCall } from '~codeyam/aws/dynamodb';
 import generateEntityPropsStructureGenerator from './promptGenerators/generateEntityPropsStructureGenerator';
 import identifyReserved, { ReservedFeature } from './identifyReserved';
 import splitOutsideParentheses from './splitOutsideParentheses';
-import { generateSha, loadStatement, saveStatement } from '~codeyam/supabase';
+import { generateSha, loadStatement, saveStatement } from '~codeyam/database';
 import { ScopeInfo } from './dataStructure/ScopeDataStructure';
 import { AI, parseJsonSafe } from '~codeyam/ai';
 
@@ -152,85 +152,52 @@ export default async function generateStatementAnalysis({
   return { sha, structure, equivalentVariables, llmCall };
 }
 
-const SYSTEM_MESSAGE = (reservedStrategies: string[]) => `**Task:**  
+const SYSTEM_MESSAGE = (
+  reservedStrategies: string[],
+) => `Analyze a code snippet to extract:
 
-We have a code snippet we need to analyze.
+1. **structure**: The data type of each variable and property path (string, number, boolean, array, object, function, or unknown)
+2. **equivalentVariables**: Assignments between variables, where the key is the target (left side) and value is the source (right side)
 
-We want to determine:
+## Type Rules
 
-1) What is the data structure of the variables in the code snippet?
-3) What variables or aspects of variables are equivalent in the code snippet?
+- Use type annotations when available; otherwise infer from context or use "unknown"
+- Non-primitive types are "object"
+- Function calls are "function"
 
-If there is any type information in the code snippet leverage it to inform the data structure of the variables but do not otherwise worry about it or include it. If a type is not a primitive simply label it as "object".
+## Equivalency Rules
 
-**Definitions:**
+For assignments like \`const a = b\`, record \`"a": "b"\`.
 
-Data Structure: 
-- Every variable in the code snippet has a data structure.
-- The data structure of a variable is the type of data it holds. For example, a variable could hold a string, a number, an array, an object, a function, etc.
-- We want to identify every aspect of every variable in the code snippet.
+For destructuring like \`const { x } = obj\`, record \`"x": "obj.x"\`.
 
-Example:
-\`\`\`typescript
-const { name, age } = person;
-\`\`\`
+For function calls like \`const result = foo(arg)\`:
+- Record \`"result": "foo(arg).functionCallReturnValue"\`
+- Record \`"foo(arg).signature[0]": "arg"\`
 
-In this case three variables are declared: \`name\`, \`age\`, and \`person\` so the overall structure would be:
+For destructured function returns like \`const { data } = foo()\`:
+- Record \`"data": "foo().functionCallReturnValue.data"\`
 
-\`\`\`json
-{
-  "structure": {
-    "person": "object",
-    "person.name": "string",
-    "person.age": "number"
-    "name": "string",
-    "age": "number"
-  }
-}
-\`\`\`
-
-Equivalent Variables:
-- In the code variables or aspects of a variable may be assigned to one another, passed in as arguments to a function call, or assigned to the return value of a function call.
-- We want to track all of these equivalent variables so that we can merge the data structure of all equivalencies together.
-- The key should be the variable or aspect of a variable that is recieving existing data from the other variable, which is the path.
+## Example
 
-Example:
 \`\`\`typescript
-const { name, hobbies } = person;
-hobbies[0].started = selectedHobby.alreadyStarted;
+const { name } = person;
+const result = process(name);
 \`\`\`
 
-Here we have a number of equivalencies:
-
-\`\`\`
-{
-  "equivalentVariables": {
-    "name": "person.name",
-    "hobbies": "person.hobbies",
-    "hobbies[0].started": "selectedHobby.alreadyStarted"    
-  }
-}
-\`\`\`
-
-**Response:**
-
-Combine these together to form the response:
-
 \`\`\`json
 {
   "structure": {
     "person": "object",
     "person.name": "string",
-    "person.hobbies": "array",
-    "person.hobbies[0]": "object",
-    "person.hobbies[0].started": "boolean",
-    "selectedHobby": "object",
-    "selectedHobby.alreadyStarted": "boolean"
+    "name": "string",
+    "process(name)": "function",
+    "result": "unknown"
   },
   "equivalentVariables": {
     "name": "person.name",
-    "hobbies": "person.hobbies",
-    "hobbies[0].started": "selectedHobby.alreadyStarted"    
+    "process(name).signature[0]": "name",
+    "result": "process(name).functionCallReturnValue"
   }
 }
 \`\`\`
@@ -239,10 +206,7 @@ ${relevantExamples(reservedStrategies)}
 
 ---
 
-**Important:**
-
-- Take your time and analyze the code snippet carefully. Capture all the data structures, function calls, and equivalencies you can find. If you miss any the simulation will fail.
-- Double check your work to ensure nothing was missed and all rules are followed.
+Analyze carefully. Missing equivalencies will cause simulation failures.
 `;
 
 function keywords(reservedStrategies: string[]) {
@@ -348,7 +312,20 @@ const STRATEGIES = {
     name: 'Basic Variable Assignment',
     examples: [
       {
-        name: 'Simple',
+        name: 'Simple Assignment',
+        code: `const selectedPerson = person;`,
+        response: `{
+    "structure": {
+      "selectedPerson": "unknown",
+      "person": "unknown"
+    },
+    "equivalentVariables": {
+      "selectedPerson": "person"
+    }
+  }`,
+      },
+      {
+        name: 'Property Assignment',
         code: `selectedPerson.position = position.name;`,
         response: `{
     "structure": {
@@ -363,7 +340,7 @@ const STRATEGIES = {
   }`,
       },
       {
-        name: 'Basic Deconstruction',
+        name: 'Destructuring',
         code: `const { name, age } = getPerson(personId);`,
         response: `{
     "structure": {
@@ -404,10 +381,10 @@ const STRATEGIES = {
         response: `{
     "structure": {
       "person": "object",
-      "options: "object"
+      "options": "object"
     },
     "equivalentVariables": {
-      "person": "signature[0]": 
+      "person": "signature[0]",
       "options": "signature[1]"
     }
   }`,
@@ -477,7 +454,7 @@ const STRATEGIES = {
       "name": "string",
       "title": "string",
       "category": "string",
-      "age": "number",
+      "age": "number"
     },
     "equivalentVariables": {
       "name": "signature[0].name",
@@ -932,10 +909,10 @@ const STRATEGIES = {
         response: `{
     "structure": {
       "age": "number",
-      "returnValue": "number",
+      "returnValue": "number"
     },
     "equivalentVariables": {
-      "returnValue: "age"
+      "returnValue": "age"
     }
   }`,
       },
@@ -988,7 +965,7 @@ const STRATEGIES = {
     "structure": {
       "items": "array",
       "items.filter(cyScope1())": "function",
-      "cyScope1()" : "function",
+      "cyScope1()": "function",
       "List()": "function",
       "div()": "function"
     },
@@ -1684,7 +1661,7 @@ const STRATEGIES = {
     "foo(arg1).bar({ arg2, arg3 }).bar().baz(arg4, arg5).boo()": "function"
   },
   "equivalentVariables": {
-   "data": "foo(arg1).bar({ arg2, arg3 }).bar().baz(arg4, arg5).boo().functionCallReturnValue.data"
+   "data": "foo(arg1).bar({ arg2, arg3 }).bar().baz(arg4, arg5).boo().functionCallReturnValue.data",
    "error": "foo(arg1).bar({ arg2, arg3 }).bar().baz(arg4, arg5).boo().functionCallReturnValue.error"
   }
 }`,