fix(web): download from shared album link (#7227)

* fix(web): download in album shared link

* chore: e2e test

e2e/src/utils.ts

@@ -177,11 +177,11 @@ export const cliUtils = {
 };
 
 export const webUtils = {
-  setAuthCookies: async (context: BrowserContext, response: LoginResponseDto) =>
+  setAuthCookies: async (context: BrowserContext, accessToken: string) =>
     await context.addCookies([
       {
         name: 'immich_access_token',
-        value: response.accessToken,
+        value: accessToken,
         domain: '127.0.0.1',
         path: '/',
         expires: 1742402728,

e2e/src/web/specs/auth.e2e-spec.ts

@@ -45,8 +45,8 @@ test.describe('Registration', () => {
   });
 
   test('user registration', async ({ context, page }) => {
-    const loginResponse = await apiUtils.adminSetup();
-    await webUtils.setAuthCookies(context, loginResponse);
+    const admin = await apiUtils.adminSetup();
+    await webUtils.setAuthCookies(context, admin.accessToken);
 
     // create user
     await page.goto('/admin/user-management');

e2e/src/web/specs/shared-link.e2e-spec.ts

@@ -0,0 +1,58 @@
+import {
+  AlbumResponseDto,
+  AssetResponseDto,
+  LoginResponseDto,
+  SharedLinkResponseDto,
+  SharedLinkType,
+  createAlbum,
+  createSharedLink,
+} from '@immich/sdk';
+import { test } from '@playwright/test';
+import { apiUtils, asBearerAuth, dbUtils } from 'src/utils';
+
+test.describe('Shared Links', () => {
+  let admin: LoginResponseDto;
+  let asset: AssetResponseDto;
+  let album: AlbumResponseDto;
+  let sharedLink: SharedLinkResponseDto;
+
+  test.beforeAll(async () => {
+    apiUtils.setup();
+    await dbUtils.reset();
+    admin = await apiUtils.adminSetup();
+    asset = await apiUtils.createAsset(admin.accessToken);
+    album = await createAlbum(
+      {
+        createAlbumDto: {
+          albumName: 'Test Album',
+          assetIds: [asset.id],
+        },
+      },
+      { headers: asBearerAuth(admin.accessToken) }
+      // { headers: asBearerAuth(admin.accessToken)},
+    );
+    sharedLink = await createSharedLink(
+      {
+        sharedLinkCreateDto: {
+          type: SharedLinkType.Album,
+          albumId: album.id,
+        },
+      },
+      { headers: asBearerAuth(admin.accessToken) }
+    );
+  });
+
+  test.afterAll(async () => {
+    await dbUtils.teardown();
+  });
+
+  test('download from a shared link', async ({ page }) => {
+    await page.goto(`/share/${sharedLink.key}`);
+    await page.getByRole('heading', { name: 'Test Album' }).waitFor();
+    await page.locator('.group > div').first().hover();
+    await page.waitForSelector('#asset-group-by-date svg');
+    await page.getByRole('checkbox').click();
+    await page.getByRole('button', { name: 'Download' }).click();
+    await page.getByText('DOWNLOADING').waitFor();
+  });
+});

web/src/lib/components/album-page/album-viewer.svelte

@@ -99,9 +99,9 @@
 </script>
 
 <header>
-  {#if $isMultiSelectState && user}
+  {#if $isMultiSelectState}
     <AssetSelectControlBar
-      ownerId={user.id}
+      ownerId={user?.id}
       assets={$selectedAssets}
       clearSelect={() => assetInteractionStore.clearMultiselect()}
     >
@@ -142,11 +142,11 @@
   <AssetGrid {album} {assetStore} {assetInteractionStore}>
     <section class="pt-24">
       <!-- ALBUM TITLE -->
-      <p
+      <h1
         class="bg-immich-bg text-6xl text-immich-primary outline-none transition-all dark:bg-immich-dark-bg dark:text-immich-dark-primary"
       >
         {album.albumName}
-      </p>
+      </h1>
 
       <!-- ALBUM SUMMARY -->
       {#if album.assetCount > 0}