@props([
    'name',
    'type' => 'text', // text or textarea
    'label' => null,
    'placeholder' => '',
    'modelObject' => '', // The parent object that contains all fields (e.g., 'feature')
    'modelField' => '', // The specific field to bind to (e.g., 'name' or 'description')
    'objectType' => '', // Type of object (e.g., 'feature', 'benefit', 'step')
    'collection' => '', // The collection this object belongs to (e.g., 'features', 'benefits', 'steps')
    'index' => 0, // Index in the collection
    'saveCallback' => 'saveProjects()', // Callback to save changes
    'rows' => 2, // For textarea
    'maxLength' => 500, // Character limit
    'generate' => true, // Show generate button
    'enhance' => true, // Show enhance button
])
<div x-data="enhanceableField('{{ $objectType }}', '{{ $modelField }}', '{{ $index }}', '{{ $collection }}', '{{ $saveCallback }}')" class="relative">
    @if ($type === 'text')
        <input type="text" id="{{ $name }}_{{ $index }}" x-ref="input"
            x-model="{{ $modelObject }}.{{ $modelField }}" @input.debounce.500ms="updateParent()"
            class="block w-full pr-24 rounded-lg border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-800 text-gray-900 dark:text-gray-100 shadow-sm focus:border-indigo-500 dark:focus:border-indigo-400 focus:ring-2 focus:ring-indigo-200 dark:focus:ring-indigo-700 transition-all duration-200"
            placeholder="{{ $placeholder }}" :disabled="loadingEnhance || loadingGenerate">
    @else
        <!-- Character counter -->
        <div class="absolute top-1 right-2 text-xs">
            <span x-text="({{ $modelObject }}.{{ $modelField }} || '').length" class ="text-indigo-600 dark:text-indigo-300 font-medium"></span>/<span class="text-gray-500 dark:text-gray-400">{{ $maxLength }}</span>
        </div>

        <textarea id="{{ $name }}_{{ $index }}" x-ref="input"
            x-model="{{ $modelObject }}.{{ $modelField }}" @input.debounce.500ms="updateParent()"
            rows="{{ $rows }}"
            maxlength="{{ $maxLength }}"
            class="block w-full pr-24 pb-12 rounded-lg border-gray-300 dark:border-gray-600 bg-white dark:bg-gray-800 text-gray-900 dark:text-gray-100 shadow-sm focus:border-indigo-500 dark:focus:border-indigo-400 focus:ring-2 focus:ring-indigo-200 dark:focus:ring-indigo-700 transition-all duration-200 resize"
            placeholder="{{ $placeholder }}" :disabled="loadingEnhance || loadingGenerate"></textarea>
    @endif

    <!-- Enhance/Generate Buttons -->
    <div class="absolute right-3 bottom-1.5 flex items-center space-x-2.5 z-10">
        <!-- Enhance Button (icon only) -->
        <button type="button" @click="enhanceText" :disabled="loadingEnhance || loadingGenerate || !hasContent"
            class="group relative p-2 rounded-md bg-blue-500 text-blue-600 dark:text-blue-400 hover:bg-blue-200 dark:hover:bg-gray-600 disabled:bg-gray-100 dark:disabled:bg-gray-800 disabled:text-gray-400 disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-blue-400 focus:ring-offset-2 dark:focus:ring-offset-gray-800 shadow-sm transition-all duration-200 ease-out"
            title="{{ trans('siri.rephrase_text') }}">
            <svg x-show="!loadingEnhance" class="w-3 h-3 transition-transform duration-200 text-white"
                :class="{
                    'group-hover:scale-110 group-hover:text-blue-600': !(loadingEnhance || loadingGenerate || !
                        hasContent),
                    'text-blue-300': (loadingEnhance || loadingGenerate || !hasContent)
                }"
                fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
                <path stroke-linecap="round" stroke-linejoin="round"
                    d="M9.813 15.904L9 18.75l-.813-2.846a4.5 4.5 0 00-3.09-3.09L2.25 12l2.846-.813a4.5 4.5 0 003.09-3.09L9 5.25l.813 2.846a4.5 4.5 0 003.09 3.09L15.75 12l-2.846.813a4.5 4.5 0 00-3.09 3.09zM18.259 8.715L18 9.75l-.259-1.035a3.375 3.375 0 00-2.455-2.456L14.25 6l1.036-.259a3.375 3.375 0 002.455-2.456L18 2.25l.259 1.035a3.375 3.375 0 002.456 2.456L21.75 6l-1.035.259a3.375 3.375 0 00-2.456 2.456z" />
            </svg>
            <svg x-show="loadingEnhance" class="w-2 h-2 animate-spin" fill="none" viewBox="0 0 24 24">
                <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4">
                </circle>
                <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8v4a4 4 0 00-4 4H4z"></path>
            </svg>
        </button>

        @if ($generate)
            <button type="button" @click="generateText" :disabled="loadingEnhance || loadingGenerate"
            class="group relative p-2 rounded-md bg-green-500 text-green-600 dark:text-green-400 hover:bg-green-200 dark:hover:bg-gray-600 disabled:bg-gray-100 dark:disabled:bg-gray-800 disabled:text-gray-400 disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-green-400 focus:ring-offset-2 dark:focus:ring-offset-gray-800 shadow-sm transition-all duration-200 ease-out"
            title="{{ trans('siri.generate_text') }}">
            <!-- No pulse background, only spinner icon during loading -->
            <svg x-show="!loadingGenerate" class="w-3 h-3 transition-transform duration-200 text-white"
                :class="{
                    'group-hover:scale-110 group-hover:text-green-600': !(loadingEnhance || loadingGenerate || !
                        hasContent),
                    'text-green-300': (loadingEnhance || loadingGenerate || !hasContent)
                }"
                fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
                <path stroke-linecap="round" stroke-linejoin="round" d="M13 10V3L4 14h7v7l9-11h-7z" />
            </svg>
            <svg x-show="loadingGenerate" class="w-3 h-3 animate-spin" fill="none" viewBox="0 0 24 24">
                <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4">
                </circle>
                <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8v4a4 4 0 00-4 4H4z"></path>
            </svg>
        </button> 
        @endif
       

        <!-- Revert Button (icon only, only when there's original text) -->
        <button type="button" x-show="originalText" x-transition:enter="transition ease-out duration-200"
            x-transition:enter-start="opacity-0 scale-95" x-transition:enter-end="opacity-100 scale-100"
            x-transition:leave="transition ease-in duration-150" x-transition:leave-start="opacity-100 scale-100"
            x-transition:leave-end="opacity-0 scale-95" @click="revertText"
            :disabled="loadingEnhance || loadingGenerate"
            class="group relative p-2 rounded-md bg-orange-500 text-orange-600 dark:text-orange-400 hover:bg-orange-200 dark:hover:bg-gray-600 disabled:bg-gray-100 dark:disabled:bg-gray-800 disabled:text-gray-400 disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-orange-400 focus:ring-offset-2 dark:focus:ring-offset-gray-800 shadow-sm transition-all duration-200 ease-out"
            title="Revert to original text">
            <svg class="w-3 h-3 transition-transform duration-200 text-white"
                :class="{
                    'group-hover:scale-110 group-hover:text-orange-600': !(loadingEnhance || loadingGenerate || !
                        hasContent),
                    'text-orange-300': (loadingEnhance || loadingGenerate || !hasContent)
                }"
                fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
                <path stroke-linecap="round" stroke-linejoin="round" d="M3 10h10a8 8 0 018 8v2M3 10l6 6m-6-6l6-6" />
            </svg>
        </button>
    </div>
</div>
<script>
    function enhanceableField(objectType, fieldName, indexStr, collectionName, saveCallback) {
        return {
            loadingEnhance: false,
            loadingGenerate: false,
            originalText: null,

            // Get authenticated headers for API requests
            getAuthHeaders(contentType = 'application/json') {
                const headers = {
                    'Content-Type': contentType,
                    'X-CSRF-TOKEN': '{{ csrf_token() }}',
                    'Accept': 'application/json'
                };

                return headers;
            },

            // Parse the index properly - it could be a number or a string like '${idx}'
            get indexValue() {
                // If it's a numeric index, use directly
                if (!isNaN(parseInt(indexStr))) {
                    return parseInt(indexStr);
                }

                // If it contains '${' pattern, extract the variable name
                if (typeof indexStr === 'string' && indexStr.includes('${')) {
                    // Remove the ${} template syntax to get just the variable name
                    const varName = indexStr.replace(/^\${/, '').replace(/}$/, '');

                    // Try to find the variable in parent scope
                    let parentElement = this.$el;
                    while (parentElement) {
                        if (parentElement._x_model && parentElement._x_model.idx !== undefined) {
                            return parentElement._x_model.idx;
                        }
                        if (parentElement._x_dataStack) {
                            for (let data of parentElement._x_dataStack) {
                                if (data[varName] !== undefined) {
                                    return data[varName];
                                }
                            }
                        }
                        parentElement = parentElement.parentElement;
                    }
                }

                // Default fallback
                return 0;
            },

            get hasContent() {
                // Always check the value of the field for this input instance only
                let modelValue = null;
                try {
                    let parentElement = this.$el;
                    while (parentElement) {
                        if (parentElement._x_dataStack) {
                            for (let data of parentElement._x_dataStack) {
                                if (data && data['{{ $modelObject }}'] && typeof data['{{ $modelObject }}'] ===
                                    'object') {
                                    // Use the fieldName argument, not the Blade prop, to ensure correct field per instance
                                    modelValue = data['{{ $modelObject }}'][fieldName];
                                    break;
                                }
                            }
                        }
                        if (modelValue !== null) break;
                        parentElement = parentElement.parentElement;
                    }
                } catch (e) {
                    modelValue = null;
                }
                return modelValue && String(modelValue).trim() !== '';
            },

            updateParent() {
                try {
                    if (saveCallback) {
                        // Give time for x-model to update the parent data
                        setTimeout(() => {
                            // Find the parent Alpine component and execute the callback in its context
                            let parentElement = this.$el;
                            while (parentElement) {
                                if (parentElement._x_dataStack) {
                                    for (let data of parentElement._x_dataStack) {
                                        // Check if this data object has the relevant variables
                                        if (data.project !== undefined || data.projects !== undefined || data
                                            .subProjects !== undefined) {
                                            // Get the collection data
                                            const collection = this.getCollection();

                                            // Handle different callback patterns
                                            if (saveCallback.includes('project.key_features = features')) {
                                                if (data.project && collection) {
                                                    data.project.key_features = collection;
                                                }
                                            } else if (saveCallback.includes(
                                                    'project.direct_benefits = benefits')) {
                                                if (data.project && collection) {
                                                    data.project.direct_benefits = collection;
                                                }
                                            } else if (saveCallback.includes(
                                                    'project.implementation_steps = steps')) {

                                                if (data.project && collection) {
                                                    data.project.implementation_steps = collection;
                                                }
                                            } else if (saveCallback.includes('project.ai_option = aiDetails')) {
                                                if (data.project && collection) {
                                                    data.project.ai_option = collection;
                                                }
                                            }
                                            // ...existing code...
                                            if (typeof data.saveProjects === 'function') {
                                                data.saveProjects();
                                            } else if (typeof window.saveProjects === 'function') {
                                                window.saveProjects();
                                            } else if (saveCallback === 'saveProjects()') {
                                                window.saveProjects();
                                            }
                                            // ...existing code...
                                            return;
                                        }
                                    }
                                }
                                parentElement = parentElement.parentElement;
                            }
                            // Final fallback: try global saveProjects
                            if (typeof window.saveProjects === 'function') {
                                // Fix: Declare relatedFields before usage
                                let relatedFields = {};
                                window.saveProjects();
                            }
                        }, 100);
                    }
                } catch (e) {
                    console.error('Error executing save callback:', e);
                }
            },

            getCollection() {
                try {
                    // Find the parent Alpine component with the collection data
                    let parentElement = this.$el;
                    while (parentElement) {
                        if (parentElement._x_dataStack) {
                            const dataStack = parentElement._x_dataStack;
                            for (let i = 0; i < dataStack.length; i++) {
                                const data = dataStack[i];
                                // Special case for subprojects
                                if (collectionName === 'subProjects' && data.subProjects) {
                                    return data.subProjects;
                                }
                                // Special handling for direct subproject reference
                                else if (collectionName === 'subproject') {
                                    // For direct subproject reference, return the subproject object directly
                                    // This ensures that when we check for collection[indexValue] in other functions,
                                    // we'll correctly handle both array access and direct object access
                                    if (data.subproject) {
                                        return data.subproject;
                                    }
                                }
                                // Regular collection handling
                                else if (data[collectionName]) {
                                    return data[collectionName];
                                }
                            }
                        }
                        parentElement = parentElement.parentElement;
                    }
                    return null;
                } catch (e) {
                    console.error('[getCollection] Error getting collection:', e);
                    return null;
                }
            },

            getCurrentProject() {
                try {
                    // Find the parent Alpine component with project data
                    let parentElement = this.$el;
                    while (parentElement) {
                        if (parentElement._x_dataStack) {
                            for (let data of parentElement._x_dataStack) {
                                if (data.project) {
                                    return data.project;
                                } else if (data.projects) {
                                    // For roadmap section
                                    return data.projects[data.activeProjectTab] || data.projects[0];
                                } else if (data.subProjects) {
                                    // For sub-projects section
                                    return data.subProjects[data.currentRoadMap] || data.subProjects[0];
                                }
                            }
                        }
                        parentElement = parentElement.parentElement;
                    }
                    return null;
                } catch (e) {
                    console.error('Error getting current project:', e);
                    return null;
                }
            },

            enhanceText() {
                const el = this.$refs.input;
                if (!el) {
                    this._debug('enhanceText', 'No element found', null, 'warn');
                    return;
                }

                // Auto-detect type from the actual element
                const actualType = el.tagName.toLowerCase() === 'textarea' ? 'textarea' : 'text';

                // If this is a text input, call enhanceTextName instead
                if (actualType === 'text') {
                    this.enhanceTextName();
                    return;
                }
                if ("{{ $objectType }}" === 'cosiri') {
                    this.enhanceTextCosiri();
                    return;
                }
                if ("{{ $objectType }}" === 'siri') {
                    this.enhanceBenchSiri();
                    return;
                }
                
                const objType = "{{ $objectType }}";
                const field = "{{ $modelField }}";

                if (objType === 'impact_project') {
                    this.enhanceImpactProject();
                    return;
                }

                // Check for empty content
                if (!el.value || el.value.trim() === '') {
                    this._debug('enhanceText', 'Empty value', null, 'warn');
                    return;
                }

                try {
                    // Get field and collection data
                    const modelAttribute = el.getAttribute('x-model');
                    const isSubproject = modelAttribute && modelAttribute.startsWith('subproject.');
                    const detectedField = this._getFieldNameFromModel(modelAttribute);
                    const collection = this.getCollection();
                    const currentProject = this.getCurrentProject();
                    const currentText = el.value.trim();

                    this.loadingEnhance = true;


                    // Build payload using shared method
                    const payload = this._buildProjectTextPayload({
                        text: currentText,
                        fieldName: detectedField,
                        isSubproject,
                        collection,
                        currentProject,
                        objectType: '{{ $objectType }}',
                        maxLength: {{ $maxLength }}
                    });

                    // If field is Specific Objectives, add project title, header, subtitle to itemRelatedFields
                    if (detectedField === 'objectives' || detectedField === 'specific_objectives') {
                        payload.itemRelatedFields = {
                            project_title: currentProject?.name || '',
                            project_header: currentProject?.header || '',
                            project_subtitle: currentProject?.subtitle || '',
                            project_dimension: currentProject?.dimension || ''
                        };
                    }

                    this._debug('Enhance Project Text Payload', payload);

                    // For browser-based requests, use session auth with CSRF token
                    const headers = {
                        'Content-Type': 'application/json',
                        'X-CSRF-TOKEN': '{{ csrf_token() }}',
                        'Accept': 'application/json',
                        'X-Requested-With': 'XMLHttpRequest'
                    };

                    // Make API request
                    fetch('{{ route("enhance_project_text") }}', {
                            method: 'POST',
                            headers: headers,
                            body: JSON.stringify(payload)
                        })
                        .then(response => {
                            if (!response.ok) {
                                return response.text().then(text => {
                                    throw new Error(`HTTP error! status: ${response.status}, body: ${text}`);
                                });
                            }
                            return response.json();
                        })
                        .then(data => {
                            if (data.success && data.enhancedText) {
                                // Store original for potential revert
                                this.originalText = currentText;

                                // Get the enhanced text
                                const enhancedText = data.enhancedText.trim();

                                // Update the collection
                                if (collection && collection[this.indexValue]) {
                                    collection[this.indexValue][detectedField] = enhancedText;
                                }

                                // Update the DOM element
                                el.value = enhancedText;
                                el.dispatchEvent(new Event('input', {
                                    bubbles: true
                                }));

                                // Execute the save callback
                                this.updateParent();
                            } else {
                                throw new Error(data.error || 'Failed to enhance text');
                            }
                        })
                        .catch(error => {
                            console.error('Error enhancing text:', error);
                        })
                        .finally(() => {
                            this.loadingEnhance = false;
                        });
                } catch (error) {
                    console.error('Error in enhanceText:', error);
                    this.loadingEnhance = false;
                }
            },

            generateText() {
                const el = this.$refs.input;
                if (!el) {
                    this._debug('generateText', 'No element found', null, 'warn');
                    return;
                }

                // Auto-detect type from the actual element
                const actualType = el.tagName.toLowerCase() === 'textarea' ? 'textarea' : 'text';

                // If this is a text input, call generateTextName instead
                if (actualType === 'text') {
                    this.generateTextName();
                    return;
                }
                if ("{{ $objectType }}" === 'cosiri') {
                    this.generateTextCosiri();
                    return;
                }
                if ("{{ $objectType }}" === 'siri') {
                    this.generateBenchSiri();
                    return;
                }
                const objType = "{{ $objectType }}";
                const field = "{{ $modelField }}";

                if (objType === 'impact_project') {
                    this.generateImpactProject();
                    return;
                }

                try {
                    // Get field and collection data
                    const modelAttribute = el.getAttribute('x-model');
                    const isSubproject = modelAttribute && modelAttribute.startsWith('subproject.');
                    const detectedField = this._getFieldNameFromModel(modelAttribute);
                    const collection = this.getCollection();
                    const currentProject = this.getCurrentProject();
                    const currentText = el?.value?.trim() || '';

                    // Store original for potential revert
                    if (this.originalText === null && currentText) {
                        this.originalText = currentText;
                    }

                    this.loadingGenerate = true;


                    // Build payload using shared method
                    const payload = this._buildProjectTextPayload({
                        text: currentText,
                        fieldName: detectedField,
                        isSubproject,
                        collection,
                        currentProject,
                        objectType: '{{ $objectType }}',
                        maxLength: {{ $maxLength }}
                    });

                    // If field is Specific Objectives, add project title, header, subtitle to itemRelatedFields
                    if (detectedField === 'objectives' || detectedField === 'specific_objectives') {
                        payload.itemRelatedFields = {
                            project_title: currentProject?.name || '',
                            project_header: currentProject?.header || '',
                            project_subtitle: currentProject?.subtitle || '',
                            project_dimension: currentProject?.dimension || document.getElementById(
                                'project_dimension')?.value || ''
                        };
                    }

                    this._debug('Generate Project Text Payload', payload);

                    // Set up headers with authentication token if available
                    const headers = {
                        'Content-Type': 'application/json',
                        'X-CSRF-TOKEN': '{{ csrf_token() }}',
                        'Accept': 'application/json'
                    };
                    // Make API request
                    fetch('{{ route("generate_project_text") }}', {
                            method: 'POST',
                            headers: headers,
                            body: JSON.stringify(payload)
                        })
                        .then(response => {
                            if (!response.ok) {
                                return response.text().then(text => {
                                    throw new Error(`HTTP error! status: ${response.status}, body: ${text}`);
                                });
                            }
                            return response.json();
                        })
                        .then(data => {
                            if (data.success && data.generatedText) {
                                // Get the generated text
                                const generatedText = data.generatedText.trim();

                                // Update the collection
                                if (collection && collection[this.indexValue]) {
                                    collection[this.indexValue][detectedField] = generatedText;
                                }

                                // Update the DOM element
                                el.value = generatedText;
                                el.dispatchEvent(new Event('input', {
                                    bubbles: true
                                }));

                                // Execute the save callback
                                this.updateParent();
                            } else {
                                throw new Error(data.error || 'Failed to generate text');
                            }
                        })
                        .catch(error => {
                            window.showNotification?.(error.message, 'error');
                            console.error('Error generating text:', error);
                        })
                        .finally(() => {
                            this.loadingGenerate = false;
                        });
                } catch (error) {
                    console.error('Error in generateText:', error);
                    this.loadingGenerate = false;
                }
            },
            // New: Enhance Project Title
            enhanceProjectTitle() {
                // Get input element and prepare common data
                const el = this.$refs.input;
                if (!el) return;

                const modelAttribute = el.getAttribute('x-model');
                const isSubproject = modelAttribute && modelAttribute.startsWith('subproject.');
                const project = this.getCurrentProject();
                const collection = this.getCollection();

                if (!project && !isSubproject) {
                    this._debug('enhanceProjectTitle', 'No project found', null, 'warn');
                    return;
                }

                this.loadingEnhance = true;

                // Get field name from model attribute
                const detectedField = this._getFieldNameFromModel(modelAttribute);
                const currentText = el.value.trim();

                try {
                    // Build the context and payload
                    const {
                        context,
                        companyInfo
                    } = this._buildProjectPayloadData(isSubproject, project, collection);

                    // Adjust label to properly reflect if it's a subproject field
                    const adjustedLabel = isSubproject ? `subproject ${detectedField}` :
                        `{{ $objectType }} ${detectedField}`;

                    const payload = {
                        text: currentText,
                        locale: '{{ app()->getLocale() }}',
                        maxLength: {{ $maxLength }},
                        label: adjustedLabel,
                        context,
                        companyInfo
                    };
                    // payload prepared for enhancement request

                    // Setup headers for the request  
                    const headers = {
                        'Content-Type': 'application/json',
                        'X-CSRF-TOKEN': '{{ csrf_token() }}',
                        'Accept': 'application/json'
                    };

                    // Make API request
                    fetch('{{ route("enhance_project_title") }}', {
                            method: 'POST',
                            headers: headers,
                            body: JSON.stringify(payload)
                        })
                        .then(response => {
                            if (!response.ok) {
                                return response.text().then(text => {
                                    throw new Error(`HTTP error! status: ${response.status}, body: ${text}`);
                                });
                            }
                            return response.json();
                        })
                        .then(data => {
                            if (data.success && data.enhancedTitle) {
                                this.originalText = currentText;
                                const enhancedTitle = data.enhancedTitle.trim();

                                // Update the input value
                                el.value = enhancedTitle;
                                el.dispatchEvent(new Event('input', {
                                    bubbles: true
                                }));

                                this.updateParent();
                            } else {
                                throw new Error(data.error || 'Failed to enhance title');
                            }
                        })
                        .catch(error => {
                            window.showNotification?.(error.message, 'error');
                            console.error('Error enhancing title:', error);
                        })
                        .finally(() => {
                            this.loadingEnhance = false;
                        });
                } catch (error) {
                    console.error('Error in enhanceProjectTitle:', error);
                    this.loadingEnhance = false;
                }
            },
            // Generate Project Title
            generateProjectTitle() {
                // Get input element and prepare common data
                const el = this.$refs.input;
                if (!el) return;

                const modelAttribute = el.getAttribute('x-model');
                const isSubproject = modelAttribute && modelAttribute.startsWith('subproject.');
                const project = this.getCurrentProject();
                const collection = this.getCollection();

                if (!project && !isSubproject) {
                    this._debug('generateProjectTitle', 'No project found', null, 'warn');
                    return;
                }

                this.loadingGenerate = true;

                // Get field name from model attribute
                const detectedField = this._getFieldNameFromModel(modelAttribute);
                const currentText = el.value.trim();

                try {
                    // Build the context and payload
                    const {
                        context,
                        companyInfo
                    } = this._buildProjectPayloadData(isSubproject, project, collection);

                    // Adjust label to properly reflect if it's a subproject field
                    const adjustedLabel = isSubproject ? `subproject ${detectedField}` :
                        `{{ $objectType }} ${detectedField}`;

                    const payload = {
                        text: currentText,
                        locale: '{{ app()->getLocale() }}',
                        maxLength: {{ $maxLength }},
                        label: adjustedLabel,
                        context,
                        companyInfo
                    };
                    // payload prepared for generation request

                    // Setup headers for the request
                    const headers = {
                        'Content-Type': 'application/json',
                        'X-CSRF-TOKEN': '{{ csrf_token() }}',
                        'Accept': 'application/json'
                    };

                    // Make API request
                    fetch('{{ route("generate_project_title") }}', {
                            method: 'POST',
                            headers: headers,
                            body: JSON.stringify(payload)
                        })
                        .then(response => {
                            if (!response.ok) {
                                return response.text().then(text => {
                                    throw new Error(`HTTP error! status: ${response.status}, body: ${text}`);
                                });
                            }
                            return response.json();
                        })
                        .then(data => {
                            if (data.success && data.generatedTitle) {
                                this.originalText = currentText;
                                const generatedTitle = data.generatedTitle.trim();

                                // Update the input value
                                el.value = generatedTitle;
                                el.dispatchEvent(new Event('input', {
                                    bubbles: true
                                }));

                                this.updateParent();
                            } else {
                                throw new Error(data.error || 'Failed to generate title');
                            }
                        })
                        .catch(error => {
                            window.showNotification?.(error.message, 'error');
                            console.error('Error generating title:', error);
                        })
                        .finally(() => {
                            this.loadingGenerate = false;
                        });
                } catch (error) {
                    console.error('Error in generateProjectTitle:', error);
                    this.loadingGenerate = false;
                }
            },
            // New: Enhance Title for text input
            enhanceTextName() {
                if ("{{ $objectType }}" === 'impact_project') {
                    this.enhanceImpactProject();
                    return;
                }
                // Get input element
                const el = this.$refs.input;
                if (!el) {
                    this._debug('enhanceTextName', 'No element found', null, 'warn');
                    return;
                }

                // Auto-detect field name from the element's x-model attribute
                const modelAttribute = el.getAttribute('x-model');

                // For specific fields, redirect to enhanceProjectTitle
                if (modelAttribute === 'project.name' ||
                    modelAttribute === 'project.header' ||
                    modelAttribute === 'subproject.name') {
                    this.enhanceProjectTitle();
                    return;
                }

                // Get the detected field name
                const detectedField = this._getFieldNameFromModel(modelAttribute);

                // Check if there's content to enhance
                if (!el.value || el.value.trim() === '') {
                    this._debug('enhanceTextName', 'Empty value', null, 'warn');
                    return;
                }

                try {
                    this.loadingEnhance = true;
                    const currentText = el.value.trim();
                    const collection = this.getCollection();
                    const currentProject = this.getCurrentProject();

                    // Create payload
                    let payload = this._buildTextNamePayload(
                        currentText,
                        detectedField,
                        collection,
                        currentProject
                    );
                    // payload prepared for enhance project text name

                    // Setup headers for the request
                    const headers = {
                        'Content-Type': 'application/json',
                        'X-CSRF-TOKEN': '{{ csrf_token() }}',
                        'Accept': 'application/json'
                    };

                    // Make API request
                    fetch('{{ route("enhance_project_text_name") }}', {
                            method: 'POST',
                            headers: headers,
                            body: JSON.stringify(payload)
                        })
                        .then(response => {
                            if (!response.ok) {
                                return response.text().then(text => {
                                    throw new Error(`HTTP error! status: ${response.status}, body: ${text}`);
                                });
                            }
                            return response.json();
                        })
                        .then(data => {
                            if (data.success && data.enhancedText) {
                                // Store original for potential revert
                                this.originalText = currentText;

                                // Update with enhanced text
                                const enhancedText = data.enhancedText.trim();

                                // Update the collection if available
                                if (collection && collection[this.indexValue]) {
                                    collection[this.indexValue][detectedField] = enhancedText;
                                }

                                // Update the DOM element
                                el.value = enhancedText;
                                el.dispatchEvent(new Event('input', {
                                    bubbles: true
                                }));

                                // Update parent component
                                this.updateParent();
                            } else {
                                throw new Error(data.error || 'Failed to enhance title');
                            }
                        })
                        .catch(error => {
                            window.showNotification?.(error.message, 'error');
                            console.error('Error enhancing title:', error);
                        })
                        .finally(() => {
                            this.loadingEnhance = false;
                        });
                } catch (error) {
                    console.error('Error in enhanceTextName:', error);
                    this.loadingEnhance = false;
                }
            },
            
            enhanceTextCosiri() {
                const el = this.$refs.input;
                if (!el || !el.value || el.value.trim() === '') {
                    return;
                }

                const modelAttribute = el.getAttribute('x-model');
                const detectedField = this._getFieldNameFromModel(modelAttribute);
                const currentText = el.value.trim();

                // Check if this is a strength/weakness point and get the selected dimensions
                let fieldNameToSend = detectedField;
                let dimensionNames = [];
                let currentLevels = {};
                let dimensionTranslations = {};
                let benchmarkData = {};
                
                if (detectedField.includes('Point_note') || detectedField.includes('Points_note')) {
                    const selectedDimensions = this._getSelectedDimensions();
                    if (selectedDimensions && selectedDimensions.dimensions.length > 0) {
                        dimensionNames = selectedDimensions.dimensions;
                        currentLevels = selectedDimensions.currentLevels;
                        
                        // Determine if it's strength or weakness based on the model attribute
                        const modelAttr = this.$refs.input?.getAttribute('x-model') || '';
                        if (modelAttr.includes('strengthPoint')) {
                            fieldNameToSend = 'strength_point';
                        } else if (modelAttr.includes('weaknessPoint')) {
                            fieldNameToSend = 'weakness_point';
                        }
                        
                        // Get dimension translations and benchmark data for all selected dimensions
                        dimensionNames.forEach(dimName => {
                            const currentLevel = currentLevels[dimName];
                            dimensionTranslations[dimName] = this._getDimensionTranslations(dimName, currentLevel, 'cosiri');
                            benchmarkData[dimName] = this._getBenchmarkDataForDimension(dimName);
                        });
                    }
                }

                this.loadingEnhance = true;

                const companyInfo = window.companyInfo || {};
                const payload = {
                    text: currentText,
                    fieldName: fieldNameToSend,
                    locale: '{{ app()->getLocale() }}',
                    maxLength: {{ $maxLength }},
                    companyInfo: {
                        name: companyInfo.name || '',
                        sector: companyInfo.sector || '',
                        email: companyInfo.email || '',
                        company_website: companyInfo.company_website || '',
                        slogan: companyInfo.slogan || ''
                    }
                };

                // Add dimension names, current levels, translations, and benchmark data if it's a strength/weakness point
                if (dimensionNames.length > 0) {
                    payload.dimensionNames = dimensionNames;
                    payload.currentLevels = currentLevels;
                    payload.dimensionTranslations = dimensionTranslations;
                    payload.benchmarkData = benchmarkData;
                    
                    // For backward compatibility, also send the first dimension as single values
                    payload.dimensionName = dimensionNames[0];
                    payload.currentLevel = currentLevels[dimensionNames[0]] || null;
                }
                
                //log the payload for debugging
                // payload prepared for enhance cosiri text

                fetch('{{ route("enhance_cosiri_text") }}', {
                        method: 'POST',
                        headers: {
                            'Content-Type': 'application/json',
                            'X-CSRF-TOKEN': '{{ csrf_token() }}',
                            'Accept': 'application/json'
                        },
                        body: JSON.stringify(payload)
                    })
                    .then(response => response.json())
                    .then(data => {
                        if (data.success && data.enhancedText) {
                            this.originalText = currentText;
                            el.value = data.enhancedText.trim();
                            el.dispatchEvent(new Event('input', { bubbles: true }));
                            this.updateParent();
                            window.showNotification?.('Text enhanced successfully', 'success');
                        } else {
                            window.showNotification?.('Failed to enhance text', 'error');
                        }
                    })
                    .catch(error => {
                        window.showNotification?.(error.message, 'error');
                        console.error('Error enhancing CoSiri text:', error);
                    })
                    .finally(() => {
                        this.loadingEnhance = false;
                    });
            },
            enhanceBenchSiri() {
                const el = this.$refs.input;
                if (!el || !el.value || el.value.trim() === '') {
                    return;
                }

                const modelAttribute = el.getAttribute('x-model');
                const detectedField = this._getFieldNameFromModel(modelAttribute);
                const currentText = el.value.trim();

                // Check if this is a strength/weakness point and get the selected dimensions
                let fieldNameToSend = detectedField;
                let dimensionNames = [];
                let currentLevels = {};
                let dimensionTranslations = {};
                let benchmarkData = {};
                
                if (detectedField.includes('Point_note') || detectedField.includes('Points_note')) {
                    const selectedDimensions = this._getSelectedDimensions();
                    if (selectedDimensions && selectedDimensions.dimensions.length > 0) {
                        dimensionNames = selectedDimensions.dimensions;
                        currentLevels = selectedDimensions.currentLevels;
                        
                        // Determine if it's strength or weakness based on the model attribute
                        const modelAttr = this.$refs.input?.getAttribute('x-model') || '';
                        if (modelAttr.includes('strengthPoint')) {
                            fieldNameToSend = 'strength_point';
                        } else if (modelAttr.includes('weaknessPoint')) {
                            fieldNameToSend = 'weakness_point';
                        }
                        
                        // Get dimension translations and benchmark data for all selected dimensions
                        dimensionNames.forEach(dimName => {
                            const currentLevel = currentLevels[dimName];
                            dimensionTranslations[dimName] = this._getDimensionTranslations(dimName, currentLevel, 'siri');
                            benchmarkData[dimName] = this._getBenchmarkDataForDimension(dimName);
                        });
                    }
                }

                this.loadingEnhance = true;

                const companyInfo = window.companyInfo || {};
                const payload = {
                    text: currentText,
                    fieldName: fieldNameToSend,
                    locale: '{{ app()->getLocale() }}',
                    maxLength: {{ $maxLength }},
                    companyInfo: {
                        name: companyInfo.name || '',
                        email: companyInfo.email || '',
                        company_website: companyInfo.company_website || '',
                    }
                };

                // Add dimension names, current levels, translations, and benchmark data if it's a strength/weakness point
                if (dimensionNames.length > 0) {
                    payload.dimensionNames = dimensionNames;
                    payload.currentLevels = currentLevels;
                    payload.dimensionTranslations = dimensionTranslations;
                    payload.benchmarkData = benchmarkData;
                    
                    // For backward compatibility, also send the first dimension as single values
                    payload.dimensionName = dimensionNames[0];
                    payload.currentLevel = currentLevels[dimensionNames[0]] || null;
                }
                
                //log the payload for debugging
                // payload prepared for enhance siri text

                fetch('{{ route("enhance_bench_text") }}', {
                        method: 'POST',
                        headers: {
                            'Content-Type': 'application/json',
                            'X-CSRF-TOKEN': '{{ csrf_token() }}',
                            'Accept': 'application/json'
                        },
                        body: JSON.stringify(payload)
                    })
                    .then(response => response.json())
                    .then(data => {
                        if (data.success && data.enhancedText) {
                            this.originalText = currentText;
                            el.value = data.enhancedText.trim();
                            el.dispatchEvent(new Event('input', { bubbles: true }));
                            this.updateParent();
                            window.showNotification?.('Text enhanced successfully', 'success');
                        } else {
                            window.showNotification?.('Failed to enhance text', 'error');
                        }
                    })
                    .catch(error => {
                        window.showNotification?.(error.message, 'error');
                        console.error('Error enhancing CoSiri text:', error);
                    })
                    .finally(() => {
                        this.loadingEnhance = false;
                    });
            },
            generateTextCosiri() {
                const el = this.$refs.input;
                if (!el) {
                    return;
                }

                const modelAttribute = el.getAttribute('x-model');
                const detectedField = this._getFieldNameFromModel(modelAttribute);
                const currentText = el?.value?.trim() || '';

                // Check if this is a strength/weakness point and get the selected dimensions
                let fieldNameToSend = detectedField;
                let dimensionNames = [];
                let currentLevels = {};
                let dimensionTranslations = {};
                let benchmarkData = {};
                
                if (detectedField.includes('Point_note') || detectedField.includes('Points_note')) {
                    const selectedDimensions = this._getSelectedDimensions();
                    if (selectedDimensions && selectedDimensions.dimensions.length > 0) {
                        dimensionNames = selectedDimensions.dimensions;
                        currentLevels = selectedDimensions.currentLevels;
                        
                        // Determine if it's strength or weakness based on the model attribute
                        const modelAttr = this.$refs.input?.getAttribute('x-model') || '';
                        if (modelAttr.includes('strengthPoint')) {
                            fieldNameToSend = 'strength_point';
                        } else if (modelAttr.includes('weaknessPoint')) {
                            fieldNameToSend = 'weakness_point';
                        }
                        
                        // Get dimension translations and benchmark data for all selected dimensions
                        dimensionNames.forEach(dimName => {
                            const currentLevel = currentLevels[dimName];
                            dimensionTranslations[dimName] = this._getDimensionTranslations(dimName, currentLevel, 'cosiri');
                            benchmarkData[dimName] = this._getBenchmarkDataForDimension(dimName);
                        });
                    }
                }

                if (this.originalText === null && currentText) {
                    this.originalText = currentText;
                }

                this.loadingGenerate = true;

                const companyInfo = window.companyInfo || {};
                const payload = {
                    text: currentText,
                    fieldName: fieldNameToSend,
                    locale: '{{ app()->getLocale() }}',
                    maxLength: {{ $maxLength }},
                    companyInfo: {
                        name: companyInfo.name || '',
                        sector: companyInfo.sector || '',
                        email: companyInfo.email || '',
                        company_website: companyInfo.company_website || '',
                        slogan: companyInfo.slogan || ''
                    }
                };

                // Add dimension names, current levels, translations, and benchmark data if it's a strength/weakness point
                if (dimensionNames.length > 0) {
                    payload.dimensionNames = dimensionNames;
                    payload.currentLevels = currentLevels;
                    payload.dimensionTranslations = dimensionTranslations;
                    payload.benchmarkData = benchmarkData;
                    
                    // For backward compatibility, also send the first dimension as single values
                    payload.dimensionName = dimensionNames[0];
                    payload.currentLevel = currentLevels[dimensionNames[0]] || null;
                }
                //log the payload for debugging
                // payload prepared for generate cosiri text

                fetch('{{ route("generate_cosiri_text") }}', {
                        method: 'POST',
                        headers: {
                            'Content-Type': 'application/json',
                            'X-CSRF-TOKEN': '{{ csrf_token() }}',
                            'Accept': 'application/json'
                        },
                        body: JSON.stringify(payload)
                    })
                    .then(response => response.json())
                    .then(data => {
                        if (data.success && data.generatedText) {
                            el.value = data.generatedText.trim();
                            el.dispatchEvent(new Event('input', { bubbles: true }));
                            this.updateParent();
                            window.showNotification?.('Text generated successfully', 'success');
                        } else {
                            window.showNotification?.('Failed to generate text', 'error');
                        }
                    })
                    .catch(error => {
                        window.showNotification?.(error.message, 'error');
                        console.error('Error generating CoSiri text:', error);
                    })
                    .finally(() => {
                        this.loadingGenerate = false;
                    });
            },
            generateBenchSiri() {
                const el = this.$refs.input;
                if (!el) {
                    return;
                }

                const modelAttribute = el.getAttribute('x-model');
                const detectedField = this._getFieldNameFromModel(modelAttribute);
                const currentText = el?.value?.trim() || '';

                // Check if this is a strength/weakness point and get the selected dimensions
                let fieldNameToSend = detectedField;
                let dimensionNames = [];
                let currentLevels = {};
                let dimensionTranslations = {};
                let benchmarkData = {};
                
                if (detectedField.includes('Point_note') || detectedField.includes('Points_note')) {
                    const selectedDimensions = this._getSelectedDimensions();
                    if (selectedDimensions && selectedDimensions.dimensions.length > 0) {
                        dimensionNames = selectedDimensions.dimensions;
                        currentLevels = selectedDimensions.currentLevels;
                        
                        // Determine if it's strength or weakness based on the model attribute
                        const modelAttr = this.$refs.input?.getAttribute('x-model') || '';
                        if (modelAttr.includes('strengthPoint')) {
                            fieldNameToSend = 'strength_point';
                        } else if (modelAttr.includes('weaknessPoint')) {
                            fieldNameToSend = 'weakness_point';
                        }
                        
                        // Get dimension translations and benchmark data for all selected dimensions
                        dimensionNames.forEach(dimName => {
                            const currentLevel = currentLevels[dimName];
                            dimensionTranslations[dimName] = this._getDimensionTranslations(dimName, currentLevel, 'siri');
                            benchmarkData[dimName] = this._getBenchmarkDataForDimension(dimName);
                        });
                    }
                }

                if (this.originalText === null && currentText) {
                    this.originalText = currentText;
                }

                this.loadingGenerate = true;

                const companyInfo = window.companyInfo || {};
                const payload = {
                    text: currentText,
                    fieldName: fieldNameToSend,
                    locale: '{{ app()->getLocale() }}',
                    maxLength: {{ $maxLength }},
                    companyInfo: {
                        name: companyInfo.name || '',
                        email: companyInfo.email || '',
                        company_website: companyInfo.company_website || ''
                    }
                };

                // Add dimension names, current levels, translations, and benchmark data if it's a strength/weakness point
                if (dimensionNames.length > 0) {
                    payload.dimensionNames = dimensionNames;
                    payload.currentLevels = currentLevels;
                    payload.dimensionTranslations = dimensionTranslations;
                    payload.benchmarkData = benchmarkData;
                    
                    // For backward compatibility, also send the first dimension as single values
                    payload.dimensionName = dimensionNames[0];
                    payload.currentLevel = currentLevels[dimensionNames[0]] || null;
                }
                //log the payload for debugging
                // payload prepared for generate siri text

                fetch('{{ route("generate_bench_text") }}', {
                        method: 'POST',
                        headers: {
                            'Content-Type': 'application/json',
                            'X-CSRF-TOKEN': '{{ csrf_token() }}',
                            'Accept': 'application/json'
                        },
                        body: JSON.stringify(payload)
                    })
                    .then(response => response.json())
                    .then(data => {
                        if (data.success && data.generatedText) {
                            el.value = data.generatedText.trim();
                            el.dispatchEvent(new Event('input', { bubbles: true }));
                            this.updateParent();
                            window.showNotification?.('Text generated successfully', 'success');
                        } else {
                            window.showNotification?.('Failed to generate text', 'error');
                        }
                    })
                    .catch(error => {
                        window.showNotification?.(error.message, 'error');
                        console.error('Error generating Siri text:', error);
                    })
                    .finally(() => {
                        this.loadingGenerate = false;
                    });
            },
            
            // Simplified Impact Project Enhancement
            enhanceImpactProject() {
                const el = this.$refs.input;
                if (!el || !el.value || el.value.trim() === '') {
                    return;
                }

                const modelAttribute = el.getAttribute('x-model');
                const detectedField = this._getFieldNameFromModel(modelAttribute);
                const currentText = el.value.trim();
                
                // Determine if this is a title field or details field
                const isTitle = detectedField === 'title' || modelAttribute.includes('title');
                
                // Get impact project context excluding current field
                const context = this._getImpactProjectContext(detectedField);
                
                this.loadingEnhance = true;

                const payload = {
                    text: currentText,
                    fieldName: detectedField,
                    locale: '{{ app()->getLocale() }}',
                    ...context
                };
                
                // payload prepared for enhance impact project

                const route = isTitle ? 'enhance_impact_project_title' : 'enhance_impact_project_details';

                fetch('{{ route('home') }}/' + route, {
                        method: 'POST',
                        headers: {
                            'Content-Type': 'application/json',
                            'X-CSRF-TOKEN': '{{ csrf_token() }}',
                            'Accept': 'application/json'
                        },
                        body: JSON.stringify(payload)
                    })
                    .then(response => response.json())
                    .then(data => {
                        if (data.success && data.enhancedText) {
                            this.originalText = currentText;
                            el.value = data.enhancedText.trim();
                            el.dispatchEvent(new Event('input', { bubbles: true }));
                            this.updateParent();
                            window.showNotification?.('Text enhanced successfully', 'success');
                        } else {
                            window.showNotification?.('Failed to enhance text', 'error');
                        }
                    })
                    .catch(error => {
                        window.showNotification?.(error.message, 'error');
                        console.error('Error enhancing Impact Project:', error);
                    })
                    .finally(() => {
                        this.loadingEnhance = false;
                    });
            },

            // Simplified Impact Project Generation  
            generateImpactProject() {
                const el = this.$refs.input;
                if (!el) {
                    return;
                }

                const modelAttribute = el.getAttribute('x-model');
                const detectedField = this._getFieldNameFromModel(modelAttribute);
                const currentText = el?.value?.trim() || '';
                
                // Determine if this is a title field or details field
                const isTitle = detectedField === 'title' || modelAttribute.includes('title');
                
                // Get impact project context excluding current field
                const context = this._getImpactProjectContext(detectedField);

                if (this.originalText === null && currentText) {
                    this.originalText = currentText;
                }

                this.loadingGenerate = true;

                const payload = {
                    text: currentText,
                    fieldName: detectedField,
                    locale: '{{ app()->getLocale() }}',
                    ...context
                };
                
                // payload prepared for generate impact project

                const route = isTitle ? 'generate_impact_project_title' : 'generate_impact_project_details';

                fetch('{{ route('home') }}/' + route, {
                        method: 'POST',
                        headers: {
                            'Content-Type': 'application/json',
                            'X-CSRF-TOKEN': '{{ csrf_token() }}',
                            'Accept': 'application/json'
                        },
                        body: JSON.stringify(payload)
                    })
                    .then(response => response.json())
                    .then(data => {
                        if (data.success && data.generatedText) {
                            el.value = data.generatedText.trim();
                            el.dispatchEvent(new Event('input', { bubbles: true }));
                            this.updateParent();
                            window.showNotification?.('Text generated successfully', 'success');
                        } else {
                            window.showNotification?.('Failed to generate text', 'error');
                        }
                    })
                    .catch(error => {
                        window.showNotification?.(error.message, 'error');
                        console.error('Error generating Impact Project:', error);
                    })
                    .finally(() => {
                        this.loadingGenerate = false;
                    });
            },

            // Helper to get impact project context with dimension, level, and notes
            _getImpactProjectContext(excludeField = null) {
                try {
                    let context = {};
                    
                    // Find the impact project data and current project details
                    let parentElement = this.$el;
                    while (parentElement) {
                        if (parentElement._x_dataStack) {
                            for (let data of parentElement._x_dataStack) {
                                // Look for impact projects component
                                if (data.impactProjects && Array.isArray(data.impactProjects)) {
                                    const currentIndex = data.currentImpactProject || 0;
                                    const currentProject = data.impactProjects[currentIndex];
                                    
                                    if (currentProject) {
                                        // Add project fields to context, excluding the current field being edited
                                        if (excludeField !== 'title') {
                                            context.projectTitle = currentProject.title || '';
                                        }
                                        if (excludeField !== 'description') {
                                            context.projectDescription = currentProject.description || '';
                                        }
                                        if (excludeField !== 'objective') {
                                            context.projectObjective = currentProject.objective || '';
                                        }
                                        if (excludeField !== 'implementation_steps') {
                                            context.projectImplementation = currentProject.implementation_steps || '';
                                        }
                                        if (excludeField !== 'kpis') {
                                            context.projectKpis = currentProject.kpis || '';
                                        }
                                        context.selectedDimension = currentProject.dimension || '';
                                        
                                        // Get dimension level from formData if dimension is selected
                                        if (currentProject.dimension) {
                                            let formDataElement = this.$el;
                                            while (formDataElement) {
                                                if (formDataElement._x_dataStack) {
                                                    for (let formData of formDataElement._x_dataStack) {
                                                        if (formData.formData && formData.formData[currentProject.dimension] !== undefined) {
                                                            context.currentLevel = parseInt(formData.formData[currentProject.dimension]) || 0;
                                                            
                                                            // Get dimension notes if available
                                                            const notesField = currentProject.dimension + '_notes';
                                                            if (formData.formData[notesField]) {
                                                                context.dimensionNotes = formData.formData[notesField];
                                                            }
                                                            
                                                            // Get dimension translations for current level
                                                            context.dimensionTranslations = this._getDimensionTranslations(currentProject.dimension, context.currentLevel);

                                                            // Also include next dimension translations when available (there are only 5 bands)
                                                            try {
                                                                if (typeof context.currentLevel === 'number') {
                                                                    const nextLevel = context.currentLevel + 1;
                                                                    // Only provide next level translations when within available bands
                                                                    if (nextLevel >= 1 && nextLevel <= 5) {
                                                                        context.nextDimensionTranslations = this._getDimensionTranslations(currentProject.dimension, nextLevel);
                                                                    } else {
                                                                        context.nextDimensionTranslations = null;
                                                                    }
                                                                } else {
                                                                    context.nextDimensionTranslations = null;
                                                                }
                                                            } catch (e) {
                                                                console.error('Error getting nextDimensionTranslations:', e);
                                                                context.nextDimensionTranslations = null;
                                                            }

                                                            // Get benchmark data for this dimension
                                                            context.benchmarkData = this._getBenchmarkDataForDimension(currentProject.dimension);
                                                            
                                                            break;
                                                        }
                                                    }
                                                }
                                                formDataElement = formDataElement.parentElement;
                                            }
                                        }
                                        
                                        return context;
                                    }
                                }
                            }
                        }
                        parentElement = parentElement.parentElement;
                    }
                    
                    return context;
                } catch (e) {
                    console.error('Error getting impact project context:', e);
                    return {};
                }
            },

            generateTextName() {
                if ("{{ $objectType }}" === 'impact_project') {
                    this.generateImpactProject();
                    return;
                }
                // Get input element
                const el = this.$refs.input;
                if (!el) {
                    this._debug('generateTextName', 'No element found', null, 'warn');
                    return;
                }

                // Auto-detect field name from the element's x-model attribute
                const modelAttribute = el.getAttribute('x-model');

                // For specific fields, redirect to generateProjectTitle
                if (modelAttribute === 'project.name' ||
                    modelAttribute === 'project.header' ||
                    modelAttribute === 'subproject.name') {
                    this.generateProjectTitle();
                    return;
                }

                // Get the detected field name
                const detectedField = this._getFieldNameFromModel(modelAttribute);

                try {
                    this.loadingGenerate = true;
                    const currentText = el?.value?.trim() || '';
                    const collection = this.getCollection();
                    const currentProject = this.getCurrentProject();

                    // Store original text for potential revert
                    if (this.originalText === null && currentText) {
                        this.originalText = currentText;
                    }

                    // Create payload
                    let payload = this._buildTextNamePayload(
                        currentText,
                        detectedField,
                        collection,
                        currentProject
                    );

                    // Special handling for AI Option fields
                    if (modelAttribute && modelAttribute.includes('ai_option')) {

                        // Set the appropriate label for AI option fields
                        if (detectedField === 'ai_option_title') {
                            payload.label = 'AI Option Title';
                        } else if (detectedField === 'ai_option') {
                            payload.label = 'AI Option Content';
                        }
                    }

                    // For collection items like steps, features, benefits, etc.
                    if (collection && collection[this.indexValue]) {
                        const currentItem = collection[this.indexValue];

                        if (currentItem) {
                            let itemRelatedFields = {};

                            // Include any non-empty strings from the item
                            for (let key in currentItem) {
                                if (key !== detectedField &&
                                    typeof currentItem[key] === 'string' &&
                                    currentItem[key].trim() !== '') {

                                    itemRelatedFields[key] = currentItem[key];
                                }
                            }

                            // For features, steps and other items with missing or existing descriptions
                            if (detectedField === 'name') {
                                // For features, always add description if available
                                if (currentItem.description) {
                                    itemRelatedFields.description = currentItem.description;
                                }

                                // Determine collection type from field name or modelAttribute
                                let collectionType = '';
                                if (fieldName.includes('feature') || modelAttribute?.includes('key_features')) {
                                    collectionType = 'feature';
                                } else if (fieldName.includes('benefit') || modelAttribute?.includes(
                                        'direct_benefits') || modelAttribute?.includes('proposed_solution')) {
                                    collectionType = 'benefit';
                                } else if (fieldName.includes('step') || modelAttribute?.includes(
                                        'implementation_steps')) {
                                    collectionType = 'step';
                                } else if (fieldName.includes('ai_option') || modelAttribute?.includes('ai_option')) {
                                    collectionType = 'ai_option';
                                }


                                // Set the appropriate label based on collection type
                                if (collectionType) {
                                    payload.label = `${collectionType} name`;
                                }


                                // Collection-specific handling
                                if (collectionType === 'feature') {
                                    // Check all key_features for similar items
                                    if (currentProject && Array.isArray(currentProject.key_features)) {
                                        const otherFeatures = currentProject.key_features
                                            .filter(f => f && f.name && f.name.trim() !== '' && f.name !== currentItem
                                                .name)
                                            .map(f => f.name)
                                            .join(', ');

                                        if (otherFeatures) {
                                            itemRelatedFields.other_features = otherFeatures;
                                        }
                                    }

                                    // Feature-specific fields from the item
                                    if (currentItem.purpose) itemRelatedFields.purpose = currentItem.purpose;
                                    if (currentItem.user_benefit) itemRelatedFields.user_benefit = currentItem
                                        .user_benefit;
                                } else if (collectionType === 'benefit') {
                                    // Check all direct_benefits for similar items
                                    if (currentProject && Array.isArray(currentProject.direct_benefits)) {
                                        const otherBenefits = currentProject.direct_benefits
                                            .filter(b => b && b.name && b.name.trim() !== '' && b.name !== currentItem
                                                .name)
                                            .map(b => b.name)
                                            .join(', ');

                                        if (otherBenefits) {
                                            itemRelatedFields.other_benefits = otherBenefits;
                                        }
                                    }

                                    // Benefit-specific fields
                                    if (currentItem.impact) itemRelatedFields.impact = currentItem.impact;
                                    if (currentItem.stakeholder) itemRelatedFields.stakeholder = currentItem
                                        .stakeholder;
                                } else if (collectionType === 'step') {
                                    // Check all implementation_steps for similar items
                                    if (currentProject && Array.isArray(currentProject.implementation_steps)) {
                                        const otherSteps = currentProject.implementation_steps
                                            .filter(s => s && s.name && s.name.trim() !== '' && s.name !== currentItem
                                                .name)
                                            .map(s => s.name)
                                            .join(', ');

                                        if (otherSteps) {
                                            itemRelatedFields.other_steps = otherSteps;
                                        }
                                    }

                                    // Step-specific fields
                                    if (currentItem.time_frame) itemRelatedFields.time_frame = currentItem.time_frame;
                                    if (currentItem.resources) itemRelatedFields.resources = currentItem.resources;
                                } else if (collectionType === 'ai_option') {
                                    // Check if we have other AI options to reference
                                    if (currentProject && Array.isArray(currentProject.ai_options)) {
                                        const otherAIOptions = currentProject.ai_options
                                            .filter(o => o && o.name && o.name.trim() !== '' && o.name !== currentItem
                                                .name)
                                            .map(o => o.name)
                                            .join(', ');

                                        if (otherAIOptions) {
                                            itemRelatedFields.other_ai_options = otherAIOptions;
                                        }
                                    }

                                    // AI option-specific fields
                                    if (currentItem.title) itemRelatedFields.title = currentItem.title;
                                    if (currentItem.text) itemRelatedFields.text = currentItem.text;
                                    if (currentItem.approach) itemRelatedFields.approach = currentItem.approach;
                                    if (currentItem.implementation) itemRelatedFields.implementation = currentItem
                                        .implementation;

                                    // Add AI option parent fields
                                    if (currentProject && currentProject.ai_option_title) {
                                        itemRelatedFields.ai_option_title = currentProject.ai_option_title;
                                    }
                                }
                            }

                            // Add related fields from the collection item
                            if (Object.keys(itemRelatedFields).length > 0) {
                                // Use the itemRelatedFields we built above (not an undefined variable)
                                payload.itemRelatedFields = itemRelatedFields;
                                payload.relatedFields = null;
                            }
                        }
                    }

                    // Log full payload details for debugging
                    // payload prepared for generate project text name

                    // Setup headers with authentication for API route
                    const headers = this.getAuthHeaders();

                    // Make API request
                    fetch('{{ route("generate_project_text_name") }}', {
                            method: 'POST',
                            headers: headers,
                            body: JSON.stringify(payload)
                        })
                        .then(response => {
                            if (!response.ok) {
                                return response.text().then(text => {
                                    throw new Error(`HTTP error! status: ${response.status}, body: ${text}`);
                                });
                            }
                            return response.json();
                        })
                        .then(data => {
                            if (data.success && data.generatedText) {
                                // Update with generated text
                                const generatedText = data.generatedText.trim();

                                // Update the collection if available
                                if (collection && collection[this.indexValue]) {
                                    collection[this.indexValue][detectedField] = generatedText;
                                }

                                // Update the DOM element
                                el.value = generatedText;
                                el.dispatchEvent(new Event('input', {
                                    bubbles: true
                                }));

                                // Update parent component
                                this.updateParent();
                            } else {
                                throw new Error(data.error || 'Failed to generate title');
                            }
                        })
                        .catch(error => {
                            window.showNotification?.(error.message, 'error');
                            console.error('Error generating title:', error);
                        })
                        .finally(() => {
                            this.loadingGenerate = false;
                        });
                } catch (error) {
                    console.error('Error in generateTextName:', error);
                    this.loadingGenerate = false;
                }
            },
            // Revert to original text if available
            revertText() {
                if (this.originalText !== null) {
                    const el = this.$refs.input;
                    if (el) {
                        el.value = this.originalText;

                        // Update the Alpine.js model
                        const collection = this.getCollection();
                        if (collection && collection[this.indexValue]) {
                            collection[this.indexValue][fieldName] = this.originalText;
                        }

                        // Trigger input event to ensure binding is updated
                        el.dispatchEvent(new Event('input', {
                            bubbles: true
                        }));

                        // Execute the save callback
                        this.updateParent();

                        this.originalText = null;
                        // No notification on revert
                    }
                }
            },

            // Helper method to normalize company info like in notes component
            normalizeCompanyInfo(companyInfo) {
                if (companyInfo && companyInfo.company_website) {
                    const normalized = {
                        ...companyInfo
                    };
                    normalized.company_website = this.normalizeUrl(companyInfo.company_website);
                    return normalized;
                }
                return companyInfo;
            },

            // Helper method to get related fields based on the current field
            _getRelatedFields(fieldName, project) {
                const relatedFields = {};

                // Check if project is valid
                if (!project || typeof project !== 'object') {
                    return relatedFields;
                }

                // Check if fieldName contains 'step' or specific names we should map differently
                const normalizedFieldName = fieldName.includes('step') ? 'step' :
                    fieldName.includes('name') ? 'name' : fieldName;

                // Field relationships mapping
                const fieldRelationships = {
                    'name': ['description', 'subtitle', 'header'],
                    'description': ['name', 'subtitle', 'header'],
                    'problem': [],
                    'solution': [],
                    'subtitle': ['name', 'header'],
                    'header': ['name', 'subtitle'],
                    'objectives': [],
                    'proposed_solution': ['proposed_solution_title'],
                    'proposed_solution_title': ['proposed_solution'],
                    'ai_option_title': ['ai_option'],
                    'dimension': ['dimensions'],
                    // Add step-related fields
                    'step': []
                };

                // Add related fields if they exist
                if (fieldRelationships[normalizedFieldName]) {

                    fieldRelationships[normalizedFieldName].forEach(relatedField => {
                        // First check the direct field
                        if (project[relatedField] &&
                            typeof project[relatedField] === 'string' &&
                            project[relatedField].trim() !== '') {
                            relatedFields[relatedField] = project[relatedField];
                        }
                        // For arrays, try to get useful values
                        else if (Array.isArray(project[relatedField]) && project[relatedField].length > 0) {
                            // Create a concatenated string of names or texts
                            const arrayValues = project[relatedField]
                                .filter(item => item && (item.name || item.text || item.description))
                                .map(item => item.name || item.text || item.description)
                                .filter(text => text && text.trim() !== '');

                            if (arrayValues.length > 0) {
                                relatedFields[relatedField] = arrayValues.join(', ');
                            }
                        }
                    });
                }

                return relatedFields;
            },

            // Helper method to normalize URLs like in notes component
            normalizeUrl(url) {
                if (!url) return url;
                const trimmed = url.trim();
                if (trimmed.startsWith('http://') || trimmed.startsWith('https://')) {
                    return trimmed;
                }
                return 'https://' + trimmed;
            },

            // Helper method to process context items for better readability
            processContextItem(item) {
                if (!item) return null;

                try {
                    // Handle Proxy objects properly by creating a plain object copy
                    // This ensures our context is more readable in the console
                    const result = {};

                    // Process common fields that we want to include in context
                    const fieldsToInclude = ['name', 'title', 'description', 'text', 'header', 'subtitle'];

                    fieldsToInclude.forEach(field => {
                        if (item[field] && typeof item[field] === 'string' && item[field].trim() !== '') {
                            // Include only non-empty string properties
                            result[field] = item[field].trim();
                        }
                    });

                    // Only return object if it has at least one property
                    return Object.keys(result).length > 0 ? result : null;
                } catch (e) {
                    console.error('[processContextItem] Error:', e);
                    return null;
                }
            },

            // Helper method to build rich project context like in notes component (DEPRECATED - kept for reference)
            buildProjectContext(project, fieldName) {
                if (!project) return `${fieldName}`;
                let context = [];

                // Check if this is a title field based on the input element
                const isTitle = this.$refs.input && this.$refs.input.tagName.toLowerCase() !== 'textarea';

                // For title fields, always include project name, header, and subtitle
                if (isTitle || fieldName === 'name' || fieldName === 'title' || fieldName === 'header' || fieldName ===
                    'subtitle') {
                    if (project.name) context.push(`Project Name: ${project.name}`);
                    if (project.header) context.push(`Project Header: ${project.header}`);
                    if (project.subtitle) context.push(`Project Subtitle: ${project.subtitle}`);
                }

                // Helper to extract only non-empty array values
                const extractValues = arr => {
                    if (!Array.isArray(arr)) return [];
                    return arr
                        .filter(item => {
                            if (typeof item === 'string') return item.trim() !== '';
                            if (typeof item === 'object' && item !== null) {
                                const values = [item.name, item.text, item.description, item.title]
                                    .filter(val => typeof val === 'string' && val.trim() !== '');
                                return values.length > 0;
                            }
                            return false;
                        })
                        .map(item => typeof item === 'string' ?
                            item :
                            item?.name || item?.text || item?.description || item?.title || '')
                        .filter(text => text.trim() !== '');
                };

                // Field-specific context generation - only include relevant fields
                switch (fieldName) {
                    case 'key_features':
                        // For key_features, include existing features and core project info
                        if (Array.isArray(project.key_features) && project.key_features.length > 0) {
                            const features = extractValues(project.key_features);
                            if (features.length > 0) {
                                context.push(`Key Features: ${features.join(', ')}`);
                            }
                        }
                        break;

                    case 'description':
                        if (project.name) context.push(`Project Name: ${project.name}`);
                        break;

                    case 'direct_benefits':
                        // For benefits, include existing benefits and related info
                        if (Array.isArray(project.direct_benefits) && project.direct_benefits.length > 0) {
                            const benefits = extractValues(project.direct_benefits);
                            if (benefits.length > 0) {
                                context.push(`Direct Benefits: ${benefits.join(', ')}`);
                            }
                        }
                        break;

                    case 'implementation_steps':
                        // For steps, include existing steps and solution
                        if (Array.isArray(project.implementation_steps) && project.implementation_steps.length > 0) {
                            const steps = extractValues(project.implementation_steps);
                            if (steps.length > 0) {
                                context.push(`Implementation Steps: ${steps.join(', ')}`);
                            }
                        }
                        if (project.solution) context.push(`Solution: ${project.solution}`);
                        break;

                    case 'ai_option':
                        // For AI options, include existing options and related metadata
                        if (Array.isArray(project.ai_option) && project.ai_option.length > 0) {
                            const options = extractValues(project.ai_option);
                            if (options.length > 0) {
                                context.push(`AI Options: ${options.join(', ')}`);
                            }
                        }
                        if (project.ai_option_title) context.push(`AI Option Title: ${project.ai_option_title}`);
                        break;

                    case 'objectives':
                        // For objectives, include objectives and problem
                        if (project.objectives) context.push(`Objectives: ${project.objectives}`);
                        break;

                    case 'proposed_solution':
                        // For proposed solution, include relevant context
                        if (project.proposed_solution) context.push(`Proposed Solution: ${project.proposed_solution}`);
                        break;

                    case 'problem':
                        // For problem, include problem and objectives
                        if (project.problem) context.push(`Problem: ${project.problem}`);
                        break;

                    case 'solution':
                        // For solution, include solution and problem
                        if (project.solution) context.push(`Solution: ${project.solution}`);
                        break;

                    case 'dimension':
                    case 'dimensions':
                        // For dimensions, include dimension info
                        if (project.dimension) context.push(`SIRI Dimension: ${project.dimension}`);
                        if (Array.isArray(project.dimensions) && project.dimensions.length > 0) {
                            const dimensions = extractValues(project.dimensions);
                            if (dimensions.length > 0) {
                                context.push(`SIRI Dimensions: ${dimensions.join(', ')}`);
                            }
                        }
                        break;

                    default:
                        // For any other field type, include the field-specific value if available
                        if (project[fieldName]) {
                            context.push(`${fieldName}: ${project[fieldName]}`);
                        }

                        // If it's a collection, include non-empty items
                        if (Array.isArray(project[fieldName])) {
                            const values = extractValues(project[fieldName]);
                            if (values.length > 0) {
                                context.push(`${fieldName}: ${values.join(', ')}`);
                            }
                        }
                }

                // For non-title fields, include project name at the end if not already included
                if (!isTitle && !context.some(c => c.startsWith('Project Name:')) && project.name) {
                    context.push(`Project: ${project.name}`);
                }

                return context.length > 0 ? context.join('\n') : `${fieldName}`;
            },

            // Helper method to get selected dimensions for strength/weakness points (supports multiple dimensions)
            _getSelectedDimensions() {
                try {
                    // Use the indexValue property which already handles the index correctly
                    const currentIndex = this.indexValue;
                    
                    let dimensionNames = [];
                    let currentLevels = {};
                    
                    // Find the Alpine component with strengthPoints/weaknessPoints data
                    let parentElement = this.$el;
                    while (parentElement) {
                        if (parentElement._x_dataStack) {
                            for (let data of parentElement._x_dataStack) {
                                if (data.strengthPoints || data.weaknessPoints) {
                                    const modelAttr = this.$refs.input?.getAttribute('x-model') || '';
                                    
                                    if (modelAttr.includes('strengthPoint') && data.strengthPoints && data.strengthPoints[currentIndex]) {
                                        const dimension = data.strengthPoints[currentIndex]?.dimension;
                                        // For strength points, dimension is still a single string
                                        dimensionNames = Array.isArray(dimension) ? dimension : (dimension ? [dimension] : []);
                                    } else if (modelAttr.includes('weaknessPoint') && data.weaknessPoints && data.weaknessPoints[currentIndex]) {
                                        const dimension = data.weaknessPoints[currentIndex]?.dimension;
                                        // For weakness points, dimension is now an array
                                        dimensionNames = Array.isArray(dimension) ? dimension : (dimension ? [dimension] : []);
                                    }
                                    
                                    // If we found dimensions, now look for the formData in parent scopes to get levels
                                    if (dimensionNames.length > 0) {
                                        let formDataElement = this.$el;
                                        while (formDataElement) {
                                            if (formDataElement._x_dataStack) {
                                                for (let formData of formDataElement._x_dataStack) {
                                                    if (formData.formData) {
                                                        // Get current levels for all selected dimensions
                                                        dimensionNames.forEach(dimName => {
                                                            if (formData.formData[dimName] !== undefined) {
                                                                currentLevels[dimName] = parseInt(formData.formData[dimName]) || 0;
                                                            }
                                                        });
                                                    }
                                                }
                                            }
                                            formDataElement = formDataElement.parentElement;
                                        }
                                        
                                        return { 
                                            dimensions: dimensionNames, 
                                            currentLevels: currentLevels 
                                        };
                                    }
                                }
                            }
                        }
                        parentElement = parentElement.parentElement;
                    }
                    
                    return null;
                } catch (e) {
                    console.error('Error getting selected dimensions:', e);
                    return null;
                }
            },

            // Legacy method for backward compatibility - returns first dimension only
            _getSelectedDimension() {
                const result = this._getSelectedDimensions();
                if (result && result.dimensions.length > 0) {
                    const firstDimension = result.dimensions[0];
                    return {
                        dimension: firstDimension,
                        currentLevel: result.currentLevels[firstDimension] || null
                    };
                }
                return null;
            },

            // Helper method to get dimension translations from Laravel
            _getDimensionTranslations(dimensionName, currentLevel = null , type = 'cosiri') {
                try {
                    if (!dimensionName) return null;
                    
                    // Pre-render translations for supported types and pick the correct one at runtime.
                    // We cannot use a JS variable inside Blade/PHP, so render both (or all) needed translations here.
                    const translationsMap = {
                        cosiri: @json(trans('cosiri.dimensions')),
                        siri: @json(trans('siri.dimensions'))
                    };

                    // Fallback to 'cosiri' if the provided type is not present
                    const translations = translationsMap[type] || translationsMap['cosiri'];
                    // We'll build the dimension-specific data from the Laravel translations

                    // Extract the specific dimension data
                    const dimensionData = translations[dimensionName];
                    if (!dimensionData) {
                        console.warn('No translation data found for dimension:', dimensionName);
                        return null;
                    }
                    
                    const result = {
                        name: dimensionData.name || dimensionName,
                        definition: dimensionData.definition || ''
                    };
                    
                    // If currentLevel is specified, only include that level's data
                    if (currentLevel !== null && dimensionData.levels && dimensionData.levels[currentLevel]) {
                        result.currentLevelData = dimensionData.levels[currentLevel];
                    } else if (dimensionData.levels) {
                        // Fallback: include all levels if currentLevel is not specified or not found
                        result.levels = dimensionData.levels;
                    }
                    
                    return result;
                } catch (e) {
                    console.error('Error getting dimension translations:', e);
                    return null;
                }
            },

            // Helper method to get benchmark data for a specific dimension
            _getBenchmarkDataForDimension(dimensionName) {
                try {
                    if (!dimensionName) return null;
                    
                    // Access the benchmark data that's available globally from the form
                    const benchmarkData = window.benchmarkData;
                    
                    if (!benchmarkData || !benchmarkData[dimensionName]) {
                        console.warn('No benchmark data found for dimension:', dimensionName);
                        return null;
                    }
                    
                    const dimensionBenchmark = benchmarkData[dimensionName];
                    
                    // The benchmark data typically contains [bottom, broad, best] values
                    // representing the performance levels for this dimension
                    return {
                        dimension: dimensionName,
                        bottom: dimensionBenchmark[0] || 1,     // Lowest performance level
                        broad: dimensionBenchmark[1] || 2.5,    // Average performance level  
                        best: dimensionBenchmark[2] || 4,       // Best performance level
                        raw: dimensionBenchmark                 // Include raw data for flexibility
                    };
                } catch (e) {
                    console.error('Error getting benchmark data for dimension:', dimensionName, e);
                    return null;
                }
            },

            

            // Helper method to add non-empty values to context
            addIfNotEmpty(context, key, value) {
                if (value && typeof value === 'string' && value.trim() !== '') {
                    context[key] = value.trim();
                }
            },

            // Helper method to build payload for text name generation and enhancement
            _buildTextNamePayload(text, fieldName, collection, currentProject) {
                // Use the core payload builder with some specific modifications for name/title fields
                const basePayload = this._buildProjectTextPayload({
                    text: text || '',
                    fieldName,
                    isSubproject: false,
                    collection,
                    currentProject,
                    objectType: '{{ $objectType }}',
                    maxLength: {{ $maxLength }}
                });

                // Override or add specific fields for text name handling
                const payload = {
                    ...basePayload,
                    // Text name/title fields need different processing parameters
                    maxLength: {{ $maxLength }},
                    label: `{{ $objectType }} ${fieldName}`, // Ensure label is properly set
                };
                const context = {};

                this.addIfNotEmpty(context, 'project_header', currentProject.header);
                this.addIfNotEmpty(context, 'project_name', currentProject.name);
                this.addIfNotEmpty(context, 'project_subtitle', currentProject.subtitle);
                this.addIfNotEmpty(context, 'dimension', currentProject.dimension);

                payload.context = context;

                // Special handling for AI option fields - needs bidirectional references
                if (fieldName && fieldName.includes('ai_option') && currentProject) {
                    this._debug('_buildTextNamePayload', 'AI option field detected');

                    // Set appropriate labels and context fields based on field type
                    const isTitle = fieldName === 'ai_option_title';

                    // Set label
                    payload.label = isTitle ? 'AI Option Title' : 'AI Option Content';



                    // Initialize relatedFields if needed
                    if (!payload.relatedFields) {
                        payload.relatedFields = {};
                    }


                    // We'll be more selective about which fields to include based on context
                    // Let the _getRelatedFields method handle this instead of unconditionally adding fields
                    // This ensures consistency and prevents fields like 'solution' or 'proposed_solution' from appearing everywhere

                    // For AI options, we still want to include the AI option context
                    if (fieldName.includes('ai_option')) {
                        ['ai_option', 'ai_option_title'].forEach(field => {
                            if (currentProject[field] && field !== fieldName) {
                                const normalizedValue = this._normalizeField(currentProject[field]);
                                if (normalizedValue) {
                                    payload.relatedFields[field] = normalizedValue;
                                }
                            }
                        });
                    }
                }

                // Add standard related fields based on the field type
                const standardRelatedFields = this._getRelatedFields(fieldName, currentProject);

                // Merge standard related fields with any already added
                if (Object.keys(standardRelatedFields).length > 0) {
                    payload.relatedFields = {
                        ...(payload.relatedFields || {}),
                        ...standardRelatedFields
                    };
                }
                if (fieldName === 'ai_option_title') {
                    payload.itemRelatedFields = {
                        ...payload.relatedFields
                    };
                    payload.relatedFields = null;
                    // Remove unwanted keys from itemRelatedFields
                    if (payload.itemRelatedFields.ai_option_title) {
                        delete payload.itemRelatedFields.ai_option_title;
                    }
                }
                return payload;
            },

            // Helper method to get related fields for a specific field
            _getRelatedFields(fieldName, project) {
                const relatedFields = {};
                let itemRelatedFields = {};
                if (!project) return relatedFields;

                // Determine the relevant fields to include based on context
                // Instead of adding all fields for every context, be more selective
                let relevantFields = [];

                // Determine if we're in a specific context based on fieldName
                const isFeatureContext = fieldName.includes('feature') ||
                    fieldName.includes('functionality') ||
                    fieldName.includes('capability');

                const isBenefitContext = fieldName.includes('benefit') ||
                    fieldName.includes('advantage') ||
                    fieldName.includes('value');

                const isStepContext = fieldName.includes('step') ||
                    fieldName.includes('implementation') ||
                    fieldName.includes('phase') ||
                    fieldName.includes('stage');

                const isAIContext = fieldName.includes('ai_option') ||
                    fieldName.includes('ai ') ||
                    fieldName.includes('artificial intelligence');

                const isKPIContext = fieldName.includes('kpi') ||
                    fieldName.includes('performance') ||
                    fieldName.includes('metric') ||
                    fieldName.includes('indicator') ||
                    fieldName.includes('measure');

                const isCostReductionContext = fieldName.includes('cost_reduction') ||
                    fieldName.includes('cost') ||
                    fieldName.includes('saving') ||
                    fieldName.includes('reduction') ||
                    fieldName.includes('efficiency');

                // Log the detected context to help with debugging
                if (this.debug) {
                    const contexts = [];
                    if (isFeatureContext) contexts.push('Feature');
                    if (isBenefitContext) contexts.push('Benefit');
                    if (isStepContext) contexts.push('Step');
                    if (isAIContext) contexts.push('AI');
                    if (isKPIContext) contexts.push('KPI');
                    if (isCostReductionContext) contexts.push('CostReduction');
                    this._debug('_getRelatedFields', `Context for field "${fieldName}":`, contexts.join(', ') ||
                        'None');
                }


                // Add the relevant fields to the relatedFields object
                relevantFields.forEach(field => {
                    if (project[field] && field !== fieldName) {
                        const normalizedValue = this._normalizeField(project[field]);
                        if (normalizedValue) {
                            relatedFields[field] = normalizedValue;
                        }
                    }
                });

                // Get the collection type from the current collection name or field context
                let collectionType = '{{ $collection }}' || '';

                // Collection type mapping - enhanced to include more variants
                const typeMapping = {
                    // Feature-related terms
                    'feature': 'key_features',
                    'features': 'key_features',
                    'key_feature': 'key_features',
                    'functionality': 'key_features',
                    'capability': 'key_features',

                    // Benefit-related terms
                    'benefit': 'direct_benefits',
                    'benefits': 'direct_benefits',
                    'direct_benefit': 'direct_benefits',
                    'advantage': 'direct_benefits',
                    'value': 'direct_benefits',
                    'impact': 'direct_benefits',

                    // Implementation step terms
                    'step': 'implementation_steps',
                    'steps': 'implementation_steps',
                    'implementation_step': 'implementation_steps',
                    'phase': 'implementation_steps',
                    'stage': 'implementation_steps',
                    'milestone': 'implementation_steps',

                    // AI option terms
                    'ai_option': 'ai_options',
                    'ai': 'ai_options',
                    'artificial_intelligence': 'ai_options',
                    'intelligence': 'ai_options',

                    // KPI terms
                    'kpi': 'kpiRows',
                    'kpis': 'kpiRows',
                    'performance': 'kpiRows',
                    'metric': 'kpiRows',
                    'metrics': 'kpiRows',
                    'indicator': 'kpiRows',
                    'measure': 'kpiRows',

                    // Cost reduction terms
                    'cost_reduction': 'costReductionRows',
                    'cost': 'costReductionRows',
                    'saving': 'costReductionRows',
                    'savings': 'costReductionRows',
                    'reduction': 'costReductionRows',
                    'efficiency': 'costReductionRows',
                    'optimization': 'costReductionRows'
                };

                // Check field name against all possible types
                for (const [key, value] of Object.entries(typeMapping)) {
                    if (fieldName.includes(key)) {
                        collectionType = value;
                        break;
                    }
                }

                // Handle collection-specific related fields
                if (collectionType) {
                    let context = {};
                    // Only include project name as the default context for all types
                    if (project.name) context.project_name = project.name;
                    if (project.header) context.project_header = project.header;
                    if (project.subtitle) context.project_subtitle = project.subtitle;
                    if (project.dimension) context.dimension = project.dimension;

                    // Be selective about which project context fields are relevant based on collection type
                    const fieldBasedContext = {
                        'key_features': [],
                        'direct_benefits': ['objectives'],
                        'implementation_steps': [],
                        'ai_options': [],
                        'kpiRows': [],
                        'costReductionRows': []
                    };

                    // Only add fields that are relevant to this collection type
                    const relevantFields = fieldBasedContext[collectionType] || [];

                    if (relevantFields.includes('problem') && project.problem) {
                        relatedFields.problem = project.problem;
                    }

                    if (relevantFields.includes('objectives') && project.objectives) {
                        relatedFields.objectives = project.objectives;
                    }

                    // Don't add solution or proposed_solution by default
                    // They're only relevant for specific contexts that explicitly need them

                    // Determine if we're in a specific context based on fieldName
                    // More comprehensive check for field context
                    const isFeatureContext = fieldName.includes('feature') ||
                        fieldName.includes('functionality') ||
                        fieldName.includes('capability');

                    const isBenefitContext = fieldName.includes('benefit') ||
                        fieldName.includes('advantage') ||
                        fieldName.includes('value');

                    const isStepContext = fieldName.includes('step') ||
                        fieldName.includes('implementation') ||
                        fieldName.includes('phase') ||
                        fieldName.includes('stage');

                    const isAIContext = fieldName.includes('ai_option') ||
                        fieldName.includes('ai ') ||
                        fieldName.includes('artificial intelligence');

                    const isKPIContext = fieldName.includes('kpi') ||
                        fieldName.includes('performance') ||
                        fieldName.includes('metric') ||
                        fieldName.includes('indicator') ||
                        fieldName.includes('measure');

                    const isCostReductionContext = fieldName.includes('cost_reduction') ||
                        fieldName.includes('cost') ||
                        fieldName.includes('saving') ||
                        fieldName.includes('reduction') ||
                        fieldName.includes(
                            'efficiency'
                        ); // Collection-type specific handling with complete data - only for relevant contexts
                    if (collectionType === 'key_features' || collectionType === 'features' || isFeatureContext) {
                        // Add full feature collection data, but only in feature context
                        if (Array.isArray(project.key_features) && project.key_features.length > 0) {
                            // Add complete feature objects instead of just names
                            relatedFields.key_features = project.key_features
                                .filter(f => f && f.name)
                                .map(f => ({
                                    name: this._normalizeField(f.name),
                                    description: this._normalizeField(f.description || f.text || '')
                                }));
                        }
                    } else if (collectionType === 'direct_benefits' || collectionType === 'benefits' ||
                        isBenefitContext) {
                        // Add full benefits collection data, but only in benefit context
                        if (Array.isArray(project.direct_benefits) && project.direct_benefits.length > 0) {
                            relatedFields.direct_benefits = project.direct_benefits
                                .filter(b => b && b.name)
                                .map(b => ({
                                    name: this._normalizeField(b.name),
                                    description: this._normalizeField(b.description || b.text || '')
                                }));
                        }
                    } else if (collectionType === 'implementation_steps' || collectionType === 'steps' ||
                        isStepContext) {
                        // Add full implementation steps collection data, but only in step context
                        if (Array.isArray(project.implementation_steps) && project.implementation_steps.length > 0) {
                            relatedFields.implementation_steps = project.implementation_steps
                                .filter(s => s && s.name)
                                .map(s => ({
                                    name: this._normalizeField(s.name),
                                    description: this._normalizeField(s.description || s.text || '')
                                }));
                        }
                    } else if (collectionType === 'ai_options' || isAIContext) {
                        // Add full AI options collection data, but only in AI context
                        if (Array.isArray(project.ai_options) && project.ai_options.length > 0) {
                            relatedFields.ai_options = project.ai_options
                                .filter(o => o && o.name)
                                .map(o => ({
                                    name: this._normalizeField(o.name),
                                    description: this._normalizeField(o.description || o.text || '')
                                }));
                        }

                        // Add AI option data as a special case
                        if (project.ai_option && project.ai_option_title) {
                            // Add directly to itemRelatedFields instead of relatedFields
                            itemRelatedFields.ai_option = this._normalizeField(project.ai_option);
                            itemRelatedFields.ai_option_title = this._normalizeField(project.ai_option_title);
                        }
                    } else if (isKPIContext) {
                        // Handle KPI data - try multiple possible property names
                        let kpiData = null;

                        // Try standard property
                        if (Array.isArray(project.kpiRows) && project.kpiRows.length > 0) {
                            kpiData = project.kpiRows;
                            this._debug('_getRelatedFields', 'Using kpiRows', kpiData.length);
                        }
                        // Try alternate properties
                        else if (Array.isArray(project.kpis) && project.kpis.length > 0) {
                            kpiData = project.kpis;
                            this._debug('_getRelatedFields', 'Using kpis', kpiData.length);

                            // Check if we have the label structure
                            if (kpiData.length > 0 && kpiData[0].label) {
                                this._debug('_getRelatedFields', 'Found KPI with label structure');
                            }
                        } else if (Array.isArray(project.metrics) && project.metrics.length > 0) {
                            kpiData = project.metrics;
                            this._debug('_getRelatedFields', 'Using metrics', kpiData.length);
                        }
                        // Try to look for numbered properties that might be KPIs
                        else if (Object.keys(project).some(key => !isNaN(parseInt(key)))) {
                            this._debug('_getRelatedFields', 'Found numbered properties, checking if they are KPIs');
                            const numberedItems = Object.keys(project)
                                .filter(key => !isNaN(parseInt(key)))
                                .map(key => project[key])
                                .filter(item => item && typeof item === 'object');

                            if (numberedItems.length > 0 && (numberedItems[0].label || numberedItems[0].name)) {
                                kpiData = numberedItems;
                                this._debug('_getRelatedFields', 'Using numbered items as KPIs', kpiData.length);
                            }
                        }

                        if (kpiData) {
                            relatedFields.kpis = kpiData
                                .filter(item => item && (
                                    item.name ||
                                    item.label || // Added label field to match possible data structure
                                    item.title ||
                                    item.description ||
                                    item.measure ||
                                    item.metric ||
                                    item.text ||
                                    item.details
                                ))
                                .map(item => {
                                    // Debug item conversion if needed
                                    // this._debug('_getRelatedFields', 'Processing KPI item', Object.keys(item));

                                    return {
                                        name: this._normalizeField(item.name || item.label || item.title || ''),
                                        description: this._normalizeField(item.description || item.details || item
                                            .text || '')
                                        // Only include essential fields as requested
                                    };
                                });
                            if (Array.isArray(kpiData) && typeof this.indexValue === 'number' && kpiData[this
                                    .indexValue]) {
                                const currentKpi = kpiData[this.indexValue];
                                payload.itemRelatedFields = {
                                    name: this._normalizeField(currentKpi.name || currentKpi.label || currentKpi
                                        .title || ''),
                                };
                                // Remove the current item from relatedFields.kpis
                                payload.relatedFields.kpis = payload.relatedFields.kpis.filter((item, idx) => idx !==
                                    this.indexValue);
                            }
                        }

                        // Remove AI options from KPI context as they're not relevant
                        if (relatedFields.ai_option) {
                            delete relatedFields.ai_option;
                            this._debug('_getRelatedFields', 'Removed AI option data from KPI context');
                        }
                    } else if (isCostReductionContext) {
                        // Handle Cost Reduction data - try multiple possible property names
                        let costData = null;

                        // Try standard property
                        if (Array.isArray(project.costReductionRows) && project.costReductionRows.length > 0) {
                            costData = project.costReductionRows;
                            this._debug('_getRelatedFields', 'Using costReductionRows', costData.length);
                        }
                        // Try alternate properties
                        else if (Array.isArray(project.costReductions) && project.costReductions.length > 0) {
                            costData = project.costReductions;
                            this._debug('_getRelatedFields', 'Using costReductions', costData.length);
                        } else if (Array.isArray(project.cost_reductions) && project.cost_reductions.length > 0) {
                            costData = project.cost_reductions;
                            this._debug('_getRelatedFields', 'Using cost_reductions', costData.length);
                        } else if (Array.isArray(project.savings) && project.savings.length > 0) {
                            costData = project.savings;
                            this._debug('_getRelatedFields', 'Using savings', costData.length);
                        }

                        if (costData) {
                            relatedFields.cost_reductions = costData
                                .filter(item => item && (
                                    item.name ||
                                    item.label || // Added label field to match data structure
                                    item.title ||
                                    item.description ||
                                    item.value ||
                                    item.amount ||
                                    item.annual_savings ||
                                    item.savings ||
                                    item.text ||
                                    item.details
                                ))
                                .map(item => ({
                                    name: this._normalizeField(item.name || item.label || item.title || ''),
                                    description: this._normalizeField(item.description || item.details || item
                                        .text || ''),
                                    value: this._normalizeField(
                                        item.value ||
                                        item.amount ||
                                        item.annual_savings ||
                                        item.savings ||
                                        item.cost_savings ||
                                        item.default_value ||
                                        ''
                                    )
                                    // Only include essential fields as requested - removed year field
                                }));
                            this._debug('_getRelatedFields',
                                `Added ${relatedFields.cost_reductions?.length} Cost Reductions`);

                            // Show the first mapped item to verify it's working properly
                            if (relatedFields.cost_reductions?.length > 0) {
                                this._debug('_getRelatedFields', 'First mapped cost reduction item:',
                                    JSON.stringify(relatedFields.cost_reductions[0]));
                            }
                        }

                        // Remove AI options from Cost Reduction context as they're not relevant
                        if (relatedFields.ai_option) {
                            delete relatedFields.ai_option;
                            this._debug('_getRelatedFields', 'Removed AI option data from Cost Reduction context');
                        }
                    }

                    if (Object.keys(relatedFields).length > 0) {}
                }

                // Check if fieldName contains specific patterns to map differently
                const normalizedFieldName = fieldName.includes('step') ? 'step' :
                    fieldName.includes('feature') ? 'feature' :
                    fieldName.includes('ai_option') ? 'ai_option' :
                    fieldName;

                // Map of field relationships (which fields are related to others)
                // Remove 'objectives' from 'name' and 'feature' related fields
                const fieldRelationships = {
                    'name': ['description', 'subtitle', 'header'],
                    'feature': ['problem', 'solution'],
                    'description': ['name'],
                    'objectives': ['name'],
                    'proposed_solution_title': ['proposed_solution'],
                    'proposed_solution': ['proposed_solution_title'],
                    'ai_option': ['ai_option_title'],
                    'dimension': ['name'],
                    'step': []
                };

                // Get the list of related field names for the current field
                const relatedFieldNames = fieldRelationships[normalizedFieldName] ||
                    fieldRelationships[fieldName] || [];


                // Special handling for AI option fields
                if (fieldName.includes('ai_option') || normalizedFieldName === 'ai_option') {


                    // Handle bidirectional field relationships
                    if (fieldName === 'ai_option_title' && project.ai_option) {
                        itemRelatedFields.ai_option = this._normalizeField(project.ai_option);
                    } else if (fieldName === 'ai_option' && project.ai_option_title) {
                        itemRelatedFields.ai_option_title = this._normalizeField(project.ai_option_title);
                    }
                }

                // Add values of related fields to the result
                relatedFieldNames.forEach(relatedFieldName => {
                    if (project[relatedFieldName] && typeof project[relatedFieldName] === 'string' &&
                        project[relatedFieldName].trim() !== '') {
                        relatedFields[relatedFieldName] = project[relatedFieldName].trim();
                    }

                    // Handle array fields
                    if (Array.isArray(project[relatedFieldName]) && project[relatedFieldName].length > 0) {
                        relatedFields[relatedFieldName] = project[relatedFieldName]
                            .filter(item => item && ((typeof item === 'string' && item.trim() !== '') ||
                                (typeof item === 'object' && item.name && item.name.trim() !== '')))
                            .map(item => typeof item === 'string' ? item : item.name)
                            .join(', ');

                    }
                });

                return relatedFields;
            },

            // Extract field name from model attribute
            _getFieldNameFromModel(modelAttribute) {
                let detectedField = '{{ $modelField }}'; // fallback
                if (modelAttribute) {
                    const parts = modelAttribute.split('.');
                    if (parts.length > 1) {
                        detectedField = parts[parts.length - 1];
                    }
                }
                return detectedField;
            },

            // Build context objects for project payload
            _buildProjectPayloadData(isSubproject, project, collection) {
                // Only include non-empty fields helper
                const addIfNotEmpty = (obj, key, value) => {
                    if (Array.isArray(value)) {
                        if (value.length > 0) obj[key] = value;
                    } else if (value !== undefined && value !== null && String(value).trim() !== '') {
                        obj[key] = value;
                    }
                };

                // Initialize context object
                let context = {};

                // Build context based on project type
                if (isSubproject) {
                    // Get the current subproject from the collection
                    const collection = this.getCollection();
                    const subproject = Array.isArray(collection) ? collection[this.indexValue] : collection;

                    if (subproject) {
                        addIfNotEmpty(context, 'subproject_name', subproject.name);
                        addIfNotEmpty(context, 'subproject_problem', subproject.problem);
                        addIfNotEmpty(context, 'subproject_solution', subproject.solution);
                        addIfNotEmpty(context, 'subproject_dimensions', subproject.dimensions);

                        // Handle multiple dimensions for subprojects
                        try {
                            const dimensions = Array.isArray(subproject.dimensions) ? subproject.dimensions :
                                             (subproject.dimension ? [subproject.dimension] : []);

                            if (dimensions.length > 0) {
                                context.dimensionsData = {};

                                // Process each dimension
                                dimensions.forEach(dim => {
                                    if (dim) {
                                        const dimensionData = {};

                                        // Find the current level for this dimension
                                        let formDataElement = this.$el;
                                        let found = false;
                                        while (formDataElement && !found) {
                                            if (formDataElement._x_dataStack) {
                                                for (let formData of formDataElement._x_dataStack) {
                                                    if (formData.formData && formData.formData[dim] !== undefined) {
                                                        dimensionData.currentLevel = parseInt(formData.formData[dim]) || 0;

                                                        // notes field
                                                        const notesField = dim + '_notes';
                                                        if (formData.formData[notesField]) {
                                                            dimensionData.dimensionNotes = formData.formData[notesField];
                                                        }

                                                        found = true;
                                                        break;
                                                    }
                                                }
                                            }
                                            formDataElement = formDataElement.parentElement;
                                        }

                                        // Get translations for current level
                                        dimensionData.dimensionTranslations = this._getDimensionTranslations(dim, dimensionData.currentLevel, 'siri');

                                        // Get next level translations (bands 1-5)
                                        try {
                                            if (typeof dimensionData.currentLevel === 'number') {
                                                const nextLevel = dimensionData.currentLevel + 1;
                                                if (nextLevel >= 1 && nextLevel <= 5) {
                                                    dimensionData.nextDimensionTranslations = this._getDimensionTranslations(dim, nextLevel, 'siri');
                                                } else {
                                                    dimensionData.nextDimensionTranslations = null;
                                                }
                                            } else {
                                                dimensionData.nextDimensionTranslations = null;
                                            }
                                        } catch (e) {
                                            dimensionData.nextDimensionTranslations = null;
                                        }

                                        // Get benchmark data
                                        dimensionData.benchmarkData = this._getBenchmarkDataForDimension(dim);

                                        // Add to dimensions data
                                        context.dimensionsData[dim] = dimensionData;
                                    }
                                });

                                // For backward compatibility, also set the first dimension's data at root level
                                const firstDim = dimensions[0];
                                if (firstDim && context.dimensionsData[firstDim]) {
                                    context.currentLevel = context.dimensionsData[firstDim].currentLevel;
                                    context.dimensionTranslations = context.dimensionsData[firstDim].dimensionTranslations;
                                    context.nextDimensionTranslations = context.dimensionsData[firstDim].nextDimensionTranslations;
                                    context.benchmarkData = context.dimensionsData[firstDim].benchmarkData;
                                    context.dimensionNotes = context.dimensionsData[firstDim].dimensionNotes;
                                }
                            }
                        } catch (e) {
                            console.error('Error resolving subproject dimension translations:', e);
                        }
                    }
                } else if (project) {
                    // Add project fields to context
                    addIfNotEmpty(context, 'project_header', project.header);
                    addIfNotEmpty(context, 'project_name', project.name);
                    addIfNotEmpty(context, 'project_subtitle', project.subtitle);
                    addIfNotEmpty(context, 'project_dimension', project.dimension);

                    // Handle array fields
                    const processArrayField = (fieldName, itemsArray, collection) => {
                        if (Array.isArray(itemsArray)) {
                            return itemsArray
                                .filter(item => item && item.name && item.name !== (collection && collection[this
                                    .indexValue] && collection[this.indexValue].name))
                                .map(item => ({
                                    name: item.name
                                }));
                        }
                        return [];
                    };

                    addIfNotEmpty(context, 'project_key_features', processArrayField('key_features', project
                        .key_features, collection));
                    addIfNotEmpty(context, 'project_direct_benefits', processArrayField('direct_benefits', project
                        .direct_benefits, collection));
                    addIfNotEmpty(context, 'project_implementation_steps', processArrayField('implementation_steps',
                        project.implementation_steps, collection));

                    // Add other project fields
                    addIfNotEmpty(context, 'project_ai_option_title', project.ai_option_title);
                    addIfNotEmpty(context, 'project_budget', project.budget);
                    addIfNotEmpty(context, 'project_budgetType', project.budgetType);
                    addIfNotEmpty(context, 'project_priority', project.priority);
                    addIfNotEmpty(context, 'project_timelineStartQuarter', project.timelineStartQuarter);
                    addIfNotEmpty(context, 'project_timelineStartYear', project.timelineStartYear);
                    addIfNotEmpty(context, 'project_timelineEndQuarter', project.timelineEndQuarter);
                    addIfNotEmpty(context, 'project_timelineEndYear', project.timelineEndYear);
                    // If project has a selected dimension, attempt to resolve current level and translations
                    try {
                        const dim = project.dimension || null;
                        if (dim) {
                            let formDataElement = this.$el;
                            let found = false;
                            while (formDataElement && !found) {
                                if (formDataElement._x_dataStack) {
                                    for (let formData of formDataElement._x_dataStack) {
                                        if (formData.formData && formData.formData[dim] !== undefined) {
                                            context.currentLevel = parseInt(formData.formData[dim]) || 0;
                                            const notesField = dim + '_notes';
                                            if (formData.formData[notesField]) {
                                                context.dimensionNotes = formData.formData[notesField];
                                            }
                                            // Projects/Subprojects use 'siri' translations
                                            context.dimensionTranslations = this._getDimensionTranslations(dim, context.currentLevel, 'siri');
                                            try {
                                                if (typeof context.currentLevel === 'number') {
                                                    const nextLevel = context.currentLevel + 1;
                                                    if (nextLevel >= 1 && nextLevel <= 5) {
                                                        context.nextDimensionTranslations = this._getDimensionTranslations(dim, nextLevel, 'siri');
                                                    } else {
                                                        context.nextDimensionTranslations = null;
                                                    }
                                                } else {
                                                    context.nextDimensionTranslations = null;
                                                }
                                            } catch (e) {
                                                context.nextDimensionTranslations = null;
                                            }

                                            context.benchmarkData = this._getBenchmarkDataForDimension(dim);
                                            found = true;
                                            break;
                                        }
                                    }
                                }
                                formDataElement = formDataElement.parentElement;
                            }
                        }
                    } catch (e) {
                        console.error('Error resolving project dimension translations:', e);
                    }
                }

                return {
                    context
                };
            },

            // Helper method to build payload for project text generation and enhancement
            _buildProjectTextPayload({
                text,
                fieldName,
                isSubproject,
                collection,
                currentProject,
                objectType,
                maxLength
            }) {
                // Initialize payload with common properties
                const payload = {
                    text: text || '',
                    locale: '{{ app()->getLocale() }}',
                    maxLength: {{ $maxLength }},
                    label: isSubproject ? `subproject ${fieldName}` : `${objectType} ${fieldName}`,
                    relatedFields: {}, // Initialize empty relatedFields object
                    itemRelatedFields: {} // Initialize empty itemRelatedFields object for collection items
                };

                // Build context based on content type
                if (isSubproject) {
                    // Handle subproject-specific context
                    const subproject = Array.isArray(collection) ? collection[this.indexValue] : collection;
                    if (subproject) {
                        payload.context = {};

                        // Add core subproject fields
                        const subprojectFields = ['name', 'problem', 'solution', 'dimensions'];
                        subprojectFields.forEach(field => {
                            if (subproject[field]) {
                                const normalizedValue = this._normalizeField(subproject[field]);
                                if (normalizedValue) {
                                    payload.context[`subproject_${field}`] = normalizedValue;
                                }
                            }
                        });
                        // Merge any precomputed context (from _buildProjectPayloadData) if available
                        try {
                            const pre = this._buildProjectPayloadData(true, null, collection);
                            if (pre && pre.context) {
                                payload.context = Object.assign({}, pre.context, payload.context);
                                // Also bring through dimension translations and next-level translations if present
                                if (pre.context.dimensionTranslations) payload.context.dimensionTranslations = pre.context.dimensionTranslations;
                                if (pre.context.nextDimensionTranslations) payload.context.nextDimensionTranslations = pre.context.nextDimensionTranslations;
                                if (pre.context.benchmarkData) payload.context.benchmarkData = pre.context.benchmarkData;
                                if (pre.context.dimensionNotes) payload.context.dimensionNotes = pre.context.dimensionNotes;
                                if (pre.context.currentLevel !== undefined) payload.context.currentLevel = pre.context.currentLevel;
                            }
                        } catch (e) {
                            // ignore
                        }
                    }
                } else if (collection && Array.isArray(collection)) {

                    // Handle special object types
                    if (objectType === 'ai_option' && currentProject) {
                        // Add problem and solution for context
                        if (currentProject.problem) {
                            payload.problem = this._normalizeField(currentProject.problem);
                        }

                        if (currentProject.solution) {
                            payload.solution = this._normalizeField(currentProject.solution);
                        }
                    } else if (objectType === 'solution' && currentProject) {
                        // Add solution metadata with normalized fields
                        const projectFields = ['name', 'header', 'subtitle', 'objectives'];
                        const payloadFieldMapping = {
                            'name': 'projectTitle',
                            'header': 'projectHeader',
                            'subtitle': 'projectSubTitle',
                            'objectives': 'objectives'
                        };

                        // Add core project fields
                        projectFields.forEach(field => {
                            if (currentProject[field]) {
                                const normalizedValue = this._normalizeField(currentProject[field]);
                                if (normalizedValue) {
                                    payload[payloadFieldMapping[field]] = normalizedValue;
                                }
                            }
                        });

                    }
                }

                // Add standard related fields based on field type
                if (currentProject) {
                    // Determine if we're in a specific context based on fieldName
                    const isFeatureContext = fieldName.includes('feature') ||
                        fieldName.includes('functionality') ||
                        fieldName.includes('capability');

                    const isBenefitContext = fieldName.includes('benefit') ||
                        fieldName.includes('advantage') ||
                        fieldName.includes('value');

                    const isStepContext = fieldName.includes('step') ||
                        fieldName.includes('implementation') ||
                        fieldName.includes('phase') ||
                        fieldName.includes('stage');

                    const isAIContext = fieldName.includes('ai_option') ||
                        fieldName.includes('ai ') ||
                        fieldName.includes('artificial intelligence');

                    const isKPIContext = fieldName.includes('kpi') ||
                        fieldName.includes('performance') ||
                        fieldName.includes('metric') ||
                        fieldName.includes('indicator') ||
                        fieldName.includes('measure');

                    const isCostReductionContext = fieldName.includes('cost_reduction') ||
                        fieldName.includes('cost') ||
                        fieldName.includes('saving') ||
                        fieldName.includes('reduction') ||
                        fieldName.includes('efficiency');

                    // Decide what fields to include based on context
                    let relevantFields = {};



                    // Handle collection-specific related fields (for collection items)
                    if (collection && Array.isArray(collection) && this.indexValue !== undefined) {
                        // Get the current item we're working with
                        const currentItem = collection[this.indexValue];

                        if (currentItem) {
                            // Add item specific fields to itemRelatedFields
                            const itemFields = ['name', 'title', 'description', 'text', 'content', 'priority', 'order',
                                'status', 'proposed_solution_title', 'proposed_solution', 'ai_option_title',
                                'ai_option'
                            ];

                            itemFields.forEach(field => {
                                if (field !== fieldName && currentItem[field]) { // Exclude the current field
                                    const normalizedValue = this._normalizeField(currentItem[field]);
                                    if (normalizedValue) {
                                        payload.itemRelatedFields[field] = normalizedValue;
                                    }
                                }
                            });

                            // Add other items in collection as context (excluding current item)
                            // We're removing the otherItems which is redundant with collection data already available in relatedFields
                            // This helps avoid duplicate context and streamlines the payload
                            if (collection.length > 1 && this.debug) {
                                this._debug('_buildProjectTextPayload',
                                    'Collection has other items but otherItems removed to avoid redundancy');
                            }
                        }
                    }

                    // Add only the relevant collection data to relatedFields based on the field context
                    if (currentProject) {
                        // Merge any precomputed project context (dimension translations etc.)
                        try {
                            const pre = this._buildProjectPayloadData(false, currentProject, collection);
                            if (pre && pre.context) {
                                payload.context = Object.assign({}, pre.context, payload.context || {});
                                if (pre.context.dimensionTranslations) payload.context.dimensionTranslations = pre.context.dimensionTranslations;
                                if (pre.context.nextDimensionTranslations) payload.context.nextDimensionTranslations = pre.context.nextDimensionTranslations;
                                if (pre.context.benchmarkData) payload.context.benchmarkData = pre.context.benchmarkData;
                                if (pre.context.dimensionNotes) payload.context.dimensionNotes = pre.context.dimensionNotes;
                                if (pre.context.currentLevel !== undefined) payload.context.currentLevel = pre.context.currentLevel;
                            }
                        } catch (e) {
                            // ignore
                        }
                        // Determine which collections are relevant based on the current field and object type
                        const isFeatureContext = objectType === 'feature' || fieldName.includes('feature');
                        const isBenefitContext = objectType === 'benefit' || fieldName.includes('benefit');
                        const isStepContext = objectType === 'step' || fieldName.includes('step');
                        const isAIContext = objectType === 'ai_option' || fieldName.includes('ai_option');
                        const isKPIContext = objectType === 'kpi' || fieldName.includes('kpi');
                        const isCostReductionContext = objectType === 'cost_reduction' || fieldName.includes(
                            'cost_reduction');

                        // Only add key_features in feature context or for solution/problem fields
                        if ((isFeatureContext || fieldName === 'solution' || fieldName === 'problem') &&
                            Array.isArray(currentProject.key_features) &&
                            currentProject.key_features.length > 0) {

                            payload.relatedFields.key_features = currentProject.key_features
                                .filter(item => item && item.name && item.name !== (collection && collection[this
                                    .indexValue] && collection[this.indexValue].name))
                                .map(item => ({
                                    name: this._normalizeField(item.name),
                                    description: this._normalizeField(item.description || item.text || '')
                                }));

                        }

                        // Only add direct_benefits in benefit context or for solution/value fields
                        if ((isBenefitContext || fieldName === 'solution' || fieldName === 'value') &&
                            Array.isArray(currentProject.direct_benefits) &&
                            currentProject.direct_benefits.length > 0) {

                            payload.relatedFields.direct_benefits = currentProject.direct_benefits
                                .filter(item => item && item.name && item.name !== (collection && collection[this
                                    .indexValue] && collection[this.indexValue].name))
                                .map(item => ({
                                    name: this._normalizeField(item.name),
                                    description: this._normalizeField(item.description || item.text || '')
                                }));

                        }

                        // Only add implementation_steps in step context or for implementation fields
                        if ((isStepContext || fieldName.includes('implement')) &&
                            Array.isArray(currentProject.implementation_steps) &&
                            currentProject.implementation_steps.length > 0) {

                            payload.relatedFields.implementation_steps = currentProject.implementation_steps
                                .filter(item => item && item.name && item.name !== (collection && collection[this
                                    .indexValue] && collection[this.indexValue].name))
                                .map(item => ({
                                    name: this._normalizeField(item.name),
                                    description: this._normalizeField(item.description || item.text || '')
                                }));

                        }

                        // For AI option context, we need both the AI option and the solution/problem
                        // ...existing code...

                        if (isAIContext && currentProject.ai_option_title) {
                            // Only put the title in itemRelatedFields
                            payload.relatedFields.ai_option = {
                                text: currentProject.ai_option
                            };

                            if (currentProject.ai_option_title) {
                                payload.itemRelatedFields.ai_option_title = this._normalizeField(currentProject
                                    .ai_option_title); // Just the title
                            }
                        }

                        // ...existing code...

                        // For KPI context, add KPI rows if available
                        if (isKPIContext) {
                            // Debug to see what's available in the project
                            this._debug('_buildProjectTextPayload', 'KPI Context - Project Keys',
                                Object.keys(currentProject || {}));

                            // Detailed debug for kpiRows
                            if (currentProject.kpiRows) {
                                this._debug('_buildProjectTextPayload', 'KPI Rows Type',
                                    typeof currentProject.kpiRows);
                                this._debug('_buildProjectTextPayload', 'KPI Rows Is Array',
                                    Array.isArray(currentProject.kpiRows));
                                this._debug('_buildProjectTextPayload', 'KPI Rows Length',
                                    currentProject.kpiRows.length || 0);

                                if (Array.isArray(currentProject.kpiRows) && currentProject.kpiRows.length > 0) {
                                    // Show keys of the first item to help debug structure
                                    this._debug('_buildProjectTextPayload', 'KPI First Item Keys',
                                        Object.keys(currentProject.kpiRows[0] || {}));

                                    // Show first item details to debug
                                    this._debug('_buildProjectTextPayload', 'KPI First Item',
                                        JSON.stringify(currentProject.kpiRows[0]).substring(0, 200));

                                    // Check if we have the expected structure with label property
                                    const hasLabelStructure = currentProject.kpiRows.some(item => item && item.label);
                                    if (hasLabelStructure) {
                                        this._debug('_buildProjectTextPayload',
                                            'Found KPI items with label property structure');
                                    }
                                }
                            } else {
                                this._debug('_buildProjectTextPayload', 'KPI Rows not found in project');
                            }

                            // Debug potential alternative property names
                            ['kpis', 'metrics', 'indicators', 'measures'].forEach(key => {
                                if (currentProject[key]) {
                                    this._debug('_buildProjectTextPayload', `Found alternate property: ${key}`,
                                        Array.isArray(currentProject[key]) ? currentProject[key].length :
                                        typeof currentProject[key]);
                                }
                            });

                            // Try to find KPI data in different project properties
                            let kpiData = null;

                            // Try standard property
                            if (Array.isArray(currentProject.kpiRows) && currentProject.kpiRows.length > 0) {
                                kpiData = currentProject.kpiRows;
                                this._debug('_buildProjectTextPayload', 'Using kpiRows', kpiData.length);
                            }
                            // Try alternate properties
                            else if (Array.isArray(currentProject.kpis) && currentProject.kpis.length > 0) {
                                kpiData = currentProject.kpis;
                                this._debug('_buildProjectTextPayload', 'Using kpis', kpiData.length);

                                // Check if we have the label structure
                                if (kpiData.length > 0 && kpiData[0].label) {
                                    this._debug('_buildProjectTextPayload', 'Found KPI with label structure');
                                }
                            } else if (Array.isArray(currentProject.metrics) && currentProject.metrics.length > 0) {
                                kpiData = currentProject.metrics;
                                this._debug('_buildProjectTextPayload', 'Using metrics', kpiData.length);
                            }
                            // Try to look for numbered properties that might be KPIs
                            else if (Object.keys(currentProject).some(key => !isNaN(parseInt(key)))) {
                                this._debug('_buildProjectTextPayload',
                                    'Found numbered properties, checking if they are KPIs');
                                const numberedItems = Object.keys(currentProject)
                                    .filter(key => !isNaN(parseInt(key)))
                                    .map(key => currentProject[key])
                                    .filter(item => item && typeof item === 'object');

                                if (numberedItems.length > 0 && (numberedItems[0].label || numberedItems[0].name)) {
                                    kpiData = numberedItems;
                                    this._debug('_buildProjectTextPayload', 'Using numbered items as KPIs', kpiData
                                        .length);
                                }
                            }
                            // If we have no data, create a sample entry
                            else {
                                // Create a mock entry for testing if needed
                                this._debug('_buildProjectTextPayload', 'No KPI data found, creating sample entry');
                                kpiData = [{
                                    name: 'Performance Indicator',
                                    description: 'This is a sample KPI metric.',
                                    measure: 'Percentage',
                                    target: '95%'
                                }];
                            }

                            if (kpiData) {
                                payload.relatedFields.kpis = kpiData
                                    .filter(item => item && (
                                        item.name ||
                                        item.label ||
                                        item.title ||
                                        item.description ||
                                        item.details ||
                                        item.measure ||
                                        item.text ||
                                        item.metric
                                    ))
                                    .map(item => {
                                        // Debug item conversion if needed
                                        // this._debug('_buildProjectTextPayload', 'Processing KPI item', Object.keys(item));

                                        return {
                                            name: this._normalizeField(item.name || item.label || item.title || ''),
                                            description: this._normalizeField(item.description || item.details ||
                                                item.text || '')
                                            // Only include essential fields as requested
                                        };
                                    });

                                this._debug('_buildProjectTextPayload', 'Added KPI data',
                                    payload.relatedFields.kpis?.length);

                                if (Array.isArray(kpiData) && typeof this.indexValue === 'number' && kpiData[this
                                        .indexValue]) {
                                    const currentKpi = kpiData[this.indexValue];
                                    payload.itemRelatedFields = {
                                        name: this._normalizeField(currentKpi.name || currentKpi.label || currentKpi
                                            .title || ''),
                                        description: this._normalizeField(currentKpi.description || currentKpi
                                            .details || currentKpi.text || '')
                                    };
                                    // Remove the current item from relatedFields.kpis
                                    payload.relatedFields.kpis = payload.relatedFields.kpis.filter((item, idx) =>
                                        idx !== this.indexValue);
                                }
                            }

                            // Remove AI options from KPI context as they're not relevant
                            if (payload.relatedFields.ai_option) {
                                delete payload.relatedFields.ai_option;
                                this._debug('_buildProjectTextPayload', 'Removed AI option data from KPI context');
                            }
                        }

                        // For Cost Reduction context, add cost reduction rows if available
                        if (isCostReductionContext) {
                            // Debug to see what's available in the project
                            this._debug('_buildProjectTextPayload', 'Cost Reduction Context - Project Keys',
                                Object.keys(currentProject || {}));

                            // Detailed debug for costReductionRows
                            if (currentProject.costReductionRows) {
                                this._debug('_buildProjectTextPayload', 'Cost Reduction Rows Type',
                                    typeof currentProject.costReductionRows);
                                this._debug('_buildProjectTextPayload', 'Cost Reduction Rows Is Array',
                                    Array.isArray(currentProject.costReductionRows));
                                this._debug('_buildProjectTextPayload', 'Cost Reduction Rows Length',
                                    currentProject.costReductionRows.length || 0);

                                if (Array.isArray(currentProject.costReductionRows) && currentProject.costReductionRows
                                    .length > 0) {
                                    // Show keys of the first item to help debug structure
                                    this._debug('_buildProjectTextPayload', 'Cost Reduction First Item Keys',
                                        Object.keys(currentProject.costReductionRows[0] || {}));

                                    // Show first item details to debug
                                    this._debug('_buildProjectTextPayload', 'Cost Reduction First Item',
                                        JSON.stringify(currentProject.costReductionRows[0]).substring(0, 200));

                                    // Check if we have the expected structure with label property
                                    const hasLabelStructure = currentProject.costReductionRows.some(item => item && item
                                        .label);
                                    if (hasLabelStructure) {
                                        this._debug('_buildProjectTextPayload',
                                            'Found cost items with label property structure');
                                    }
                                }
                            } else {
                                this._debug('_buildProjectTextPayload', 'Cost Reduction Rows not found in project');
                            }

                            // Debug potential alternative property names
                            ['costReductions', 'cost_reductions', 'savings', 'reductions'].forEach(key => {
                                if (currentProject[key]) {
                                    this._debug('_buildProjectTextPayload', `Found alternate property: ${key}`,
                                        Array.isArray(currentProject[key]) ? currentProject[key].length :
                                        typeof currentProject[key]);
                                }
                            });

                            // Try to find cost reduction data in different project properties
                            let costReductionData = null;

                            // Try standard property
                            if (Array.isArray(currentProject.costReductionRows) && currentProject.costReductionRows
                                .length > 0) {
                                costReductionData = currentProject.costReductionRows;
                            }
                            // Try alternate properties
                            else if (Array.isArray(currentProject.cost_reductions) && currentProject.cost_reductions
                                .length > 0) {
                                costReductionData = currentProject.cost_reductions;
                            } else if (Array.isArray(currentProject.costReduction) && currentProject.costReduction
                                .length > 0) {
                                costReductionData = currentProject.costReduction;
                            }
                            // If we have data in any format, process it
                            else {
                                // Create a mock entry for testing if needed
                                this._debug('_buildProjectTextPayload',
                                    'No cost reduction data found, creating sample entry');
                                costReductionData = [{
                                    name: 'Cost Reduction Example',
                                    description: 'This is a sample cost reduction entry.',
                                    value: '10000',
                                    year: '2025'
                                }];
                            }

                            if (costReductionData) {
                                payload.relatedFields.cost_reductions = costReductionData
                                    .filter(item => item && (
                                        item.name ||
                                        item.label || // Add label field to match the data structure
                                        item.title ||
                                        item.description ||
                                        item.value ||
                                        item.amount ||
                                        item.annual_savings ||
                                        item.savings ||
                                        item.text ||
                                        item.details
                                    ))
                                    .map(item => {
                                        // Debug each item conversion if needed
                                        // this._debug('_buildProjectTextPayload', 'Processing cost item', Object.keys(item));

                                        // More flexible mapping to handle various property names
                                        const mappedItem = {
                                            name: this._normalizeField(item.name || item.label || item.title ||
                                                ''),
                                            description: this._normalizeField(item.description || item
                                                .details || item.text || ''),
                                            value: this._normalizeField(
                                                item.value ||
                                                item.amount ||
                                                item.annual_savings ||
                                                item.savings ||
                                                item.cost_savings ||
                                                item.default_value ||
                                                ''
                                            )
                                            // Only include essential fields as requested - removed year field
                                        };

                                        return mappedItem;
                                    });

                                this._debug('_buildProjectTextPayload', 'Added Cost Reduction data',
                                    payload.relatedFields.cost_reductions?.length);

                                if (Array.isArray(costReductionData) && typeof this.indexValue === 'number' &&
                                    costReductionData[this.indexValue]) {
                                    const currentCost = costReductionData[this.indexValue];
                                    payload.itemRelatedFields = {
                                        name: this._normalizeField(currentCost.name || currentCost.label ||
                                            currentCost.title || ''),
                                    };
                                    // Remove the current item from relatedFields.cost_reductions
                                    payload.relatedFields.cost_reductions = payload.relatedFields.cost_reductions
                                        .filter((item, idx) => idx !== this.indexValue);
                                }

                            }

                            // Remove AI options from Cost Reduction context as they're not relevant
                            if (payload.relatedFields.ai_option) {
                                delete payload.relatedFields.ai_option;
                                this._debug('_buildProjectTextPayload',
                                    'Removed AI option data from Cost Reduction context');
                            }
                        }
                    }

                    // Special handling for specific field types
                    if (objectType === 'ai_option' || fieldName.includes('ai_option')) {

                        // Cross-reference AI option fields with improved structure
                        if (fieldName === 'ai_option_title' && currentProject.ai_option) {
                            // Add content to the itemRelatedFields object
                            payload.itemRelatedFields.ai_option = this._normalizeField(currentProject.ai_option);
                            // Remove redundant entry from relatedFields to avoid duplication
                            delete payload.relatedFields.ai_option;
                        } else if (fieldName === 'ai_option' && currentProject.ai_option_title) {
                            // Add title to the itemRelatedFields object
                            payload.itemRelatedFields.ai_option_title = this._normalizeField(currentProject
                                .ai_option_title);
                            // Remove redundant entry from relatedFields to avoid duplication
                            delete payload.relatedFields.ai_option_title;
                        }

                        this._debug('_buildProjectTextPayload', 'Enhanced AI option handling with structured fields');
                    }

                    // Special handling for proposed solution fields with title/content structure
                    if (fieldName === 'proposed_solution_title' || fieldName === 'proposed_solution') {
                        // Cross-reference proposed solution fields with improved structure
                        if (fieldName === 'proposed_solution_title' && currentProject.proposed_solution) {
                            // Add content to the itemRelatedFields object
                            payload.itemRelatedFields.proposed_solution = this._normalizeField(currentProject
                                .proposed_solution);
                            // Remove redundant entry from relatedFields to avoid duplication
                            delete payload.relatedFields.proposed_solution;
                        } else if (fieldName === 'proposed_solution' && currentProject.proposed_solution_title) {
                            // Add title to the itemRelatedFields object
                            payload.itemRelatedFields.proposed_solution_title = this._normalizeField(currentProject
                                .proposed_solution_title);
                            // Remove redundant entry from relatedFields to avoid duplication
                            delete payload.relatedFields.proposed_solution_title;
                        }

                        this._debug('_buildProjectTextPayload',
                            'Enhanced proposed solution handling with structured fields');
                    }

                    // Add subproject fields when working with subprojects
                    if (isSubproject && Array.isArray(collection) && this.indexValue !== undefined) {
                        const subproject = collection[this.indexValue];
                        if (subproject) {
                            // Add parent project fields to subproject context
                            ['name', 'objectives', 'problem', 'solution'].forEach(field => {
                                if (currentProject[field] && !payload.relatedFields[field]) {
                                    payload.relatedFields[`project_${field}`] = this._normalizeField(
                                        currentProject[field]);
                                }
                            });
                        }
                    }
                }

                if (fieldName === 'ai_option_title') {
                    payload.itemRelatedFields = {
                        ...payload.relatedFields
                    };
                    payload.relatedFields = null;
                    // Remove unwanted keys from itemRelatedFields
                    if (payload.itemRelatedFields.ai_option_title) {
                        delete payload.itemRelatedFields.ai_option_title;
                    }
                }

                return payload;
            },

            // Debug utility for consistent logging
            _debug(area, message, data = null, level = 'log') {
                // Handle both function signatures for backward compatibility
                // If the first argument is a string but not an area, it's likely the old message parameter
                if (typeof area === 'string' && ['warn', 'error', 'info', 'log', 'debug'].includes(data)) {
                    level = data;
                    data = message;
                    message = area;
                    area = 'EnhanceableField';
                }

                // Check if we're in a production environment
                const isProduction = typeof process !== 'undefined' &&
                    process.env &&
                    process.env.NODE_ENV === 'production';

                // Skip logging in production
                if (isProduction) return;

                const logPrefix = `[${area}]`;

                try {
                    // Make sure we're using a valid console method
                    const logMethod = ['log', 'warn', 'error', 'info', 'debug'].includes(level) ? level : 'log';

                    if (data !== null && data !== undefined) {
                        if (typeof data === 'object' && data !== null && Object.keys(data).length > 10) {
                            // For large objects, only log keys to avoid console clutter
                            console[logMethod](logPrefix, message, 'Keys:', Object.keys(data));
                        } else {
                            console[logMethod](logPrefix, message, data);
                        }
                    } else {
                        console[logMethod](logPrefix, message);
                    }
                } catch (error) {
                    // Fallback if logging fails
                }
            },
            addIfNotEmpty(obj, key, value) {
                if (Array.isArray(value)) {
                    if (value.length > 0) obj[key] = value;
                } else if (value !== undefined && value !== null && String(value).trim() !== '') {
                    obj[key] = value;
                }
            },

            // Helper method to normalize field values for API payload
            _normalizeField(fieldValue) {
                try {
                    // Handle null, undefined
                    if (fieldValue === null || fieldValue === undefined) {
                        return '';
                    }

                    // Common text properties to check in objects
                    const TEXT_PROPERTIES = ['text', 'content', 'name', 'value', 'description', 'title'];

                    // Function to extract text from an object
                    const extractTextFromObject = (obj) => {
                        // Check for common text properties
                        for (const prop of TEXT_PROPERTIES) {
                            if (obj[prop] && typeof obj[prop] === 'string' && obj[prop].trim() !== '') {
                                return obj[prop].trim();
                            }
                        }

                        // Last resort - stringify but limit length
                        try {
                            const json = JSON.stringify(obj);
                            return json.length > 100 ? json.substring(0, 100) + '...' : json;
                        } catch (e) {
                            return '[Complex Object]';
                        }
                    };

                    // Handle simple string case
                    if (typeof fieldValue === 'string') {
                        return fieldValue.trim();
                    }

                    // Handle array case
                    if (Array.isArray(fieldValue)) {
                        if (fieldValue.length === 0) return '';

                        // Try to extract meaningful text from array items
                        const items = fieldValue
                            .filter(item => item)
                            .map(item => {
                                if (typeof item === 'string') return item.trim();
                                if (item && typeof item === 'object') return extractTextFromObject(item);
                                return String(item);
                            })
                            .filter(text => text && text.trim() !== '');

                        return items.join('\n');
                    }

                    // Handle object case
                    if (fieldValue && typeof fieldValue === 'object') {
                        return extractTextFromObject(fieldValue);
                    }

                    // Any other type, convert to string
                    return String(fieldValue);
                } catch (error) {
                    console.error('[_normalizeField] Error normalizing field:', error);
                    return '[Error normalizing field]';
                }
            }
        };
    }
</script>