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

package/background/src/lib/virtualized/project/writeMockDataTsx.js

@@ -6,6 +6,35 @@ import { parseDocument } from 'htmlparser2';
 import { safeFileName } from "../../../../../packages/utils/index.js";
 import { cleanOutBoundary } from "../../../../../packages/ai/index.js";
 import { reconcileMockDataKeys } from "./reconcileMockDataKeys.js";
+/**
+ * Normalize useParams mock data by fixing the React Router splat param (*).
+ * The LLM often generates random string values for `*` (the splat param),
+ * but this param represents the URL path suffix after the matched route
+ * and should typically be empty string for default scenarios.
+ *
+ * Example: For route `/entity/:sha/*`, the `*` param contains everything
+ * after `/entity/:sha/`. An empty string means the default tab/view.
+ */
+function normalizeParamsMockData(mockData) {
+    const result = {};
+    for (const [key, value] of Object.entries(mockData)) {
+        // Check if this is a useParams mock data entry
+        if (key.includes('useParams') && value && typeof value === 'object') {
+            const paramsObj = value;
+            // If there's a `*` key (splat param), default it to empty string
+            // The splat param represents URL path suffix and is typically empty for default views
+            if ('*' in paramsObj) {
+                result[key] = {
+                    ...paramsObj,
+                    '*': '', // Default splat to empty string for default tab/view
+                };
+                continue;
+            }
+        }
+        result[key] = value;
+    }
+    return result;
+}
 /**
  * Return true when `markup` contains 0 or >1 meaningful
  * top-level nodes (element *or* non-blank text), so React
@@ -39,12 +68,12 @@ const cleanOutTypes = (str) => {
     return cleanOutBoundary(str, '<', '>').replace(/<>/g, '');
 };
 const safeString = (s, level) => {
-    if (s?.endsWith && s.endsWith(')') && (level === 1 || level === 2)) {
-        // remove arguments from top level functions
-        s = s.split('(')[0] + '()';
-        // strip type parameters like <typeof loader>
-        s = cleanOutTypes(s);
-    }
+    // NOTE: We no longer strip arguments from top-level function keys (level 2)
+    // because normalizeMockData now handles merging duplicate keys while preserving
+    // original keys when there's only one call site. This ensures constructMockCode
+    // can look up data with the full key (e.g., "useCustomSizes(projectSlug)").
+    //
+    // Only escape quotes and newlines for safe string output.
     return s?.replace ? s.replace(/"/g, "'").replace(/\n/g, '\\n') : s;
 };
 /**
@@ -80,39 +109,51 @@ const shouldBeMap = (mockKey, mergedDataStructure) => {
     return false;
 };
 /**
- * Normalize a function call key by stripping arguments and type parameters.
+ * Normalize a function call key by stripping arguments but PRESERVING type parameters.
+ * Type parameters like <typeof loader> are important for disambiguation.
+ * Variable qualifiers (::variableName suffix) are also preserved.
+ *
  * e.g., "useLastLogLine(projectSlug, !!simulatingEntitySha)" -> "useLastLogLine()"
- * e.g., "useLoaderData<typeof loader>()" -> "useLoaderData()"
+ * e.g., "useLoaderData<typeof loader>()" -> "useLoaderData<typeof loader>()" (PRESERVED)
+ * e.g., "useFetcher()::entityDiffFetcher" -> "useFetcher()::entityDiffFetcher" (preserved)
+ * e.g., "useFetcher<T>()::entityDiffFetcher" -> "useFetcher<T>()::entityDiffFetcher" (PRESERVED)
  */
 const normalizeKey = (key) => {
-    if (key.endsWith(')') && key.includes('(')) {
-        // Strip arguments: "foo(a, b)" -> "foo()"
-        const normalized = key.split('(')[0] + '()';
-        // Strip type parameters: "foo<T>()" -> "foo()"
-        return cleanOutTypes(normalized);
-    }
-    return key;
-};
-/**
- * Deep merge two objects, with source values taking precedence.
- * Arrays are replaced, not merged.
- */
-const deepMergeObjects = (target, source) => {
-    const result = { ...target };
-    for (const key of Object.keys(source)) {
-        if (source[key] &&
-            typeof source[key] === 'object' &&
-            !Array.isArray(source[key]) &&
-            target[key] &&
-            typeof target[key] === 'object' &&
-            !Array.isArray(target[key])) {
-            result[key] = deepMergeObjects(target[key], source[key]);
+    // Check for variable qualifier (::variableName)
+    const qualifierMatch = key.match(/::[a-zA-Z_][a-zA-Z0-9_]*$/);
+    const qualifier = qualifierMatch ? qualifierMatch[0] : '';
+    const keyWithoutQualifier = qualifier ? key.slice(0, -qualifier.length) : key;
+    // Check if key ends with ) - indicating a function call (after removing qualifier)
+    if (keyWithoutQualifier.endsWith(')') && keyWithoutQualifier.includes('(')) {
+        // Find the opening paren that matches the closing paren (accounting for nested parens and generics)
+        // We want to strip arguments but preserve type parameters
+        // e.g., "useLoaderData<typeof loader>(arg1, arg2)" -> "useLoaderData<typeof loader>()"
+        // e.g., "foo(a, b)" -> "foo()"
+        // Find where type parameters end (if any) by finding matching < >
+        let typeParamEnd = 0;
+        if (keyWithoutQualifier.includes('<')) {
+            let depth = 0;
+            for (let i = 0; i < keyWithoutQualifier.length; i++) {
+                if (keyWithoutQualifier[i] === '<')
+                    depth++;
+                if (keyWithoutQualifier[i] === '>') {
+                    depth--;
+                    if (depth === 0) {
+                        typeParamEnd = i + 1;
+                        break;
+                    }
+                }
+            }
         }
-        else {
-            result[key] = source[key];
+        // Find the opening paren for function arguments (after type params)
+        const argsStart = keyWithoutQualifier.indexOf('(', typeParamEnd);
+        if (argsStart !== -1) {
+            // Preserve everything up to and including the opening paren, then close it
+            const normalized = keyWithoutQualifier.slice(0, argsStart) + '()';
+            return normalized + qualifier;
         }
     }
-    return result;
+    return key;
 };
 /**
  * Extract all keys from a JsonTypeDefinition recursively.
@@ -131,11 +172,43 @@ function extractAllKeys(obj) {
     }
     return keys;
 }
+/**
+ * Bare type markers that indicate a function was detected but has no actual return data.
+ * These should be filtered out of mock data output since they're just type hints.
+ */
+const BARE_TYPE_MARKERS = ['function', 'async-function'];
+/**
+ * Check if a value is a bare function type marker that should be filtered out.
+ * These markers indicate the LLM detected a function but couldn't generate meaningful mock data.
+ *
+ * Also catches TypeScript union types containing function, like:
+ * - "function | null"
+ * - "function | undefined"
+ * - "async-function | null"
+ */
+const isBareTypeMarker = (value) => {
+    if (typeof value !== 'string')
+        return false;
+    // Check for exact bare type markers
+    if (BARE_TYPE_MARKERS.includes(value))
+        return true;
+    // Check for TypeScript union types containing function type markers
+    // e.g., "function | null", "function | undefined", "async-function | null"
+    if (value.includes('|')) {
+        const parts = value.split('|').map((p) => p.trim());
+        // If any part is a bare type marker, treat the whole thing as a type marker
+        return parts.some((part) => BARE_TYPE_MARKERS.includes(part));
+    }
+    return false;
+};
 /**
  * Normalize mock data by merging entries that have the same normalized function name.
  * e.g., "useLastLogLine(projectSlug, !!simulatingEntitySha)" and
  *       "useLastLogLine(projectSlug, currentRunActive)" both become "useLastLogLine()"
  * Their values are deep-merged to ensure all attributes are accounted for.
+ *
+ * Also filters out bare function type markers like "validateInputs()": "function"
+ * which are just type hints without actual mock data.
  */
 const normalizeMockData = (mockData) => {
     const normalized = {};
@@ -148,31 +221,64 @@ const normalizeMockData = (mockData) => {
         }
         keyMapping.get(normKey).push(key);
     }
+    // Helper to check if a value is an empty object
+    const isEmptyObject = (value) => {
+        return (value !== null &&
+            typeof value === 'object' &&
+            !Array.isArray(value) &&
+            Object.keys(value).length === 0);
+    };
     // Second pass: merge values for duplicate normalized keys
     for (const [normKey, originalKeys] of keyMapping) {
         if (originalKeys.length === 1) {
-            // No duplicates, use the original key (may be normalized or not based on safeString)
-            normalized[normKey] = mockData[originalKeys[0]];
+            // No duplicates - PRESERVE the original key with arguments
+            // This is critical because constructMockCode generates code that accesses
+            // data with the FULL key (e.g., scenarios().data()?.["useCustomSizes(projectSlug)"])
+            // If we normalize to "useCustomSizes()" but code looks for "useCustomSizes(projectSlug)",
+            // the lookup fails and returns undefined, causing runtime errors.
+            const value = mockData[originalKeys[0]];
+            // Skip bare type markers like "function" or "async-function"
+            if (isBareTypeMarker(value)) {
+                continue;
+            }
+            // Skip empty objects - these cause "Objects are not valid as a React child" errors
+            // when mock functions return them (e.g., CheckCircle2() from lucide-react)
+            if (isEmptyObject(value)) {
+                continue;
+            }
+            normalized[originalKeys[0]] = value;
         }
         else {
             // Multiple keys normalize to the same value - merge them
             let mergedValue = {};
             for (const origKey of originalKeys) {
                 const value = mockData[origKey];
+                // Skip bare type markers when merging
+                if (isBareTypeMarker(value)) {
+                    continue;
+                }
                 if (value &&
                     typeof value === 'object' &&
                     !Array.isArray(value) &&
                     mergedValue &&
                     typeof mergedValue === 'object' &&
                     !Array.isArray(mergedValue)) {
-                    mergedValue = deepMergeObjects(mergedValue, value);
+                    mergedValue = deepMerge(mergedValue, value);
                 }
                 else {
                     // For non-objects or arrays, later values take precedence
                     mergedValue = value;
                 }
             }
-            normalized[normKey] = mergedValue;
+            // Only add if we have actual data (not just filtered type markers)
+            // Note: typeof null === 'object' in JS, so we must check for null explicitly
+            if (mergedValue !== undefined &&
+                !isBareTypeMarker(mergedValue) &&
+                !(mergedValue !== null &&
+                    typeof mergedValue === 'object' &&
+                    Object.keys(mergedValue).length === 0)) {
+                normalized[normKey] = mergedValue;
+            }
         }
     }
     return normalized;
@@ -186,9 +292,13 @@ const jsonToCode = (json, level = 1, mergedDataStructure, currentKey) => {
         if (Array.isArray(json)) {
             const arrayStrings = [];
             for (const item of json) {
-                if (!item)
+                // Skip undefined but preserve null (important for ref props)
+                if (item === undefined)
                     continue;
-                if (typeof item === 'object') {
+                if (item === null) {
+                    arrayStrings.push('null');
+                }
+                else if (typeof item === 'object') {
                     arrayStrings.push(jsonToCode(item, level + 1, mergedDataStructure));
                 }
                 else {
@@ -200,13 +310,62 @@ const jsonToCode = (json, level = 1, mergedDataStructure, currentKey) => {
         else {
             const keyStrings = [];
             const jsonObj = json;
+            // Track normalized function names to avoid duplicate keys in output
+            // e.g., submit({ a }) and submit({ b }) should both become "submit" once
+            const seenNormalizedFuncNames = new Set();
+            // Pre-scan to identify plain keys that have function-call versions
+            // These plain keys should be skipped because the function-call version
+            // will be normalized to the same key name
+            // e.g., if both "push" and "push(`/path`)" exist, skip the plain "push"
+            const plainKeysWithFunctionCallVersions = new Set();
+            for (const key of Object.keys(jsonObj)) {
+                if (key.includes('(') && key.endsWith(')')) {
+                    const funcName = key.split('(')[0];
+                    // Check if a plain key with this name exists
+                    if (funcName in jsonObj && !funcName.includes('(')) {
+                        plainKeysWithFunctionCallVersions.add(funcName);
+                    }
+                }
+            }
             for (const key of Object.keys(jsonObj)) {
-                if (jsonObj[key] === undefined || jsonObj[key] === null)
+                if (jsonObj[key] === undefined)
+                    continue;
+                // Preserve explicit null values - components check `value !== null`
+                // to distinguish "not loaded" (undefined) from "explicitly null"
+                if (jsonObj[key] === null) {
+                    keyStrings.push(`${levelSpacing}"${safeString(key, level)}": null`);
                     continue;
+                }
                 if (Array.isArray(jsonObj[key])) {
                     if (key === '~~codeyam-jsx~~') {
                         return `<>${jsonObj[key].join('')}</>`;
                     }
+                    // Check if this is a nested function signature with array value
+                    // e.g., "postMessage(message, '*')": ["mockMessageString", "*"]
+                    // These need to be transformed into callable arrow functions
+                    // Only apply at deeper nesting levels (level > 2) - top-level mock data keys
+                    // (level 2) are return values that should preserve their data
+                    // Skip when array contains objects (likely return data like getAll() returning [{name, value}])
+                    const argsArray = jsonObj[key];
+                    const isReturnData = argsArray.some((item) => item && typeof item === 'object' && !Array.isArray(item));
+                    if (key.includes('(') &&
+                        key.endsWith(')') &&
+                        level > 2 &&
+                        !isReturnData) {
+                        const funcName = key.split('(')[0];
+                        // Skip if we've already added this normalized function name
+                        if (seenNormalizedFuncNames.has(funcName)) {
+                            continue;
+                        }
+                        seenNormalizedFuncNames.add(funcName);
+                        const argsArray = jsonObj[key];
+                        const argsString = argsArray
+                            .map((_, i) => `arg${i + 1}`)
+                            .join(', ');
+                        console.log(`CodeYam: Nested func transform (array): "${key}" -> "${funcName}"`);
+                        keyStrings.push(`${levelSpacing}"${safeString(funcName, level)}": (${argsString}) => {}`);
+                        continue;
+                    }
                     const arrayString = jsonToCode(jsonObj[key], level + 1, mergedDataStructure);
                     // Check if this key should be instantiated as a Map
                     if (mergedDataStructure && shouldBeMap(key, mergedDataStructure)) {
@@ -216,10 +375,34 @@ const jsonToCode = (json, level = 1, mergedDataStructure, currentKey) => {
                         keyStrings.push(`${levelSpacing}"${safeString(key, level)}": ${arrayString}`);
                     }
                 }
-                else if (typeof jsonObj[key] === 'object') {
-                    // Check if this object has a "functionCallReturnValue" key - if so, unwrap it
+                else if (jsonObj[key] !== null && typeof jsonObj[key] === 'object') {
                     const objKeys = Object.keys(jsonObj[key]);
-                    if (objKeys.length === 1 &&
+                    // Check if this is a nested function signature (e.g., "postMessage(message, targetOrigin)": { signature: [...] })
+                    // These need to be transformed into callable arrow functions
+                    // Only apply at deeper nesting levels (level > 2) - top-level mock data keys
+                    // (level 2) are return values that should preserve their data
+                    if (key.includes('(') &&
+                        key.endsWith(')') &&
+                        level > 2 &&
+                        objKeys.includes('signature') &&
+                        Array.isArray(jsonObj[key].signature)) {
+                        const funcName = key.split('(')[0];
+                        // Skip if we've already added this normalized function name
+                        if (seenNormalizedFuncNames.has(funcName)) {
+                            continue;
+                        }
+                        seenNormalizedFuncNames.add(funcName);
+                        const signature = jsonObj[key]
+                            .signature;
+                        const argsString = signature
+                            .map((_, i) => `arg${i + 1}`)
+                            .join(', ');
+                        console.log(`CodeYam: Nested func transform (signature): "${key}" -> "${funcName}"`);
+                        keyStrings.push(`${levelSpacing}"${safeString(funcName, level)}": (${argsString}) => {}`);
+                    }
+                    else if (
+                    // Check if this object has a "functionCallReturnValue" key - if so, unwrap it
+                    objKeys.length === 1 &&
                         objKeys[0] === 'functionCallReturnValue') {
                         const unwrappedValue = jsonObj[key]
                             .functionCallReturnValue;
@@ -239,24 +422,43 @@ const jsonToCode = (json, level = 1, mergedDataStructure, currentKey) => {
                         objKeys[0].startsWith('(') &&
                         objKeys[0].endsWith(')')) {
                         const signatureKey = objKeys[0];
-                        // Extract arguments without parentheses for the combined key
+                        // Extract arguments without parentheses for the function name
                         const args = signatureKey.slice(1, -1);
-                        const flattenedKey = `${key}(${args})`;
                         const unwrappedValue = jsonObj[key][signatureKey];
-                        if (typeof unwrappedValue === 'string') {
+                        // Handle null values - generate arrow function stubs for function signatures with null
+                        if (unwrappedValue === null) {
+                            const funcName = key;
+                            const argsString = args
+                                .split(',')
+                                .map((arg, i) => `${arg.trim()}: any`)
+                                .join(', ');
+                            keyStrings.push(`${levelSpacing}"${safeString(funcName, level)}": (${argsString}) => {}`);
+                        }
+                        else if (typeof unwrappedValue === 'string') {
+                            const flattenedKey = `${key}(${args})`;
                             keyStrings.push(`${levelSpacing}"${safeString(flattenedKey, level)}": "${safeString(unwrappedValue, level)}"`);
                         }
                         else if (typeof unwrappedValue === 'object') {
+                            const flattenedKey = `${key}(${args})`;
                             keyStrings.push(`${levelSpacing}"${safeString(flattenedKey, level)}": ${jsonToCode(unwrappedValue, level + 1, mergedDataStructure)}`);
                         }
                         else if (typeof unwrappedValue === 'boolean') {
+                            const flattenedKey = `${key}(${args})`;
                             keyStrings.push(`${levelSpacing}"${safeString(flattenedKey, level)}": ${unwrappedValue}`);
                         }
                         else {
+                            const flattenedKey = `${key}(${args})`;
                             keyStrings.push(`${levelSpacing}"${safeString(flattenedKey, level)}": ${safeString(String(unwrappedValue), level)}`);
                         }
                     }
                     else {
+                        // Skip plain keys that have function-call versions (at deeper nesting levels)
+                        // e.g., if both "t" and "t('common.close')" exist, skip the plain "t" object
+                        // because the function-call version will be normalized to "t"
+                        if (level > 2 && plainKeysWithFunctionCallVersions.has(key)) {
+                            console.log(`CodeYam: Skipping plain object key "${key}" (has function-call version that will be normalized)`);
+                            continue;
+                        }
                         keyStrings.push(`${levelSpacing}"${safeString(key, level)}": ${jsonToCode(jsonObj[key], level + 1, mergedDataStructure)}`);
                     }
                 }
@@ -277,9 +479,101 @@ const jsonToCode = (json, level = 1, mergedDataStructure, currentKey) => {
                     return keyValue;
                 }
                 else if (typeof jsonObj[key] === 'string') {
-                    keyStrings.push(`${levelSpacing}"${safeString(key, level)}": "${safeString(jsonObj[key], level)}"`);
+                    const stringValue = jsonObj[key];
+                    // Check if this is a nested function signature with string value
+                    // e.g., "postMessage(message, '*')": "() => { console.log('postMessage called'); }"
+                    // These need to have the key normalized to just the function name
+                    // Only apply at deeper nesting levels (level > 2)
+                    if (key.includes('(') && key.endsWith(')') && level > 2) {
+                        const funcName = key.split('(')[0];
+                        // Extract the function arguments to check if they're string literals
+                        const argsMatch = key.match(/\((.+)\)$/);
+                        const args = argsMatch ? argsMatch[1].trim() : '';
+                        // Check if the argument is a simple string literal like "common.close" or 'common.close'
+                        // These are static lookup keys (e.g., translation functions) and should NOT be normalized
+                        const isStringLiteralArg = /^["'][^"']*["']$/.test(args);
+                        if (isStringLiteralArg) {
+                            // DON'T normalize - preserve the full key for static lookups (e.g., translations)
+                            // This allows constructMockCode to generate a dispatch function that looks up by key
+                            keyStrings.push(`${levelSpacing}"${safeString(key, level)}": "${safeString(stringValue, level)}"`);
+                            console.log(`CodeYam: Preserving string-literal function key for lookup: "${key}": "${stringValue}"`);
+                            continue;
+                        }
+                        // Skip if we've already added this normalized function name
+                        if (seenNormalizedFuncNames.has(funcName)) {
+                            continue;
+                        }
+                        // Skip TypeScript union type markers like "function | null" - these are type hints
+                        // that would produce invalid JavaScript if output as-is.
+                        // Note: We only skip UNION types here (containing '|'), not bare 'function'
+                        // because bare 'function' is transformed to () => {} below.
+                        // Note: This must come BEFORE seenNormalizedFuncNames.add() so that
+                        // if another key with the same funcName has actual data, it can be used.
+                        if (stringValue.includes('|') && isBareTypeMarker(stringValue)) {
+                            continue;
+                        }
+                        seenNormalizedFuncNames.add(funcName);
+                        // Check if the string value looks like a function expression
+                        // Be careful not to match descriptive strings like "function listening" -
+                        // a valid function expression must have parentheses like function(), function name(), or function (
+                        const looksLikeFunction = stringValue.includes('=>') ||
+                            /^function\s*[\w]*\s*\(/.test(stringValue) ||
+                            /^async\s+function\s*[\w]*\s*\(/.test(stringValue) ||
+                            /^async\s*\(/.test(stringValue);
+                        // Check if the string value looks like a Promise expression
+                        // e.g., "Promise.resolve()", "new Promise(...)", etc.
+                        const looksLikePromise = stringValue.startsWith('Promise.') ||
+                            stringValue.startsWith('new Promise');
+                        // Handle special type indicators that need transformation
+                        let outputValue;
+                        if (stringValue === 'promise' || looksLikePromise) {
+                            // The key is a function call (e.g., "revalidate()"), so output a function
+                            // that returns a Promise, not the Promise itself
+                            const promiseExpr = looksLikePromise
+                                ? stringValue
+                                : 'Promise.resolve()';
+                            outputValue = `() => ${promiseExpr}`;
+                            console.log(`CodeYam: Nested func transform (string->Promise): "${key}" -> "${funcName}": () => ${promiseExpr}`);
+                        }
+                        else if (stringValue === 'function') {
+                            outputValue = '() => {}';
+                            console.log(`CodeYam: Nested func transform (string->function): "${key}" -> "${funcName}": () => {}`);
+                        }
+                        else if (looksLikeFunction) {
+                            outputValue = stringValue;
+                            console.log(`CodeYam: Nested func transform (string): "${key}" -> "${funcName}": ${stringValue.substring(0, 30)}...`);
+                        }
+                        else {
+                            // Plain string value - must be quoted
+                            outputValue = `"${safeString(stringValue, level)}"`;
+                            console.log(`CodeYam: Nested func transform (string->quoted): "${key}" -> "${funcName}": "${stringValue}"`);
+                        }
+                        keyStrings.push(`${levelSpacing}"${safeString(funcName, level)}": ${outputValue}`);
+                    }
+                    else {
+                        // Skip plain keys that have function-call versions (at the same nesting level where
+                        // function-call keys get normalized). The function-call version will be output instead.
+                        // e.g., if both "push" and "push(`/path`)" exist, skip "push" - the other normalizes to "push"
+                        if (level > 2 && plainKeysWithFunctionCallVersions.has(key)) {
+                            console.log(`CodeYam: Skipping plain key "${key}" (has function-call version that will be normalized)`);
+                            continue;
+                        }
+                        // Skip bare type markers like "function", "function | null", etc.
+                        // For plain keys (not function signatures), these are just type hints
+                        // that would produce invalid JavaScript if output as-is.
+                        if (isBareTypeMarker(stringValue)) {
+                            continue;
+                        }
+                        keyStrings.push(`${levelSpacing}"${safeString(key, level)}": "${safeString(stringValue, level)}"`);
+                    }
                 }
                 else {
+                    // Skip plain keys that have function-call versions (at the same nesting level where
+                    // function-call keys get normalized)
+                    if (level > 2 && plainKeysWithFunctionCallVersions.has(key)) {
+                        console.log(`CodeYam: Skipping plain key "${key}" (has function-call version that will be normalized)`);
+                        continue;
+                    }
                     keyStrings.push(`${levelSpacing}"${safeString(key, level)}": ${safeString(String(jsonObj[key]), level)}`);
                 }
             }
@@ -332,9 +626,11 @@ import React from 'react';
     if (mockScenario.name === DEFAULT_SCENARIO_NAME) {
         // Normalize mock data to merge entries with same normalized function name
         const normalizedMockData = normalizeMockData(defaultMockData);
+        // Fix useParams splat param (*) to default to empty string
+        const paramsNormalizedMockData = normalizeParamsMockData(normalizedMockData);
         dataCode = jsonToCode({
             arguments: defaultArguments,
-            ...normalizedMockData,
+            ...paramsNormalizedMockData,
         }, 2, mergedDataStructure);
     }
     else {
@@ -352,9 +648,11 @@ import React from 'react';
         const mergedMockData = deepMerge(defaultMockData, scenarioMockData);
         // Normalize mock data to merge entries with same normalized function name
         const normalizedMockData = normalizeMockData(mergedMockData);
+        // Fix useParams splat param (*) to default to empty string
+        const paramsNormalizedMockData = normalizeParamsMockData(normalizedMockData);
         const mergedData = {
             arguments: mergedArguments,
-            ...normalizedMockData,
+            ...paramsNormalizedMockData,
         };
         // Use level=2 (same as default scenario) for consistent key formatting.
         // This ensures nested function arguments are kept (e.g., "from('workouts')")
@@ -410,13 +708,44 @@ function serialize(obj) {
         
         // Handle functions
         if (typeof value === 'function') {
-            const fnStr = value.toString();
+            let fnStr;
+            try {
+                fnStr = value.toString();
+            } catch (toStringErr) {
+                console.warn('CodeYam: Function.toString() threw error:', toStringErr, 'function name:', value.name);
+                return {
+                    __type: TYPE_MARKERS.FUNCTION,
+                    value: '() => {}',
+                    name: value.name || 'anonymous'
+                };
+            }
+
+            // Defensive check: ensure fnStr is actually a string
+            if (typeof fnStr !== 'string') {
+                console.warn('CodeYam: Function.toString() returned non-string:', typeof fnStr, fnStr, 'function name:', value.name);
+                return {
+                    __type: TYPE_MARKERS.FUNCTION,
+                    value: '() => {}',
+                    name: value.name || 'anonymous'
+                };
+            }
+
             // Check if it's an arrow function
             if (fnStr.includes('=>')) {
+                const arrowIndex = fnStr.indexOf('=>');
+                // Extra safety: verify indexOf returned a valid index
+                if (arrowIndex === -1) {
+                    console.warn('CodeYam: Arrow function detection inconsistency - includes found => but indexOf returned -1. fnStr:', fnStr);
+                    return {
+                        __type: TYPE_MARKERS.FUNCTION,
+                        value: fnStr,
+                        name: value.name
+                    };
+                }
                 return {
                     __type: TYPE_MARKERS.ARROW_FUNCTION,
-                    params: fnStr.substring(0, fnStr.indexOf('=>')).trim(),
-                    body: fnStr.substring(fnStr.indexOf('=>') + 2).trim()
+                    params: fnStr.substring(0, arrowIndex).trim(),
+                    body: fnStr.substring(arrowIndex + 2).trim()
                 };
             }
             return {
@@ -510,17 +839,23 @@ function deserialize(jsonString) {
                 
             case TYPE_MARKERS.FUNCTION:
                 try {
-                    // Handle named functions
+                    // Handle named functions - extract params and body properly
                     if (value.name && value.name !== 'anonymous') {
-                        const functionBody = value.value.slice(value.value.indexOf('{') + 1, value.value.lastIndexOf('}'));
-                        return new Function(\`return function \${value.name}\${functionBody}\`)();
+                        const parenStart = value.value.indexOf('(');
+                        const braceStart = value.value.indexOf('{');
+                        if (parenStart !== -1 && braceStart !== -1 && parenStart < braceStart) {
+                            // Extract params (between first ( and the { that starts the body)
+                            const params = value.value.slice(parenStart, braceStart).trim();
+                            const functionBody = value.value.slice(braceStart + 1, value.value.lastIndexOf('}'));
+                            return new Function(\`return function \${value.name}\${params}{\${functionBody}}\`)();
+                        }
                     }
-                    // Handle anonymous functions
+                    // Handle anonymous functions or fallback
                     return new Function(\`return \${value.value}\`)();
                 } catch (e) {
                     console.warn('Error deserializing function:', e);
-                    return function() { 
-                        return 'Error: Function could not be deserialized'; 
+                    return function() {
+                        return 'Error: Function could not be deserialized';
                     };
                 }