Utilise dirtyFormTracking de stimulus-library

app/javascript/controllers/modified_form_controller.js

@@ -1,27 +1,28 @@
 import { Controller } from '@hotwired/stimulus'
+import {useDirtyFormTracking, isDirty} from 'stimulus-library'
 
 export default class extends Controller {
  static targets = ['submit']
- static values = { changed: Boolean, preventSubmit: Boolean }
+ static values = {preventSubmit: Boolean }
 
  connect () {
- this.submitTarget.disabled = true
+ if (this.preventSubmitValue && this.hasSubmitTarget) { 
+ this.submitTarget.disabled = true
+ }
+ useDirtyFormTracking(this, this.element)
  }
 
  submit (event) {
  if (!this.preventSubmitValue) { return }
- if (this.changedValue) { return }
+ if (isDirty(this.element)) { return }
 
  event.preventDefault()
  }
 
  update () {
- this.changedValue = true
- this._enableSubmitButton()
- }
+ if (!this.hasSubmitTarget) { return }
 
- _enableSubmitButton () {
- if (this.changedValue) {
+ if (isDirty(this.element)) {
  this.submitTarget.disabled = false
  } else {
  this.submitTarget.disabled = true

config/importmap.rb

@@ -2,6 +2,16 @@
 
 pin "application", preload: true
 pin "@hotwired/turbo-rails", to: "turbo.min.js", preload: true
-pin "@hotwired/stimulus", to: "stimulus.min.js", preload: true
+pin "@hotwired/stimulus", to: "https://ga.jspm.io/npm:@hotwired/stimulus@3.2.2/dist/stimulus.js"
 pin "@hotwired/stimulus-loading", to: "stimulus-loading.js", preload: true
 pin_all_from "app/javascript/controllers", under: "controllers"
+pin "stimulus-library", to: "https://ga.jspm.io/npm:[email protected]/dist/index.js"
+pin "@stimulus-library/controllers", to: "https://ga.jspm.io/npm:@stimulus-library/[email protected]/dist/index.js"
+pin "@stimulus-library/mixins", to: "https://ga.jspm.io/npm:@stimulus-library/[email protected]/dist/index.js"
+pin "@stimulus-library/utilities", to: "https://ga.jspm.io/npm:@stimulus-library/[email protected]/dist/index.js"
+pin "date-fns/formatDistanceToNow", to: "https://ga.jspm.io/npm:[email protected]/formatDistanceToNow.mjs"
+pin "date-fns/formatDuration", to: "https://ga.jspm.io/npm:[email protected]/formatDuration.mjs"
+pin "date-fns/intervalToDuration", to: "https://ga.jspm.io/npm:[email protected]/intervalToDuration.mjs"
+pin "date-fns/isPast", to: "https://ga.jspm.io/npm:[email protected]/isPast.mjs"
+pin "date-fns/toDate", to: "https://ga.jspm.io/npm:[email protected]/toDate.mjs"
+pin "mitt", to: "https://ga.jspm.io/npm:[email protected]/dist/mitt.mjs"