mirror/chartdb
1
0
Fork 0
mirror of https://github.com/chartdb/chartdb.git synced 2026-05-04 00:40:09 -05:00
Code Issues Packages Projects Releases Wiki Activity

fix(canvas): read only mode (#665)

Browse Source
This commit is contained in:
Guy Ben-Aharon
2025-04-22 16:29:39 +03:00
committed by GitHub
parent aee1713aec
commit 651fe361fc
1 changed files with 20 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/editor-page/canvas/canvas.tsx
+20 -19
View File
@@ -544,16 +544,7 @@ export const Canvas: React.FC<CanvasProps> = ({ initialTables }) => {
const findRelevantNodesChanges = useCallback(
(changes: NodeChange<NodeType>[], type: NodeType['type']) => {
let changesToApply = changes;
if (readonly) {
changesToApply = changesToApply.filter(
(change) => change.type !== 'remove'
);
}
// keeps only the changes that are on tables nodes
changesToApply = changesToApply.filter((change) => {
const relevantChanges = changes.filter((change) => {
if (
change.type === 'position' ||
change.type === 'dimensions' ||
@@ -574,15 +565,16 @@ export const Canvas: React.FC<CanvasProps> = ({ initialTables }) => {
return false;
});
const positionChanges: NodePositionChange[] = changesToApply.filter(
(change) => change.type === 'position' && !change.dragging
) as NodePositionChange[];
const positionChanges: NodePositionChange[] =
relevantChanges.filter(
(change) => change.type === 'position' && !change.dragging
) as NodePositionChange[];
const removeChanges: NodeRemoveChange[] = changesToApply.filter(
const removeChanges: NodeRemoveChange[] = relevantChanges.filter(
(change) => change.type === 'remove'
) as NodeRemoveChange[];
const sizeChanges: NodeDimensionChange[] = changesToApply.filter(
const sizeChanges: NodeDimensionChange[] = relevantChanges.filter(
(change) => change.type === 'dimensions' && change.resizing
) as NodeDimensionChange[];
@@ -592,14 +584,22 @@ export const Canvas: React.FC<CanvasProps> = ({ initialTables }) => {
sizeChanges,
};
},
[getNode, readonly]
[getNode]
);
const onNodesChangeHandler: OnNodesChange<NodeType> = useCallback(
(changes) => {
let changesToApply = changes;
if (readonly) {
changesToApply = changesToApply.filter(
(change) => change.type !== 'remove'
);
}
// Handle table changes
const { positionChanges, removeChanges, sizeChanges } =
findRelevantNodesChanges(changes, 'table');
findRelevantNodesChanges(changesToApply, 'table');
if (
positionChanges.length > 0 ||
@@ -655,7 +655,7 @@ export const Canvas: React.FC<CanvasProps> = ({ initialTables }) => {
positionChanges: areaPositionChanges,
removeChanges: areaRemoveChanges,
sizeChanges: areaSizeChanges,
} = findRelevantNodesChanges(changes, 'area');
} = findRelevantNodesChanges(changesToApply, 'area');
if (
areaPositionChanges.length > 0 ||
@@ -687,7 +687,7 @@ export const Canvas: React.FC<CanvasProps> = ({ initialTables }) => {
});
}
return onNodesChange(changes);
return onNodesChange(changesToApply);
},
[
onNodesChange,
@@ -696,6 +696,7 @@ export const Canvas: React.FC<CanvasProps> = ({ initialTables }) => {
findRelevantNodesChanges,
updateArea,
removeArea,
readonly,
]
);