Init project

assets/controllers/news/sortable_controller.js

@@ -0,0 +1,33 @@
+import Sortable from "sortablejs";
+import { Controller } from "@hotwired/stimulus";
+
+export default class extends Controller {
+    static values = {
+        url: String,
+    };
+
+    static targets = ["item"];
+
+    connect() {
+        this.sortable = new Sortable(this.element, {
+            animation: 150,
+            handle: '[data-news--sortable-target="handle"]',
+            onEnd: this.reorder.bind(this),
+        });
+    }
+
+    reorder() {
+        const order = this.itemTargets.map((el, index) => ({
+            id: el.dataset.id,
+            position: index + 1,
+        }));
+
+        fetch(this.urlValue, {
+            method: "POST",
+            headers: {
+                "Content-Type": "application/json",
+            },
+            body: JSON.stringify({ order }),
+        });
+    }
+}