Upgrade dependencies, enabled Svelte ESLint rules

Author: KieranP

.vscode/settings.json

@@ -1,8 +1,49 @@
 {
-  "search.exclude": {
-      "**/.git": true,
-      "**/node_modules": true,
-      "**/public": true,
-      "**/tmp": true
-  }
+  // Editor
+  "editor.formatOnSave": false,
+  "editor.insertSpaces": true,
+  "editor.renderWhitespace": "trailing",
+  "editor.tabSize": 2,
+
+  // Files
+  "files.associations": {
+    "*.svelte": "svelte"
+  },
+  "files.defaultLanguage": "${activeEditorLanguage}",
+  "files.exclude": {
+    "**/.svelte-kit": true,
+    "**/.yarn": true,
+  },
+  "files.insertFinalNewline": true,
+  "files.trimFinalNewlines": true,
+  "files.trimTrailingWhitespace": true,
+
+  // Search
+  "search.useIgnoreFiles": true,
+
+  // Extensions
+  "eslint.validate": [
+    "javascript",
+    "typescript",
+    "svelte"
+  ],
+  "svelte.enable-ts-plugin": true,
+
+  // File Specific
+  "[javascript]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode",
+    "editor.formatOnSave": true
+  },
+  "[scss]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode",
+    "editor.formatOnSave": true
+  },
+  "[svelte]": {
+    "editor.defaultFormatter": "svelte.svelte-vscode",
+    "editor.formatOnSave": true
+  },
+  "[typescript]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode",
+    "editor.formatOnSave": true
+  },
 }

.yarn/install-state.gz

@@ -4,4 +4,4 @@ enableGlobalCache: false
 
 nodeLinker: node-modules
 
-yarnPath: .yarn/releases/yarn-4.5.3.cjs
+yarnPath: .yarn/releases/yarn-4.6.0.cjs

.yarn/releases/yarn-4.5.3.cjs renamed to .yarn/releases/yarn-4.6.0.cjs

@@ -86,7 +86,7 @@ GEM
     bindex (0.8.1)
     bootsnap (1.18.4)
       msgpack (~> 1.2)
-    brakeman (6.2.2)
+    brakeman (7.0.0)
       racc
     builder (3.3.0)
     bundler-audit (0.9.2)
@@ -113,7 +113,7 @@ GEM
       activerecord (>= 5.a)
       database_cleaner-core (~> 2.0.0)
     database_cleaner-core (2.0.1)
-    database_consistency (2.0.2)
+    database_consistency (2.0.3)
       activerecord (>= 3.2)
     date (3.4.1)
     debug (1.10.0)
@@ -134,7 +134,7 @@ GEM
       logger
       zeitwerk (~> 2.6)
     dry-inflector (1.1.0)
-    dry-initializer (3.1.1)
+    dry-initializer (3.2.0)
     dry-logic (1.5.0)
       concurrent-ruby (~> 1.0)
       dry-core (~> 1.0, < 2)
@@ -169,7 +169,9 @@ GEM
       i18n (>= 1.8.11, < 2)
     fasterer (0.11.0)
       ruby_parser (>= 3.19.1)
-    ffi (1.17.0)
+    ffi (1.17.1)
+    ffi (1.17.1-arm-linux-gnu)
+    ffi (1.17.1-arm-linux-musl)
     fiber-storage (1.0.0)
     foreman (0.88.1)
     fugit (1.11.1)
@@ -205,7 +207,7 @@ GEM
       rb-fsevent (~> 0.10, >= 0.10.3)
       rb-inotify (~> 0.9, >= 0.9.10)
     logger (1.6.4)
-    loofah (2.23.1)
+    loofah (2.24.0)
       crass (~> 1.0.2)
       nokogiri (>= 1.12.0)
     mail (2.8.1)
@@ -228,9 +230,13 @@ GEM
       timeout
     net-smtp (0.5.0)
     nio4r (2.7.4)
-    nokogiri (1.18.0)
+    nokogiri (1.18.1)
       mini_portile2 (~> 2.8.2)
       racc (~> 1.4)
+    nokogiri (1.18.1-arm-linux-gnu)
+      racc (~> 1.4)
+    nokogiri (1.18.1-arm-linux-musl)
+      racc (~> 1.4)
     ostruct (0.6.1)
     parallel (1.26.3)
     parser (3.3.6.0)
@@ -427,6 +433,8 @@ GEM
     zeitwerk (2.7.1)
 
 PLATFORMS
+  arm-linux-gnu
+  arm-linux-musl
   ruby
 
 DEPENDENCIES

.yarnrc.yml

@@ -12,7 +12,7 @@
 
   let dialog: HTMLDivElement | undefined = $state()
 
-  function confirm() {
+  function confirm(): void {
     if (!dialog) return
 
     const modal = Modal.getInstance(dialog)
@@ -22,33 +22,33 @@
 </script>
 
 <div
-  class="modal fade"
-  id="confirmDialog"
   bind:this={dialog}
+  id="confirmDialog"
+  class="modal fade"
 >
   <div class="modal-dialog">
     <div class="modal-content">
       <div class="modal-header">
         <h5 class="modal-title">{title}</h5>
         <button
-          type="button"
           class="btn-close"
-          data-bs-dismiss="modal"
           aria-label="Close"
+          data-bs-dismiss="modal"
+          type="button"
         ></button>
       </div>
       <div class="modal-footer">
         <button
-          type="button"
           class="btn btn-secondary"
           data-bs-dismiss="modal"
+          type="button"
         >
           {$_('components.confirm.cancel')}
         </button>
         <button
-          type="button"
           class="btn btn-danger"
           onclick={confirm}
+          type="button"
         >
           {$_('components.confirm.proceed')}
         </button>

Gemfile.lock

@@ -11,7 +11,7 @@
 </script>
 
 {#if $errors.length > 0}
-  {#each $errors as error}
+  {#each $errors as error (error)}
     <div
       class="alert alert-danger"
       role="alert"

app/frontend/lib/components/confirm.svelte

@@ -10,29 +10,29 @@
     <ul class="navbar-nav me-auto">
       <li class="nav-item">
         <a
-          href="/"
           class="nav-link"
           class:active={$page.url.pathname === '/index'}
+          href="/"
         >
           {$_('components.nav.home')}
         </a>
       </li>
 
       <li class="nav-item">
         <a
-          href="/about"
           class="nav-link"
           class:active={$page.url.pathname === '/about'}
+          href="/about"
         >
           {$_('components.nav.about')}
         </a>
       </li>
 
       <li class="nav-item">
         <a
-          href="/posts"
           class="nav-link"
           class:active={$page.url.pathname === '/posts'}
+          href="/posts"
         >
           {$_('components.nav.posts')}
         </a>
@@ -43,38 +43,38 @@
       {#if $session.user}
         <li class="nav-item">
           <a
-            href="/users/{$session.user.uuid}"
             class="nav-link"
             class:active={$page.url.pathname === '/users'}
+            href="/users/{$session.user.uuid}"
           >
             {$session.user.name}
           </a>
         </li>
 
         <li class="nav-item">
           <a
-            href="/logout"
             class="nav-link"
+            href="/logout"
           >
             {$_('components.nav.logout')}
           </a>
         </li>
       {:else}
         <li class="nav-item">
           <a
-            href="/login"
             class="nav-link"
             class:active={$page.url.pathname === '/login'}
+            href="/login"
           >
             {$_('components.nav.login')}
           </a>
         </li>
 
         <li class="nav-item">
           <a
-            href="/users/new"
             class="nav-link"
             class:active={$page.url.pathname === '/users/new'}
+            href="/users/new"
           >
             {$_('components.nav.signup')}
           </a>

app/frontend/lib/components/errors.svelte

@@ -11,15 +11,15 @@
 
   const { pageInfo }: Props = $props()
 
-  function prev() {
+  function prev(): void {
     const queryParams = new URLSearchParams(window.location.search)
     queryParams.set('before', pageInfo.startCursor)
     queryParams.delete('after')
 
     void goto(`${window.location.pathname}?${queryParams.toString()}`)
   }
 
-  function next() {
+  function next(): void {
     const queryParams = new URLSearchParams(window.location.search)
     queryParams.set('after', pageInfo.endCursor)
     queryParams.delete('before')
@@ -30,17 +30,19 @@
 
 {#if pageInfo.hasPreviousPage}
   <button
-    onclick={prev}
     class="btn btn-outline-secondary btn-sm"
+    onclick={prev}
+    type="button"
   >
     {$_('components.pager.prev')}
   </button>
 {/if}
 
 {#if pageInfo.hasNextPage}
   <button
-    onclick={next}
     class="btn btn-outline-secondary btn-sm"
+    onclick={next}
+    type="button"
   >
     {$_('components.pager.next')}
   </button>

app/frontend/lib/components/nav.svelte

@@ -20,6 +20,6 @@
 </script>
 
 <canvas
-  id="qrcode"
   bind:this={canvas}
+  id="qrcode"
 ></canvas>