From 76d42ec1484894d69d4034a172e3010b235f256c Mon Sep 17 00:00:00 2001
From: Johannes Fleck <johannes.fleck@stackable.tech>
Date: Thu, 10 Sep 2026 13:27:25 +0200
Subject: [PATCH 01/12] meta descriptions

---
 messages/de.json          | 1 +
 messages/en.json          | 1 +
 src/routes/+layout.svelte | 5 +++++
 3 files changed, 7 insertions(+)

diff --git a/messages/de.json b/messages/de.json
index 8b0bc0b1..31fd57ea 100644
--- a/messages/de.json
+++ b/messages/de.json
@@ -33,6 +33,7 @@
   "page_title_dashboard": "Dashboard",
   "page_title_default": "Stackable",
   "page_title_suffix": "Stackable",
+  "meta_description": "Stackable Unified Data Platform UI – verwalten Sie Ihre Dateninfrastruktur über eine zentrale Oberfläche.",
   "page_title_trino": "Trino",
   "setup_steps_label": "Einrichtungsschritte",
   "language_label": "Sprache",
diff --git a/messages/en.json b/messages/en.json
index a6ded56d..227b92fe 100644
--- a/messages/en.json
+++ b/messages/en.json
@@ -33,6 +33,7 @@
   "page_title_dashboard": "Dashboard",
   "page_title_default": "Stackable",
   "page_title_suffix": "Stackable",
+  "meta_description": "Stackable Unified Data Platform UI — manage your data infrastructure from a single interface.",
   "page_title_trino": "Trino",
   "setup_steps_label": "Setup steps",
   "language_label": "Language",
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index 3b77780c..6fdca625 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -2,6 +2,7 @@
   import '../app.css';
   import { onMount } from 'svelte';
   import { theme } from '$lib/theme.svelte';
+  import * as m from '$lib/paraglide/messages.js';
 
   let { children } = $props();
 
@@ -19,4 +20,8 @@
   });
 </script>
 
+<svelte:head>
+  <meta name="description" content={m.meta_description()} />
+</svelte:head>
+
 {@render children()}

From 58971954ba425b50656a1a49241ca802533cc03c Mon Sep 17 00:00:00 2001
From: Johannes Fleck <johannes.fleck@stackable.tech>
Date: Thu, 10 Sep 2026 13:32:14 +0200
Subject: [PATCH 02/12] fix contrast ratio

---
 src/app.css | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/src/app.css b/src/app.css
index 30b34902..de0048de 100644
--- a/src/app.css
+++ b/src/app.css
@@ -1,6 +1,16 @@
 @import 'tailwindcss';
 @plugin 'daisyui';
 
+/*
+ * DaisyUI's shipped dark-theme --color-primary (oklch(58% 0.233 277.117)) only reaches
+ * ~3.3:1 contrast against base-100/base-200, failing WCAG AA (4.5:1) for text-primary used
+ * as body text (e.g. active nav labels). This keeps the same hue while satisfying contrast.
+ */
+[data-theme='dark'] {
+  --color-primary: oklch(70% 0.17 277.117);
+  --color-primary-content: oklch(24% 0.12 277.117);
+}
+
 /* Subtle highlight for the currently executing statement in the Monaco editor */
 .highlighted-statement {
   background-color: oklch(from var(--color-primary) l c h / 0.08);

From 521af4f8d116130f0db1597097eb8c0bf9a0082d Mon Sep 17 00:00:00 2001
From: Johannes Fleck <johannes.fleck@stackable.tech>
Date: Thu, 10 Sep 2026 13:35:20 +0200
Subject: [PATCH 03/12] fix aria role

---
 src/lib/components/TabBar.svelte | 122 ++++++++++++++++---------------
 1 file changed, 62 insertions(+), 60 deletions(-)

diff --git a/src/lib/components/TabBar.svelte b/src/lib/components/TabBar.svelte
index 53586b2c..d7f9e351 100644
--- a/src/lib/components/TabBar.svelte
+++ b/src/lib/components/TabBar.svelte
@@ -124,72 +124,74 @@
   }
 </script>
 
-<div class="flex items-end gap-1 overflow-x-auto px-0.5" role="tablist">
-  {#each items as item, index (item.id)}
-    {@const isActive = item.id === activeId}
-    {@const isDragOver =
-      dragOverIndex === index && dragFromIndex !== null && dragFromIndex !== index}
-    <div
-      class="group has-[:focus-visible]:ring-primary flex max-w-56 items-center rounded-t-lg border-x border-t transition-colors has-[:focus-visible]:ring-2
-        {isActive
-        ? 'border-base-300 bg-base-100 text-base-content'
-        : 'bg-base-200/50 text-base-content/60 hover:bg-base-200 hover:text-base-content/80 border-transparent'}
-        {isDragOver ? 'ring-primary ring-2' : ''}"
-    >
-      <button
-        type="button"
-        id="tab-{item.id}"
-        class="flex min-w-0 flex-1 cursor-pointer items-center gap-1 rounded-t-lg px-3 py-1.5 text-sm select-none focus-visible:outline-none"
-        role="tab"
-        aria-selected={isActive}
-        tabindex={isActive ? 0 : -1}
-        draggable={onReorder ? 'true' : 'false'}
-        ondragstart={(e) => handleDragStart(e, index)}
-        ondragover={(e) => handleDragOver(e, index)}
-        ondrop={(e) => handleDrop(e, index)}
-        ondragend={handleDragEnd}
-        onclick={() => onSelect(item.id)}
-        onkeydown={(e) => handleTabKeydown(e, index)}
-        ondblclick={() => startRename(item.id, item.label)}
+<div class="flex items-end gap-1 overflow-x-auto px-0.5">
+  <div class="flex items-end gap-1" role="tablist">
+    {#each items as item, index (item.id)}
+      {@const isActive = item.id === activeId}
+      {@const isDragOver =
+        dragOverIndex === index && dragFromIndex !== null && dragFromIndex !== index}
+      <div
+        class="group has-[:focus-visible]:ring-primary flex max-w-56 items-center rounded-t-lg border-x border-t transition-colors has-[:focus-visible]:ring-2
+          {isActive
+          ? 'border-base-300 bg-base-100 text-base-content'
+          : 'bg-base-200/50 text-base-content/60 hover:bg-base-200 hover:text-base-content/80 border-transparent'}
+          {isDragOver ? 'ring-primary ring-2' : ''}"
       >
-        {#if editingId === item.id}
-          <input
-            bind:this={editInput}
-            bind:value={editValue}
-            class="w-24 min-w-0 border-b border-current bg-transparent text-sm outline-none"
-            aria-label={m.trino_tab_rename()}
-            onblur={commitRename}
-            onkeydown={handleEditKeydown}
-            onclick={(e: MouseEvent) => e.stopPropagation()}
-          />
-        {:else}
-          <span class="truncate">{item.label}</span>
-        {/if}
-      </button>
-
-      {#if showClose && item.closable !== false}
         <button
           type="button"
-          class="btn btn-ghost btn-xs mr-1 h-5 min-h-0 w-5 p-0 opacity-0 group-hover:opacity-100 focus-visible:opacity-100
-            {isActive ? 'opacity-60' : ''}"
+          id="tab-{item.id}"
+          class="flex min-w-0 flex-1 cursor-pointer items-center gap-1 rounded-t-lg px-3 py-1.5 text-sm select-none focus-visible:outline-none"
+          role="tab"
+          aria-selected={isActive}
           tabindex={isActive ? 0 : -1}
-          aria-label={m.trino_tab_close({ name: item.label })}
-          onclick={() => onClose?.(item.id)}
+          draggable={onReorder ? 'true' : 'false'}
+          ondragstart={(e) => handleDragStart(e, index)}
+          ondragover={(e) => handleDragOver(e, index)}
+          ondrop={(e) => handleDrop(e, index)}
+          ondragend={handleDragEnd}
+          onclick={() => onSelect(item.id)}
+          onkeydown={(e) => handleTabKeydown(e, index)}
+          ondblclick={() => startRename(item.id, item.label)}
         >
-          <svg
-            class="h-3 w-3"
-            aria-hidden="true"
-            viewBox="0 0 24 24"
-            fill="none"
-            stroke="currentColor"
-            stroke-width="2"
-            stroke-linecap="round"
-            stroke-linejoin="round"><path d="M18 6 6 18" /><path d="m6 6 12 12" /></svg
-          >
+          {#if editingId === item.id}
+            <input
+              bind:this={editInput}
+              bind:value={editValue}
+              class="w-24 min-w-0 border-b border-current bg-transparent text-sm outline-none"
+              aria-label={m.trino_tab_rename()}
+              onblur={commitRename}
+              onkeydown={handleEditKeydown}
+              onclick={(e: MouseEvent) => e.stopPropagation()}
+            />
+          {:else}
+            <span class="truncate">{item.label}</span>
+          {/if}
         </button>
-      {/if}
-    </div>
-  {/each}
+
+        {#if showClose && item.closable !== false}
+          <button
+            type="button"
+            class="btn btn-ghost btn-xs mr-1 h-5 min-h-0 w-5 p-0 opacity-0 group-hover:opacity-100 focus-visible:opacity-100
+              {isActive ? 'opacity-60' : ''}"
+            tabindex={isActive ? 0 : -1}
+            aria-label={m.trino_tab_close({ name: item.label })}
+            onclick={() => onClose?.(item.id)}
+          >
+            <svg
+              class="h-3 w-3"
+              aria-hidden="true"
+              viewBox="0 0 24 24"
+              fill="none"
+              stroke="currentColor"
+              stroke-width="2"
+              stroke-linecap="round"
+              stroke-linejoin="round"><path d="M18 6 6 18" /><path d="m6 6 12 12" /></svg
+            >
+          </button>
+        {/if}
+      </div>
+    {/each}
+  </div>
 
   {#if onAdd && showAdd}
     <button

From 38e5aefd2762a99d266855486d616e9021edb088 Mon Sep 17 00:00:00 2001
From: Johannes Fleck <johannes.fleck@stackable.tech>
Date: Thu, 10 Sep 2026 14:12:38 +0200
Subject: [PATCH 04/12] fix theme switch flicker

---
 messages/de.json                              |  1 +
 messages/en.json                              |  1 +
 .../layout/header/ThemeToggle.svelte          | 22 ++++++++++++++-----
 3 files changed, 18 insertions(+), 6 deletions(-)

diff --git a/messages/de.json b/messages/de.json
index 31fd57ea..e4002e8e 100644
--- a/messages/de.json
+++ b/messages/de.json
@@ -30,6 +30,7 @@
   "header_user_menu": "Benutzermenü",
   "theme_switch_light": "Zum hellen Modus wechseln",
   "theme_switch_dark": "Zum dunklen Modus wechseln",
+  "theme_toggle": "Design umschalten",
   "page_title_dashboard": "Dashboard",
   "page_title_default": "Stackable",
   "page_title_suffix": "Stackable",
diff --git a/messages/en.json b/messages/en.json
index 227b92fe..92c4e3a5 100644
--- a/messages/en.json
+++ b/messages/en.json
@@ -30,6 +30,7 @@
   "header_user_menu": "User menu",
   "theme_switch_light": "Switch to light mode",
   "theme_switch_dark": "Switch to dark mode",
+  "theme_toggle": "Toggle theme",
   "page_title_dashboard": "Dashboard",
   "page_title_default": "Stackable",
   "page_title_suffix": "Stackable",
diff --git a/src/lib/components/layout/header/ThemeToggle.svelte b/src/lib/components/layout/header/ThemeToggle.svelte
index 9286d392..2733624a 100644
--- a/src/lib/components/layout/header/ThemeToggle.svelte
+++ b/src/lib/components/layout/header/ThemeToggle.svelte
@@ -1,5 +1,6 @@
 <script lang="ts">
   import { browser } from '$app/environment';
+  import { onMount } from 'svelte';
   import * as m from '$lib/paraglide/messages.js';
   import IconLightMode from 'virtual:icons/material-symbols/light-mode';
   import IconDarkMode from 'virtual:icons/material-symbols/dark-mode';
@@ -11,8 +12,14 @@
     return window.matchMedia('(prefers-color-scheme: dark)').matches;
   }
 
+  // Theme is only known clientside so the button is hidden until its state is known
+  let mounted = $state(false);
   let dark = $state(prefersDark());
 
+  onMount(() => {
+    mounted = true;
+  });
+
   $effect(() => {
     if (!browser) return;
     const theme = dark ? 'dark' : 'light';
@@ -24,11 +31,14 @@
 <button
   onclick={() => (dark = !dark)}
   class="btn btn-ghost btn-sm btn-square"
-  aria-label={dark ? m.theme_switch_light() : m.theme_switch_dark()}
+  aria-label={mounted ? (dark ? m.theme_switch_light() : m.theme_switch_dark()) : m.theme_toggle()}
+  disabled={!mounted}
 >
-  {#if dark}
-    <IconLightMode class="h-5 w-5" aria-hidden="true" />
-  {:else}
-    <IconDarkMode class="h-5 w-5" aria-hidden="true" />
-  {/if}
+  <div hidden={!mounted}>
+    {#if dark}
+      <IconLightMode class="h-5 w-5" aria-hidden="true" />
+    {:else}
+      <IconDarkMode class="h-5 w-5" aria-hidden="true" />
+    {/if}
+  </div>
 </button>

From 09fa69aa0cee47717cedabf626f6cde1acf69593 Mon Sep 17 00:00:00 2001
From: Johannes Fleck <johannes.fleck@stackable.tech>
Date: Thu, 10 Sep 2026 14:16:32 +0200
Subject: [PATCH 05/12] svelte check warn

---
 src/lib/components/storage/modals/preview/CsvPreview.svelte | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/lib/components/storage/modals/preview/CsvPreview.svelte b/src/lib/components/storage/modals/preview/CsvPreview.svelte
index 9c0c4090..9281b052 100644
--- a/src/lib/components/storage/modals/preview/CsvPreview.svelte
+++ b/src/lib/components/storage/modals/preview/CsvPreview.svelte
@@ -78,7 +78,7 @@
               <td class="text-base-content/80 max-w-xs truncate text-xs">{row[j] ?? ''}</td>
             {/each}
             {#if extraColumns > 0}
-              <td class="text-base-content/30 max-w-xs truncate text-xs italic" />
+              <td class="text-base-content/30 max-w-xs truncate text-xs italic"></td>
             {/if}
           </tr>
         {/each}

From 56c4d9ced9e86cec97e0b32674652cb35ced5ea5 Mon Sep 17 00:00:00 2001
From: Johannes Fleck <johannes.fleck@stackable.tech>
Date: Thu, 10 Sep 2026 15:26:30 +0200
Subject: [PATCH 06/12] remove obsolete daisy v4 classes

---
 eslint.config.js                              | 10 +++++++-
 .../components/layout/sidebar/Sidebar.svelte  |  2 +-
 .../storage/explorer/ContextMenu.svelte       |  2 +-
 .../storage/explorer/ObjectTable.svelte       |  2 +-
 .../storage/landing/RecentItems.svelte        |  4 +--
 .../storage/landing/StorageConnectForm.svelte | 25 ++++++-------------
 .../connections/[id]/edit/+page.svelte        | 14 +++++------
 src/routes/(app)/trino/+page.svelte           |  4 +--
 8 files changed, 30 insertions(+), 33 deletions(-)

diff --git a/eslint.config.js b/eslint.config.js
index 1e6f8cb6..e8945aa5 100644
--- a/eslint.config.js
+++ b/eslint.config.js
@@ -49,7 +49,15 @@ export default ts.config(
       }
     },
     rules: {
-      'better-tailwindcss/no-unknown-classes': ['warn', { detectComponentClasses: true }]
+      'better-tailwindcss/no-unknown-classes': [
+        'warn',
+        {
+          detectComponentClasses: true,
+          // DaisyUIs nestes selectors are not detected by this rule.
+          // Ignore them to catch outdated classes from DaisyUI v4 Agents seem to love.
+          ignore: ['dropdown-content', 'tab-active', 'swap-on', 'swap-off', 'menu-disabled']
+        }
+      ]
     }
   }
 );
diff --git a/src/lib/components/layout/sidebar/Sidebar.svelte b/src/lib/components/layout/sidebar/Sidebar.svelte
index 2ae05a16..cadad8c8 100644
--- a/src/lib/components/layout/sidebar/Sidebar.svelte
+++ b/src/lib/components/layout/sidebar/Sidebar.svelte
@@ -99,7 +99,7 @@
               onclick={(e) => handleNavClick(e, item)}
               onkeydown={(e) => handleNavKeydown(e, item)}
               title={collapsed ? item.label : undefined}
-              class="flex min-h-[44px] items-center gap-3 rounded-lg px-3 py-2 text-sm font-medium transition-colors
+              class="flex min-h-11 items-center gap-3 rounded-lg px-3 py-2 text-sm font-medium transition-colors
                 {active
                 ? 'bg-primary/10 text-primary'
                 : 'text-base-content/70 hover:bg-base-content/5 hover:text-base-content'}
diff --git a/src/lib/components/storage/explorer/ContextMenu.svelte b/src/lib/components/storage/explorer/ContextMenu.svelte
index 981e88da..22a17fc2 100644
--- a/src/lib/components/storage/explorer/ContextMenu.svelte
+++ b/src/lib/components/storage/explorer/ContextMenu.svelte
@@ -145,7 +145,7 @@
   {#each actions as act (act.key)}
     {#if !act.hidden}
       {@const ActIcon = act.icon}
-      <li role="none" class:menu-disabled={act.disabled}>
+      <li role="none" class={{ 'menu-disabled': act.disabled }}>
         <button
           role="menuitem"
           class="justify-start"
diff --git a/src/lib/components/storage/explorer/ObjectTable.svelte b/src/lib/components/storage/explorer/ObjectTable.svelte
index d97cbd87..b8184942 100644
--- a/src/lib/components/storage/explorer/ObjectTable.svelte
+++ b/src/lib/components/storage/explorer/ObjectTable.svelte
@@ -58,7 +58,7 @@
     <tbody>
       <!-- Parent directory row -->
       {#if storage.prefix}
-        <tr class="hover cursor-pointer" onclick={navigateUp}>
+        <tr class="cursor-pointer" onclick={navigateUp}>
           <td class="pr-0"></td>
           <td colspan={3}>
             <div class="text-base-content/50 flex items-center gap-2">
diff --git a/src/lib/components/storage/landing/RecentItems.svelte b/src/lib/components/storage/landing/RecentItems.svelte
index 58622dfd..f86534a5 100644
--- a/src/lib/components/storage/landing/RecentItems.svelte
+++ b/src/lib/components/storage/landing/RecentItems.svelte
@@ -59,7 +59,7 @@
     </thead>
     <tbody>
       {#each storage.bookmarks.recentFiles as file (file.bucket + '::' + file.key)}
-        <tr class="hover">
+        <tr>
           <td>
             <div class="flex items-center gap-2">
               <IconDescriptionOutline class="text-primary size-4 shrink-0" aria-hidden="true" />
@@ -126,7 +126,7 @@
     </thead>
     <tbody>
       {#each storage.bookmarks.recentLocations as loc (loc.bucket + '::' + loc.prefix)}
-        <tr class="hover">
+        <tr>
           <td>
             <div class="flex items-center gap-2">
               {#if loc.prefix === ''}
diff --git a/src/lib/components/storage/landing/StorageConnectForm.svelte b/src/lib/components/storage/landing/StorageConnectForm.svelte
index af28cf7f..c93c963b 100644
--- a/src/lib/components/storage/landing/StorageConnectForm.svelte
+++ b/src/lib/components/storage/landing/StorageConnectForm.svelte
@@ -109,12 +109,7 @@
           <label for="{uid}-type" class="label mb-1 text-sm font-medium">
             {m.storage_connect_type()}
           </label>
-          <select
-            id="{uid}-type"
-            name="type"
-            class="select-bordered select w-full"
-            bind:value={$form.type}
-          >
+          <select id="{uid}-type" name="type" class="select w-full" bind:value={$form.type}>
             <option value="s3">{m.storage_connect_type_s3()}</option>
             <option value="hdfs" disabled>{m.storage_connect_type_hdfs()}</option>
           </select>
@@ -128,7 +123,7 @@
             id="{uid}-host"
             name="host"
             type="text"
-            class={['input-bordered input w-full', $errors?.host && 'input-error']}
+            class={['input w-full', $errors?.host && 'input-error']}
             placeholder={m.storage_connect_host_placeholder()}
             bind:value={$form.host}
             onblur={parseHostInput}
@@ -148,7 +143,7 @@
             type="number"
             min="1"
             max="65535"
-            class={['input-bordered input w-full', $errors?.port && 'input-error']}
+            class={['input w-full', $errors?.port && 'input-error']}
             placeholder={m.storage_connect_port_placeholder()}
             bind:value={$form.port}
           />
@@ -205,7 +200,7 @@
           <select
             id="{uid}-access-style"
             name="accessStyle"
-            class="select-bordered select w-full"
+            class="select w-full"
             bind:value={$form.accessStyle}
           >
             <option value="Path">{m.storage_connect_access_style_path()}</option>
@@ -221,7 +216,7 @@
             id="{uid}-region"
             name="region.name"
             type="text"
-            class={['input-bordered input w-full', $errors?.region?.name && 'input-error']}
+            class={['input w-full', $errors?.region?.name && 'input-error']}
             bind:value={$form.region.name}
           />
           {#if $errors?.region?.name}
@@ -237,10 +232,7 @@
             id="{uid}-access-key"
             name="credentials.accessKey"
             type="text"
-            class={[
-              'input-bordered input w-full',
-              $errors?.credentials?.accessKey && 'input-error'
-            ]}
+            class={['input w-full', $errors?.credentials?.accessKey && 'input-error']}
             autocomplete="username"
             bind:value={$form.credentials.accessKey}
           />
@@ -257,10 +249,7 @@
             id="{uid}-secret-key"
             name="credentials.secretKey"
             type="password"
-            class={[
-              'input-bordered input w-full',
-              $errors?.credentials?.secretKey && 'input-error'
-            ]}
+            class={['input w-full', $errors?.credentials?.secretKey && 'input-error']}
             autocomplete="current-password"
             bind:value={$form.credentials.secretKey}
           />
diff --git a/src/routes/(app)/storage/connections/[id]/edit/+page.svelte b/src/routes/(app)/storage/connections/[id]/edit/+page.svelte
index 9da8b957..e09ebb98 100644
--- a/src/routes/(app)/storage/connections/[id]/edit/+page.svelte
+++ b/src/routes/(app)/storage/connections/[id]/edit/+page.svelte
@@ -183,7 +183,7 @@
         id="{uid}-name"
         name="name"
         type="text"
-        class="input-bordered input w-full"
+        class="input w-full"
         placeholder={m.storage_connection_edit_name_placeholder()}
         bind:value={$form.name}
       />
@@ -202,7 +202,7 @@
         id="{uid}-host"
         name="host"
         type="text"
-        class={['input-bordered input w-full', $errors?.host && 'input-error']}
+        class={['input w-full', $errors?.host && 'input-error']}
         placeholder={m.storage_connect_host_placeholder()}
         bind:value={$form.host}
         onblur={parseHostInput}
@@ -223,7 +223,7 @@
         type="number"
         min="1"
         max="65535"
-        class={['input-bordered input w-full', $errors?.port && 'input-error']}
+        class={['input w-full', $errors?.port && 'input-error']}
         placeholder={m.storage_connect_port_placeholder()}
         bind:value={$form.port}
       />
@@ -283,7 +283,7 @@
       <select
         id="{uid}-access-style"
         name="accessStyle"
-        class="select-bordered select w-full"
+        class="select w-full"
         bind:value={$form.accessStyle}
       >
         <option value="Path">{m.storage_connect_access_style_path()}</option>
@@ -300,7 +300,7 @@
         id="{uid}-region"
         name="region.name"
         type="text"
-        class={['input-bordered input w-full', $errors?.region?.name && 'input-error']}
+        class={['input w-full', $errors?.region?.name && 'input-error']}
         bind:value={$form.region.name}
       />
       {#if $errors?.region?.name}
@@ -317,7 +317,7 @@
         id="{uid}-access-key"
         name="credentials.accessKey"
         type="text"
-        class={['input-bordered input w-full', $errors?.credentials?.accessKey && 'input-error']}
+        class={['input w-full', $errors?.credentials?.accessKey && 'input-error']}
         autocomplete="username"
         bind:value={$form.credentials.accessKey}
       />
@@ -335,7 +335,7 @@
         id="{uid}-secret-key"
         name="credentials.secretKey"
         type="password"
-        class={['input-bordered input w-full', $errors?.credentials?.secretKey && 'input-error']}
+        class={['input w-full', $errors?.credentials?.secretKey && 'input-error']}
         autocomplete="current-password"
         bind:value={$form.credentials.secretKey}
       />
diff --git a/src/routes/(app)/trino/+page.svelte b/src/routes/(app)/trino/+page.svelte
index d4c01c0c..05b8c990 100644
--- a/src/routes/(app)/trino/+page.svelte
+++ b/src/routes/(app)/trino/+page.svelte
@@ -799,7 +799,7 @@
               <button
                 type="button"
                 class="
-                  rounded-btn hover:bg-primary-content/20 cursor-pointer px-3 py-1.5
+                  rounded-field hover:bg-primary-content/20 cursor-pointer px-3 py-1.5
                   text-left
                   {runMode === 'cursor' ? 'bg-primary-content/15' : ''}"
                 onclick={() => selectRunMode('cursor')}
@@ -809,7 +809,7 @@
               <button
                 type="button"
                 class="
-                  rounded-btn hover:bg-primary-content/20 cursor-pointer px-3 py-1.5
+                  rounded-field hover:bg-primary-content/20 cursor-pointer px-3 py-1.5
                   text-left
                   {runMode === 'all' ? 'bg-primary-content/15' : ''}"
                 onclick={() => selectRunMode('all')}

From 1cc213d577faf945d630f8ad3743c16e5d0acd6c Mon Sep 17 00:00:00 2001
From: Johannes Fleck <johannes.fleck@stackable.tech>
Date: Thu, 10 Sep 2026 15:52:22 +0200
Subject: [PATCH 07/12] mark external links and resolve internal

to make linter happy
---
 src/lib/components/layout/header/UserMenu.svelte | 3 ++-
 src/lib/components/layout/sidebar/nav-items.ts   | 5 +++--
 src/lib/components/trino/StatementResult.svelte  | 2 +-
 src/routes/(app)/trino/+page.svelte              | 2 +-
 4 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/src/lib/components/layout/header/UserMenu.svelte b/src/lib/components/layout/header/UserMenu.svelte
index 0641b735..0fa6322c 100644
--- a/src/lib/components/layout/header/UserMenu.svelte
+++ b/src/lib/components/layout/header/UserMenu.svelte
@@ -1,4 +1,5 @@
 <script lang="ts">
+  import { resolve } from '$app/paths';
   import * as m from '$lib/paraglide/messages.js';
   import IconLogout from 'virtual:icons/material-symbols/logout';
   import type { User } from '$lib/types/auth.js';
@@ -41,7 +42,7 @@
     </li>
     <li><hr class="border-base-300 my-1" /></li>
     <li class="mt-4">
-      <a href="/auth/logout" class="text-sm">
+      <a href={resolve('/auth/logout')} class="text-sm">
         <IconLogout class="h-4 w-4" aria-hidden="true" />
         {m.header_sign_out()}
       </a>
diff --git a/src/lib/components/layout/sidebar/nav-items.ts b/src/lib/components/layout/sidebar/nav-items.ts
index 07b938f1..0ba729ae 100644
--- a/src/lib/components/layout/sidebar/nav-items.ts
+++ b/src/lib/components/layout/sidebar/nav-items.ts
@@ -1,3 +1,4 @@
+import { resolve } from '$app/paths';
 import * as m from '$lib/paraglide/messages.js';
 import type { NavItem, NavSection } from '$lib/types/navigation.js';
 import IconDashboard from 'virtual:icons/material-symbols/dashboard';
@@ -16,7 +17,7 @@ export function getNavSections(flags: NavFlags = {}): NavSection[] {
   const dataToolsItems: NavItem[] = [
     {
       label: m.nav_trino(),
-      href: '/trino',
+      href: resolve('/trino'),
       icon: IconDatabase
     }
   ];
@@ -24,7 +25,7 @@ export function getNavSections(flags: NavFlags = {}): NavSection[] {
   if (storageBrowserEnabled) {
     dataToolsItems.push({
       label: m.nav_storage(),
-      href: '/storage',
+      href: resolve('/storage'),
       icon: IconFolder
     });
   }
diff --git a/src/lib/components/trino/StatementResult.svelte b/src/lib/components/trino/StatementResult.svelte
index ec9f2838..5548e608 100644
--- a/src/lib/components/trino/StatementResult.svelte
+++ b/src/lib/components/trino/StatementResult.svelte
@@ -165,7 +165,7 @@
           <a
             href={result.trinoQueryUrl}
             target="_blank"
-            rel="noopener noreferrer"
+            rel="noopener noreferrer external"
             class="btn btn-ghost btn-xs"
           >
             {m.trino_view_in_trino()}
diff --git a/src/routes/(app)/trino/+page.svelte b/src/routes/(app)/trino/+page.svelte
index 05b8c990..4241f9fb 100644
--- a/src/routes/(app)/trino/+page.svelte
+++ b/src/routes/(app)/trino/+page.svelte
@@ -893,7 +893,7 @@
             <a
               href={runner.currentTrinoQueryUrl}
               target="_blank"
-              rel="noopener noreferrer"
+              rel="noopener noreferrer external"
               class="btn btn-ghost btn-xs"
             >
               {m.trino_view_in_trino()}

From 8a4d5f82d0f6b63b980eae35edc44f33760cfca9 Mon Sep 17 00:00:00 2001
From: Johannes Fleck <johannes.fleck@stackable.tech>
Date: Fri, 11 Sep 2026 12:19:36 +0200
Subject: [PATCH 08/12] make custom classes visible to tailwind

---
 src/app.css | 40 +++++++++++++++++++++-------------------
 1 file changed, 21 insertions(+), 19 deletions(-)

diff --git a/src/app.css b/src/app.css
index de0048de..07487488 100644
--- a/src/app.css
+++ b/src/app.css
@@ -38,27 +38,29 @@ progress.progress::-moz-progress-bar {
  * Visible scrollbars for preview panels. Uses DaisyUI semantic color variables
  * so the thumb adapts to both light and dark themes automatically.
  */
-.preview-scroll {
-  scrollbar-width: thin;
-  /* Use currentColor so Firefox resolves the thumb colour immediately at paint
-     time rather than deferring CSS custom-property resolution. */
-  scrollbar-color: color-mix(in oklch, currentColor 28%, transparent) transparent;
-}
+@layer components {
+  .preview-scroll {
+    scrollbar-width: thin;
+    /* Use currentColor so Firefox resolves the thumb colour immediately at paint
+       time rather than deferring CSS custom-property resolution. */
+    scrollbar-color: color-mix(in oklch, currentColor 28%, transparent) transparent;
+  }
 
-.preview-scroll::-webkit-scrollbar {
-  width: 8px;
-  height: 8px;
-}
+  .preview-scroll::-webkit-scrollbar {
+    width: 8px;
+    height: 8px;
+  }
 
-.preview-scroll::-webkit-scrollbar-track {
-  background: transparent;
-}
+  .preview-scroll::-webkit-scrollbar-track {
+    background: transparent;
+  }
 
-.preview-scroll::-webkit-scrollbar-thumb {
-  background-color: color-mix(in oklch, currentColor 28%, transparent);
-  border-radius: 4px;
-}
+  .preview-scroll::-webkit-scrollbar-thumb {
+    background-color: color-mix(in oklch, currentColor 28%, transparent);
+    border-radius: 4px;
+  }
 
-.preview-scroll::-webkit-scrollbar-thumb:hover {
-  background-color: color-mix(in oklch, currentColor 50%, transparent);
+  .preview-scroll::-webkit-scrollbar-thumb:hover {
+    background-color: color-mix(in oklch, currentColor 50%, transparent);
+  }
 }

From c28eb8b0b227baaaf9a490456da4f3bd151c5606 Mon Sep 17 00:00:00 2001
From: Johannes Fleck <johannes.fleck@stackable.tech>
Date: Fri, 11 Sep 2026 12:49:03 +0200
Subject: [PATCH 09/12] disabled some linter rules locally

---
 e2e/i18n.spec.ts                                                 | 1 +
 e2e/support/global-setup.ts                                      | 1 +
 .../components/storage/modals/preview/PdfPreview.svelte.spec.ts  | 1 +
 .../storage/modals/upload/UploadConflictEntry.svelte.spec.ts     | 1 +
 src/lib/server/trino/client.ts                                   | 1 +
 5 files changed, 5 insertions(+)

diff --git a/e2e/i18n.spec.ts b/e2e/i18n.spec.ts
index 73b9ce29..ec558fd5 100644
--- a/e2e/i18n.spec.ts
+++ b/e2e/i18n.spec.ts
@@ -6,6 +6,7 @@ import { waitForHydration } from './support/helpers';
 /** Load the saved auth storage state, optionally stripping the locale cookie. */
 function loadAuthState(projectName: string, { withoutLocale = false } = {}) {
   const authFile = path.join(import.meta.dirname, `.auth/user-setup-${projectName}.json`);
+  // eslint-disable-next-line security/detect-non-literal-fs-filename
   const state = JSON.parse(fs.readFileSync(authFile, 'utf-8'));
   if (withoutLocale) {
     state.cookies = state.cookies.filter((c: { name: string }) => c.name !== 'PARAGLIDE_LOCALE');
diff --git a/e2e/support/global-setup.ts b/e2e/support/global-setup.ts
index 3754ac1b..d9d992f0 100644
--- a/e2e/support/global-setup.ts
+++ b/e2e/support/global-setup.ts
@@ -1,3 +1,4 @@
+/* eslint-disable security/detect-non-literal-fs-filename */
 import fs from 'node:fs';
 import path from 'path';
 
diff --git a/src/lib/components/storage/modals/preview/PdfPreview.svelte.spec.ts b/src/lib/components/storage/modals/preview/PdfPreview.svelte.spec.ts
index ac061992..9c26765e 100644
--- a/src/lib/components/storage/modals/preview/PdfPreview.svelte.spec.ts
+++ b/src/lib/components/storage/modals/preview/PdfPreview.svelte.spec.ts
@@ -38,6 +38,7 @@ describe('PdfPreview', () => {
     const name = `${faker.system.fileName()}.pdf`;
     render(PdfPreview, { src: 'blob:http://localhost/id', name });
 
+    // eslint-disable-next-line security/detect-non-literal-regexp
     const iframe = page.getByTitle(new RegExp(name.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')));
     await expect.element(iframe).toBeInTheDocument();
   });
diff --git a/src/lib/components/storage/modals/upload/UploadConflictEntry.svelte.spec.ts b/src/lib/components/storage/modals/upload/UploadConflictEntry.svelte.spec.ts
index e6f8aebd..d5fffc04 100644
--- a/src/lib/components/storage/modals/upload/UploadConflictEntry.svelte.spec.ts
+++ b/src/lib/components/storage/modals/upload/UploadConflictEntry.svelte.spec.ts
@@ -53,6 +53,7 @@ describe('UploadConflictEntry', () => {
       const entry = makeEntry({ targetKey: `deep/nested/${longName}` });
       render(UploadConflictEntry, { entry, ...defaultCallbacks });
 
+      // eslint-disable-next-line security/detect-non-literal-regexp
       await expect.element(page.getByText(new RegExp(longName.slice(0, 20)))).toBeInTheDocument();
     });
   });
diff --git a/src/lib/server/trino/client.ts b/src/lib/server/trino/client.ts
index f3787871..a7c2f884 100644
--- a/src/lib/server/trino/client.ts
+++ b/src/lib/server/trino/client.ts
@@ -195,6 +195,7 @@ if (trinoConfigured) {
     dispatcher = new Agent({
       connect: {
         rejectUnauthorized: !tlsInsecure,
+        // eslint-disable-next-line security/detect-non-literal-fs-filename
         ...(tlsCaCertPath ? { ca: readFileSync(tlsCaCertPath) } : {})
       }
     });

From caee9842ef11c42986b1f3aa73be5f7370ca0e67 Mon Sep 17 00:00:00 2001
From: Johannes Fleck <johannes.fleck@stackable.tech>
Date: Fri, 11 Sep 2026 13:53:10 +0200
Subject: [PATCH 10/12] fix resove warn

---
 src/lib/components/layout/sidebar/Sidebar.svelte | 5 +++--
 src/lib/components/layout/sidebar/nav-items.ts   | 7 +++----
 src/lib/types/navigation.ts                      | 3 ++-
 3 files changed, 8 insertions(+), 7 deletions(-)

diff --git a/src/lib/components/layout/sidebar/Sidebar.svelte b/src/lib/components/layout/sidebar/Sidebar.svelte
index cadad8c8..8b517ace 100644
--- a/src/lib/components/layout/sidebar/Sidebar.svelte
+++ b/src/lib/components/layout/sidebar/Sidebar.svelte
@@ -1,4 +1,5 @@
 <script lang="ts">
+  import { resolve } from '$app/paths';
   import { page } from '$app/state';
   import * as m from '$lib/paraglide/messages.js';
   import type { Component } from 'svelte';
@@ -92,10 +93,10 @@
 
       <ul class="flex flex-col gap-1">
         {#each section.items as item (item.label)}
-          {@const active = isActive(item.href)}
+          {@const active = isActive(resolve(item.route))}
           <li>
             <a
-              href={item.href}
+              href={resolve(item.route)}
               onclick={(e) => handleNavClick(e, item)}
               onkeydown={(e) => handleNavKeydown(e, item)}
               title={collapsed ? item.label : undefined}
diff --git a/src/lib/components/layout/sidebar/nav-items.ts b/src/lib/components/layout/sidebar/nav-items.ts
index 0ba729ae..d3988033 100644
--- a/src/lib/components/layout/sidebar/nav-items.ts
+++ b/src/lib/components/layout/sidebar/nav-items.ts
@@ -1,4 +1,3 @@
-import { resolve } from '$app/paths';
 import * as m from '$lib/paraglide/messages.js';
 import type { NavItem, NavSection } from '$lib/types/navigation.js';
 import IconDashboard from 'virtual:icons/material-symbols/dashboard';
@@ -17,7 +16,7 @@ export function getNavSections(flags: NavFlags = {}): NavSection[] {
   const dataToolsItems: NavItem[] = [
     {
       label: m.nav_trino(),
-      href: resolve('/trino'),
+      route: '/trino',
       icon: IconDatabase
     }
   ];
@@ -25,7 +24,7 @@ export function getNavSections(flags: NavFlags = {}): NavSection[] {
   if (storageBrowserEnabled) {
     dataToolsItems.push({
       label: m.nav_storage(),
-      href: resolve('/storage'),
+      route: '/storage',
       icon: IconFolder
     });
   }
@@ -33,7 +32,7 @@ export function getNavSections(flags: NavFlags = {}): NavSection[] {
   return [
     {
       title: m.nav_platform(),
-      items: [{ label: m.nav_dashboard(), href: '/', icon: IconDashboard }]
+      items: [{ label: m.nav_dashboard(), route: '/', icon: IconDashboard }]
     },
     {
       title: m.nav_data_tools(),
diff --git a/src/lib/types/navigation.ts b/src/lib/types/navigation.ts
index cc1d4078..0b534eb5 100644
--- a/src/lib/types/navigation.ts
+++ b/src/lib/types/navigation.ts
@@ -1,8 +1,9 @@
+import type { Pathname } from '$app/types';
 import type { Component } from 'svelte';
 
 export type NavItem = {
   label: string;
-  href: string;
+  route: Pathname;
   icon: Component;
   disabled?: boolean;
   badge?: string;

From a0dcef61e837d0d6ded883ce39c1116ab23f420b Mon Sep 17 00:00:00 2001
From: Johannes Fleck <johannes.fleck@stackable.tech>
Date: Fri, 11 Sep 2026 14:29:08 +0200
Subject: [PATCH 11/12] disable object injection warning for now

---
 eslint.config.js | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/eslint.config.js b/eslint.config.js
index e8945aa5..0dd34152 100644
--- a/eslint.config.js
+++ b/eslint.config.js
@@ -27,7 +27,9 @@ export default ts.config(
       'no-undef': 'off',
       // It will currently also error on external links or links with query parameters
       // https://github.com/sveltejs/eslint-plugin-svelte/issues/1353
-      'svelte/no-navigation-without-resolve': 'warn'
+      'svelte/no-navigation-without-resolve': 'warn',
+      // Too common occurance in this project, disabling for now
+      'security/detect-object-injection': 'off'
     }
   },
   {

From a021c5c26e58adc943708b513d90167dd2a021a7 Mon Sep 17 00:00:00 2001
From: Johannes Fleck <johannes.fleck@stackable.tech>
Date: Fri, 11 Sep 2026 14:31:15 +0200
Subject: [PATCH 12/12] remove deprecated ts config

---
 eslint.config.js | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/eslint.config.js b/eslint.config.js
index 0dd34152..1893c1d0 100644
--- a/eslint.config.js
+++ b/eslint.config.js
@@ -1,6 +1,7 @@
 import prettier from 'eslint-config-prettier';
 import js from '@eslint/js';
 import { includeIgnoreFile } from '@eslint/compat';
+import { defineConfig } from 'eslint/config';
 import svelte from 'eslint-plugin-svelte';
 import betterTailwindcss from 'eslint-plugin-better-tailwindcss';
 import security from 'eslint-plugin-security';
@@ -10,7 +11,7 @@ import ts from 'typescript-eslint';
 
 const gitignorePath = fileURLToPath(new URL('./.gitignore', import.meta.url));
 
-export default ts.config(
+export default defineConfig(
   includeIgnoreFile(gitignorePath),
   { ignores: ['src/lib/editor/generated/**'] },
   js.configs.recommended,