Skip to content

Commit 05d65d9

Browse files
morishwemorishwe
committed
Fixing mergeConfig was not defined. Using the config hook to get the current configs. Fixed visual editor not rendering because of style attritubes on Cloudscape components
1 parent 045bddc commit 05d65d9

File tree

6 files changed

+99
-77
lines changed

6 files changed

+99
-77
lines changed

‎src/ui/src/components/configuration-layout/FormView.jsx‎

Lines changed: 80 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -326,7 +326,14 @@ ResizableColumns.propTypes = {
326326
columnSpacing: PropTypes.string,
327327
};
328328

329-
const FormView = ({ schema = { properties: {} }, formValues = {}, defaultConfig = null, isCustomized = null, onResetToDefault = null, onChange }) => {
329+
const FormView = ({
330+
schema = { properties: {} },
331+
formValues = {},
332+
defaultConfig = null,
333+
isCustomized = null,
334+
onResetToDefault = null,
335+
onChange,
336+
}) => {
330337
// Track expanded state for all list items across the form - default to collapsed
331338
const [expandedItems, setExpandedItems] = useState({});
332339

@@ -337,6 +344,54 @@ const FormView = ({ schema = { properties: {} }, formValues = {}, defaultConfig
337344
// For handling dropdown selection in modal
338345
const [showNameAsDropdown, setShowNameAsDropdown] = useState(false);
339346

347+
// Handle default value initialization at component level to avoid hooks violations
348+
useEffect(() => {
349+
const initializeDefaults = (obj, currentPath = '', schemaProps = schema.properties) => {
350+
if (!schemaProps) return;
351+
352+
Object.entries(schemaProps).forEach(([key, property]) => {
353+
const fullPath = currentPath ? `${currentPath}.${key}` : key;
354+
const currentValue = getValueAtPath(formValues, fullPath);
355+
356+
// Handle attributeType field default
357+
if (key === 'attributeType' && (currentValue === undefined || currentValue === null || currentValue === '')) {
358+
updateValue(fullPath, 'simple');
359+
}
360+
361+
// Handle boolean fields with default values - ONLY when value is truly undefined/null, NOT false
362+
if (
363+
property.type === 'boolean' &&
364+
property.default !== undefined &&
365+
(currentValue === undefined || currentValue === null)
366+
) {
367+
updateValue(fullPath, property.default);
368+
}
369+
370+
// Recursively handle nested objects
371+
if (property.type === 'object' && property.properties) {
372+
const nestedObj = getValueAtPath(formValues, fullPath);
373+
if (nestedObj && typeof nestedObj === 'object') {
374+
initializeDefaults(nestedObj, fullPath, property.properties);
375+
}
376+
}
377+
378+
// Handle arrays/lists with object items
379+
if ((property.type === 'array' || property.type === 'list') && property.items && property.items.properties) {
380+
const arrayValue = getValueAtPath(formValues, fullPath);
381+
if (Array.isArray(arrayValue)) {
382+
arrayValue.forEach((item, index) => {
383+
if (item && typeof item === 'object') {
384+
initializeDefaults(item, `${fullPath}[${index}]`, property.items.properties);
385+
}
386+
});
387+
}
388+
}
389+
});
390+
};
391+
392+
initializeDefaults();
393+
}, [formValues, schema.properties]);
394+
340395
// Component-level function to add a new item with a name
341396
const addNewItem = (path, name) => {
342397
// Get current values
@@ -471,7 +526,7 @@ const FormView = ({ schema = { properties: {} }, formValues = {}, defaultConfig
471526
// Parent doesn't exist, so we can't delete anything
472527
return;
473528
}
474-
current = current[segments[i]]; // nosemgrep: javascript.lang.security.audit.prototype-pollution.prototype-pollution-loop.prototype-pollution-loop - Index from controlled array iteration
529+
current = current[segments[i]]; // nosemgrep: javascript.lang.security.audit.prototype-pollution.prototype-pollution-loop.prototype-pollution-loop - Index from controlled array iteration
475530
}
476531

477532
const [lastSegment] = segments.slice(-1);
@@ -501,7 +556,7 @@ const FormView = ({ schema = { properties: {} }, formValues = {}, defaultConfig
501556
current[segment] = {};
502557
}
503558
}
504-
current = current[segment]; // nosemgrep: javascript.lang.security.audit.prototype-pollution.prototype-pollution-loop.prototype-pollution-loop - Index from controlled array iteration
559+
current = current[segment]; // nosemgrep: javascript.lang.security.audit.prototype-pollution.prototype-pollution-loop.prototype-pollution-loop - Index from controlled array iteration
505560
});
506561

507562
const [lastSegment] = segments.slice(-1);
@@ -524,7 +579,7 @@ const FormView = ({ schema = { properties: {} }, formValues = {}, defaultConfig
524579
current[segment] = {};
525580
}
526581
}
527-
current = current[segment]; // nosemgrep: javascript.lang.security.audit.prototype-pollution.prototype-pollution-loop.prototype-pollution-loop - Index from controlled array iteration
582+
current = current[segment]; // nosemgrep: javascript.lang.security.audit.prototype-pollution.prototype-pollution-loop.prototype-pollution-loop - Index from controlled array iteration
528583
});
529584

530585
const [lastSegment] = segments.slice(-1);
@@ -539,7 +594,8 @@ const FormView = ({ schema = { properties: {} }, formValues = {}, defaultConfig
539594

540595
// Add debugging for granular assessment
541596
if (currentPath.includes('granular')) {
542-
console.log(`DEBUG: Rendering granular field '${key}' at path '${currentPath}':`, { // nosemgrep: javascript.lang.security.audit.unsafe-formatstring.unsafe-formatstring - Debug logging with controlled internal data
597+
console.log(`DEBUG: Rendering granular field '${key}' at path '${currentPath}':`, {
598+
// nosemgrep: javascript.lang.security.audit.unsafe-formatstring.unsafe-formatstring - Debug logging with controlled internal data
543599
property,
544600
value,
545601
formValues: getValueAtPath(formValues, 'assessment'),
@@ -548,21 +604,7 @@ const FormView = ({ schema = { properties: {} }, formValues = {}, defaultConfig
548604

549605
// For objects with properties, ensure the object exists in formValues
550606
if (property.type === 'object' && property.properties && value === undefined) {
551-
// Initialize the object
552-
const newObj = {};
553-
554-
// Initialize any properties with default values
555-
Object.entries(property.properties).forEach(([propKey, propSchema]) => {
556-
if (propSchema.default !== undefined) {
557-
newObj[propKey] = propSchema.default;
558-
}
559-
});
560-
561-
// Only update if we have defaults to set
562-
if (Object.keys(newObj).length > 0) {
563-
updateValue(currentPath, newObj);
564-
value = newObj;
565-
}
607+
return null;
566608
}
567609

568610
// Check dependencies FIRST, before any rendering - applies to all field types
@@ -606,7 +648,8 @@ const FormView = ({ schema = { properties: {} }, formValues = {}, defaultConfig
606648
const dependencyValue = getValueAtPath(formValues, dependencyPath);
607649

608650
// Enhanced debug logging for dependency checking
609-
console.log(`DEBUG renderField dependency check for ${key}:`, { // nosemgrep: javascript.lang.security.audit.unsafe-formatstring.unsafe-formatstring - Debug logging with controlled internal data
651+
console.log(`DEBUG renderField dependency check for ${key}:`, {
652+
// nosemgrep: javascript.lang.security.audit.unsafe-formatstring.unsafe-formatstring - Debug logging with controlled internal data
610653
key,
611654
currentPath,
612655
dependencyField,
@@ -654,7 +697,8 @@ const FormView = ({ schema = { properties: {} }, formValues = {}, defaultConfig
654697

655698
// If dependency value doesn't match any required values, hide this field
656699
if (normalizedDependencyValue === undefined || !normalizedDependencyValues.includes(normalizedDependencyValue)) {
657-
console.log(`Hiding field ${key} due to dependency mismatch:`, { // nosemgrep: javascript.lang.security.audit.unsafe-formatstring.unsafe-formatstring - Data from trusted internal source only
700+
console.log(`Hiding field ${key} due to dependency mismatch:`, {
701+
// nosemgrep: javascript.lang.security.audit.unsafe-formatstring.unsafe-formatstring - Data from trusted internal source only
658702
normalizedDependencyValue,
659703
normalizedDependencyValues,
660704
includes: normalizedDependencyValues.includes(normalizedDependencyValue),
@@ -805,7 +849,7 @@ const FormView = ({ schema = { properties: {} }, formValues = {}, defaultConfig
805849
const values = getValueAtPath(formValues, path) || [];
806850

807851
// Add debug info
808-
console.log(`Rendering list field: ${key}, type: ${property.type}, path: ${path}`, property, values); // nosemgrep: javascript.lang.security.audit.unsafe-formatstring.unsafe-formatstring - Debug logging with controlled internal data
852+
console.log(`Rendering list field: ${key}, type: ${property.type}, path: ${path}`, property, values); // nosemgrep: javascript.lang.security.audit.unsafe-formatstring.unsafe-formatstring - Debug logging with controlled internal data
809853

810854
// Get list item display settings from schema metadata
811855
const columnCount = property.columns ? parseInt(property.columns, 10) : 2;
@@ -1020,7 +1064,8 @@ const FormView = ({ schema = { properties: {} }, formValues = {}, defaultConfig
10201064
});
10211065

10221066
// Add debugging to see field distribution
1023-
console.log(`Field distribution for ${key}:`, { // nosemgrep: javascript.lang.security.audit.unsafe-formatstring.unsafe-formatstring - Debug logging with controlled internal data
1067+
console.log(`Field distribution for ${key}:`, {
1068+
// nosemgrep: javascript.lang.security.audit.unsafe-formatstring.unsafe-formatstring - Debug logging with controlled internal data
10241069
totalProperties: propEntries.length,
10251070
requestedColumns: columnCount,
10261071
visibleRegularFields: regularProps.length,
@@ -1066,7 +1111,8 @@ const FormView = ({ schema = { properties: {} }, formValues = {}, defaultConfig
10661111
const maxRows = Math.max(...fieldColumns.map((col) => col.length));
10671112

10681113
// Validation and debugging for field distribution
1069-
console.log(`Distribution result for ${key}:`, { // nosemgrep: javascript.lang.security.audit.unsafe-formatstring.unsafe-formatstring - Debug logging with controlled internal data
1114+
console.log(`Distribution result for ${key}:`, {
1115+
// nosemgrep: javascript.lang.security.audit.unsafe-formatstring.unsafe-formatstring - Debug logging with controlled internal data
10701116
actualColumnCount,
10711117
maxRows,
10721118
columnLengths: fieldColumns.map((col) => col.length),
@@ -1247,31 +1293,28 @@ const FormView = ({ schema = { properties: {} }, formValues = {}, defaultConfig
12471293
// Special handling for fields with default values
12481294
let displayValue = value;
12491295

1250-
// Handle attributeType field default
1296+
// Handle attributeType field default - just for display, actual update handled by useEffect
12511297
if (key === 'attributeType' && (value === undefined || value === null || value === '')) {
12521298
displayValue = 'simple';
1253-
updateValue(path, 'simple');
12541299
}
12551300

1256-
// Handle boolean fields with default values - ONLY when value is truly undefined/null, NOT false
1301+
// Handle boolean fields with default values - just for display, actual update handled by useEffect
12571302
if (property.type === 'boolean' && property.default !== undefined && (value === undefined || value === null)) {
12581303
displayValue = property.default;
1259-
// Update the form values immediately to ensure dependency checking works
1260-
updateValue(path, property.default);
12611304
}
12621305

12631306
// Dependencies are now checked in the main renderField function
12641307

12651308
// If this is an object type, it should be rendered as an object field, not an input field
12661309
if (property.type === 'object') {
1267-
console.log(`Redirecting object type ${key} to renderObjectField`); // nosemgrep: javascript.lang.security.audit.unsafe-formatstring.unsafe-formatstring - Debug logging with controlled internal data
1310+
console.log(`Redirecting object type ${key} to renderObjectField`); // nosemgrep: javascript.lang.security.audit.unsafe-formatstring.unsafe-formatstring - Debug logging with controlled internal data
12681311
return renderObjectField(key, property, path.substring(0, path.lastIndexOf('.')) || '');
12691312
}
12701313

12711314
let input;
12721315

12731316
// Add debug info
1274-
console.log(`Rendering input field: ${key}, type: ${property.type}, path: ${path}`, { property, value }); // nosemgrep: javascript.lang.security.audit.unsafe-formatstring.unsafe-formatstring - Debug logging with controlled internal data
1317+
console.log(`Rendering input field: ${key}, type: ${property.type}, path: ${path}`, { property, value }); // nosemgrep: javascript.lang.security.audit.unsafe-formatstring.unsafe-formatstring - Debug logging with controlled internal data
12751318

12761319
// Check if we're trying to render an array as an input field (which would be incorrect)
12771320
if (Array.isArray(value) && (property.type === 'array' || property.type === 'list')) {
@@ -1296,7 +1339,7 @@ const FormView = ({ schema = { properties: {} }, formValues = {}, defaultConfig
12961339
// Use the provided onResetToDefault function if available
12971340
onResetToDefault(path)
12981341
.then(() => {
1299-
console.log(`Restored default value for ${path} using onResetToDefault`); // nosemgrep: javascript.lang.security.audit.unsafe-formatstring.unsafe-formatstring - Data from trusted internal source only
1342+
console.log(`Restored default value for ${path} using onResetToDefault`); // nosemgrep: javascript.lang.security.audit.unsafe-formatstring.unsafe-formatstring - Data from trusted internal source only
13001343
})
13011344
.catch((error) => {
13021345
console.error(`Error restoring default value: ${error.message}`);
@@ -1306,7 +1349,7 @@ const FormView = ({ schema = { properties: {} }, formValues = {}, defaultConfig
13061349
const defaultValue = getValueAtPath(defaultConfig, path);
13071350
if (defaultValue !== undefined) {
13081351
updateValue(path, defaultValue);
1309-
console.log(`Manually restored default value for ${path}: ${defaultValue}`); // nosemgrep: javascript.lang.security.audit.unsafe-formatstring.unsafe-formatstring - Data from trusted internal source only
1352+
console.log(`Manually restored default value for ${path}: ${defaultValue}`); // nosemgrep: javascript.lang.security.audit.unsafe-formatstring.unsafe-formatstring - Data from trusted internal source only
13101353
}
13111354
}
13121355
});
@@ -1315,7 +1358,7 @@ const FormView = ({ schema = { properties: {} }, formValues = {}, defaultConfig
13151358
const defaultValue = getValueAtPath(defaultConfig, path);
13161359
if (defaultValue !== undefined) {
13171360
updateValue(path, defaultValue);
1318-
console.log(`Manually restored default value for ${path}: ${defaultValue}`); // nosemgrep: javascript.lang.security.audit.unsafe-formatstring.unsafe-formatstring - Data from trusted internal source only
1361+
console.log(`Manually restored default value for ${path}: ${defaultValue}`); // nosemgrep: javascript.lang.security.audit.unsafe-formatstring.unsafe-formatstring - Data from trusted internal source only
13191362
}
13201363
}
13211364
};
@@ -1442,14 +1485,14 @@ const FormView = ({ schema = { properties: {} }, formValues = {}, defaultConfig
14421485
const renderTopLevelProperty = ({ key, property }) => {
14431486
// Debug info for sections
14441487
console.log(
1445-
`Rendering top level property: ${key}, type: ${property.type}, sectionLabel: ${property.sectionLabel}`, // nosemgrep: javascript.lang.security.audit.unsafe-formatstring.unsafe-formatstring - Debug logging with controlled internal data
1488+
`Rendering top level property: ${key}, type: ${property.type}, sectionLabel: ${property.sectionLabel}`, // nosemgrep: javascript.lang.security.audit.unsafe-formatstring.unsafe-formatstring - Debug logging with controlled internal data
14461489
property,
14471490
);
14481491

14491492
// If property should have a section container, wrap it
14501493
if (shouldUseContainer(key, property)) {
14511494
const sectionTitle = property.sectionLabel;
1452-
console.log(`Creating section container for ${key} with title: ${sectionTitle}`); // nosemgrep: javascript.lang.security.audit.unsafe-formatstring.unsafe-formatstring - Debug logging with controlled internal data
1495+
console.log(`Creating section container for ${key} with title: ${sectionTitle}`); // nosemgrep: javascript.lang.security.audit.unsafe-formatstring.unsafe-formatstring - Debug logging with controlled internal data
14531496

14541497
return (
14551498
<Container key={key} header={<Header variant="h3">{sectionTitle}</Header>}>

‎src/ui/src/components/document-panel/DocumentPanel.jsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -335,7 +335,7 @@ const MeteringExpandableSection = ({ meteringData, documentItem }) => {
335335
<Box margin={{ top: 'l', bottom: 'm' }}>
336336
<ExpandableSection
337337
variant="container"
338-
header={
338+
headerText={
339339
<Header variant="h3" description={`Estimated cost per page: $${costPerPage.toFixed(4)}`}>
340340
Estimated Cost
341341
</Header>

‎src/ui/src/components/document-viewer/VisualEditorModal.jsx‎

Lines changed: 2 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1091,16 +1091,7 @@ const VisualEditorModal = ({ visible, onDismiss, jsonData, onChange, isReadOnly,
10911091
flex: '0 0 50%',
10921092
}}
10931093
>
1094-
<Container
1095-
header={<Header variant="h3">Document Pages ({pageIds.length})</Header>}
1096-
style={{
1097-
height: '100%',
1098-
display: 'flex',
1099-
flexDirection: 'column',
1100-
overflow: 'hidden',
1101-
flex: 1,
1102-
}}
1103-
>
1094+
<Container header={<Header variant="h3">Document Pages ({pageIds.length})</Header>}>
11041095
{(() => {
11051096
if (loadingImages) {
11061097
return (
@@ -1139,7 +1130,6 @@ const VisualEditorModal = ({ visible, onDismiss, jsonData, onChange, isReadOnly,
11391130
}
11401131
}}
11411132
disabled={pageIds.indexOf(currentPage) === 0}
1142-
style={{ pointerEvents: 'auto' }}
11431133
/>
11441134
<Button
11451135
iconName="angle-right"
@@ -1152,7 +1142,6 @@ const VisualEditorModal = ({ visible, onDismiss, jsonData, onChange, isReadOnly,
11521142
}
11531143
}}
11541144
disabled={pageIds.indexOf(currentPage) === pageIds.length - 1}
1155-
style={{ pointerEvents: 'auto' }}
11561145
/>
11571146
</Box>
11581147

@@ -1338,16 +1327,7 @@ const VisualEditorModal = ({ visible, onDismiss, jsonData, onChange, isReadOnly,
13381327
overflow: 'hidden',
13391328
}}
13401329
>
1341-
<Container
1342-
header={<Header variant="h3">Document Data</Header>}
1343-
style={{
1344-
height: '100%',
1345-
display: 'flex',
1346-
flexDirection: 'column',
1347-
overflow: 'hidden',
1348-
flex: 1,
1349-
}}
1350-
>
1330+
<Container header={<Header variant="h3">Document Data</Header>}>
13511331
<div
13521332
style={{
13531333
flex: 1,

‎src/ui/src/components/step-function-flow/FlowDiagram.jsx‎

Lines changed: 4 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@
44
import React from 'react';
55
import PropTypes from 'prop-types';
66
import { Box, Badge } from '@cloudscape-design/components';
7+
import useConfiguration from '../../hooks/use-configuration';
78
import './FlowDiagram.css';
89

910
// Helper function to check if a step is disabled based on configuration
@@ -26,6 +27,9 @@ const isStepDisabled = (stepName, config) => {
2627
};
2728

2829
const FlowDiagram = ({ steps = [], onStepClick, selectedStep = null, getStepIcon }) => {
30+
// Use the configuration hook to get mergedConfig
31+
const { mergedConfig } = useConfiguration();
32+
2933
if (!steps || steps.length === 0) {
3034
return (
3135
<Box textAlign="center" padding="xl">
@@ -231,14 +235,6 @@ FlowDiagram.propTypes = {
231235
name: PropTypes.string,
232236
}),
233237
getStepIcon: PropTypes.func.isRequired,
234-
mergedConfig: PropTypes.shape({
235-
summarization: PropTypes.shape({
236-
enabled: PropTypes.bool,
237-
}),
238-
assessment: PropTypes.shape({
239-
enabled: PropTypes.bool,
240-
}),
241-
}),
242238
};
243239

244240
export default FlowDiagram;

0 commit comments

Comments
 (0)