Ran eslint fix on existing codebase

Had to do some manual fixing of the app.js file due to misplaced
comments

resources/js/services/animations.js

@@ -15,7 +15,7 @@ export function fadeIn(element, animTime = 400, onComplete = null) {
     cleanupExistingElementAnimation(element);
     element.style.display = 'block';
     animateStyles(element, {
-        opacity: ['0', '1']
+        opacity: ['0', '1'],
     }, animTime, () => {
         if (onComplete) onComplete();
     });
@@ -30,7 +30,7 @@ export function fadeIn(element, animTime = 400, onComplete = null) {
 export function fadeOut(element, animTime = 400, onComplete = null) {
     cleanupExistingElementAnimation(element);
     animateStyles(element, {
-        opacity: ['1', '0']
+        opacity: ['1', '0'],
     }, animTime, () => {
         element.style.display = 'none';
         if (onComplete) onComplete();
@@ -125,12 +125,12 @@ export function transitionHeight(element, animTime = 400) {
  */
 function animateStyles(element, styles, animTime = 400, onComplete = null) {
     const styleNames = Object.keys(styles);
-    for (let style of styleNames) {
+    for (const style of styleNames) {
         element.style[style] = styles[style][0];
     }
 
     const cleanup = () => {
-        for (let style of styleNames) {
+        for (const style of styleNames) {
             element.style[style] = null;
         }
         element.style.transition = null;
@@ -141,7 +141,7 @@ function animateStyles(element, styles, animTime = 400, onComplete = null) {
 
     setTimeout(() => {
         element.style.transition = `all ease-in-out ${animTime}ms`;
-        for (let style of styleNames) {
+        for (const style of styleNames) {
             element.style[style] = styles[style][1];
         }
 
@@ -159,4 +159,4 @@ function cleanupExistingElementAnimation(element) {
         const oldCleanup = animateStylesCleanupMap.get(element);
         oldCleanup();
     }
-}
+}

resources/js/services/clipboard.js

@@ -1,4 +1,3 @@
-
 export class Clipboard {
 
     /**
@@ -21,7 +20,7 @@ export class Clipboard {
      * @return {boolean}
      */
     containsTabularData() {
-        const rtfData = this.data.getData( 'text/rtf');
+        const rtfData = this.data.getData('text/rtf');
         return rtfData && rtfData.includes('\\trowd');
     }
 
@@ -30,8 +29,8 @@ export class Clipboard {
      * @return {Array<File>}
      */
     getImages() {
-        const types = this.data.types;
-        const files = this.data.files;
+        const {types} = this.data;
+        const {files} = this.data;
         const images = [];
 
         for (const type of types) {
@@ -49,6 +48,7 @@ export class Clipboard {
 
         return images;
     }
+
 }
 
 export async function copyTextToClipboard(text) {
@@ -58,13 +58,13 @@ export async function copyTextToClipboard(text) {
     }
 
     // Backup option where we can't use the navigator.clipboard API
-    const tempInput = document.createElement("textarea");
-    tempInput.style = "position: absolute; left: -1000px; top: -1000px;";
+    const tempInput = document.createElement('textarea');
+    tempInput.style = 'position: absolute; left: -1000px; top: -1000px;';
     tempInput.value = text;
     document.body.appendChild(tempInput);
     tempInput.select();
-    document.execCommand("copy");
+    document.execCommand('copy');
     document.body.removeChild(tempInput);
 }
 
-export default Clipboard;
+export default Clipboard;

resources/js/services/components.js

@@ -1,4 +1,4 @@
-import {kebabToCamel, camelToKebab} from "./text";
+import {kebabToCamel, camelToKebab} from './text';
 
 /**
  * A mapping of active components keyed by name, with values being arrays of component
@@ -25,12 +25,12 @@ const elementComponentMap = new WeakMap();
  * @param {Element} element
  */
 function initComponent(name, element) {
-    /** @type {Function<Component>|undefined} **/
+    /** @type {Function<Component>|undefined} * */
     const componentModel = componentModelMap[name];
     if (componentModel === undefined) return;
 
     // Create our component instance
-    /** @type {Component} **/
+    /** @type {Component} * */
     let instance;
     try {
         instance = new componentModel();
@@ -46,7 +46,7 @@ function initComponent(name, element) {
     }
 
     // Add to global listing
-    if (typeof components[name] === "undefined") {
+    if (typeof components[name] === 'undefined') {
         components[name] = [];
     }
     components[name].push(instance);
@@ -67,7 +67,7 @@ function parseRefs(name, element) {
     const refs = {};
     const manyRefs = {};
 
-    const prefix = `${name}@`
+    const prefix = `${name}@`;
     const selector = `[refs*="${prefix}"]`;
     const refElems = [...element.querySelectorAll(selector)];
     if (element.matches(selector)) {
@@ -114,7 +114,7 @@ function parseOpts(name, element) {
  * @param {Element|Document} parentElement
  */
 export function init(parentElement = document) {
-    const componentElems = parentElement.querySelectorAll(`[component],[components]`);
+    const componentElems = parentElement.querySelectorAll('[component],[components]');
 
     for (const el of componentElems) {
         const componentNames = `${el.getAttribute('component') || ''} ${(el.getAttribute('components'))}`.toLowerCase().split(' ').filter(Boolean);
@@ -162,4 +162,4 @@ export function get(name) {
 export function firstOnElement(element, name) {
     const elComponents = elementComponentMap.get(element) || {};
     return elComponents[name] || null;
-}
+}

resources/js/services/dates.js

@@ -1,24 +1,23 @@
-
 export function getCurrentDay() {
-    let date = new Date();
-    let month = date.getMonth() + 1;
-    let day = date.getDate();
+    const date = new Date();
+    const month = date.getMonth() + 1;
+    const day = date.getDate();
 
-    return `${date.getFullYear()}-${(month>9?'':'0') + month}-${(day>9?'':'0') + day}`;
+    return `${date.getFullYear()}-${(month > 9 ? '' : '0') + month}-${(day > 9 ? '' : '0') + day}`;
 }
 
 export function utcTimeStampToLocalTime(timestamp) {
-    let date = new Date(timestamp * 1000);
-    let hours = date.getHours();
-    let mins = date.getMinutes();
-    return `${(hours>9?'':'0') + hours}:${(mins>9?'':'0') + mins}`;
+    const date = new Date(timestamp * 1000);
+    const hours = date.getHours();
+    const mins = date.getMinutes();
+    return `${(hours > 9 ? '' : '0') + hours}:${(mins > 9 ? '' : '0') + mins}`;
 }
 
 export function formatDateTime(date) {
-    let month = date.getMonth() + 1;
-    let day = date.getDate();
-    let hours = date.getHours();
-    let mins = date.getMinutes();
+    const month = date.getMonth() + 1;
+    const day = date.getDate();
+    const hours = date.getHours();
+    const mins = date.getMinutes();
 
-    return `${date.getFullYear()}-${(month>9?'':'0') + month}-${(day>9?'':'0') + day} ${(hours>9?'':'0') + hours}:${(mins>9?'':'0') + mins}`;
-}
+    return `${date.getFullYear()}-${(month > 9 ? '' : '0') + month}-${(day > 9 ? '' : '0') + day} ${(hours > 9 ? '' : '0') + hours}:${(mins > 9 ? '' : '0') + mins}`;
+}

resources/js/services/dom.js

@@ -5,7 +5,7 @@
  */
 export function forEach(selector, callback) {
     const elements = document.querySelectorAll(selector);
-    for (let element of elements) {
+    for (const element of elements) {
         callback(element);
     }
 }
@@ -17,7 +17,7 @@ export function forEach(selector, callback) {
  * @param {Function<Event>} callback
  */
 export function onEvents(listenerElement, events, callback) {
-    for (let eventName of events) {
+    for (const eventName of events) {
         listenerElement.addEventListener(eventName, callback);
     }
 }
@@ -35,7 +35,7 @@ export function onSelect(elements, callback) {
 
     for (const listenerElement of elements) {
         listenerElement.addEventListener('click', callback);
-        listenerElement.addEventListener('keydown', (event) => {
+        listenerElement.addEventListener('keydown', event => {
             if (event.key === 'Enter' || event.key === ' ') {
                 event.preventDefault();
                 callback(event);
@@ -58,7 +58,7 @@ export function onEnterPress(elements, callback) {
         if (event.key === 'Enter') {
             callback(event);
         }
-    }
+    };
 
     elements.forEach(e => e.addEventListener('keypress', listener));
 }
@@ -73,7 +73,7 @@ export function onEnterPress(elements, callback) {
  * @param {Function} callback
  */
 export function onChildEvent(listenerElement, childSelector, eventName, callback) {
-    listenerElement.addEventListener(eventName, function(event) {
+    listenerElement.addEventListener(eventName, event => {
         const matchingChild = event.target.closest(childSelector);
         if (matchingChild) {
             callback.call(matchingChild, event, matchingChild);
@@ -91,7 +91,7 @@ export function onChildEvent(listenerElement, childSelector, eventName, callback
 export function findText(selector, text) {
     const elements = document.querySelectorAll(selector);
     text = text.toLowerCase();
-    for (let element of elements) {
+    for (const element of elements) {
         if (element.textContent.toLowerCase().includes(text)) {
             return element;
         }
@@ -105,7 +105,7 @@ export function findText(selector, text) {
  * @param {Element} element
  */
 export function showLoading(element) {
-    element.innerHTML = `<div class="loading-container"><div></div><div></div><div></div></div>`;
+    element.innerHTML = '<div class="loading-container"><div></div><div></div><div></div></div>';
 }
 
 /**
@@ -130,4 +130,4 @@ export function htmlToDom(html) {
     wrap.innerHTML = html;
     window.$components.init(wrap);
     return wrap.children[0];
-}
+}

resources/js/services/drawio.js

@@ -1,6 +1,7 @@
 let iFrame = null;
 let lastApprovedOrigin;
-let onInit, onSave;
+let onInit; let
+    onSave;
 
 /**
  * Show the draw.io editor.
@@ -55,13 +56,15 @@ function drawEventExport(message) {
 }
 
 function drawEventSave(message) {
-    drawPostMessage({action: 'export', format: 'xmlpng', xml: message.xml, spin: 'Updating drawing'});
+    drawPostMessage({
+        action: 'export', format: 'xmlpng', xml: message.xml, spin: 'Updating drawing',
+    });
 }
 
 function drawEventInit() {
     if (!onInit) return;
     onInit().then(xml => {
-        drawPostMessage({action: 'load', autosave: 1, xml: xml});
+        drawPostMessage({action: 'load', autosave: 1, xml});
     });
 }
 
@@ -81,11 +84,11 @@ function drawPostMessage(data) {
 }
 
 async function upload(imageData, pageUploadedToId) {
-    let data = {
+    const data = {
         image: imageData,
         uploaded_to: pageUploadedToId,
     };
-    const resp = await window.$http.post(window.baseUrl(`/images/drawio`), data);
+    const resp = await window.$http.post(window.baseUrl('/images/drawio'), data);
     return resp.data;
 }
 
@@ -107,4 +110,6 @@ async function load(drawingId) {
     }
 }
 
-export default {show, close, upload, load};
+export default {
+    show, close, upload, load,
+};

resources/js/services/events.js

@@ -9,9 +9,9 @@ const stack = [];
 function emit(eventName, eventData) {
     stack.push({name: eventName, data: eventData});
     if (typeof listeners[eventName] === 'undefined') return this;
-    let eventsToStart = listeners[eventName];
+    const eventsToStart = listeners[eventName];
     for (let i = 0; i < eventsToStart.length; i++) {
-        let event = eventsToStart[i];
+        const event = eventsToStart[i];
         event(eventData);
     }
 }
@@ -37,7 +37,7 @@ function listen(eventName, callback) {
 function emitPublic(targetElement, eventName, eventData) {
     const event = new CustomEvent(eventName, {
         detail: eventData,
-        bubbles: true
+        bubbles: true,
     });
     targetElement.dispatchEvent(event);
 }
@@ -69,8 +69,8 @@ export default {
     emit,
     emitPublic,
     listen,
-    success: (msg) => emit('success', msg),
-    error: (msg) => emit('error', msg),
+    success: msg => emit('success', msg),
+    error: msg => emit('error', msg),
     showValidationErrors,
     showResponseError,
-}
+};

resources/js/services/http.js

@@ -1,4 +1,3 @@
-
 /**
  * Perform a HTTP GET request.
  * Can easily pass query parameters as the second parameter.
@@ -63,7 +62,7 @@ async function performDelete(url, data = null) {
  */
 async function dataRequest(method, url, data = null) {
     const options = {
-        method: method,
+        method,
         body: data,
     };
 
@@ -84,7 +83,7 @@ async function dataRequest(method, url, data = null) {
         options.method = 'post';
     }
 
-    return request(url, options)
+    return request(url, options);
 }
 
 /**
@@ -101,7 +100,7 @@ async function request(url, options = {}) {
 
     if (options.params) {
         const urlObj = new URL(url);
-        for (let paramName of Object.keys(options.params)) {
+        for (const paramName of Object.keys(options.params)) {
             const value = options.params[paramName];
             if (typeof value !== 'undefined' && value !== null) {
                 urlObj.searchParams.set(paramName, value);
@@ -111,13 +110,12 @@ async function request(url, options = {}) {
     }
 
     const csrfToken = document.querySelector('meta[name=token]').getAttribute('content');
-    options = Object.assign({}, options, {
-        'credentials': 'same-origin',
-    });
-    options.headers = Object.assign({}, options.headers || {}, {
-        'baseURL': window.baseUrl(''),
+    options = {...options, credentials: 'same-origin'};
+    options.headers = {
+        ...options.headers || {},
+        baseURL: window.baseUrl(''),
         'X-CSRF-TOKEN': csrfToken,
-    });
+    };
 
     const response = await fetch(url, options);
     const content = await getResponseContent(response);
@@ -160,6 +158,7 @@ async function getResponseContent(response) {
 }
 
 class HttpError extends Error {
+
     constructor(response, content) {
         super(response.statusText);
         this.data = content;
@@ -170,13 +169,14 @@ class HttpError extends Error {
         this.url = response.url;
         this.original = response;
     }
+
 }
 
 export default {
-    get: get,
-    post: post,
-    put: put,
-    patch: patch,
+    get,
+    post,
+    put,
+    patch,
     delete: performDelete,
-    HttpError: HttpError,
-};
+    HttpError,
+};

resources/js/services/keyboard-navigation.js

@@ -57,7 +57,6 @@ export class KeyboardNavigationHandler {
      * @param {KeyboardEvent} event
      */
     #keydownHandler(event) {
-
         // Ignore certain key events in inputs to allow text editing.
         if (event.target.matches('input') && (event.key === 'ArrowRight' || event.key === 'ArrowLeft')) {
             return;
@@ -72,7 +71,7 @@ export class KeyboardNavigationHandler {
         } else if (event.key === 'Escape') {
             if (this.onEscape) {
                 this.onEscape(event);
-            } else if  (document.activeElement) {
+            } else if (document.activeElement) {
                 document.activeElement.blur();
             }
         } else if (event.key === 'Enter' && this.onEnter) {
@@ -88,8 +87,9 @@ export class KeyboardNavigationHandler {
         const focusable = [];
         const selector = '[tabindex]:not([tabindex="-1"]),[href],button:not([tabindex="-1"],[disabled]),input:not([type=hidden])';
         for (const container of this.containers) {
-            focusable.push(...container.querySelectorAll(selector))
+            focusable.push(...container.querySelectorAll(selector));
         }
         return focusable;
     }
-}
+
+}

resources/js/services/text.js

@@ -4,7 +4,7 @@
  * @returns {string}
  */
 export function kebabToCamel(kebab) {
-    const ucFirst = (word) => word.slice(0,1).toUpperCase() + word.slice(1);
+    const ucFirst = word => word.slice(0, 1).toUpperCase() + word.slice(1);
     const words = kebab.split('-');
     return words[0] + words.slice(1).map(ucFirst).join('');
 }
@@ -15,5 +15,5 @@ export function kebabToCamel(kebab) {
  * @returns {String}
  */
 export function camelToKebab(camelStr) {
-    return camelStr.replace(/[A-Z]/g, (str, offset) =>  (offset > 0 ? '-' : '') + str.toLowerCase());
-}
+    return camelStr.replace(/[A-Z]/g, (str, offset) => (offset > 0 ? '-' : '') + str.toLowerCase());
+}

resources/js/services/translations.js

@@ -19,7 +19,7 @@ class Translator {
      */
     parseTranslations() {
         const translationMetaTags = document.querySelectorAll('meta[name="translation"]');
-        for (let tag of translationMetaTags) {
+        for (const tag of translationMetaTags) {
             const key = tag.getAttribute('key');
             const value = tag.getAttribute('value');
             this.store.set(key, value);
@@ -64,7 +64,7 @@ class Translator {
         const rangeRegex = /^\[([0-9]+),([0-9*]+)]/;
         let result = null;
 
-        for (let t of splitText) {
+        for (const t of splitText) {
             // Parse exact matches
             const exactMatches = t.match(exactCountRegex);
             if (exactMatches !== null && Number(exactMatches[1]) === count) {

resources/js/services/util.js

@@ -1,5 +1,3 @@
-
-
 /**
  * Returns a function, that, as long as it continues to be invoked, will not
  * be triggered. The function will be called after it stops being called for
@@ -14,7 +12,8 @@
 export function debounce(func, wait, immediate) {
     let timeout;
     return function() {
-        const context = this, args = arguments;
+        const context = this; const
+            args = arguments;
         const later = function() {
             timeout = null;
             if (!immediate) func.apply(context, args);
@@ -24,7 +23,7 @@ export function debounce(func, wait, immediate) {
         timeout = setTimeout(later, wait);
         if (callNow) func.apply(context, args);
     };
-};
+}
 
 /**
  * Scroll and highlight an element.
@@ -55,11 +54,11 @@ export function scrollAndHighlightElement(element) {
  */
 export function escapeHtml(unsafe) {
     return unsafe
-        .replace(/&/g, "&")
-        .replace(/</g, "&lt;")
-        .replace(/>/g, "&gt;")
-        .replace(/"/g, "&quot;")
-        .replace(/'/g, "&#039;");
+        .replace(/&/g, '&amp;')
+        .replace(/</g, '&lt;')
+        .replace(/>/g, '&gt;')
+        .replace(/"/g, '&quot;')
+        .replace(/'/g, '&#039;');
 }
 
 /**
@@ -68,6 +67,6 @@ export function escapeHtml(unsafe) {
  * @returns {string}
  */
 export function uniqueId() {
-    const S4 = () => (((1+Math.random())*0x10000)|0).toString(16).substring(1);
-    return (S4()+S4()+"-"+S4()+"-"+S4()+"-"+S4()+"-"+S4()+S4()+S4());
-}
+    const S4 = () => (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);
+    return (`${S4() + S4()}-${S4()}-${S4()}-${S4()}-${S4()}${S4()}${S4()}`);
+}

resources/js/services/vdom.js

@@ -1,8 +1,8 @@
 import {
     init,
     attributesModule,
-    toVNode
-} from "snabbdom";
+    toVNode,
+} from 'snabbdom';
 
 let patcher;
 
@@ -12,7 +12,6 @@ let patcher;
 function getPatcher() {
     if (patcher) return patcher;
 
-
     patcher = init([
         attributesModule,
     ]);
@@ -28,4 +27,4 @@ export function patchDomFromHtmlString(domTarget, html) {
     const contentDom = document.createElement('div');
     contentDom.innerHTML = html;
     getPatcher()(toVNode(domTarget), toVNode(contentDom));
-}
+}