Update sortable controller for better data handling

app/javascript/controllers/sortable_controller.js

@@ -58,8 +58,20 @@ export default class extends Controller {
     const newColumnId = to.closest('.board-column').dataset.sortableColumnIdValue;
     const url = this.urlValue.replace(":id", id);
 
+    const card = {
+      position: newIndex,
+      board_column_id: newColumnId,
+    };
+
+    const body = {
+      _method: 'patch',
+      authenticity_token: document.querySelector("[name='csrf-token']").content,
+      card: card,
+      commit: 'Save'
+    };
+
     put(url, {
-      body: JSON.stringify({ position: newIndex, column_id: newColumnId }),
+      body: JSON.stringify(body),
       headers: {
         'Content-Type': 'application/json',
         'X-CSRF-Token': document.querySelector("[name='csrf-token']").content

app/views/boards/show.html.erb

@@ -13,7 +13,7 @@
 </div>
 
 <div class="board-container">
-  <div class="board-scroll p-3" data-controller="sortable" data-sortable-group-value="<%= @board.id %>" data-sortable-url-value="<%= update_card_positions_board_column_path(":id") %>">
+  <div class="board-scroll p-3" data-controller="sortable" data-sortable-group-value="<%= @board.id %>" data-sortable-url-value="<%= card_path(":id") %>">
     <% @board_columns.each do |board_column| %>
       <%= render partial: 'board_columns/board_column', locals: { board_column: board_column } %>
     <% end %>

config/routes.rb

@@ -2,11 +2,7 @@
   root "boards#index"
 
   resources :boards, shallow: true do
-    resources :board_columns, except: [ :index, :show ] do
-      member do
-        put :update_card_positions
-      end
-    end
+    resources :board_columns, except: [ :index, :show ]
   end
 
   resources :cards,  except: [ :index ]