Elgato_dark/ToolJet
1
0
Fork 0
mirror of https://github.com/ToolJet/ToolJet synced 2026-05-23 08:58:26 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 5

[improvement] Multipages : sync undo redo to page level (#5010)

Browse source 
* undo/redo is page level

* resolves: auto save definitions and double redo/undo actions
This commit is contained in:
Arpit 2022-12-21 18:49:05 +05:30 committed by GitHub
parent 464dec4c42
commit 8e1a3bab9c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 32 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

43
frontend/src/Editor/Editor.jsx
View file

@ -268,7 +268,9 @@ class EditorComponent extends React.Component {
// 2. Whenever you perform an undo – you can always redo and keep doing undo as long as we have a patch for it.
// 3. Whenever you redo – you can always undo and keep doing redo as long as we have a patch for it.
initComponentVersioning = () => {
this.currentVersion = -1;
this.currentVersion = {
[this.state.currentPageId]: -1,
};
this.currentVersionChanges = {};
this.noOfVersionsSupported = 100;
this.canUndo = false;
@ -512,39 +514,52 @@ class EditorComponent extends React.Component {
handleAddPatch = (patches, inversePatches) => {
if (isEmpty(patches) && isEmpty(inversePatches)) return;
if (isEqual(patches, inversePatches)) return;
this.currentVersion++;
this.currentVersionChanges[this.currentVersion] = {
const currentPage = this.state.currentPageId;
const currentVersion = this.currentVersion[currentPage] ?? -1;
this.currentVersionChanges[currentPage] = this.currentVersionChanges[currentPage] ?? {};
this.currentVersionChanges[currentPage][currentVersion] = {
redo: patches,
undo: inversePatches,
};
this.canUndo = this.currentVersionChanges.hasOwnProperty(this.currentVersion);
this.canRedo = this.currentVersionChanges.hasOwnProperty(this.currentVersion + 1);
this.canUndo = this.currentVersionChanges[currentPage].hasOwnProperty(currentVersion);
this.canRedo = this.currentVersionChanges[currentPage].hasOwnProperty(currentVersion + 1);
delete this.currentVersionChanges[this.currentVersion + 1];
delete this.currentVersionChanges[this.currentVersion - this.noOfVersionsSupported];
this.currentVersion[currentPage] = currentVersion + 1;
delete this.currentVersionChanges[currentPage][currentVersion + 1];
delete this.currentVersionChanges[currentPage][currentVersion - this.noOfVersionsSupported];
};
handleUndo = () => {
if (this.canUndo) {
let currentVersion = this.currentVersion[this.state.currentPageId];
const appDefinition = applyPatches(
this.state.appDefinition,
this.currentVersionChanges[this.currentVersion--].undo
this.currentVersionChanges[this.state.currentPageId][currentVersion - 1].undo
);
this.canUndo = this.currentVersionChanges.hasOwnProperty(this.currentVersion);
this.canUndo = this.currentVersionChanges[this.state.currentPageId].hasOwnProperty(currentVersion - 1);
this.canRedo = true;
this.currentVersion[this.state.currentPageId] = currentVersion - 1;
if (!appDefinition) return;
this.setState(
{
appDefinition,
isSaving: true,
},
() => {
this.props.ymap?.set('appDef', {
newDefinition: appDefinition,
editingVersionId: this.state.editingVersion?.id,
});
this.autoSave();
}
);
}
@ -552,24 +567,30 @@ class EditorComponent extends React.Component {
handleRedo = () => {
if (this.canRedo) {
let currentVersion = this.currentVersion[this.state.currentPageId];
const appDefinition = applyPatches(
this.state.appDefinition,
this.currentVersionChanges[++this.currentVersion].redo
this.currentVersionChanges[this.state.currentPageId][currentVersion].redo
);
this.canUndo = true;
this.canRedo = this.currentVersionChanges.hasOwnProperty(this.currentVersion + 1);
this.canRedo = this.currentVersionChanges[this.state.currentPageId].hasOwnProperty(currentVersion + 1);
this.currentVersion[this.state.currentPageId] = currentVersion + 1;
if (!appDefinition) return;
this.setState(
{
appDefinition,
isSaving: true,
},
() => {
this.props.ymap?.set('appDef', {
newDefinition: appDefinition,
editingVersionId: this.state.editingVersion?.id,
});
this.autoSave();
}
);
}