Fixed State Issues, should be good to go.

frontend/realtime/src/KonvaApp/Engine.ts

@@ -379,7 +379,7 @@ export class Engine {
     // Listen to Toolbar Main
     uiEvents.toolbarMain.UNDO.onClick(() => this.undoStackManager.undo());
     uiEvents.toolbarMain.REDO.onClick(() => this.undoStackManager.redo());
-
+ 
     uiEvents.toolbarMain.SAVE.onClick(async (/*event*/) => {
       await this.realTimeDrawEngine.saveOutput();
     });
@@ -467,6 +467,7 @@ export class Engine {
     });
 
     uiEvents.onAddShapeToEngine((shapeData) => {
+      this.setAppMode(AppModes.SELECT);
       switch (shapeData.shape) {
         case "circle":
           this.addShape(ShapeType.CIRCLE, 100);

frontend/realtime/src/KonvaApp/EngineUtitlities/CommandManager.ts

@@ -50,7 +50,7 @@ export class CommandManager {
   }
 
   createNode(node: MediaNode) {
-    console.log("CREATE?!?!?!?!")
+
     const command = new CreateCommand({
       nodes: new Set<MediaNode>([node]),
       mediaLayerRef: this.mediaLayerRef,

frontend/realtime/src/KonvaApp/RenderingPrimitives/RealTimeDrawEngine.ts

@@ -376,7 +376,7 @@ export class RealTimeDrawEngine {
     });
   }
 
-  public findImageNodeById(id: string): (ImageNode | TextNode | ShapeNode | undefined) {
+  public findImageNodeById(id: string): (ImageNode | TextNode | ShapeNode | PaintNode | undefined) {
     return this.imageNodes.find(node => {
       if (node.kNode) {
         return node.kNode.id() === id;
@@ -528,8 +528,6 @@ export class RealTimeDrawEngine {
     await this.render();
   };
   
-
-
   public async addNodes(node: MediaNode) {
     if (node instanceof ImageNode || 
       node instanceof TextNode || 
@@ -541,6 +539,12 @@ export class RealTimeDrawEngine {
       console.log(this.imageNodes)
       node.kNode.on("dragend", this.handleNodeDragEnd);
     }
+
+    // ensure the layer doesn't move if added while painting.
+    if (this.isEnabled) {
+      this.disableDragging();
+    }
+
     await this.render();
   }