autosubmit, live search

app/javascript/application.js

@@ -0,0 +1,2 @@
+import "@hotwired/turbo-rails"
+import "controllers"

app/javascript/controllers/application.js

@@ -0,0 +1,7 @@
+import { Application } from "@hotwired/stimulus"
+
+const application = Application.start()
+application.debug = false
+window.Stimulus = application
+
+export { application }

app/javascript/controllers/index.js

@@ -0,0 +1,4 @@
+import { application } from "controllers/application"
+import { eagerLoadControllersFrom } from "@hotwired/stimulus-loading"
+
+eagerLoadControllersFrom("controllers", application)

app/javascript/controllers/search_controller.js

@@ -0,0 +1,23 @@
+import { Controller } from "@hotwired/stimulus"
+
+export default class extends Controller {
+  static values = {
+    debounce: { type: Number, default: 250 }
+  }
+
+  connect() {
+    console.log("Search controller connected", this.element)
+    this.submitTimeoutId = null
+  }
+
+  queueSubmit(event) {
+    console.log("queueSubmit fired", event.target.value)
+    clearTimeout(this.submitTimeoutId)
+    this.submitTimeoutId = setTimeout(() => this.submit(), this.debounceValue)
+  }
+
+  submit() {
+    console.log("submit() called")
+    this.element.requestSubmit()
+  }
+}