diff --git a/frontend/app/components/sy-modal/component.js b/frontend/app/components/sy-modal/component.js
new file mode 100644
index 000000000..80919a286
--- /dev/null
+++ b/frontend/app/components/sy-modal/component.js
@@ -0,0 +1,7 @@
+import Component from "@glimmer/component";
+
+export default class SyModal extends Component {
+  get syModals() {
+    return document.getElementById("sy-modals");
+  }
+}
diff --git a/frontend/app/components/sy-modal/template.hbs b/frontend/app/components/sy-modal/template.hbs
index 48a4de171..8fb598fb8 100644
--- a/frontend/app/components/sy-modal/template.hbs
+++ b/frontend/app/components/sy-modal/template.hbs
@@ -1,5 +1,5 @@
 {{#if @visible}}
-  <EmberWormhole @to="sy-modals">
+    {{#in-element this.syModals insertBefore=null}}
     <SyModal::Overlay @visible={{@visible}} @onClose={{optional @onClose}}>
       <div class="modal-dialog {{if @size (concat 'modal-dialog--' @size)}}">
         {{yield
@@ -12,5 +12,5 @@
         }}
       </div>
     </SyModal::Overlay>
-  </EmberWormhole>
+  {{/in-element}}
 {{/if}}
diff --git a/frontend/package.json b/frontend/package.json
index ba880c2ee..8d25cf3b8 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -100,7 +100,6 @@
     "ember-tether": "2.0.1",
     "ember-truth-helpers": "3.1.1",
     "ember-validated-form": "6.2.0",
-    "ember-wormhole": "0.6.0",
     "eslint": "8.46.0",
     "eslint-config-prettier": "8.8.0",
     "eslint-plugin-ember": "11.12.0",
diff --git a/frontend/pnpm-lock.yaml b/frontend/pnpm-lock.yaml
index 851c6ee15..1521d47b7 100644
--- a/frontend/pnpm-lock.yaml
+++ b/frontend/pnpm-lock.yaml
@@ -236,9 +236,6 @@ importers:
       ember-validated-form:
         specifier: 6.2.0
         version: 6.2.0(@babel/core@7.22.9)(@glint/template@1.4.0)(ember-data@4.12.8(@babel/core@7.22.9)(@ember/string@3.1.1)(@glimmer/tracking@1.1.2)(@glint/template@1.4.0)(ember-source@4.12.4(@babel/core@7.22.9)(@glimmer/component@1.1.2(@babel/core@7.22.9))(@glint/template@1.4.0)(webpack@5.92.1))(webpack@5.92.1))(ember-source@4.12.4(@babel/core@7.22.9)(@glimmer/component@1.1.2(@babel/core@7.22.9))(@glint/template@1.4.0)(webpack@5.92.1))(webpack@5.92.1)
-      ember-wormhole:
-        specifier: 0.6.0
-        version: 0.6.0
       eslint:
         specifier: 8.46.0
         version: 8.46.0
@@ -3934,10 +3931,6 @@ packages:
     resolution: {integrity: sha512-aNyJW52eWvWhdcRfnb0pGYSDuQU4i4XjA682aDG1ocmz7eUEDw7bXXvKEYGtVsPTtPLtUPvTtaH9mXKpMG+1xA==}
     engines: {node: 12.* || 14.* || >= 16}
 
-  ember-wormhole@0.6.0:
-    resolution: {integrity: sha512-b7RrRxkwCBEJxM2zR34dEzIET81BOZWTcYNJtkidLycLQvdbxPys5QJEjJ/IfDikT/z5HuQBdZRKBhXI0vZNXQ==}
-    engines: {node: 10.* || >= 12}
-
   emoji-regex@8.0.0:
     resolution: {integrity: sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==}
 
@@ -14556,13 +14549,6 @@ snapshots:
       - '@glint/template'
       - supports-color
 
-  ember-wormhole@0.6.0:
-    dependencies:
-      ember-cli-babel: 7.26.11
-      ember-cli-htmlbars: 5.7.2
-    transitivePeerDependencies:
-      - supports-color
-
   emoji-regex@8.0.0: {}
 
   emojis-list@3.0.0: {}