From 3d524d21404028486c9fe240ee1829c87b01ee69 Mon Sep 17 00:00:00 2001
From: Alex <alex.tran1502@gmail.com>
Date: Thu, 10 Oct 2024 15:46:09 +0700
Subject: [PATCH] format fix

---
 .../album-page/album-options.svelte           | 95 ++++++++++---------
 .../[[assetId=id]]/+page.svelte               | 30 +++---
 2 files changed, 62 insertions(+), 63 deletions(-)

diff --git a/web/src/lib/components/album-page/album-options.svelte b/web/src/lib/components/album-page/album-options.svelte
index dd2d601338e75..53fd355c4b0db 100644
--- a/web/src/lib/components/album-page/album-options.svelte
+++ b/web/src/lib/components/album-page/album-options.svelte
@@ -5,7 +5,7 @@
     removeUserFromAlbum,
     type AlbumResponseDto,
     type UserResponseDto,
-    AssetOrder
+    AssetOrder,
   } from '@immich/sdk';
   import { mdiArrowDownThin, mdiArrowUpThin, mdiPlus, mdiDotsVertical } from '@mdi/js';
   import FullScreenModal from '$lib/components/shared-components/full-screen-modal.svelte';
@@ -83,62 +83,63 @@
 </script>
 
 {#if !selectedRemoveUser}
-<FullScreenModal title={$t('options')} {onClose}>
-  <div class="items-center justify-center">
-    <div class="py-2">
-      <h2 class="text-gray text-sm mb-2">{$t('settings').toUpperCase()}</h2>
-      <div class="grid p-2 gap-y-2">
-        {#if order}
-          <SettingDropdown
-            title={$t('display_order')}
-            options={Object.values(options)}
-            selectedOption={options[order]}
-            onToggle={handleToggle}
+  <FullScreenModal title={$t('options')} {onClose}>
+    <div class="items-center justify-center">
+      <div class="py-2">
+        <h2 class="text-gray text-sm mb-2">{$t('settings').toUpperCase()}</h2>
+        <div class="grid p-2 gap-y-2">
+          {#if order}
+            <SettingDropdown
+              title={$t('display_order')}
+              options={Object.values(options)}
+              selectedOption={options[order]}
+              onToggle={handleToggle}
+            />
+          {/if}
+          <SettingSwitch
+            title={$t('comments_and_likes')}
+            subtitle={$t('let_others_respond')}
+            checked={album.isActivityEnabled}
+            onToggle={onToggleEnabledActivity}
           />
-        {/if}
-        <SettingSwitch
-          title={$t('comments_and_likes')}
-          subtitle={$t('let_others_respond')}
-          checked={album.isActivityEnabled}
-          onToggle={onToggleEnabledActivity}
-        />
-      </div>
-    </div>
-    <div class="py-2">
-      <div class="text-gray text-sm mb-3">{$t('people').toUpperCase()}</div>
-      <div class="p-2">
-        <button type="button" class="flex items-center gap-2" on:click={onShowSelectSharedUser}>
-          <div class="rounded-full w-10 h-10 border border-gray-500 flex items-center justify-center">
-            <div><Icon path={mdiPlus} size="25" /></div>
-          </div>
-          <div>{$t('invite_people')}</div>
-        </button>
-        
-        <div class="flex items-center gap-2 py-2 mt-2">
-          <div>
-            <UserAvatar user={user} size="md" />
-          </div>
-          <div class="w-full">{user.name}</div>
-          <div>{$t('owner')}</div>
         </div>
+      </div>
+      <div class="py-2">
+        <div class="text-gray text-sm mb-3">{$t('people').toUpperCase()}</div>
+        <div class="p-2">
+          <button type="button" class="flex items-center gap-2" on:click={onShowSelectSharedUser}>
+            <div class="rounded-full w-10 h-10 border border-gray-500 flex items-center justify-center">
+              <div><Icon path={mdiPlus} size="25" /></div>
+            </div>
+            <div>{$t('invite_people')}</div>
+          </button>
 
-        {#each album.albumUsers as { user } (user.id)}
-          <div class="flex items-center gap-2 py-2">
+          <div class="flex items-center gap-2 py-2 mt-2">
             <div>
               <UserAvatar {user} size="md" />
             </div>
             <div class="w-full">{user.name}</div>
-            {#if user.id !== album.ownerId} <!-- Allow deletion for non-owners -->
-              <ButtonContextMenu icon={mdiDotsVertical} size="20" title={$t('options')}>
-                <MenuOption onClick={() => handleMenuRemove(user)} text={$t('remove')} />
-              </ButtonContextMenu>
-            {/if}
+            <div>{$t('owner')}</div>
           </div>
-        {/each}
+
+          {#each album.albumUsers as { user } (user.id)}
+            <div class="flex items-center gap-2 py-2">
+              <div>
+                <UserAvatar {user} size="md" />
+              </div>
+              <div class="w-full">{user.name}</div>
+              {#if user.id !== album.ownerId}
+                <!-- Allow deletion for non-owners -->
+                <ButtonContextMenu icon={mdiDotsVertical} size="20" title={$t('options')}>
+                  <MenuOption onClick={() => handleMenuRemove(user)} text={$t('remove')} />
+                </ButtonContextMenu>
+              {/if}
+            </div>
+          {/each}
+        </div>
       </div>
     </div>
-  </div>
-</FullScreenModal>
+  </FullScreenModal>
 {/if}
 
 {#if selectedRemoveUser}
diff --git a/web/src/routes/(user)/albums/[albumId=id]/[[photos=photos]]/[[assetId=id]]/+page.svelte b/web/src/routes/(user)/albums/[albumId=id]/[[photos=photos]]/[[assetId=id]]/+page.svelte
index b2b628be1854b..fdf21a2bb82cd 100644
--- a/web/src/routes/(user)/albums/[albumId=id]/[[photos=photos]]/[[assetId=id]]/+page.svelte
+++ b/web/src/routes/(user)/albums/[albumId=id]/[[photos=photos]]/[[assetId=id]]/+page.svelte
@@ -346,22 +346,20 @@
   };
 
   const handleRemoveUser = async (userId: string, nextViewMode: ViewMode) => {
-  if (userId == 'me' || userId === $user.id) {
-    await goto(backUrl);
-    return;
-  }
-
-  try {
-    await refreshAlbum();
-    
-    // Dynamically set the view mode based on the passed argument
-    viewMode = album.albumUsers.length > 0 ? nextViewMode : ViewMode.VIEW;
+    if (userId == 'me' || userId === $user.id) {
+      await goto(backUrl);
+      return;
+    }
 
-  } catch (error) {
-    handleError(error, $t('errors.error_deleting_shared_user'));
-  }
-};
+    try {
+      await refreshAlbum();
 
+      // Dynamically set the view mode based on the passed argument
+      viewMode = album.albumUsers.length > 0 ? nextViewMode : ViewMode.VIEW;
+    } catch (error) {
+      handleError(error, $t('errors.error_deleting_shared_user'));
+    }
+  };
 
   const handleDownloadAlbum = async () => {
     await downloadAlbum(album);
@@ -734,7 +732,7 @@
   <ShareInfoModal
     onClose={() => (viewMode = ViewMode.VIEW)}
     {album}
-    onRemove={(userId) => handleRemoveUser(userId, ViewMode.VIEW_USERS)}  
+    onRemove={(userId) => handleRemoveUser(userId, ViewMode.VIEW_USERS)}
     onRefreshAlbum={refreshAlbum}
   />
 {/if}
@@ -748,7 +746,7 @@
       albumOrder = order;
       await setModeToView();
     }}
-    onRemove={(userId)=>handleRemoveUser(userId, ViewMode.OPTIONS)}
+    onRemove={(userId) => handleRemoveUser(userId, ViewMode.OPTIONS)}
     onClose={() => (viewMode = ViewMode.VIEW)}
     onToggleEnabledActivity={handleToggleEnableActivity}
     onShowSelectSharedUser={() => (viewMode = ViewMode.SELECT_USERS)}