Refactor JS

Gemfile

@@ -9,6 +9,7 @@ gem 'bootsnap', '~> 1.18', require: false
 gem 'importmap-rails', '~> 2.2'
 gem 'propshaft', '~> 1.2'
 gem 'puma', '~> 6.6'
+gem 'requestjs-rails'
 gem "rollbar", "~> 3.6"
 gem 'sqlite3', '>= 1.4'
 gem 'stimulus-rails', '~> 1.3'

Gemfile.lock

@@ -246,6 +246,8 @@ GEM
     regexp_parser (2.11.1)
     reline (0.6.2)
       io-console (~> 0.5)
+    requestjs-rails (0.0.13)
+      railties (>= 7.1.0)
     rexml (3.4.1)
     rollbar (3.6.2)
     rubocop (1.79.2)
@@ -342,6 +344,7 @@ DEPENDENCIES
   puma (~> 6.6)
   rack-mini-profiler (~> 4.0)
   rails (~> 8.0.1)
+  requestjs-rails
   rollbar (~> 3.6)
   rubocop (~> 1.79)
   rubocop-rails (~> 2.33)

app/javascript/application.js

@@ -4,3 +4,4 @@ import "messenger"
 import Rails from "@rails/ujs";
 
 Rails.start();
+import "@rails/request.js"

app/javascript/controllers/webauthn_credential_controller.js

@@ -10,9 +10,6 @@ export default class extends Controller {
       const optionsResponse = await fetch(this.optionsUrlValue, {
         method: "POST",
         body: new FormData(this.element),
-        headers: {
-          "X-CSRF-Token": document.querySelector('meta[name="csrf-token"]')?.getAttribute("content")
-        }
       });
 
       const optionsJson = await optionsResponse.json();
@@ -37,9 +34,6 @@ export default class extends Controller {
       const optionsResponse = await fetch(this.optionsUrlValue, {
         method: "POST",
         body: new FormData(this.element),
-        headers: {
-          "X-CSRF-Token": document.querySelector('meta[name="csrf-token"]')?.getAttribute("content")
-        }
       });
 
       const optionsJson = await optionsResponse.json();