Merge branch 'fixes/app-builder-perf' of https://github.com/ToolJet/ToolJet into fixes/app-builder-perf

This commit is contained in:
Johnson Cherian 2024-05-29 15:30:38 +05:30
commit ae50ea6632
8 changed files with 32 additions and 16 deletions

View file

@ -41,6 +41,7 @@ const MultiLineCodeEditor = (props) => {
portalProps,
showPreview,
paramLabel = '',
delayOnChange = true, // Added this prop to immediately update the onBlurUpdate callback
} = props;
const [currentValue, setCurrentValue] = React.useState(() => initialValue);
@ -63,6 +64,7 @@ const MultiLineCodeEditor = (props) => {
}, []);
const handleOnBlur = () => {
if (!delayOnChange) return onChange(currentValue);
setTimeout(() => {
onChange(currentValue);
}, 100);

View file

@ -425,21 +425,31 @@ class TableComponent extends React.Component {
...draggableStyle,
});
removeColumn = (index, ref) => {
const columns = this.props.component.component.definition.properties.columns;
const newValue = columns.value;
const removedColumns = newValue.splice(index, 1);
this.props.paramUpdated({ name: 'columns' }, 'value', newValue, 'properties', true);
removeColumn = async (index, ref) => {
try {
const columns = this.props.component.component.definition.properties.columns;
const newValue = columns.value;
const removedColumns = newValue.splice(index, 1);
await this.props.paramUpdated({ name: 'columns' }, 'value', newValue, 'properties', true);
const existingcolumnDeletionHistory =
this.props.component.component.definition.properties.columnDeletionHistory?.value ?? [];
const newcolumnDeletionHistory = [
...existingcolumnDeletionHistory,
...removedColumns.map((column) => column.key || column.name),
];
this.props.paramUpdated({ name: 'columnDeletionHistory' }, 'value', newcolumnDeletionHistory, 'properties', true);
const existingColumnDeletionHistory =
this.props.component.component.definition.properties.columnDeletionHistory?.value ?? [];
const newColumnDeletionHistory = [
...existingColumnDeletionHistory,
...removedColumns.map((column) => column.key || column.name),
];
await this.props.paramUpdated(
{ name: 'columnDeletionHistory' },
'value',
newColumnDeletionHistory,
'properties',
true
);
this.deleteEvents(ref, 'table_column');
await this.deleteEvents(ref, 'table_column');
} catch (error) {
console.error('Error updating column:', error);
}
};
reorderColumns = (startIndex, endIndex) => {

View file

@ -218,6 +218,7 @@ return data.filter(row => row.amount > 1000);
cyLabel={'transformation-input'}
callgpt={noop}
isCopilotEnabled={false}
delayOnChange={false}
/>
</div>
)}

View file

@ -36,6 +36,7 @@ const Runjs = (props) => {
}}
componentName="Runjs"
cyLabel={`runjs`}
delayOnChange={false}
/>
</Card>
);

View file

@ -26,6 +26,7 @@ export class Runpy extends React.Component {
onChange={(value) => changeOption(this, 'code', value)}
componentName="Runpy"
cyLabel={`runpy`}
delayOnChange={false}
/>
</div>
);

View file

@ -80,7 +80,7 @@ export const SubContainer = ({
setContainerCanvasWidth(canvasWidth);
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [parentRef, getContainerCanvasWidth(), listmode]);
}, [parentRef, getContainerCanvasWidth(), listmode, parentComponent?.definition?.properties?.size?.value]); // Listen for changes to the modal size and update the subcontainer state with the new grid width.
zoomLevel = zoomLevel || 1;

View file

@ -339,6 +339,7 @@ const DynamicForm = ({
width,
componentName: queryName ? `${queryName}::${key ?? ''}` : null,
cyLabel: key ? `${String(key).toLocaleLowerCase().replace(/\s+/g, '-')}` : '',
delayOnChange: false,
};
case 'react-component-openapi-validator':
return {

View file

@ -264,7 +264,7 @@ const computeComponentDiff = (appDiff, currentPageId, opts, currentLayout) => {
if (doesActionsExist || doesColumnsExist) {
const actions = _.toArray(metaDiff.definition[attribute]?.actions?.value) || [];
const columns = _.toArray(metaDiff.definition[attribute]?.columns?.value) || [];
// const columns = _.toArray(metaDiff.definition[attribute]?.columns?.value) || [];
metaDiff.definition = {
...metaDiff.definition,
@ -274,7 +274,7 @@ const computeComponentDiff = (appDiff, currentPageId, opts, currentLayout) => {
value: actions,
},
columns: {
value: columns,
value: component.component?.definition?.properties?.columns?.value,
},
},
};