From 154362613e4c92e47cacda7a4c68eb5376ed91f9 Mon Sep 17 00:00:00 2001
From: RubenPX <rubenmarchante@gmail.com>
Date: Wed, 20 Apr 2022 11:53:51 +0200
Subject: [PATCH 1/7] fix trade lots modal

---
 ereuse_devicehub/templates/inventory/device_list.html | 1 +
 1 file changed, 1 insertion(+)

diff --git a/ereuse_devicehub/templates/inventory/device_list.html b/ereuse_devicehub/templates/inventory/device_list.html
index c7e8c133..10305ac4 100644
--- a/ereuse_devicehub/templates/inventory/device_list.html
+++ b/ereuse_devicehub/templates/inventory/device_list.html
@@ -78,6 +78,7 @@
                   Lots
                   <span class="caret"></span>
                 </button>
+                <span class="d-none" id="activeTradeModal" data-bs-toggle="modal" data-bs-target="#tradeLotModal"></span>
                 <ul class="dropdown-menu" aria-labelledby="btnLots" style="width: 300px;" id="dropDownLotsSelector">
                   <h6 class="dropdown-header">Select some devices to manage lots</h6>
                   <ul style="list-style-type: none; margin: 0; padding: 0;" class="mx-3" id="LotsSelector"></ul>

From e68471d307d45941d25029f2addd40f45774a5fc Mon Sep 17 00:00:00 2001
From: RubenPX <rubenmarchante@gmail.com>
Date: Wed, 20 Apr 2022 11:54:58 +0200
Subject: [PATCH 2/7] Create basic config

---
 .eslintignore                |  4 +++
 .eslintrc.json               | 36 ++++++++++++++++++++++++
 .github/workflows/eslint.yml | 54 ++++++++++++++++++++++++++++++++++++
 .gitignore                   |  8 ++++++
 package.json                 | 30 ++++++++++++++++++++
 5 files changed, 132 insertions(+)
 create mode 100644 .eslintignore
 create mode 100644 .eslintrc.json
 create mode 100644 .github/workflows/eslint.yml
 create mode 100644 package.json

diff --git a/.eslintignore b/.eslintignore
new file mode 100644
index 00000000..416c47b1
--- /dev/null
+++ b/.eslintignore
@@ -0,0 +1,4 @@
+ereuse_devicehub/static/vendor
+ereuse_devicehub/static/js/print.pdf.js
+ereuse_devicehub/static/js/qrcode.js
+*.min.js
\ No newline at end of file
diff --git a/.eslintrc.json b/.eslintrc.json
new file mode 100644
index 00000000..0d9213bb
--- /dev/null
+++ b/.eslintrc.json
@@ -0,0 +1,36 @@
+{
+    "env": {
+        "browser": true,
+        "es2021": true,
+        "jquery": true
+    },
+    "extends": [
+        "airbnb",
+        "prettier"
+    ],
+    "plugins": [
+        "prettier"
+    ],
+    "parserOptions": {
+        "ecmaVersion": "latest"
+    },
+    "rules": {
+        "quotes": ["error","double"],
+        "no-use-before-define": "off",
+        "no-unused-vars": "warn",
+        "no-undef": "warn",
+        "camelcase": "off",
+        "no-console": "off",
+        "no-plusplus": "off",
+        "no-param-reassign": "off",
+        "no-new": "warn",
+        "strict": "off",
+        "class-methods-use-this": "off",
+        "eqeqeq": "warn",
+        "radix": "warn"
+    },
+    "globals": {
+        "API_URLS": true,
+        "Api": true
+    }
+}
\ No newline at end of file
diff --git a/.github/workflows/eslint.yml b/.github/workflows/eslint.yml
new file mode 100644
index 00000000..02bc4c5f
--- /dev/null
+++ b/.github/workflows/eslint.yml
@@ -0,0 +1,54 @@
+# This workflow uses actions that are not certified by GitHub.
+# They are provided by a third-party and are governed by
+# separate terms of service, privacy policy, and support
+# documentation.
+# ESLint is a tool for identifying and reporting on patterns
+# found in ECMAScript/JavaScript code.
+# More details at https://github.com/eslint/eslint
+# and https://eslint.org
+
+name: ESLint
+
+on:
+  push:
+    branches: [master, testing]
+  pull_request:
+    branches: [master, testing]
+
+jobs:
+  build: 
+    runs-on: ubuntu-latest
+    steps:
+    - uses: actions/checkout@v2
+    - uses: actions/setup-node@v1
+      with:
+        node-version: '16'
+    - name: Install dependencies
+      run: npm install
+    - name: Save Code Linting Report JSON
+      # npm script for ESLint
+      # eslint --output-file eslint_report.json --format json src
+      # See https://eslint.org/docs/user-guide/command-line-interface#options
+      run: npm run lint:report
+      # Continue to the next step even if this fails
+      continue-on-error: true
+    - name: Annotate Code Linting Results
+      uses: ataylorme/eslint-annotate-action@1.2.0
+      with:
+        repo-token: "${{ secrets.GITHUB_TOKEN }}"
+        report-json: "eslint_report.json"
+    - name: Run linters
+      uses: wearerequired/lint-action@v1
+      with:
+        eslint: true
+        prettier: false
+        commit_message: "Fix code style issues with ${linter}"
+        auto_fix: true
+        commit: true
+        github_token: "${{ secrets.GITHUB_TOKEN }}"
+        git_name: "Lint Action"
+    - name: Upload ESLint report
+      uses: actions/upload-artifact@v2
+      with:
+        name: eslint_report.json
+        path: eslint_report.json
diff --git a/.gitignore b/.gitignore
index 6a130a6e..0d6f75c3 100644
--- a/.gitignore
+++ b/.gitignore
@@ -119,3 +119,11 @@ ENV/
 
 # Temporal dir
 tmp/
+
+# NPM modules
+node_modules/
+yarn.lock
+
+# ESLint Report
+eslint_report.json
+
diff --git a/package.json b/package.json
new file mode 100644
index 00000000..219a75f4
--- /dev/null
+++ b/package.json
@@ -0,0 +1,30 @@
+{
+  "name": "workspace",
+  "version": "1.0.0",
+  "description": "Devicehub is a distributed IT Asset Management System focused in reusing devices, created under the project [eReuse.org](https://www.ereuse.org)",
+  "main": "index.js",
+  "directories": {
+    "doc": "docs",
+    "example": "examples",
+    "test": "tests"
+  },
+  "devDependencies": {
+    "eslint": "^8.13.0",
+    "eslint-config-airbnb": "^19.0.4",
+    "eslint-config-prettier": "^8.5.0",
+    "eslint-plugin-import": "^2.26.0",
+    "eslint-plugin-prettier": "^4.0.0"
+  },
+  "scripts": {
+    "lint:report": "eslint ereuse_devicehub --ext .js --output-file eslint_report.json --format json",
+    "lint:fix": "eslint ereuse_devicehub --ext .js --fix"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "dependencies": {
+    "eslint-plugin-jsx-a11y": "^6.5.1",
+    "eslint-plugin-react": "^7.29.4",
+    "eslint-plugin-react-hooks": "^4.4.0"
+  }
+}

From b1746421a315e636a083ef7f41ca638d06ea66c5 Mon Sep 17 00:00:00 2001
From: RubenPX <rubenmarchante@gmail.com>
Date: Wed, 20 Apr 2022 11:55:15 +0200
Subject: [PATCH 3/7] add prettier rule

---
 .prettierrc.json | 3 +++
 1 file changed, 3 insertions(+)
 create mode 100644 .prettierrc.json

diff --git a/.prettierrc.json b/.prettierrc.json
new file mode 100644
index 00000000..f92e93ef
--- /dev/null
+++ b/.prettierrc.json
@@ -0,0 +1,3 @@
+{
+    "printWidth": 250
+}
\ No newline at end of file

From fb7b58bbaed50ad9f394ff94785b87ec44308db2 Mon Sep 17 00:00:00 2001
From: RubenPX <rubenmarchante@gmail.com>
Date: Wed, 20 Apr 2022 12:04:18 +0200
Subject: [PATCH 4/7] Change order steps

---
 .github/workflows/eslint.yml | 20 ++++++++++----------
 1 file changed, 10 insertions(+), 10 deletions(-)

diff --git a/.github/workflows/eslint.yml b/.github/workflows/eslint.yml
index 02bc4c5f..6113c185 100644
--- a/.github/workflows/eslint.yml
+++ b/.github/workflows/eslint.yml
@@ -25,6 +25,16 @@ jobs:
         node-version: '16'
     - name: Install dependencies
       run: npm install
+    - name: Run linters
+      uses: wearerequired/lint-action@v1
+      with:
+        eslint: true
+        prettier: false
+        commit_message: "Fix code style issues with ${linter}"
+        auto_fix: true
+        commit: true
+        github_token: "${{ secrets.GITHUB_TOKEN }}"
+        git_name: "Lint Action"
     - name: Save Code Linting Report JSON
       # npm script for ESLint
       # eslint --output-file eslint_report.json --format json src
@@ -37,16 +47,6 @@ jobs:
       with:
         repo-token: "${{ secrets.GITHUB_TOKEN }}"
         report-json: "eslint_report.json"
-    - name: Run linters
-      uses: wearerequired/lint-action@v1
-      with:
-        eslint: true
-        prettier: false
-        commit_message: "Fix code style issues with ${linter}"
-        auto_fix: true
-        commit: true
-        github_token: "${{ secrets.GITHUB_TOKEN }}"
-        git_name: "Lint Action"
     - name: Upload ESLint report
       uses: actions/upload-artifact@v2
       with:

From a51cc9872da122f97979a0306d6ddfb1020cf7bd Mon Sep 17 00:00:00 2001
From: Lint Action <lint-action@samuelmeuli.com>
Date: Wed, 20 Apr 2022 10:04:53 +0000
Subject: [PATCH 5/7] Fix code style issues with ESLint

---
 ereuse_devicehub/static/js/api.js            |  18 +--
 ereuse_devicehub/static/js/create_device.js  |   6 +-
 ereuse_devicehub/static/js/main.js           | 106 +++++++--------
 ereuse_devicehub/static/js/main_inventory.js | 134 +++++++++----------
 4 files changed, 130 insertions(+), 134 deletions(-)

diff --git a/ereuse_devicehub/static/js/api.js b/ereuse_devicehub/static/js/api.js
index ee98a08f..abf6df89 100644
--- a/ereuse_devicehub/static/js/api.js
+++ b/ereuse_devicehub/static/js/api.js
@@ -4,7 +4,7 @@ const Api = {
      * @returns get lots
      */
     async get_lots() {
-        var request = await this.doRequest(API_URLS.lots, "GET", null);
+        const request = await this.doRequest(API_URLS.lots, "GET", null);
         if (request != undefined) return request.items;
         throw request;
     },
@@ -15,7 +15,7 @@ const Api = {
      * @returns full detailed device list
      */
     async get_devices(ids) {
-        var request = await this.doRequest(API_URLS.devices + '?filter={"id": [' + ids.toString() + ']}', "GET", null);
+        const request = await this.doRequest(`${API_URLS.devices  }?filter={"id": [${  ids.toString()  }]}`, "GET", null);
         if (request != undefined) return request.items;
         throw request;
     },
@@ -26,7 +26,7 @@ const Api = {
          * @returns full detailed device list
          */
     async search_device(id) {
-        var request = await this.doRequest(API_URLS.devices + '?filter={"devicehub_id": ["' + id + '"]}', "GET", null)
+        const request = await this.doRequest(`${API_URLS.devices  }?filter={"devicehub_id": ["${  id  }"]}`, "GET", null)
         if (request != undefined) return request.items
         throw request
     },
@@ -37,7 +37,7 @@ const Api = {
      * @param {number[]} listDevices list devices id
      */
     async devices_add(lotID, listDevices) {
-        var queryURL = API_URLS.devices_modify.replace("UUID", lotID) + "?" + listDevices.map(deviceID => "id=" + deviceID).join("&");
+        const queryURL = `${API_URLS.devices_modify.replace("UUID", lotID)  }?${  listDevices.map(deviceID => `id=${  deviceID}`).join("&")}`;
         return await Api.doRequest(queryURL, "POST", null);
     },
 
@@ -47,7 +47,7 @@ const Api = {
      * @param {number[]} listDevices list devices id
      */
     async devices_remove(lotID, listDevices) {
-        var queryURL = API_URLS.devices_modify.replace("UUID", lotID) + "?" + listDevices.map(deviceID => "id=" + deviceID).join("&");
+        const queryURL = `${API_URLS.devices_modify.replace("UUID", lotID)  }?${  listDevices.map(deviceID => `id=${  deviceID}`).join("&")}`;
         return await Api.doRequest(queryURL, "DELETE", null);
     },
 
@@ -59,13 +59,13 @@ const Api = {
      * @returns 
      */
     async doRequest(url, type, body) {
-        var result;
+        let result;
         try {
             result = await $.ajax({
-                url: url,
-                type: type,
+                url,
+                type,
                 headers: { "Authorization": API_URLS.Auth_Token },
-                body: body
+                body
             });
             return result;
         } catch (error) {
diff --git a/ereuse_devicehub/static/js/create_device.js b/ereuse_devicehub/static/js/create_device.js
index 1c9e0655..a1b609b0 100644
--- a/ereuse_devicehub/static/js/create_device.js
+++ b/ereuse_devicehub/static/js/create_device.js
@@ -1,15 +1,15 @@
-$(document).ready(function() {
+$(document).ready(() => {
    $("#type").on("change", deviceInputs);
    deviceInputs();
 })
 
 function deviceInputs() {
-    if ($("#type").val() == 'Monitor') {
+    if ($("#type").val() == "Monitor") {
         $("#screen").show();
         $("#resolution").show();
         $("#imei").hide();
         $("#meid").hide();
-    } else if (['Smartphone', 'Cellphone', 'Tablet'].includes($("#type").val())) {
+    } else if (["Smartphone", "Cellphone", "Tablet"].includes($("#type").val())) {
         $("#screen").hide();
         $("#resolution").hide();
         $("#imei").show();
diff --git a/ereuse_devicehub/static/js/main.js b/ereuse_devicehub/static/js/main.js
index 5eaec3ea..f8a97d3a 100644
--- a/ereuse_devicehub/static/js/main.js
+++ b/ereuse_devicehub/static/js/main.js
@@ -14,9 +14,9 @@
     el = el.trim()
     if (all) {
       return [...document.querySelectorAll(el)]
-    } else {
+    } 
       return document.querySelector(el)
-    }
+    
   }
 
   /**
@@ -34,103 +34,101 @@
    * Easy on scroll event listener
    */
   const onscroll = (el, listener) => {
-    el.addEventListener('scroll', listener)
+    el.addEventListener("scroll", listener)
   }
 
   /**
    * Sidebar toggle
    */
-  if (select('.toggle-sidebar-btn')) {
-    on('click', '.toggle-sidebar-btn', function (e) {
-      select('body').classList.toggle('toggle-sidebar')
+  if (select(".toggle-sidebar-btn")) {
+    on("click", ".toggle-sidebar-btn", (e) => {
+      select("body").classList.toggle("toggle-sidebar")
     })
   }
 
   /**
    * Search bar toggle
    */
-  if (select('.search-bar-toggle')) {
-    on('click', '.search-bar-toggle', function (e) {
-      select('.search-bar').classList.toggle('search-bar-show')
+  if (select(".search-bar-toggle")) {
+    on("click", ".search-bar-toggle", (e) => {
+      select(".search-bar").classList.toggle("search-bar-show")
     })
   }
 
   /**
    * Navbar links active state on scroll
    */
-  let navbarlinks = select('#navbar .scrollto', true)
+  const navbarlinks = select("#navbar .scrollto", true)
   const navbarlinksActive = () => {
-    let position = window.scrollY + 200
+    const position = window.scrollY + 200
     navbarlinks.forEach(navbarlink => {
       if (!navbarlink.hash) return
-      let section = select(navbarlink.hash)
+      const section = select(navbarlink.hash)
       if (!section) return
       if (position >= section.offsetTop && position <= (section.offsetTop + section.offsetHeight)) {
-        navbarlink.classList.add('active')
+        navbarlink.classList.add("active")
       } else {
-        navbarlink.classList.remove('active')
+        navbarlink.classList.remove("active")
       }
     })
   }
-  window.addEventListener('load', navbarlinksActive)
+  window.addEventListener("load", navbarlinksActive)
   onscroll(document, navbarlinksActive)
 
   /**
    * Toggle .header-scrolled class to #header when page is scrolled
    */
-  let selectHeader = select('#header')
+  const selectHeader = select("#header")
   if (selectHeader) {
     const headerScrolled = () => {
       if (window.scrollY > 100) {
-        selectHeader.classList.add('header-scrolled')
+        selectHeader.classList.add("header-scrolled")
       } else {
-        selectHeader.classList.remove('header-scrolled')
+        selectHeader.classList.remove("header-scrolled")
       }
     }
-    window.addEventListener('load', headerScrolled)
+    window.addEventListener("load", headerScrolled)
     onscroll(document, headerScrolled)
   }
 
   /**
    * Back to top button
    */
-  let backtotop = select('.back-to-top')
+  const backtotop = select(".back-to-top")
   if (backtotop) {
     const toggleBacktotop = () => {
       if (window.scrollY > 100) {
-        backtotop.classList.add('active')
+        backtotop.classList.add("active")
       } else {
-        backtotop.classList.remove('active')
+        backtotop.classList.remove("active")
       }
     }
-    window.addEventListener('load', toggleBacktotop)
+    window.addEventListener("load", toggleBacktotop)
     onscroll(document, toggleBacktotop)
   }
 
   /**
    * Initiate tooltips
    */
-  var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'))
-  var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
-    return new bootstrap.Tooltip(tooltipTriggerEl)
-  })
+  const tooltipTriggerList = [].slice.call(document.querySelectorAll("[data-bs-toggle=\"tooltip\"]"))
+  const tooltipList = tooltipTriggerList.map((tooltipTriggerEl) => new bootstrap.Tooltip(tooltipTriggerEl))
 
   /**
    * Initiate quill editors
    */
-  if (select('.quill-editor-default')) {
-    new Quill('.quill-editor-default', {
-      theme: 'snow'
+  if (select(".quill-editor-default")) {
+    new Quill(".quill-editor-default", {
+      theme: "snow"
     });
   }
 
-  if (select('.quill-editor-bubble')) {
-    new Quill('.quill-editor-bubble', {
-      theme: 'bubble'
+  if (select(".quill-editor-bubble")) {
+    new Quill(".quill-editor-bubble", {
+      theme: "bubble"
     });
   }
 
-  if (select('.quill-editor-full')) {
+  if (select(".quill-editor-full")) {
     new Quill(".quill-editor-full", {
       modules: {
         toolbar: [
@@ -181,24 +179,24 @@
   /**
    * Initiate Bootstrap validation check
    */
-  var needsValidation = document.querySelectorAll('.needs-validation')
+  const needsValidation = document.querySelectorAll(".needs-validation")
 
   Array.prototype.slice.call(needsValidation)
-    .forEach(function (form) {
-      form.addEventListener('submit', function (event) {
+    .forEach((form) => {
+      form.addEventListener("submit", (event) => {
         if (!form.checkValidity()) {
           event.preventDefault()
           event.stopPropagation()
         }
 
-        form.classList.add('was-validated')
+        form.classList.add("was-validated")
       }, false)
     })
 
   /**
    * Initiate Datatables
    */
-  const datatables = select('.datatable', true)
+  const datatables = select(".datatable", true)
   datatables.forEach(datatable => {
     new simpleDatatables.DataTable(datatable);
   })
@@ -206,11 +204,11 @@
   /**
    * Autoresize echart charts
    */
-  const mainContainer = select('#main');
+  const mainContainer = select("#main");
   if (mainContainer) {
     setTimeout(() => {
-      new ResizeObserver(function () {
-        select('.echart', true).forEach(getEchart => {
+      new ResizeObserver(() => {
+        select(".echart", true).forEach(getEchart => {
           echarts.getInstanceByDom(getEchart).resize();
         })
       }).observe(mainContainer);
@@ -220,11 +218,11 @@
   /**
    * Select all functionality
    */
-  var btnSelectAll = document.getElementById("SelectAllBTN");
-  var tableListCheckboxes = document.querySelectorAll(".deviceSelect");
+  const btnSelectAll = document.getElementById("SelectAllBTN");
+  const tableListCheckboxes = document.querySelectorAll(".deviceSelect");
 
   function itemListCheckChanged(event) {
-    let isAllChecked = Array.from(tableListCheckboxes).map(itm => itm.checked);
+    const isAllChecked = Array.from(tableListCheckboxes).map(itm => itm.checked);
     if (isAllChecked.every(bool => bool == true)) {
       btnSelectAll.checked = true;
       btnSelectAll.indeterminate = false;
@@ -241,7 +239,7 @@
   })
 
   btnSelectAll.addEventListener("click", event => {
-    let checkedState = event.target.checked;
+    const checkedState = event.target.checked;
     tableListCheckboxes.forEach(ckeckbox => ckeckbox.checked = checkedState);
   })
 
@@ -256,23 +254,23 @@
    * Search form functionality
    */
   window.addEventListener("DOMContentLoaded", () => {
-    var searchForm = document.getElementById("SearchForm")
-    var inputSearch = document.querySelector("#SearchForm > input")
-    var doSearch = true
+    const searchForm = document.getElementById("SearchForm")
+    const inputSearch = document.querySelector("#SearchForm > input")
+    const doSearch = true
 
     searchForm.addEventListener("submit", (event) => {
       event.preventDefault();
     })
 
     let timeoutHandler = setTimeout(() => { }, 1)
-    let dropdownList = document.getElementById("dropdown-search-list")
-    let defaultEmptySearch = document.getElementById("dropdown-search-list").innerHTML
+    const dropdownList = document.getElementById("dropdown-search-list")
+    const defaultEmptySearch = document.getElementById("dropdown-search-list").innerHTML
 
 
     inputSearch.addEventListener("input", (e) => {
       clearTimeout(timeoutHandler)
-      let searchText = e.target.value
-      if (searchText == '') {
+      const searchText = e.target.value
+      if (searchText == "") {
         document.getElementById("dropdown-search-list").innerHTML = defaultEmptySearch;
         return
       }
@@ -315,7 +313,7 @@
               const device = devices[i];
 
               // See: ereuse_devicehub/resources/device/models.py
-              var verboseName = `${device.type} ${device.manufacturer} ${device.model}`
+              const verboseName = `${device.type} ${device.manufacturer} ${device.model}`
 
               const templateString = `
               <li>
diff --git a/ereuse_devicehub/static/js/main_inventory.js b/ereuse_devicehub/static/js/main_inventory.js
index bf2fdf43..4ba8ced2 100644
--- a/ereuse_devicehub/static/js/main_inventory.js
+++ b/ereuse_devicehub/static/js/main_inventory.js
@@ -1,7 +1,7 @@
-$(document).ready(function() {
-    var show_allocate_form = $("#allocateModal").data('show-action-form');
-    var show_datawipe_form = $("#datawipeModal").data('show-action-form');
-    var show_trade_form = $("#tradeLotModal").data('show-action-form');
+$(document).ready(() => {
+    const show_allocate_form = $("#allocateModal").data("show-action-form");
+    const show_datawipe_form = $("#datawipeModal").data("show-action-form");
+    const show_trade_form = $("#tradeLotModal").data("show-action-form");
     if (show_allocate_form != "None") {
         $("#allocateModal .btn-primary").show();
         newAllocate(show_allocate_form);
@@ -18,7 +18,7 @@ $(document).ready(function() {
 })
 
 function deviceSelect() {
-    var devices_count = $(".deviceSelect").filter(':checked').length;
+    const devices_count = $(".deviceSelect").filter(":checked").length;
     get_device_list();
     if (devices_count == 0) {
         $("#addingLotModal .pol").show();
@@ -60,7 +60,7 @@ function deviceSelect() {
 }
 
 function removeLot() {
-    var devices = $(".deviceSelect");
+    const devices = $(".deviceSelect");
     if (devices.length > 0) {
         $("#btnRemoveLots .text-danger").show();
     } else {
@@ -70,10 +70,10 @@ function removeLot() {
 }
 
 function removeTag() {
-    var devices = $(".deviceSelect").filter(':checked');
-    var devices_id = $.map(devices, function(x) { return $(x).attr('data')});
+    const devices = $(".deviceSelect").filter(":checked");
+    const devices_id = $.map(devices, (x) => $(x).attr("data"));
     if (devices_id.length == 1) {
-        var url = "/inventory/tag/devices/"+devices_id[0]+"/del/";
+        const url = `/inventory/tag/devices/${devices_id[0]}/del/`;
         window.location.href = url;
     } else {
         $("#unlinkTagAlertModal").click();
@@ -81,8 +81,8 @@ function removeTag() {
 }
 
 function addTag() {
-    var devices = $(".deviceSelect").filter(':checked');
-    var devices_id = $.map(devices, function(x) { return $(x).attr('data')});
+    const devices = $(".deviceSelect").filter(":checked");
+    const devices_id = $.map(devices, (x) => $(x).attr("data"));
     if (devices_id.length == 1) {
         $("#addingTagModal .pol").hide();
         $("#addingTagModal .btn-primary").show();
@@ -95,20 +95,20 @@ function addTag() {
 }
 
 function newTrade(action) {
-    var title = "Trade "
-    var user_to = $("#user_to").data("email");
-    var user_from = $("#user_from").data("email");
-    if (action == 'user_from') {
-        title = 'Trade Incoming';
-        $("#user_to").attr('readonly', 'readonly');
-        $("#user_from").prop('readonly', false);
-        $("#user_from").val('');
+    let title = "Trade "
+    const user_to = $("#user_to").data("email");
+    const user_from = $("#user_from").data("email");
+    if (action == "user_from") {
+        title = "Trade Incoming";
+        $("#user_to").attr("readonly", "readonly");
+        $("#user_from").prop("readonly", false);
+        $("#user_from").val("");
         $("#user_to").val(user_to);
-    } else if (action == 'user_to') {
-        title = 'Trade Outgoing';
-        $("#user_from").attr('readonly', 'readonly');
-        $("#user_to").prop('readonly', false);
-        $("#user_to").val('');
+    } else if (action == "user_to") {
+        title = "Trade Outgoing";
+        $("#user_from").attr("readonly", "readonly");
+        $("#user_to").prop("readonly", false);
+        $("#user_to").val("");
         $("#user_from").val(user_from);
     }
     $("#tradeLotModal #title-action").html(title);
@@ -137,44 +137,44 @@ function newDataWipe(action) {
 }
 
 function get_device_list() {
-    var devices = $(".deviceSelect").filter(':checked');
+    const devices = $(".deviceSelect").filter(":checked");
 
     /* Insert the correct count of devices in actions form */
-    var devices_count = devices.length;
+    const devices_count = devices.length;
     $("#datawipeModal .devices-count").html(devices_count);
     $("#allocateModal .devices-count").html(devices_count);
     $("#actionModal .devices-count").html(devices_count);
 
     /* Insert the correct value in the input devicesList */
-    var devices_id = $.map(devices, function(x) { return $(x).attr('data')}).join(",");
-    $.map($(".devicesList"), function(x) {
+    const devices_id = $.map(devices, (x) => $(x).attr("data")).join(",");
+    $.map($(".devicesList"), (x) => {
         $(x).val(devices_id);
     });
 
     /* Create a list of devices for human representation */
-    var computer = {
+    const computer = {
         "Desktop": "<i class='bi bi-building'></i>",
         "Laptop": "<i class='bi bi-laptop'></i>",
     };
-    list_devices = devices.map(function (x) {
-        var typ = $(devices[x]).data("device-type");
-        var manuf = $(devices[x]).data("device-manufacturer");
-        var dhid = $(devices[x]).data("device-dhid");
+    list_devices = devices.map((x) => {
+        let typ = $(devices[x]).data("device-type");
+        const manuf = $(devices[x]).data("device-manufacturer");
+        const dhid = $(devices[x]).data("device-dhid");
         if (computer[typ]) {
             typ = computer[typ];
         };
-        return typ + " " + manuf + " " + dhid;
+        return `${typ  } ${  manuf  } ${  dhid}`;
     });
 
-    description = $.map(list_devices, function(x) { return x }).join(", ");
+    description = $.map(list_devices, (x) => x).join(", ");
     $(".enumeration-devices").html(description);
 }
 
 function export_file(type_file) {
-    var devices = $(".deviceSelect").filter(':checked');
-    var devices_id = $.map(devices, function(x) { return $(x).attr('data-device-dhid')}).join(",");
+    const devices = $(".deviceSelect").filter(":checked");
+    const devices_id = $.map(devices, (x) => $(x).attr("data-device-dhid")).join(",");
     if (devices_id){
-        var url = "/inventory/export/"+type_file+"/?ids="+devices_id;
+        const url = `/inventory/export/${type_file}/?ids=${devices_id}`;
         window.location.href = url;
     } else {
         $("#exportAlertModal").click();
@@ -200,11 +200,11 @@ async function processSelectedDevices() {
          */
         manage(event, lotID, deviceListID) {
             event.preventDefault();
-            const indeterminate = event.srcElement.indeterminate;
+            const {indeterminate} = event.srcElement;
             const checked = !event.srcElement.checked;
 
-            var found = this.list.filter(list => list.lotID == lotID)[0];
-            var foundIndex = found != undefined ? this.list.findLastIndex(x => x.lotID == found.lotID) : -1;
+            const found = this.list.filter(list => list.lotID == lotID)[0];
+            const foundIndex = found != undefined ? this.list.findLastIndex(x => x.lotID == found.lotID) : -1;
 
             if (checked) {
                 if (found != undefined && found.type == "Remove") {
@@ -215,10 +215,9 @@ async function processSelectedDevices() {
                         this.list = this.list.filter(list => list.lotID != lotID);
                     }
                 } else {
-                    this.list.push({ type: "Add", lotID: lotID, devices: deviceListID, isFromIndeterminate: indeterminate });
+                    this.list.push({ type: "Add", lotID, devices: deviceListID, isFromIndeterminate: indeterminate });
                 }
-            } else {
-                if (found != undefined && found.type == "Add") {
+            } else if (found != undefined && found.type == "Add") {
                     if (found.isFromIndeterminate == true) {
                         found.type = "Remove";
                         this.list[foundIndex] = found;
@@ -226,9 +225,8 @@ async function processSelectedDevices() {
                         this.list = this.list.filter(list => list.lotID != lotID);
                     }
                 } else {
-                    this.list.push({ type: "Remove", lotID: lotID, devices: deviceListID, isFromIndeterminate: indeterminate });
+                    this.list.push({ type: "Remove", lotID, devices: deviceListID, isFromIndeterminate: indeterminate });
                 }
-            }
 
             if (this.list.length > 0) {
                 document.getElementById("ApplyDeviceLots").classList.remove("disabled");
@@ -244,10 +242,10 @@ async function processSelectedDevices() {
          * @param {boolean} isError defines if a toast is a error
          */
         notifyUser(title, toastText, isError) {
-            let toast = document.createElement("div");
-            toast.classList = "alert alert-dismissible fade show " + (isError ? "alert-danger" : "alert-success");
+            const toast = document.createElement("div");
+            toast.classList = `alert alert-dismissible fade show ${  isError ? "alert-danger" : "alert-success"}`;
             toast.attributes["data-autohide"] = !isError;
-            toast.attributes["role"] = "alert";
+            toast.attributes.role = "alert";
             toast.style = "margin-left: auto; width: fit-content;";
             toast.innerHTML = `<strong>${title}</strong><button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>`;
             if (toastText && toastText.length > 0) {
@@ -265,7 +263,7 @@ async function processSelectedDevices() {
          * Get actions and execute call request to add or remove devices from lots
          */
         doActions() {
-            var requestCount = 0; // This is for count all requested api count, to perform reRender of table device list
+            let requestCount = 0; // This is for count all requested api count, to perform reRender of table device list
             this.list.forEach(async action => {
                 if (action.type == "Add") {
                     try {
@@ -295,13 +293,13 @@ async function processSelectedDevices() {
          * Re-render list in table
          */
         async reRenderTable() {
-            var newRequest = await Api.doRequest(window.location)
+            const newRequest = await Api.doRequest(window.location)
 
-            var tmpDiv = document.createElement("div")
+            const tmpDiv = document.createElement("div")
             tmpDiv.innerHTML = newRequest
 
-            var oldTable = Array.from(document.querySelectorAll("table.table > tbody > tr .deviceSelect")).map(x => x.attributes["data-device-dhid"].value)
-            var newTable = Array.from(tmpDiv.querySelectorAll("table.table > tbody > tr .deviceSelect")).map(x => x.attributes["data-device-dhid"].value)
+            const oldTable = Array.from(document.querySelectorAll("table.table > tbody > tr .deviceSelect")).map(x => x.attributes["data-device-dhid"].value)
+            const newTable = Array.from(tmpDiv.querySelectorAll("table.table > tbody > tr .deviceSelect")).map(x => x.attributes["data-device-dhid"].value)
 
             for (let i = 0; i < oldTable.length; i++) {
                 if (!newTable.includes(oldTable[i])) {
@@ -312,7 +310,7 @@ async function processSelectedDevices() {
         }
     }
 
-    var eventClickActions;
+    let eventClickActions;
 
     /**
      * Generates a list item with a correspondient checkbox state
@@ -324,12 +322,12 @@ async function processSelectedDevices() {
     function templateLot(lotID, lot, selectedDevicesIDs, elementTarget, actions) {
         elementTarget.innerHTML = ""
 
-        var htmlTemplate = `<input class="form-check-input" type="checkbox" id="${lotID}" style="width: 20px; height: 20px; margin-right: 7px;">
+        const htmlTemplate = `<input class="form-check-input" type="checkbox" id="${lotID}" style="width: 20px; height: 20px; margin-right: 7px;">
             <label class="form-check-label" for="${lotID}">${lot.name}</label>`;
 
-        var existLotList = selectedDevicesIDs.map(selected => lot.devices.includes(selected));
+        const existLotList = selectedDevicesIDs.map(selected => lot.devices.includes(selected));
 
-        var doc = document.createElement('li');
+        const doc = document.createElement("li");
         doc.innerHTML = htmlTemplate;
 
         if (selectedDevicesIDs.length <= 0) {
@@ -342,21 +340,21 @@ async function processSelectedDevices() {
             doc.children[0].indeterminate = true;
         }
 
-        doc.children[0].addEventListener('mouseup', (ev) => actions.manage(ev, lotID, selectedDevicesIDs));
+        doc.children[0].addEventListener("mouseup", (ev) => actions.manage(ev, lotID, selectedDevicesIDs));
         elementTarget.append(doc);
     }
 
-    var listHTML = $("#LotsSelector")
+    const listHTML = $("#LotsSelector")
 
     // Get selected devices
-    var selectedDevicesIDs = $.map($(".deviceSelect").filter(':checked'), function (x) { return parseInt($(x).attr('data')) });
+    const selectedDevicesIDs = $.map($(".deviceSelect").filter(":checked"), (x) => parseInt($(x).attr("data")));
     if (selectedDevicesIDs.length <= 0) {
-        listHTML.html('<li style="color: red; text-align: center">No devices selected</li>');
+        listHTML.html("<li style=\"color: red; text-align: center\">No devices selected</li>");
         return;
     }
 
     // Initialize Actions list, and set checkbox triggers
-    var actions = new Actions();
+    const actions = new Actions();
     if (eventClickActions) {
         document.getElementById("ApplyDeviceLots").removeEventListener(eventClickActions);
     }
@@ -364,9 +362,9 @@ async function processSelectedDevices() {
     document.getElementById("ApplyDeviceLots").classList.add("disabled");
 
     try {
-        listHTML.html('<li style="text-align: center"><div class="spinner-border text-info" style="margin: auto" role="status"></div></li>')
-        var devices = await Api.get_devices(selectedDevicesIDs);
-        var lots = await Api.get_lots();
+        listHTML.html("<li style=\"text-align: center\"><div class=\"spinner-border text-info\" style=\"margin: auto\" role=\"status\"></div></li>")
+        const devices = await Api.get_devices(selectedDevicesIDs);
+        let lots = await Api.get_lots();
 
         lots = lots.map(lot => {
             lot.devices = devices
@@ -375,10 +373,10 @@ async function processSelectedDevices() {
             return lot;
         })
 
-        listHTML.html('');
+        listHTML.html("");
         lots.forEach(lot => templateLot(lot.id, lot, selectedDevicesIDs, listHTML, actions));
     } catch (error) {
         console.log(error);
-        listHTML.html('<li style="color: red; text-align: center">Error feching devices and lots<br>(see console for more details)</li>');
+        listHTML.html("<li style=\"color: red; text-align: center\">Error feching devices and lots<br>(see console for more details)</li>");
     }
 }

From 97e931e1650de38a9e498af55fe7056dcebbc5eb Mon Sep 17 00:00:00 2001
From: RubenPX <rubenmarchante@gmail.com>
Date: Wed, 20 Apr 2022 12:09:56 +0200
Subject: [PATCH 6/7] Action failed, fix issues

---
 ereuse_devicehub/static/js/api.js  | 4 ++--
 ereuse_devicehub/static/js/main.js | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/ereuse_devicehub/static/js/api.js b/ereuse_devicehub/static/js/api.js
index abf6df89..190e5d42 100644
--- a/ereuse_devicehub/static/js/api.js
+++ b/ereuse_devicehub/static/js/api.js
@@ -38,7 +38,7 @@ const Api = {
      */
     async devices_add(lotID, listDevices) {
         const queryURL = `${API_URLS.devices_modify.replace("UUID", lotID)  }?${  listDevices.map(deviceID => `id=${  deviceID}`).join("&")}`;
-        return await Api.doRequest(queryURL, "POST", null);
+        return Api.doRequest(queryURL, "POST", null);
     },
 
     /**
@@ -48,7 +48,7 @@ const Api = {
      */
     async devices_remove(lotID, listDevices) {
         const queryURL = `${API_URLS.devices_modify.replace("UUID", lotID)  }?${  listDevices.map(deviceID => `id=${  deviceID}`).join("&")}`;
-        return await Api.doRequest(queryURL, "DELETE", null);
+        return Api.doRequest(queryURL, "DELETE", null);
     },
 
     /**
diff --git a/ereuse_devicehub/static/js/main.js b/ereuse_devicehub/static/js/main.js
index f8a97d3a..55a4951c 100644
--- a/ereuse_devicehub/static/js/main.js
+++ b/ereuse_devicehub/static/js/main.js
@@ -240,7 +240,7 @@
 
   btnSelectAll.addEventListener("click", event => {
     const checkedState = event.target.checked;
-    tableListCheckboxes.forEach(ckeckbox => ckeckbox.checked = checkedState);
+    tableListCheckboxes.forEach(ckeckbox => {ckeckbox.checked = checkedState});
   })
 
   /**

From 8a37217a38edc2759fd9b854eeab1c3a55805dd2 Mon Sep 17 00:00:00 2001
From: Lint Action <lint-action@samuelmeuli.com>
Date: Wed, 20 Apr 2022 10:12:59 +0000
Subject: [PATCH 7/7] Fix code style issues with ESLint

---
 ereuse_devicehub/static/js/main_inventory.js | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/ereuse_devicehub/static/js/main_inventory.js b/ereuse_devicehub/static/js/main_inventory.js
index 36ba13fd..34dd42c3 100644
--- a/ereuse_devicehub/static/js/main_inventory.js
+++ b/ereuse_devicehub/static/js/main_inventory.js
@@ -201,7 +201,7 @@ async function processSelectedDevices() {
         manage(event, lotID, deviceListID) {
             event.preventDefault();
             const srcElement = event.srcElement.parentElement.children[0]
-            const indeterminate = srcElement.indeterminate;
+            const {indeterminate} = srcElement;
             const checked = !srcElement.checked;
 
             const found = this.list.filter(list => list.lotID == lotID)[0];
@@ -340,8 +340,8 @@ async function processSelectedDevices() {
         } else {
             doc.children[0].indeterminate = true;
         }
-        doc.children[0].addEventListener('mouseup', (ev) => actions.manage(ev, lotID, selectedDevicesIDs));
-        doc.children[1].addEventListener('mouseup', (ev) => actions.manage(ev, lotID, selectedDevicesIDs));
+        doc.children[0].addEventListener("mouseup", (ev) => actions.manage(ev, lotID, selectedDevicesIDs));
+        doc.children[1].addEventListener("mouseup", (ev) => actions.manage(ev, lotID, selectedDevicesIDs));
         elementTarget.append(doc);
     }