fix(deps): update typescript-projects (#21510)

* fix(deps): update typescript-projects

* chore: downgrade dependencies

* chore: downgrade svelte-gestures

* fix: svelte/no-navigation-without-resolve

* fix: dumb test

---------

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
Co-authored-by: Zack Pollard <zack@futo.org>
Co-authored-by: Daniel Dietzler <mail@ddietzler.dev>
Co-authored-by: Jason Rasmussen <jason@rasm.me>

mise.toml

@@ -1,7 +1,7 @@
 [tools]
 node = "22.19.0"
 flutter = "3.35.4"
-pnpm = "10.14.0"
+pnpm = "10.15.1"
 dart = "3.8.2"
 
 [tools."github:CQLabs/homebrew-dcm"]

package.json

@@ -3,7 +3,7 @@
   "version": "0.0.1",
   "description": "Monorepo for Immich",
   "private": true,
-  "packageManager": "pnpm@10.14.0+sha512.ad27a79641b49c3e481a16a805baa71817a04bbe06a38d17e60e2eaee83f6a146c6a688125f5792e48dd5ba30e7da52a5cda4c3992b9ccf333f9ce223af84748",
+  "packageManager": "pnpm@10.15.1+sha512.34e538c329b5553014ca8e8f4535997f96180a1d0f614339357449935350d924e22f8614682191264ec33d1462ac21561aff97f6bb18065351c162c7e8f6de67",
   "engines": {
     "pnpm": ">=10.0.0"
   }

server/package.json

@@ -44,14 +44,14 @@
     "@nestjs/websockets": "^11.0.4",
     "@opentelemetry/api": "^1.9.0",
     "@opentelemetry/context-async-hooks": "^2.0.0",
-    "@opentelemetry/exporter-prometheus": "^0.203.0",
+    "@opentelemetry/exporter-prometheus": "^0.205.0",
-    "@opentelemetry/instrumentation-http": "^0.203.0",
+    "@opentelemetry/instrumentation-http": "^0.205.0",
-    "@opentelemetry/instrumentation-ioredis": "^0.51.0",
+    "@opentelemetry/instrumentation-ioredis": "^0.53.0",
-    "@opentelemetry/instrumentation-nestjs-core": "^0.49.0",
+    "@opentelemetry/instrumentation-nestjs-core": "^0.51.0",
-    "@opentelemetry/instrumentation-pg": "^0.56.0",
+    "@opentelemetry/instrumentation-pg": "^0.58.0",
     "@opentelemetry/resources": "^2.0.1",
     "@opentelemetry/sdk-metrics": "^2.0.1",
-    "@opentelemetry/sdk-node": "^0.203.0",
+    "@opentelemetry/sdk-node": "^0.205.0",
     "@opentelemetry/semantic-conventions": "^1.34.0",
     "@react-email/components": "^0.5.0",
     "@react-email/render": "^1.1.2",

web/eslint.config.js

@@ -127,6 +127,7 @@ export default typescriptEslint.config(
       '@typescript-eslint/no-misused-promises': 'error',
       '@typescript-eslint/require-await': 'error',
       'object-shorthand': ['error', 'always'],
+      'svelte/no-navigation-without-resolve': 'off',
     },
   },
   {

web/package.json

@@ -55,7 +55,7 @@
     "qrcode": "^1.5.4",
     "simple-icons": "^15.15.0",
     "socket.io-client": "~4.8.0",
-    "svelte-gestures": "^5.1.3",
+    "svelte-gestures": "5.1.4",
     "svelte-i18n": "^4.0.1",
     "svelte-maplibre": "^1.2.0",
     "svelte-persisted-store": "^0.12.0",
@@ -70,7 +70,7 @@
     "@sveltejs/adapter-static": "^3.0.8",
     "@sveltejs/enhanced-img": "^0.8.0",
     "@sveltejs/kit": "^2.27.1",
-    "@sveltejs/vite-plugin-svelte": "6.1.2",
+    "@sveltejs/vite-plugin-svelte": "6.2.0",
     "@tailwindcss/vite": "^4.1.7",
     "@testing-library/jest-dom": "^6.4.2",
     "@testing-library/svelte": "^5.2.8",
@@ -85,7 +85,7 @@
     "dotenv": "^17.0.0",
     "eslint": "^9.18.0",
     "eslint-config-prettier": "^10.1.8",
-    "eslint-p": "^0.25.0",
+    "eslint-p": "^0.26.0",
     "eslint-plugin-compat": "^6.0.2",
     "eslint-plugin-svelte": "^3.9.0",
     "eslint-plugin-unicorn": "^60.0.0",
@@ -97,7 +97,7 @@
     "prettier-plugin-sort-json": "^4.1.1",
     "prettier-plugin-svelte": "^3.3.3",
     "rollup-plugin-visualizer": "^6.0.0",
-    "svelte": "5.35.5",
+    "svelte": "5.38.10",
     "svelte-check": "^4.1.5",
     "svelte-eslint-parser": "^1.2.0",
     "tailwindcss": "^4.1.7",

web/src/lib/components/admin-settings/StorageTemplateSettings.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+  import { resolve } from '$app/paths';
   import SupportedDatetimePanel from '$lib/components/admin-settings/SupportedDatetimePanel.svelte';
   import SupportedVariablesPanel from '$lib/components/admin-settings/SupportedVariablesPanel.svelte';
   import SettingButtonsRow from '$lib/components/shared-components/settings/setting-buttons-row.svelte';
@@ -262,7 +263,7 @@
                       values={{ job: $t('admin.storage_template_migration_job') }}
                     >
                       {#snippet children({ message })}
-                        <a href={AppRoute.ADMIN_JOBS} class="text-primary">
+                        <a href={resolve(AppRoute.ADMIN_JOBS)} class="text-primary">
                           {message}
                         </a>
                       {/snippet}

web/src/lib/components/album-page/album-card-group.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+  import { resolve } from '$app/paths';
   import AlbumCard from '$lib/components/album-page/album-card.svelte';
   import { AppRoute } from '$lib/constants';
   import { albumViewSettings } from '$lib/stores/preferences.store';
@@ -65,7 +66,7 @@
       {#each albums as album, index (album.id)}
         <a
           data-sveltekit-preload-data="hover"
-          href="{AppRoute.ALBUMS}/{album.id}"
+          href={resolve(`${AppRoute.ALBUMS}/${album.id}`)}
           animate:flip={{ duration: 400 }}
           oncontextmenu={(event) => oncontextmenu(event, album)}
         >

web/src/lib/components/album-page/albums-list.svelte

@@ -1,5 +1,6 @@
 <script lang="ts">
   import { goto } from '$app/navigation';
+  import { resolve } from '$app/paths';
   import AlbumCardGroup from '$lib/components/album-page/album-card-group.svelte';
   import AlbumsTable from '$lib/components/album-page/albums-table.svelte';
   import MenuOption from '$lib/components/shared-components/context-menu/menu-option.svelte';
@@ -315,7 +316,7 @@
       button: {
         text: $t('view_album'),
         onClick() {
-          return goto(`${AppRoute.ALBUMS}/${album.id}`);
+          return goto(resolve(`${AppRoute.ALBUMS}/${album.id}`));
         },
       },
     });

web/src/lib/components/album-page/albums-table-row.svelte

@@ -1,5 +1,6 @@
 <script lang="ts">
   import { goto } from '$app/navigation';
+  import { resolve } from '$app/paths';
   import { AppRoute, dateFormats } from '$lib/constants';
   import { locale } from '$lib/stores/preferences.store';
   import { user } from '$lib/stores/user.store';
@@ -32,7 +33,7 @@
 
 <tr
   class="flex h-[50px] w-full place-items-center border-[3px] border-transparent p-2 text-center even:bg-subtle/20 odd:bg-subtle/80 hover:cursor-pointer hover:border-immich-primary/75 odd:dark:bg-immich-dark-gray/75 even:dark:bg-immich-dark-gray/50 dark:hover:border-immich-dark-primary/75 md:p-5"
-  onclick={() => goto(`${AppRoute.ALBUMS}/${album.id}`)}
+  onclick={() => goto(resolve(`${AppRoute.ALBUMS}/${album.id}`))}
   {oncontextmenu}
 >
   <td class="text-md text-ellipsis text-start w-8/12 sm:w-4/12 md:w-4/12 xl:w-[30%] 2xl:w-[40%] items-center">

web/src/lib/components/asset-viewer/activity-viewer.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+  import { resolve } from '$app/paths';
   import { autoGrowHeight } from '$lib/actions/autogrow';
   import { shortcut } from '$lib/actions/shortcut';
   import ButtonContextMenu from '$lib/components/shared-components/context-menu/button-context-menu.svelte';
@@ -146,7 +147,10 @@
 
               <div class="w-full leading-4 overflow-hidden self-center break-words text-sm">{reaction.comment}</div>
               {#if assetId === undefined && reaction.assetId}
-                <a class="aspect-square w-[75px] h-[75px]" href="{AppRoute.ALBUMS}/{albumId}/photos/{reaction.assetId}">
+                <a
+                  class="aspect-square w-[75px] h-[75px]"
+                  href={resolve(`${AppRoute.ALBUMS}/${albumId}/photos/${reaction.assetId}`)}
+                >
                   <img
                     class="rounded-lg w-[75px] h-[75px] object-cover"
                     src={getAssetThumbnailUrl(reaction.assetId)}
@@ -198,7 +202,7 @@
                 {#if assetId === undefined && reaction.assetId}
                   <a
                     class="aspect-square w-[75px] h-[75px]"
-                    href="{AppRoute.ALBUMS}/{albumId}/photos/{reaction.assetId}"
+                    href={resolve(`${AppRoute.ALBUMS}/${albumId}/photos/${reaction.assetId}`)}
                   >
                     <img
                       class="rounded-lg w-[75px] h-[75px] object-cover"

web/src/lib/components/asset-viewer/asset-viewer-nav-bar.svelte

@@ -1,5 +1,6 @@
 <script lang="ts">
   import { goto } from '$app/navigation';
+  import { resolve } from '$app/paths';
   import CastButton from '$lib/cast/cast-button.svelte';
   import type { OnAction, PreAction } from '$lib/components/asset-viewer/actions/action';
   import AddToAlbumAction from '$lib/components/asset-viewer/actions/add-to-album-action.svelte';
@@ -224,14 +225,15 @@
             {#if !asset.isArchived && !asset.isTrashed}
               <MenuOption
                 icon={mdiImageSearch}
-                onClick={() => goto(`${AppRoute.PHOTOS}?at=${stack?.primaryAssetId ?? asset.id}`)}
+                onClick={() => goto(resolve(`${AppRoute.PHOTOS}?at=${stack?.primaryAssetId ?? asset.id}`))}
                 text={$t('view_in_timeline')}
               />
             {/if}
             {#if !asset.isArchived && !asset.isTrashed && smartSearchEnabled}
               <MenuOption
                 icon={mdiCompare}
-                onClick={() => goto(`${AppRoute.SEARCH}?query={"queryAssetId":"${stack?.primaryAssetId ?? asset.id}"}`)}
+                onClick={() =>
+                  goto(resolve(`${AppRoute.SEARCH}?query={"queryAssetId":"${stack?.primaryAssetId ?? asset.id}"}`))}
                 text={$t('view_similar_photos')}
               />
             {/if}

web/src/lib/components/asset-viewer/detail-panel-tags.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+  import { resolve } from '$app/paths';
   import { shortcut } from '$lib/actions/shortcut';
   import { AppRoute } from '$lib/constants';
   import { authManager } from '$lib/managers/auth-manager.svelte';
@@ -45,7 +46,7 @@
         <div class="flex group transition-all">
           <a
             class="inline-block h-min whitespace-nowrap ps-3 pe-1 group-hover:ps-3 py-1 text-center align-baseline leading-none text-gray-100 dark:text-immich-dark-gray bg-primary rounded-s-full hover:bg-immich-primary/80 dark:hover:bg-immich-dark-primary/80 transition-all"
-            href={encodeURI(`${AppRoute.TAGS}/?path=${tag.value}`)}
+            href={resolve(`${AppRoute.TAGS}/?path=${encodeURI(tag.value)}`)}
           >
             <p class="text-sm">
               {tag.value}

web/src/lib/components/asset-viewer/detail-panel.svelte

@@ -1,5 +1,6 @@
 <script lang="ts">
   import { goto } from '$app/navigation';
+  import { resolve } from '$app/paths';
   import DetailPanelDescription from '$lib/components/asset-viewer/detail-panel-description.svelte';
   import DetailPanelLocation from '$lib/components/asset-viewer/detail-panel-location.svelte';
   import DetailPanelRating from '$lib/components/asset-viewer/detail-panel-star-rating.svelte';
@@ -208,9 +209,11 @@
           {#if showingHiddenPeople || !person.isHidden}
             <a
               class="w-[90px]"
-              href="{AppRoute.PEOPLE}/{person.id}?{QueryParameter.PREVIOUS_ROUTE}={currentAlbum?.id
+              href={resolve(
-                ? `${AppRoute.ALBUMS}/${currentAlbum?.id}`
+                `${AppRoute.PEOPLE}/${person.id}?${QueryParameter.PREVIOUS_ROUTE}=${
-                : AppRoute.PHOTOS}"
+                  currentAlbum?.id ? `${AppRoute.ALBUMS}/${currentAlbum?.id}` : AppRoute.PHOTOS
+                }`,
+              )}
               onfocus={() => ($boundingBoxesArray = people[index].faces)}
               onblur={() => ($boundingBoxesArray = [])}
               onmouseover={() => ($boundingBoxesArray = people[index].faces)}
@@ -362,6 +365,7 @@
         </p>
         {#if showAssetPath}
           <p class="text-xs opacity-50 break-all pb-2 hover:text-primary" transition:slide={{ duration: 250 }}>
+            <!-- eslint-disable-next-line svelte/no-navigation-without-resolve this is supposed to be treated as an absolute/external link -->
             <a href={getAssetFolderHref(asset)} title={$t('go_to_folder')} class="whitespace-pre-wrap">
               {asset.originalPath}
             </a>
@@ -394,10 +398,12 @@
           {#if asset.exifInfo?.make || asset.exifInfo?.model}
             <p>
               <a
-                href="{AppRoute.SEARCH}?{getMetadataSearchQuery({
+                href={resolve(
-                  ...(asset.exifInfo?.make ? { make: asset.exifInfo.make } : {}),
+                  `${AppRoute.SEARCH}?${getMetadataSearchQuery({
-                  ...(asset.exifInfo?.model ? { model: asset.exifInfo.model } : {}),
+                    ...(asset.exifInfo?.make ? { make: asset.exifInfo.make } : {}),
-                })}"
+                    ...(asset.exifInfo?.model ? { model: asset.exifInfo.model } : {}),
+                  })}`,
+                )}
                 title="{$t('search_for')} {asset.exifInfo.make || ''} {asset.exifInfo.model || ''}"
                 class="hover:text-primary"
               >
@@ -411,7 +417,9 @@
             <div class="flex gap-2 text-sm">
               <p>
                 <a
-                  href="{AppRoute.SEARCH}?{getMetadataSearchQuery({ lensModel: asset.exifInfo.lensModel })}"
+                  href={resolve(
+                    `${AppRoute.SEARCH}?${getMetadataSearchQuery({ lensModel: asset.exifInfo.lensModel })}`,
+                  )}
                   title="{$t('search_for')} {asset.exifInfo.lensModel}"
                   class="hover:text-primary line-clamp-1"
                 >
@@ -475,7 +483,7 @@
         simplified
         useLocationPin
         showSimpleControls={!showEditFaces}
-        onOpenInMapView={() => goto(`${AppRoute.MAP}#12.5/${latlng.lat}/${latlng.lng}`)}
+        onOpenInMapView={() => goto(resolve(`${AppRoute.MAP}#12.5/${latlng.lat}/${latlng.lng}`))}
       >
         {#snippet popup({ marker })}
           {@const { lat, lon } = marker}
@@ -516,7 +524,7 @@
   <section class="px-6 pt-6 dark:text-immich-dark-fg">
     <p class="uppercase pb-4 text-sm">{$t('appears_in')}</p>
     {#each albums as album (album.id)}
-      <a href="{AppRoute.ALBUMS}/{album.id}">
+      <a href={resolve(`${AppRoute.ALBUMS}/${album.id}`)}>
         <div class="flex gap-4 pt-2 hover:cursor-pointer items-center">
           <div>
             <img

web/src/lib/components/shared-components/side-bar/recent-albums.spec.ts

@@ -17,6 +17,9 @@ describe('RecentAlbums component', () => {
     render(RecentAlbums);
 
     expect(sdkMock.getAllAlbums).toBeCalledTimes(1);
+
+    // wtf
+    await tick();
     await tick();
 
     const links = screen.getAllByRole('link');