add-delete bond: undo redo (with issues)

packages/ketcher-core/src/application/editor/operations/polymerBond/index.ts

@@ -14,78 +14,103 @@
  * limitations under the License.
  ***************************************************************************/
 /* eslint-disable @typescript-eslint/no-use-before-define */
+// eslint-disable no-unused-vars
+/* eslint-disable @typescript-eslint/no-unused-vars */
 
 import { PolymerBond } from 'domain/entities/PolymerBond';
 import { RenderersManager } from 'application/render/renderers/RenderersManager';
 import { Operation } from 'domain/entities/Operation';
 import assert from 'assert';
+import { Command } from 'domain/entities/Command';
 
 export class PolymerBondAddOperation implements Operation {
-  constructor(private polymerBond: PolymerBond) {}
+  public polymerBond;
+  constructor(
+    private addPolymerBondChangeModel: () => PolymerBond,
+    private deletePolymerBondChangeModel: (polymerBond) => void,
+  ) {
+    this.polymerBond = this.addPolymerBondChangeModel();
+  }
 
   public execute(renderersManager: RenderersManager) {
     renderersManager.addPolymerBond(this.polymerBond);
   }
 
   public invert(renderersManager: RenderersManager) {
+    this.deletePolymerBondChangeModel(this.polymerBond);
+    renderersManager.deletePolymerBond(this.polymerBond);
     console.log('invert PolymerBondAddOperation');
   }
 }
 
 export class PolymerBondDeleteOperation implements Operation {
-  constructor(private polymerBond: PolymerBond) {}
+  constructor(
+    public polymerBond: PolymerBond,
+    private deletePolymerBondChangeModel: () => void,
+    private addPolymerBondChangeModel: (polymerBondExists) => PolymerBond,
+    private finishPolymerBondCreationModelChange: () => PolymerBond,
+  ) {}
 
   public execute(renderersManager: RenderersManager) {
+    this.deletePolymerBondChangeModel();
     renderersManager.deletePolymerBond(this.polymerBond);
     console.log('execute PolymerBondDeleteOperation');
   }
 
   public invert(renderersManager: RenderersManager) {
     console.log('invert PolymerBondDeleteOperation');
+    this.polymerBond = this.finishPolymerBondCreationModelChange();
+    this.addPolymerBondChangeModel(this.polymerBond);
     renderersManager.addPolymerBond(this.polymerBond);
+
+    console.log('this.polymerBond: ', this.polymerBond);
   }
 }
 
 export class PolymerBondMoveOperation implements Operation {
-  constructor(private polymerBond: PolymerBond) {}
+  constructor(public polymerBond: PolymerBond) {}
 
   public execute(renderersManager: RenderersManager) {
     renderersManager.movePolymerBond(this.polymerBond);
   }
 
-  public invert(renderersManager: RenderersManager) {
+  public invert(_renderersManager: RenderersManager) {
     console.log('invert PolymerBondMoveOperation');
   }
 }
 
 export class PolymerBondShowInfoOperation implements Operation {
-  constructor(private polymerBond: PolymerBond) {}
+  constructor(public polymerBond: PolymerBond) {}
 
   public execute(renderersManager: RenderersManager) {
     renderersManager.showPolymerBondInformation(this.polymerBond);
   }
 
-  public invert(renderersManager: RenderersManager) {
+  public invert(_renderersManager: RenderersManager) {
     console.log('invert PolymerBondShowInfoOperation');
   }
 }
 
 export class PolymerBondCancelCreationOperation implements Operation {
-  constructor(private polymerBond: PolymerBond) {}
+  constructor(public polymerBond: PolymerBond) {}
 
   public execute(renderersManager: RenderersManager) {
     renderersManager.cancelPolymerBondCreation(this.polymerBond);
   }
 
-  public invert(renderersManager: RenderersManager) {
+  public invert(_renderersManager: RenderersManager) {
     console.log('invert PolymerBondCancelCreationOperation');
   }
 }
 
 export class PolymerBondFinishCreationOperation implements Operation {
-  constructor(private polymerBond: PolymerBond) {}
+  public polymerBond;
+  constructor(
+    private finishPolymerBondCreationModelChange: () => PolymerBond,
+  ) {}
 
   public execute(renderersManager: RenderersManager) {
+    this.polymerBond = this.finishPolymerBondCreationModelChange();
     renderersManager.finishPolymerBondCreation(this.polymerBond);
     console.log('execute PolymerBondFinishCreationOperation');
   }
@@ -98,7 +123,7 @@ export class PolymerBondFinishCreationOperation implements Operation {
 
 export class PolymerBondAddAttachmentPointsOperation implements Operation {
   constructor(
-    private polymerBond: PolymerBond,
+    public polymerBond: PolymerBond,
     private secondMonomer,
     private firstMonomerAttachmentPoint,
     private secondMonomerAttachmentPoint,
@@ -147,7 +172,7 @@ export class PolymerBondCleanAttachmentPointsOperation implements Operation {
   private firstMonomerAttachmentPoint;
   private secondMonomerAttachmentPoint;
 
-  constructor(private polymerBond: PolymerBond) {
+  constructor(public polymerBond: PolymerBond) {
     this.polymerBond = polymerBond;
   }
 

packages/ketcher-core/src/domain/entities/DrawingEntitiesManager.ts

@@ -89,14 +89,20 @@ export class DrawingEntitiesManager {
     return mergedCommand;
   }
 
-  public addMonomer(monomerItem: MonomerItemType, position: Vec2) {
+  public addMonomerChangeModel(monomerItem: MonomerItemType, position: Vec2) {
     const [Monomer] = monomerFactory(monomerItem);
     const monomer = new Monomer(monomerItem, position);
     monomer.moveAbsolute(position);
     this.monomers.set(monomer.id, monomer);
+    return monomer;
+  }
 
+  public addMonomer(monomerItem: MonomerItemType, position: Vec2) {
     const command = new Command();
-    const operation = new MonomerAddOperation(monomer);
+    const operation = new MonomerAddOperation(
+      this.addMonomerChangeModel.bind(this, monomerItem, position),
+      this.deleteMonomerChangeModel.bind(this),
+    );
 
     command.addOperation(operation);
 
@@ -186,10 +192,21 @@ export class DrawingEntitiesManager {
     return command;
   }
 
-  public deleteMonomer(monomer: BaseMonomer) {
+  private deleteMonomerChangeModel(monomer: BaseMonomer) {
     this.monomers.delete(monomer.id);
+  }
+
+  public deleteMonomer(monomer: BaseMonomer) {
     const command = new Command();
-    const operation = new MonomerDeleteOperation(monomer);
+    const operation = new MonomerDeleteOperation(
+      monomer,
+      this.addMonomerChangeModel.bind(
+        this,
+        monomer.monomerItem,
+        monomer.position,
+      ),
+      this.deleteMonomerChangeModel.bind(this),
+    );
     command.addOperation(operation);
 
     if (monomer.hasBonds) {
@@ -233,33 +250,76 @@ export class DrawingEntitiesManager {
     return command;
   }
 
-  public addPolymerBond(firstMonomer, startPosition, endPosition) {
-    const polymerBond = new PolymerBond(firstMonomer);
+  public addPolymerBondChangeModel(
+    firstMonomer,
+    startPosition,
+    endPosition,
+    polymerBondExists?: PolymerBond,
+  ) {
+    let polymerBond = new PolymerBond(firstMonomer);
+    if (polymerBondExists) {
+      polymerBond = polymerBondExists;
+    }
     this.polymerBonds.set(polymerBond.id, polymerBond);
     firstMonomer.setPotentialBond(
       firstMonomer.startBondAttachmentPoint,
       polymerBond,
     );
     polymerBond.moveBondStartAbsolute(startPosition.x, startPosition.y);
     polymerBond.moveBondEndAbsolute(endPosition.x, endPosition.y);
+    return polymerBond;
+  }
 
+  public addPolymerBond(firstMonomer, startPosition, endPosition) {
     const command = new Command();
-    const operation = new PolymerBondAddOperation(polymerBond);
+
+    const operation = new PolymerBondAddOperation(
+      this.addPolymerBondChangeModel.bind(
+        this,
+        firstMonomer,
+        startPosition,
+        endPosition,
+      ),
+      this.deletePolymerBondChangeModel.bind(this),
+    );
 
     command.addOperation(operation);
 
-    return { command, polymerBond };
+    return { command, polymerBond: operation.polymerBond };
   }
 
-  public deletePolymerBond(polymerBond: PolymerBond) {
+  public deletePolymerBondChangeModel(polymerBond: PolymerBond) {
     this.polymerBonds.delete(polymerBond.id);
+  }
+
+  public deletePolymerBond(polymerBond: PolymerBond) {
     const command = new Command();
 
     const operationCleanAttachmentPoints =
       new PolymerBondCleanAttachmentPointsOperation(polymerBond);
     command.addOperation(operationCleanAttachmentPoints);
 
-    const operation = new PolymerBondDeleteOperation(polymerBond);
+    const operation = new PolymerBondDeleteOperation(
+      polymerBond,
+      this.deletePolymerBondChangeModel.bind(this, polymerBond),
+      this.addPolymerBondChangeModel.bind(
+        this,
+        polymerBond.firstMonomer,
+        polymerBond.startPosition,
+        polymerBond.endPosition,
+      ),
+      this.finishPolymerBondCreationModelChange.bind(
+        this,
+        polymerBond.firstMonomer,
+        polymerBond.secondMonomer as BaseMonomer,
+        polymerBond.firstMonomer.getAttachmentPointByBond(
+          polymerBond,
+        ) as string,
+        polymerBond.secondMonomer?.getAttachmentPointByBond(
+          polymerBond,
+        ) as string,
+      ),
+    );
     command.addOperation(operation);
 
     return command;
@@ -289,6 +349,34 @@ export class DrawingEntitiesManager {
     return command;
   }
 
+  public finishPolymerBondCreationModelChange(
+    firstMonomer: BaseMonomer,
+    secondMonomer: BaseMonomer,
+    firstMonomerAttachmentPoint: string,
+    secondMonomerAttachmentPoint: string,
+  ) {
+    const polymerBond = new PolymerBond(firstMonomer);
+    polymerBond.setSecondMonomer(secondMonomer);
+    polymerBond.firstMonomer.setBond(firstMonomerAttachmentPoint, polymerBond);
+    assert(polymerBond.secondMonomer);
+    assert(secondMonomer.renderer);
+    polymerBond.secondMonomer.setBond(
+      secondMonomerAttachmentPoint,
+      polymerBond,
+    );
+    polymerBond.firstMonomer.removePotentialBonds();
+    polymerBond.secondMonomer.removePotentialBonds();
+    polymerBond.moveToLinkedMonomers();
+    polymerBond.firstMonomer.turnOffSelection();
+    polymerBond.firstMonomer.turnOffHover();
+    polymerBond.firstMonomer.turnOffAttachmentPointsVisibility();
+    polymerBond.secondMonomer.turnOffSelection();
+    polymerBond.secondMonomer.turnOffHover();
+    polymerBond.secondMonomer.turnOffAttachmentPointsVisibility();
+    polymerBond.turnOffHover();
+    return polymerBond;
+  }
+
   public finishPolymerBondCreation(
     polymerBond: PolymerBond,
     secondMonomer: BaseMonomer,
@@ -297,16 +385,26 @@ export class DrawingEntitiesManager {
   ) {
     const command = new Command();
 
-    const operationAddAttachmentPoints =
-      new PolymerBondAddAttachmentPointsOperation(
-        polymerBond,
+    const firstMonomer = polymerBond.firstMonomer;
+    this.polymerBonds.delete(polymerBond.id);
+    // const operationAddAttachmentPoints =
+    //   new PolymerBondAddAttachmentPointsOperation(
+    //     polymerBond,
+    //     secondMonomer,
+    //     firstMonomerAttachmentPoint,
+    //     secondMonomerAttachmentPoint,
+    //   );
+
+    // command.addOperation(operationAddAttachmentPoints);
+    const operation = new PolymerBondFinishCreationOperation(
+      this.finishPolymerBondCreationModelChange.bind(
+        this,
+        firstMonomer,
         secondMonomer,
         firstMonomerAttachmentPoint,
         secondMonomerAttachmentPoint,
-      );
-
-    command.addOperation(operationAddAttachmentPoints);
-    const operation = new PolymerBondFinishCreationOperation(polymerBond);
+      ),
+    );
 
     command.addOperation(operation);