--no-edit

Author: Vondry

.eslintrc.js

@@ -21,6 +21,12 @@ jobs:
           - name: Lint on SCSS files
             run: npm run stylelint
 
+          - name: UI Unit Tests
+            run: npm run test:run
+
+          - name: Type Check
+            run: npm run typecheck
+
     name: ${{ matrix.actions.name }}
     runs-on: ubuntu-latest
 

.github/workflows/assets_code_analysis.yaml

@@ -3,9 +3,39 @@
     "stylelint-config-standard",
     "stylelint-config-recommended-scss"
   ],
-  "syntax": "scss",
+  "customSyntax": "postcss-scss",
+  "ignoreFiles": [
+    "assets/scss/vendor/**/*.scss"
+  ],
   "plugins": ["stylelint-scss"],
   "rules": {
-    "no-descending-specificity": null
+    "alpha-value-notation": null,
+    "color-function-alias-notation": null,
+    "color-function-notation": null,
+    "custom-property-pattern": null,
+    "declaration-block-no-redundant-longhand-properties": null,
+    "font-family-name-quotes": null,
+    "function-url-quotes": null,
+    "import-notation": null,
+    "keyframes-name-pattern": null,
+    "no-descending-specificity": null,
+    "no-invalid-position-at-import-rule": null,
+    "number-max-precision": null,
+    "property-no-deprecated": null,
+    "property-no-vendor-prefix": null,
+    "scss/at-extend-no-missing-placeholder": null,
+    "scss/comment-no-empty": null,
+    "scss/load-no-partial-leading-underscore": null,
+    "scss/load-partial-extension": null,
+    "scss/no-global-function-names": null,
+    "scss/operator-no-unspaced": null,
+    "selector-attribute-quotes": null,
+    "selector-class-pattern": null,
+    "selector-id-pattern": null,
+    "selector-not-notation": null,
+    "shorthand-property-no-redundant-values": null,
+    "unit-no-unknown": null,
+    "value-keyword-case": null,
+    "value-no-vendor-prefix": null
   }
 }

.stylelintrc

@@ -14,10 +14,10 @@ record_id = JSON.stringify(record_id);
 /**
  * Start of Ajaxy solution for saving
  */
-$(document).ready(function() {
+$(document).ready(function () {
     let unsaved = false;
 
-    $(form).change(function() {
+    $(form).change(function () {
         //triggers change in all input fields including text type
         unsaved = true;
     });
@@ -48,13 +48,13 @@ $(document).ready(function() {
         $('#toastType').append(toastType);
         $('#toastBody').append(toastMessage);
 
-        $(document).ready(function() {
+        $(document).ready(function () {
             let toastElList = [].slice.call(document.querySelectorAll('.toast'));
-            let toastList = toastElList.map(function(toastEl) {
+            let toastList = toastElList.map(function (toastEl) {
                 return new Toast(toastEl, []);
             });
 
-            toastList.forEach(function(toast) {
+            toastList.forEach(function (toast) {
                 toast.show();
             });
         });
@@ -67,25 +67,25 @@ $(document).ready(function() {
 
     // For classic POST: disable only after native HTML5 validation has passed (submit event)
     if (elementSubmit.length) {
-        $(form).on('submit', function() {
+        $(form).on('submit', function () {
             elementSubmit.prop('disabled', true);
         });
     }
 
-    elementButton.on('click', function() {
+    elementButton.on('click', function () {
         elementButton.prop('disabled', true);
         $.ajax({
             type: 'POST',
             link: url,
             data: $(form).serialize(),
-            beforeSend: function() {
+            beforeSend: function () {
                 patience_virtue(elementButton);
             },
-            complete: function() {
+            complete: function () {
                 renable();
                 elementButton.prop('disabled', false);
             },
-            success: function(data, textStatus) {
+            success: function (data, textStatus) {
                 if (!record_id) {
                     window.location.replace(data.url);
                 } else if (window.location.pathname === '/bolt/duplicate/' + duplicate_id) {
@@ -98,7 +98,7 @@ $(document).ready(function() {
                     showToast();
                 }
             },
-            error: function(jq, status, err) {
+            error: function (jq, status, err) {
                 // eslint-disable-next-line no-console
                 console.log(status, err);
                 showToast();

assets/images/bolt_logo_dashboard.svg

@@ -8,7 +8,7 @@ import ClipboardJS from 'clipboard';
 import { version } from '../version';
 window.assetsVersion = version;
 
-$(document).ready(function() {
+$(document).ready(function () {
     // add a js class to indicate we have JS enabled. Might need a change to either modernizr or somethng comparable
     $('html').addClass('js');
 
@@ -20,7 +20,7 @@ $(document).ready(function() {
      */
     $('.admin__sidebar').addClass('admin__sidebar--is-collapsed');
 
-    $('.admin-sidebar-toggler').on('click', function() {
+    $('.admin-sidebar-toggler').on('click', function () {
         if ($('.admin__sidebar').hasClass('admin__sidebar--is-collapsed')) {
             $('.admin__sidebar')
                 .addClass('admin__sidebar--is-expanded')
@@ -52,7 +52,7 @@ $(document).ready(function() {
         }, 50);
     }
 
-    $('a[data-bs-toggle="tab"]').on('click', function() {
+    $('a[data-bs-toggle="tab"]').on('click', function () {
         let newUrl;
         const hash = $(this).attr('href');
         newUrl = url.split('#')[0] + hash;
@@ -62,23 +62,23 @@ $(document).ready(function() {
     /*
      ** Convert all ISO dates with class .datetime-relative to relative time
      */
-    $('.datetime-relative').each(function() {
+    $('.datetime-relative').each(function () {
         $(this).text(DateTime.fromISO($(this).text()).toRelative());
     });
 
     /*
      ** Initialise all popover elements
      */
     let popoverTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="popover"]'));
-    popoverTriggerList.map(function(popoverTriggerEl) {
+    popoverTriggerList.map(function (popoverTriggerEl) {
         return new Popover(popoverTriggerEl);
     });
 
     /*
      ** When a field from another group is invalid, show it.
      */
-    $('#editor button[type="submit"]').click(function() {
-        $('#editor input:invalid').each(function() {
+    $('#editor button[type="submit"]').click(function () {
+        $('#editor input:invalid').each(function () {
             // Find the tab-pane that this element is inside, and get the id
             let $closest = $(this).closest('.tab-pane');
             let id = $closest.attr('id');
@@ -97,20 +97,15 @@ $(document).ready(function() {
      ** Simulates disabled behavior for elements with data-readonly attribute.
      * This is needed, because a disabled input cannot be required.
      */
-    $('[data-readonly]').on('keydown paste', function(e) {
+    $('[data-readonly]').on('keydown paste', function (e) {
         e.preventDefault();
     });
     /* Part of the code above, however make sure flatpickr is not readonly
      * and that its validation works.
      */
-    $('.editor--date')
-        .siblings()
-        .prop('readonly', false)
-        .attr('data-readonly', 'readonly');
-    $('.editor--date').on('change', e => {
-        const target = $(e.target)
-            .parent()
-            .find('input[data-readonly="readonly"]');
+    $('.editor--date').siblings().prop('readonly', false).attr('data-readonly', 'readonly');
+    $('.editor--date').on('change', (e) => {
+        const target = $(e.target).parent().find('input[data-readonly="readonly"]');
         if (target.val()) {
             target[0].setCustomValidity('');
         } else {
@@ -136,15 +131,12 @@ $(document).ready(function() {
     $('[data-errormessage]').on('input', handleInput);
 
     /* Set the errormessage on the correct editor--date field */
-    $('.editor--date').each(function() {
+    $('.editor--date').each(function () {
         let siblings = $(this).siblings();
         const errormessage = $(this).attr('data-errormessage');
 
-        siblings.each(function() {
-            $(this)
-                .attr('data-errormessage', errormessage)
-                .on('invalid', handleInvalid)
-                .on('input', handleInput);
+        siblings.each(function () {
+            $(this).attr('data-errormessage', errormessage).on('invalid', handleInvalid).on('input', handleInput);
         });
     });
     /* End of custom error message */
@@ -161,7 +153,7 @@ $(document).ready(function() {
 
     // Reset the content of a modal to it's default
 
-    window.$(document).on('click', '[data-bs-toggle="modal"]', function(event) {
+    window.$(document).on('click', '[data-bs-toggle="modal"]', function (event) {
         let resourcesModal = document.getElementById('resourcesModal');
 
         let saveButton = document.getElementById('modalButtonAccept');

assets/js/app/ajax-save.js

@@ -8,7 +8,7 @@
                 :checked="value"
                 type="checkbox"
                 :readonly="readonly"
-                @change="liveValue = $event.target.checked"
+                @change="liveValue = ($event.target as HTMLInputElement).checked"
             />
             <label class="custom-control-label form-label" :for="name">{{ label }}</label>
 
@@ -19,36 +19,18 @@
     </div>
 </template>
 
-<script>
-export default {
-    name: 'EditorCheckbox',
-    props: {
-        value: {
-            type: Boolean,
-        },
-        name: {
-            type: String,
-        },
-        id: {
-            type: String,
-        },
-        required: {
-            type: Boolean,
-        },
-        readonly: {
-            type: Boolean,
-        },
-        label: {
-            type: String,
-        },
-        mode: {
-            type: String,
-        },
-    },
-    data() {
-        return {
-            liveValue: this.value,
-        };
-    },
-};
+<script setup lang="ts">
+import { ref } from 'vue';
+
+const props = defineProps<{
+    value?: boolean;
+    name?: string;
+    id?: string;
+    required?: boolean;
+    readonly?: boolean;
+    label?: string;
+    mode?: string;
+}>();
+
+const liveValue = ref(props.value);
 </script>