1 files changed, 29 insertions, 19 deletions
diff --git a/src/engine/entities/FunctionBox.ts b/src/engine/entities/FunctionBox.ts
index 57eeedb..e5d031a 100644
--- a/src/engine/entities/FunctionBox.ts
+++ b/src/engine/entities/FunctionBox.ts
@@ -4,7 +4,9 @@ import {
   BoundingBox,
   ComponentNames,
   Grid,
+  Highlight,
   Interactable,
+  Pushable,
   Sprite,
 } from "../components";
 import { Coord2D } from "../interfaces";
@@ -36,7 +38,9 @@ export class FunctionBox extends Entity {
       ),
     );
 
-    this.addComponent(new Grid(true, gridPosition));
+    this.addComponent(new Pushable());
+
+    this.addComponent(new Grid(gridPosition));
 
     this.addComponent(
       new Sprite(
@@ -51,25 +55,31 @@ export class FunctionBox extends Entity {
       ),
     );
 
-    this.hooks.set(ComponentNames.Highlight, {
-      add: () => {
-        let modalOpen = false;
-        const interaction = () => {
-          if (modalOpen) {
-            modalOpen = false;
-            closeModal();
-            return;
-          }
-          modalOpen = true;
-          openModal(this.code);
-        };
+    this.addComponent(
+      new Highlight(
+        () => this.onHighlight(),
+        () => this.onUnhighlight(),
+      ),
+    );
+  }
+
+  private onUnhighlight() {
+    closeModal();
+    this.removeComponent(ComponentNames.Interactable);
+  }
 
-        this.addComponent(new Interactable(interaction));
-      },
-      remove: () => {
+  private onHighlight() {
+    let modalOpen = false;
+    const interaction = () => {
+      if (modalOpen) {
+        modalOpen = false;
         closeModal();
-        this.removeComponent(ComponentNames.Interactable);
-      },
-    });
+        return;
+      }
+      modalOpen = true;
+      openModal(this.code);
+    };
+
+    this.addComponent(new Interactable(interaction));
   }
 }