diff --git a/app/views/admin/order_cycles/_order_cycle_top_buttons.html.haml b/app/views/admin/order_cycles/_order_cycle_top_buttons.html.haml
index 08bbb2c70d..86ca6b2ae4 100644
--- a/app/views/admin/order_cycles/_order_cycle_top_buttons.html.haml
+++ b/app/views/admin/order_cycles/_order_cycle_top_buttons.html.haml
@@ -1,9 +1,19 @@
-- content_for :wrapper_data_controllers, "toggle"
 - content_for :page_actions do
+  :javascript
+    function toggleSettings(){
+      if( $('#advanced_settings').is(":visible") ){
+        $('button#toggle_settings i').switchClass("icon-chevron-up","icon-chevron-down")
+      }
+      else {
+        $('button#toggle_settings i').switchClass("icon-chevron-down","icon-chevron-up")
+      }
+      $("#advanced_settings").slideToggle()
+    }
+
   %li
-    %button#toggle_settings{ "data-action": "toggle#toggle" }
+    %button#toggle_settings{ onClick: 'toggleSettings()' }
       = t('.advanced_settings')
       %i.icon-chevron-down
 
-#advanced_settings{ "data-toggle-target": "content", style: "display: none" }
+#advanced_settings{ hidden: true }
   = render partial: "/admin/order_cycles/advanced_settings"
diff --git a/app/views/spree/layouts/_admin_body.html.haml b/app/views/spree/layouts/_admin_body.html.haml
index 68b02110ce..bc380b803c 100644
--- a/app/views/spree/layouts/_admin_body.html.haml
+++ b/app/views/spree/layouts/_admin_body.html.haml
@@ -2,7 +2,7 @@
 = render "layouts/i18n_script"
 = yield :stripe_js
 
-#wrapper{ data: { hook: '', controller: (yield :wrapper_data_controllers) } }
+#wrapper{ data: { hook: '' } }
   .flash-container
     - if flash[:error]
       .flash.error= flash[:error]
diff --git a/app/webpacker/controllers/toggle_controller.js b/app/webpacker/controllers/toggle_controller.js
index 0084e10d76..de87ad095d 100644
--- a/app/webpacker/controllers/toggle_controller.js
+++ b/app/webpacker/controllers/toggle_controller.js
@@ -4,22 +4,9 @@ export default class extends Controller {
   static targets = ["content"];
 
   toggle(event) {
-    event.stopImmediatePropagation()
     const input = event.currentTarget;
-    const chevron = input.querySelector(".icon-chevron-down, .icon-chevron-up")
-    const toggleViaSingleElement = !input.dataset.toggleShow;
-
-    if(chevron) {
-      chevron.classList.toggle("icon-chevron-down");
-      chevron.classList.toggle("icon-chevron-up");
-    }
-
     this.contentTargets.forEach((t) => {
-      if(toggleViaSingleElement) {
-        t.style.display = t.style.display === "none" ? "block" : "none";
-      } else {
-        t.style.display = input.dataset.toggleShow === "true" ? "block" : "none";
-      }
+      t.style.display = input.dataset.toggleShow === "true" ? "block" : "none";
     });
   }
 }
diff --git a/spec/javascripts/stimulus/toggle_controller_test.js b/spec/javascripts/stimulus/toggle_controller_test.js
index 94f2727fc1..7dcd527e16 100644
--- a/spec/javascripts/stimulus/toggle_controller_test.js
+++ b/spec/javascripts/stimulus/toggle_controller_test.js
@@ -9,17 +9,9 @@ describe("ToggleController", () => {
   describe("#toggle", () => {
     beforeEach(() => {
       document.body.innerHTML = `<div data-controller="toggle">
-        <button id="toggle" data-action="click->toggle#toggle"></button>
-        <button id="toggle-show" data-action="click->toggle#toggle" data-toggle-show="true"></button>
-        <button id="toggle-hide" data-action="click->toggle#toggle" data-toggle-show="false"></button>
-        <button id="toggle-with-chevron" data-action="click->toggle#toggle">
-          <i class="icon-chevron-down"></i>
-        </button>
-        <div id="visible-content" data-toggle-target="content" style="display: block;">
-          visible content
-        </div>
-        <div id="invisible-content" data-toggle-target="content" style="display: none;">
-          invisible content
+        <span id="button" data-action="click->toggle#toggle" data-toggle-show="true" />
+        <div id="content" data-toggle-target="content" >
+          content
         </div>
       </div>`;
 
@@ -27,73 +19,14 @@ describe("ToggleController", () => {
       application.register("toggle", toggle_controller);
     });
 
-    it("toggling a button which shows and hides content switches the visibility of content", () => {
-      const button = document.getElementById("toggle");
-      const invisibleContent = document.getElementById("invisible-content");
-      const visibleContent = document.getElementById("visible-content");
-      expect(invisibleContent.style.display).toBe("none");
-      expect(visibleContent.style.display).toBe("block");
+    it("toggle the content", () => {
+      const button = document.getElementById("button");
+      const content = document.getElementById("content");
+      expect(content.style.display).toBe("");
 
       button.click();
 
-      expect(invisibleContent.style.display).toBe("block");
-      expect(visibleContent.style.display).toBe("none");
-    });
-
-    it("toggling a button with 'data-toggle-show=true' shows invisible content", () => {
-      const button = document.getElementById("toggle-show");
-      const invisibleContent = document.getElementById("invisible-content");
-      expect(invisibleContent.style.display).toBe("none");
-
-      button.click();
-
-      expect(invisibleContent.style.display).toBe("block");
-    });
-
-    it("toggling a button with 'data-toggle-show=true' doesn't hide visible content", () => {
-      const button = document.getElementById("toggle-show");
-      const visibleContent = document.getElementById("visible-content");
-      expect(visibleContent.style.display).toBe("block");
-
-      button.click();
-
-      expect(visibleContent.style.display).toBe("block");
-    });
-
-    it("toggling a button with 'data-toggle-show=false' hides visible content", () => {
-      const button = document.getElementById("toggle-hide");
-      const visibleContent = document.getElementById("visible-content");
-      expect(visibleContent.style.display).toBe("block");
-
-      button.click();
-
-      expect(visibleContent.style.display).toBe("none");
-    });
-
-    it("toggling a button with 'data-toggle-show=false' doesn't show invisible content", () => {
-      const button = document.getElementById("toggle-hide");
-      const invisibleContent = document.getElementById("invisible-content");
-      expect(invisibleContent.style.display).toBe("none");
-
-      button.click();
-
-      expect(invisibleContent.style.display).toBe("none");
-    });
-
-    it("toggling a button with a chevron icon switches the visibility of content and the direction of the icon", () => {
-      const buttonA = document.getElementById("toggle-with-chevron");
-      const chevron = buttonA.querySelector("i");
-      const invisibleContent = document.getElementById("invisible-content");
-      const visibleContent = document.getElementById("visible-content");
-      expect(invisibleContent.style.display).toBe("none");
-      expect(visibleContent.style.display).toBe("block");
-      expect(chevron.className).toBe("icon-chevron-down");
-
-      buttonA.click();
-
-      expect(invisibleContent.style.display).toBe("block");
-      expect(visibleContent.style.display).toBe("none");
-      expect(chevron.className).toBe("icon-chevron-up");
+      expect(content.style.display).toBe("block");
     });
   });
 });