\n \n {fieldConfig.title}\n {fieldConfig.required && *}\n \n {fieldConfig.options ? (\n handleFieldChange(path, e.target.value)}\n className={`w-full mp-input ${hasError ? 'border-red-500' : hasWarning ? 'border-yellow-500' : ''}`}\n >\n \n {fieldConfig.options.map((option: string) => (\n \n ))}\n \n ) : (\n handleFieldChange(path, e.target.value)}\n className={`w-full mp-input ${hasError ? 'border-red-500' : hasWarning ? 'border-yellow-500' : ''}`}\n placeholder={fieldConfig.placeholder || `Enter ${fieldConfig.title.toLowerCase()}`}\n />\n )}\n {hasError && (\n

\n {validationErrors.find(error => error.field === path)?.message}\n

\n )}\n {hasWarning && (\n

\n {validationWarnings.find(warning => warning.field === path)?.message}\n

\n )}\n

\n );\n\n case 'number':\n return (\n

\n \n {fieldConfig.title}\n {fieldConfig.required && *}\n \n handleFieldChange(path, parseFloat(e.target.value) || 0)}\n className={`w-full mp-input ${hasError ? 'border-red-500' : hasWarning ? 'border-yellow-500' : ''}`}\n placeholder={`Enter ${fieldConfig.title.toLowerCase()}`}\n />\n {hasError && (\n

\n {validationErrors.find(error => error.field === path)?.message}\n

\n )}\n

\n );\n\n case 'date':\n return (\n

\n \n {fieldConfig.title}\n {fieldConfig.required && *}\n \n handleFieldChange(path, new Date(e.target.value))}\n className={`w-full mp-input ${hasError ? 'border-red-500' : hasWarning ? 'border-yellow-500' : ''}`}\n />\n {hasError && (\n

\n {validationErrors.find(error => error.field === path)?.message}\n

\n )}\n

\n );\n\n case 'array':\n return (\n

\n \n {fieldConfig.title}\n {fieldConfig.required && *}\n \n {\n const currentArray = getNestedValue(cdmData, path) || [];\n const newItem = fieldConfig.itemStructure ? {} : '';\n handleFieldChange(path, [...currentArray, newItem]);\n }}\n className=\"text-sm text-blue-600 hover:text-blue-800\"\n >\n + Add Item\n \n

\n {(getNestedValue(cdmData, path) || []).map((item: any, index: number) => (\n

\n Item {index + 1}\n {\n const currentArray = getNestedValue(cdmData, path) || [];\n const newArray = currentArray.filter((_: any, i: number) => i !== index);\n handleFieldChange(path, newArray);\n }}\n className=\"text-sm text-red-600 hover:text-red-800\"\n >\n Remove\n \n

\n {fieldConfig.itemStructure ? (\n

\n {renderObject(fieldConfig.itemStructure, `${path}[${index}]`, item)}\n

\n ) : (\n {\n const currentArray = getNestedValue(cdmData, path) || [];\n const newArray = [...currentArray];\n newArray[index] = e.target.value;\n handleFieldChange(path, newArray);\n }}\n className=\"w-full mp-input\"\n placeholder={`Enter ${fieldConfig.title.toLowerCase()} item`}\n />\n )}\n

\n ))}\n

\n );\n\n case 'object':\n return (\n

\n \n {fieldConfig.title}\n {fieldConfig.required && *}\n \n

\n {renderObject(fieldConfig.fields, path, value)}\n

\n );\n\n default:\n return (\n

\n \n {fieldConfig.title} (Unsupported type: {fieldConfig.type})\n \n handleFieldChange(path, e.target.value)}\n className=\"w-full mp-input\"\n disabled\n />\n

\n );\n }\n };\n\n const renderObject = (fields: any, basePath: string, data: any) => {\n if (!fields) return null;\n\n return Object.entries(fields).map(([key, fieldConfig]: [string, any]) => {\n const fieldPath = basePath ? `${basePath}.${key}` : key;\n const fieldValue = getNestedValue(data, key);\n \n // Filter by search term\n if (searchTerm && !fieldConfig.title.toLowerCase().includes(searchTerm.toLowerCase())) {\n return null;\n }\n\n return renderField(fieldConfig, fieldPath, fieldValue);\n });\n };\n\n const renderSection = (sectionKey: string, sectionConfig: any) => {\n const isExpanded = drillDownState.expandedSections.has(sectionKey);\n const sectionData = cdmData[sectionKey as keyof CDMTrade];\n const hasErrors = validationErrors.some(error => error.field.startsWith(sectionKey));\n const hasWarnings = validationWarnings.some(warning => warning.field.startsWith(sectionKey));\n\n return (\n

\n handleSectionToggle(sectionKey)}\n >\n

\n \n \n \n

\n {sectionConfig.title}\n {sectionConfig.required && *}\n

\n {hasErrors && (\n \n Errors\n \n )}\n {hasWarnings && (\n \n Warnings\n \n )}\n

\n\n {isExpanded && (\n

\n {sectionConfig.fields ? (\n renderObject(sectionConfig.fields, sectionKey, sectionData)\n ) : (\n

No fields defined for this section

\n )}\n

\n )}\n \n );\n };\n\n return (\n

Manual CDM Entry

\n Enter CDM ISDA data manually with drill-down capabilities\n

\n\n

\n {/* Main Content */}\n

\n {/* Search and Templates */}\n

\n \n Search Fields\n \n setSearchTerm(e.target.value)}\n className=\"w-full mp-input\"\n />\n

\n \n Apply Template\n \n

\n setSelectedTemplate(e.target.value)}\n className=\"flex-1 mp-input\"\n >\n \n {templates && Object.entries(templates).map(([key, template]: [string, any]) => (\n \n ))}\n \n \n Apply\n \n

\n\n {/* CDM Sections */}\n

\n {cdmStructure && Object.entries(cdmStructure).map(([sectionKey, sectionConfig]: [string, any]) => \n renderSection(sectionKey, sectionConfig)\n )}\n

\n\n {/* Action Buttons */}\n

\n \n {isValidating ? 'Validating...' : 'Validate'}\n \n \n Complete Entry →\n \n

\n\n {/* Sidebar */}\n

\n {/* Validation Status */}\n

Validation Status

\n Errors\n 0 ? 'text-red-600' : 'text-green-600'}`}>\n {validationErrors.length}\n \n

\n Warnings\n 0 ? 'text-yellow-600' : 'text-green-600'}`}>\n {validationWarnings.length}\n \n

\n\n {validationErrors.length > 0 && (\n

Recent Errors

\n {validationErrors.slice(0, 3).map((error, index) => (\n

\n {error.field}: {error.message}\n

\n ))}\n

\n )}\n

\n\n {/* Quick Actions */}\n

Quick Actions

\n setDrillDownState(prev => ({ \n ...prev, \n expandedSections: new Set(Object.keys(cdmStructure || {})) \n }))}\n className=\"w-full mp-button-secondary text-sm\"\n >\n Expand All Sections\n \n setDrillDownState(prev => ({ \n ...prev, \n expandedSections: new Set() \n }))}\n className=\"w-full mp-button-secondary text-sm\"\n >\n Collapse All Sections\n \n setCdmData(createEmptyCDMTrade())}\n className=\"w-full mp-button-secondary text-sm\"\n >\n Clear All Data\n \n

\n\n {/* Progress */}\n

Completion Progress

\n {cdmStructure && Object.entries(cdmStructure).map(([key, config]: [string, any]) => {\n const sectionData = cdmData[key as keyof CDMTrade];\n const hasData = sectionData && Object.keys(sectionData).length > 0;\n \n return (\n

\n {config.title}\n \n {hasData ? 'Complete' : 'Empty'}\n \n

\n );\n })}\n

\n\n {/* Help */}\n

Help

• Click section headers to expand/collapse

• Required fields are marked with *

• Use templates for common trade types

• Validate before completing entry

\n );\n};\n\nexport default ManualEntry;","deleted","label",[172,173,154],"frontend","components","permalink","https://www.val.town/x/MRPRRSIDENT/CDMBenchmarking/code/frontend/components/ManualEntry.tsx","extension","actionData","errors"]