Lint code

frontend/src/components/contextmenu.svelte

@@ -50,7 +50,7 @@
 <svelte:window on:keydown={keydown} />
 
 {#if items && position}
-  <div class="backdrop" on:pointerdown={close}></div>
+  <div class="backdrop" on:pointerdown={close} />
   <nav>
     <ul class="contextmenu" role="" style:left="{position[0]}px" style:top="{position[1]}px">
       {#each items as item, index}

frontend/src/components/editors/codeeditor.svelte

@@ -40,7 +40,7 @@
   });
 </script>
 
-<div bind:this={editorParent} class="editor"></div>
+<div bind:this={editorParent} class="editor" />
 
 <style>
   .editor {

frontend/src/components/editors/datepicker.svelte

@@ -1,5 +1,5 @@
 <script>
-  import { daysAbbr, months } from '$lib/constants';
+  import { daysAbbr, months } from '$lib/constants.js';
   import { addDays, getWeek, isDate, isSameDay, startOfWeek } from 'date-fns';
   import { onMount } from 'svelte';
   import Clock from '../clock.svelte';
@@ -97,7 +97,7 @@
       <table class="calendar">
         <thead>
           <tr>
-            <th></th>
+            <th />
             {#each daysAbbr as dayName}
               <th>{dayName}</th>
             {/each}

frontend/src/components/editors/directorychooser.svelte

@@ -1,5 +1,5 @@
 <script>
-  import { OpenDirectory } from '$wails/go/ui/UI';
+  import { OpenDirectory } from '$wails/go/ui/UI.js';
 
   export let value = '';
   export let id = '';
@@ -10,7 +10,13 @@
   }
 </script>
 
-<input type="text" on:pointerdown={selectDir} readonly {id} {value} />
+<input
+  type="text"
+  on:pointerdown={selectDir}
+  readonly
+  {id}
+  {value}
+/>
 
 <style>
   input {

frontend/src/components/editors/forminput.svelte

@@ -1,6 +1,6 @@
 <script>
-  import input from '$lib/actions/input';
-  import { canBeObjectId, numericInputTypes } from '$lib/mongo';
+  import input from '$lib/actions/input.js';
+  import { canBeObjectId, numericInputTypes } from '$lib/mongo.js';
   import { ObjectId } from 'bson';
   import { onMount } from 'svelte';
   import Datepicker from './datepicker.svelte';
@@ -70,7 +70,12 @@
 <div class="forminput {type}">
   <div class="field">
     {#if type === 'string'}
-      <input type="text" bind:value use:input={{ type, onValid, onInvalid, mandatory, autofocus }} autocomplete="off" spellcheck="false" />
+      <input
+        type="text"
+        bind:value
+        use:input={{ type, onValid, onInvalid, mandatory, autofocus }}
+        autocomplete="off"
+        spellcheck="false" />
     {:else if type === 'objectid'}
       <input
         type="text"
@@ -79,7 +84,11 @@
         use:input={{ type, onValid, onInvalid, mandatory, autofocus }}
       />
     {:else if numericInputTypes.includes(type)}
-      <input type="number" bind:value use:input={{ type, onValid, onInvalid, mandatory, autofocus }} />
+      <input
+        type="number"
+        bind:value
+        use:input={{ type, onValid, onInvalid, mandatory, autofocus }}
+      />
     {:else if type === 'bool'}
       <select bind:value on:change={selectChange} bind:this={selectInput}>
         <option value={undefined} disabled={mandatory}>Unset</option>
@@ -98,18 +107,38 @@
           <Icon name="edit" />
         </button>
       {/if}
-      <button class="button-small" type="button" title="Generate random object id" on:click={generateObjectId}>
+      <button
+        class="button-small"
+        type="button"
+        title="Generate random object id"
+        on:click={generateObjectId}
+      >
         <Icon name="reload" />
       </button>
     {:else if type === 'date'}
-      <button class="button-small" type="button" title="Edit date" on:click={() => showDatepicker = true}>
+      <button
+        class="button-small"
+        type="button"
+        title="Edit date"
+        on:click={() => showDatepicker = true}
+      >
         <Icon name="edit" />
       </button>
-      <button class="button-small" type="button" title="Set date to now" on:click={() => value = new Date()}>
+      <button
+        class="button-small"
+        type="button"
+        title="Set date to now"
+        on:click={() => value = new Date()}
+      >
         <Icon name="o" />
       </button>
     {/if}
-    <button class="button-small" type="button" title="Reset field to default value" on:click={() => value = undefined}>
+    <button
+      class="button-small"
+      type="button"
+      title="Reset field to default value"
+      on:click={() => value = undefined}
+    >
       <Icon name="trash" />
     </button>
   </div>

frontend/src/components/editors/objecteditor.svelte

@@ -7,9 +7,7 @@
   export let editor = undefined;
   export let readonly = false;
 
-  const extensions = [
-    javascript(),
-  ];
+  const extensions = [ javascript() ];
 
   onMount(() => {
     editor.dispatch({

frontend/src/components/grid/grid-items.svelte

@@ -1,6 +1,6 @@
 <script>
-  import { pathsAreEqual, resolveKeypath, setValue } from '$lib/objects';
-  import contextMenu from '$lib/stores/contextmenu';
+  import { pathsAreEqual, resolveKeypath, setValue } from '$lib/objects.js';
+  import contextMenu from '$lib/stores/contextmenu.js';
   import { createEventDispatcher } from 'svelte';
   import FormInput from '$components/editors/forminput.svelte';
   import Icon from '$components/icon.svelte';
@@ -131,7 +131,7 @@
     on:dblclick={() => doubleClick(item[key], index)}
     on:contextmenu|preventDefault={evt => showContextMenu(evt, item)}
     class:selectable={canSelect}
-    class:selected={canSelect && pathsAreEqual(activePath, [ ...path, item[key] ])}
+    class:selected={canSelect && pathsAreEqual(activePath, ...path, item[key])}
     class:striped
   >
     {#if !hideChildrenToggles}
@@ -157,7 +157,11 @@
     {#each columns as column, columnIndex}
       <td class:right={column.right} title={keypathProxies[index][column.key]}>
         {#if column.inputType}
-          <FormInput {column} bind:value={keypathProxies[index][column.key]} bind:valid={validity[columnIndex]} />
+          <FormInput
+            {column}
+            bind:value={keypathProxies[index][column.key]}
+            bind:valid={validity[columnIndex]}
+          />
         {:else}
           <div class="value" style:margin-left="{level * 10}px">
             {formatValue(keypathProxies[index][column.key])}
@@ -168,7 +172,12 @@
 
     {#if canRemoveItems}
       <td class="has-button">
-        <button class="button-small" type="button" on:click|stopPropagation={() => removeItem(index, item[key])} on:dblclick|stopPropagation>
+        <button
+          class="button-small"
+          type="button"
+          on:click|stopPropagation={() => removeItem(index, item[key])}
+          on:dblclick|stopPropagation
+        >
           <Icon name="x" />
         </button>
       </td>

frontend/src/components/grid/grid.svelte

@@ -57,17 +57,17 @@
         <thead>
           <tr>
             {#if !hideChildrenToggles}
-              <th class="has-toggle"></th>
+              <th class="has-toggle" />
             {/if}
 
-            <th class="has-icon"></th>
+            <th class="has-icon" />
 
             {#each columns as column}
               <th scope="col">{column.title || ''}</th>
             {/each}
 
             {#if canRemoveItems}
-              <th class="has-button"></th>
+              <th class="has-button" />
             {/if}
           </tr>
         </thead>

frontend/src/components/grid/objectgrid.svelte

@@ -1,5 +1,5 @@
 <script>
-  import { isBsonBuiltin } from '$lib/mongo';
+  import { isBsonBuiltin } from '$lib/mongo.js';
   import { isDate } from 'date-fns';
   import Grid from './grid.svelte';
 
@@ -22,7 +22,6 @@
   ].filter(c => !!c);
 
   $: if (data) {
-    // items = dissectObject(data).map(item => ({ ...item, menu: getRootMenu(item.key, item) }));
     items = [];
 
     if (Array.isArray(data)) {

frontend/src/components/modal.svelte

@@ -3,7 +3,7 @@
 </script>
 
 <script>
-  import { Beep } from '$wails/go/ui/UI';
+  import { Beep } from '$wails/go/ui/UI.js';
   import { createEventDispatcher } from 'svelte';
   import Icon from './icon.svelte';
 

frontend/src/components/objectviewer.svelte

@@ -1,5 +1,5 @@
 <script>
-  import { looseJsonIsValid } from '$lib/strings';
+  import { looseJsonIsValid } from '$lib/strings.js';
   import { EJSON } from 'bson';
   import { createEventDispatcher, onDestroy } from 'svelte';
   import Icon from './icon.svelte';