refactor: admin sidebar (#18276)

web/src/routes/admin/jobs-status/+page.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
   import JobsPanel from '$lib/components/admin-page/jobs/jobs-panel.svelte';
-  import UserPageLayout from '$lib/components/layouts/user-page-layout.svelte';
+  import AdminPageLayout from '$lib/components/layouts/AdminPageLayout.svelte';
   import { AppRoute } from '$lib/constants';
   import { modalManager } from '$lib/managers/modal-manager.svelte';
   import JobCreateModal from '$lib/modals/JobCreateModal.svelte';
@@ -34,7 +34,7 @@
   });
 </script>
 
-<UserPageLayout title={data.meta.title} admin>
+<AdminPageLayout title={data.meta.title}>
   {#snippet buttons()}
     <HStack gap={0}>
       <Button
@@ -64,4 +64,4 @@
       {/if}
     </section>
   </section>
-</UserPageLayout>
+</AdminPageLayout>

web/src/routes/admin/library-management/+page.svelte

@@ -4,7 +4,7 @@
   import LibraryRenameForm from '$lib/components/forms/library-rename-form.svelte';
   import LibraryScanSettingsForm from '$lib/components/forms/library-scan-settings-form.svelte';
   import LibraryUserPickerForm from '$lib/components/forms/library-user-picker-form.svelte';
-  import UserPageLayout from '$lib/components/layouts/user-page-layout.svelte';
+  import AdminPageLayout from '$lib/components/layouts/AdminPageLayout.svelte';
   import ButtonContextMenu from '$lib/components/shared-components/context-menu/button-context-menu.svelte';
   import MenuOption from '$lib/components/shared-components/context-menu/menu-option.svelte';
   import EmptyPlaceholder from '$lib/components/shared-components/empty-placeholder.svelte';
@@ -240,7 +240,7 @@
   };
 </script>
 
-<UserPageLayout title={data.meta.title} admin>
+<AdminPageLayout title={data.meta.title}>
   {#snippet buttons()}
     <div class="flex justify-end gap-2">
       {#if libraries.length > 0}
@@ -363,7 +363,7 @@
       {/if}
     </div>
   </section>
-</UserPageLayout>
+</AdminPageLayout>
 
 {#if renameLibrary !== undefined}
   <LibraryRenameForm

web/src/routes/admin/server-status/+page.svelte

@@ -1,10 +1,10 @@
 <script lang="ts">
   import ServerStatsPanel from '$lib/components/admin-page/server-stats/server-stats-panel.svelte';
-  import UserPageLayout from '$lib/components/layouts/user-page-layout.svelte';
+  import AdminPageLayout from '$lib/components/layouts/AdminPageLayout.svelte';
+  import { asyncTimeout } from '$lib/utils';
   import { getServerStatistics } from '@immich/sdk';
   import { onDestroy, onMount } from 'svelte';
   import type { PageData } from './$types';
-  import { asyncTimeout } from '$lib/utils';
 
   interface Props {
     data: PageData;
@@ -26,10 +26,10 @@
   });
 </script>
 
-<UserPageLayout title={data.meta.title} admin>
+<AdminPageLayout title={data.meta.title}>
   <section id="setting-content" class="flex place-content-center sm:mx-4">
     <section class="w-full pb-28 sm:w-5/6 md:w-[850px]">
       <ServerStatsPanel stats={data.stats} />
     </section>
   </section>
-</UserPageLayout>
+</AdminPageLayout>

web/src/routes/admin/system-settings/+page.svelte

@@ -19,7 +19,7 @@
   import TrashSettings from '$lib/components/admin-page/settings/trash-settings/trash-settings.svelte';
   import UserSettings from '$lib/components/admin-page/settings/user-settings/user-settings.svelte';
   import SearchBar from '$lib/components/elements/search-bar.svelte';
-  import UserPageLayout from '$lib/components/layouts/user-page-layout.svelte';
+  import AdminPageLayout from '$lib/components/layouts/AdminPageLayout.svelte';
   import SettingAccordionState from '$lib/components/shared-components/settings/setting-accordion-state.svelte';
   import SettingAccordion from '$lib/components/shared-components/settings/setting-accordion.svelte';
   import { QueryParameter } from '$lib/constants';
@@ -241,7 +241,7 @@
 
 <input bind:this={inputElement} type="file" accept=".json" style="display: none" onchange={uploadConfig} />
 
-<UserPageLayout title={data.meta.title} admin>
+<AdminPageLayout title={data.meta.title}>
   {#snippet buttons()}
     <HStack gap={1}>
       <div class="hidden lg:block">
@@ -301,4 +301,4 @@
       </section>
     {/snippet}
   </AdminSettings>
-</UserPageLayout>
+</AdminPageLayout>

web/src/routes/admin/users/+page.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
   import { page } from '$app/stores';
   import Icon from '$lib/components/elements/icon.svelte';
-  import UserPageLayout from '$lib/components/layouts/user-page-layout.svelte';
+  import AdminPageLayout from '$lib/components/layouts/AdminPageLayout.svelte';
   import {
     NotificationType,
     notificationController,
@@ -85,7 +85,7 @@
   };
 </script>
 
-<UserPageLayout title={data.meta.title} admin>
+<AdminPageLayout title={data.meta.title}>
   {#snippet buttons()}
     <HStack gap={1}>
       <Button leadingIcon={mdiPlusBoxOutline} onclick={handleCreate} size="small" variant="ghost" color="secondary">
@@ -172,4 +172,4 @@
       </table>
     </section>
   </section>
-</UserPageLayout>
+</AdminPageLayout>

web/src/routes/admin/users/[id]/+page.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
   import StatsCard from '$lib/components/admin-page/server-stats/stats-card.svelte';
-  import UserPageLayout from '$lib/components/layouts/user-page-layout.svelte';
+  import AdminPageLayout from '$lib/components/layouts/AdminPageLayout.svelte';
   import {
     notificationController,
     NotificationType,
@@ -166,7 +166,7 @@
   }
 </script>
 
-<UserPageLayout title={data.meta.title} admin>
+<AdminPageLayout title={data.meta.title}>
   {#snippet buttons()}
     <HStack gap={0}>
       {#if canResetPassword}
@@ -365,4 +365,4 @@
       </div>
     </Container>
   </div>
-</UserPageLayout>
+</AdminPageLayout>