patch(feat): octo overlays can now add or remove anchors beyond constructor.

Author: rash805115

packages/octo/src/overlays/overlay.abstract.ts

@@ -23,15 +23,19 @@ export abstract class AOverlay<T> extends AModel<IOverlay, T> {
     }
 
     for (const anchor of anchors) {
-      const dependencies = this.addRelationship(anchor.getParent());
-      dependencies[0].addBehavior('overlayId', DiffAction.ADD, 'MODEL_NAME', DiffAction.ADD);
-      dependencies[0].addBehavior('overlayId', DiffAction.ADD, 'MODEL_NAME', DiffAction.UPDATE);
-      dependencies[1].addBehavior('MODEL_NAME', DiffAction.DELETE, 'overlayId', DiffAction.DELETE);
-
-      this.anchors.push(anchor);
+      this.addAnchor(anchor);
     }
   }
 
+  addAnchor(anchor: AAnchor): void {
+    const dependencies = this.addRelationship(anchor.getParent());
+    dependencies[0].addBehavior('overlayId', DiffAction.ADD, 'MODEL_NAME', DiffAction.ADD);
+    dependencies[0].addBehavior('overlayId', DiffAction.ADD, 'MODEL_NAME', DiffAction.UPDATE);
+    dependencies[1].addBehavior('MODEL_NAME', DiffAction.DELETE, 'overlayId', DiffAction.DELETE);
+
+    this.anchors.push(anchor);
+  }
+
   async diff(previous?: T): Promise<Diff[]> {
     const diffs: Diff[] = [];
 
@@ -53,6 +57,24 @@ export abstract class AOverlay<T> extends AModel<IOverlay, T> {
     return `${this.MODEL_NAME}=${this.overlayId}`;
   }
 
+  removeAnchor(anchor: AAnchor): void {
+    const overlayDependencyIndex = this.dependencies.findIndex((d) => d.from === this && d.to === anchor.getParent());
+    if (overlayDependencyIndex > -1) {
+      this.dependencies.splice(overlayDependencyIndex, 1);
+    }
+    const parentDependencyIndex = anchor
+      .getParent()
+      ['dependencies'].findIndex((d) => d.from === anchor.getParent() && d.to === this);
+    if (parentDependencyIndex > -1) {
+      anchor.getParent()['dependencies'].splice(parentDependencyIndex, 1);
+    }
+
+    const anchorIndex = this.anchors.findIndex((a) => a.anchorId === anchor.anchorId);
+    if (anchorIndex > -1) {
+      this.anchors.splice(anchorIndex, 1);
+    }
+  }
+
   synth(): IOverlay {
     return {
       anchors: this.anchors.map((a) => a.synth()),

packages/octo/src/overlays/overlay.spec.ts

@@ -47,6 +47,64 @@ describe('Overlay UT', () => {
     });
   });
 
+  describe('removeAnchor()', () => {
+    it('should remove one anchor parent when multiple anchors have same parent', () => {
+      const app = new App('test');
+      const anchor1 = new TestAnchor('anchor-1', app);
+      const anchor2 = new TestAnchor('anchor-2', app);
+
+      const overlay1 = new TestOverlay('overlay-1', {}, [anchor1, anchor2]);
+      expect(app['dependencies']).toMatchInlineSnapshot(`
+       [
+         {
+           "from": "app=test",
+           "relationship": undefined,
+           "to": "test-overlay=overlay-1",
+         },
+         {
+           "from": "app=test",
+           "relationship": undefined,
+           "to": "test-overlay=overlay-1",
+         },
+       ]
+      `);
+      expect(overlay1['dependencies']).toMatchInlineSnapshot(`
+       [
+         {
+           "from": "test-overlay=overlay-1",
+           "relationship": undefined,
+           "to": "app=test",
+         },
+         {
+           "from": "test-overlay=overlay-1",
+           "relationship": undefined,
+           "to": "app=test",
+         },
+       ]
+      `);
+
+      overlay1.removeAnchor(anchor1);
+      expect(app['dependencies']).toMatchInlineSnapshot(`
+       [
+         {
+           "from": "app=test",
+           "relationship": undefined,
+           "to": "test-overlay=overlay-1",
+         },
+       ]
+      `);
+      expect(overlay1['dependencies']).toMatchInlineSnapshot(`
+       [
+         {
+           "from": "test-overlay=overlay-1",
+           "relationship": undefined,
+           "to": "app=test",
+         },
+       ]
+      `);
+    });
+  });
+
   describe('synth()', () => {
     it('should be able to synth an empty overlay', () => {
       const overlay = new TestOverlay('overlay-1', {}, []);