add template preferences

app/javascript/elements/toggle_on_submit.js

@@ -0,0 +1,35 @@
+export default class extends HTMLElement {
+  connectedCallback () {
+    document.addEventListener('turbo:submit-end', this.onSubmitEnd)
+
+    this.form.addEventListener('submit', this.onSubmit)
+  }
+
+  disconnectedCallback () {
+    document.removeEventListener('turbo:submit-end', this.onSubmitEnd)
+
+    this.form.removeEventListener('submit', this.onSubmit)
+  }
+
+  onSubmit = () => {
+    this.element.classList.add('invisible')
+  }
+
+  onSubmitEnd = (event) => {
+    if (event.target === this.form) {
+      const resp = event.detail?.formSubmission?.result?.fetchResponse?.response
+
+      if (resp?.status / 100 === 2) {
+        this.element.classList.remove('invisible')
+      }
+    }
+  }
+
+  get element () {
+    return document.getElementById(this.dataset.elementId)
+  }
+
+  get form () {
+    return this.closest('form')
+  }
+}