Add new JS linter rules (#17699)

* Add new JS linter rules

Adds a few useful rules from eslint-plugin-github. Notable changes:

- Forbid dataset usage, its camel-casing behaviour makes it hard to
  grep for attributes.
- Forbid .then() and .catch(), we should generally prefer await for new
  code. For rare cases where they are useful, a eslint-disable-line
  directive can be set.
- Add docs js to linting

* also enable github/array-foreach

* small tweak

Co-authored-by: Andrew Thornton <art27@cantab.net>
Co-authored-by: techknowlogick <techknowlogick@gitea.io>
Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>

1 files changed, 40 insertions, 43 deletions

diff --git a/web_src/js/features/repo-projects.js b/web_src/js/features/repo-projects.js
index ef664b4808..d9baa58916 100644
--- a/web_src/js/features/repo-projects.js
+++ b/web_src/js/features/repo-projects.js
@@ -6,57 +6,54 @@ async function initRepoProjectSortable() {
 
   const {Sortable} = await import(/* webpackChunkName: "sortable" */'sortablejs');
   const boardColumns = document.getElementsByClassName('board-column');
-  new Sortable(
-    els[0],
-    {
-      group: 'board-column',
-      draggable: '.board-column',
-      animation: 150,
-      ghostClass: 'card-ghost',
-      onSort: () => {
-        const board = document.getElementsByClassName('board')[0];
-        const boardColumns = board.getElementsByClassName('board-column');
-
-        boardColumns.forEach((column, i) => {
-          if (parseInt($(column).data('sorting')) !== i) {
-            $.ajax({
-              url: $(column).data('url'),
-              data: JSON.stringify({sorting: i, color: rgbToHex($(column).css('backgroundColor'))}),
-              headers: {
-                'X-Csrf-Token': csrfToken,
-                'X-Remote': true,
-              },
-              contentType: 'application/json',
-              method: 'PUT',
-            });
-          }
-        });
-      },
-    },
-  );
 
-  for (const column of boardColumns) {
-    new Sortable(
-      column.getElementsByClassName('board')[0],
-      {
-        group: 'shared',
-        animation: 150,
-        ghostClass: 'card-ghost',
-        onAdd: (e) => {
-          $.ajax(`${e.to.dataset.url}/${e.item.dataset.issue}`, {
+  new Sortable(els[0], {
+    group: 'board-column',
+    draggable: '.board-column',
+    animation: 150,
+    ghostClass: 'card-ghost',
+    onSort: () => {
+      const board = document.getElementsByClassName('board')[0];
+      const boardColumns = board.getElementsByClassName('board-column');
+
+      for (const [i, column] of boardColumns.entries()) {
+        if (parseInt($(column).data('sorting')) !== i) {
+          $.ajax({
+            url: $(column).data('url'),
+            data: JSON.stringify({sorting: i, color: rgbToHex($(column).css('backgroundColor'))}),
             headers: {
               'X-Csrf-Token': csrfToken,
               'X-Remote': true,
             },
             contentType: 'application/json',
-            type: 'POST',
-            error: () => {
-              e.from.insertBefore(e.item, e.from.children[e.oldIndex]);
-            },
+            method: 'PUT',
           });
-        },
+        }
+      }
+    },
+  });
+
+  for (const column of boardColumns) {
+    new Sortable(column.getElementsByClassName('board')[0], {
+      group: 'shared',
+      animation: 150,
+      ghostClass: 'card-ghost',
+      onAdd: ({item, from, to, oldIndex}) => {
+        const url = to.getAttribute('data-url');
+        const issue = item.getAttribute('data-issue');
+        $.ajax(`${url}/${issue}`, {
+          headers: {
+            'X-Csrf-Token': csrfToken,
+            'X-Remote': true,
+          },
+          contentType: 'application/json',
+          type: 'POST',
+          error: () => {
+            from.insertBefore(item, from.children[oldIndex]);
+          },
+        });
       },
-    );
+    });
   }
 }