immich-app/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich.git synced 2025-12-17 01:11:13 +03:00
Code Issues Packages Projects Releases 16 Wiki Activity

refactor: layout components (#18290)

Browse Source
This commit is contained in:
Jason Rasmussen
2025-05-14 12:30:47 -04:00
committed by GitHub
parent fac1beb7d8
commit 77b0505006
4 changed files with 67 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

37
web/src/lib/components/layouts/AdminPageLayout.svelte
View File

@@ -1,22 +1,19 @@
<script lang="ts">
import PageContent from '$lib/components/layouts/PageContent.svelte';
import TitleLayout from '$lib/components/layouts/TitleLayout.svelte';
import NavigationBar from '$lib/components/shared-components/navigation-bar/navigation-bar.svelte';
import BottomInfo from '$lib/components/shared-components/side-bar/bottom-info.svelte';
import { AppRoute } from '$lib/constants';
import AdminSidebar from '$lib/sidebars/AdminSidebar.svelte';
import { sidebarStore } from '$lib/stores/sidebar.svelte';
import { AppShell, AppShellHeader, AppShellSidebar, NavbarItem, type Size } from '@immich/ui';
import { mdiAccountMultipleOutline, mdiBookshelf, mdiCog, mdiServer, mdiSync } from '@mdi/js';
import { AppShell, AppShellHeader, AppShellSidebar, Scrollable } from '@immich/ui';
import type { Snippet } from 'svelte';
import { t } from 'svelte-i18n';
interface Props {
type Props = {
title: string;
size?: Size | 'full';
buttons?: Snippet;
children?: Snippet;
}
};
let { title, size, buttons, children }: Props = $props();
let { title, buttons, children }: Props = $props();
</script>
<AppShell>
@@ -24,20 +21,14 @@
<NavigationBar showUploadButton={false} noBorder />
</AppShellHeader>
<AppShellSidebar bind:open={sidebarStore.isOpen}>
<div class="h-full flex flex-col justify-between gap-2">
<div class="flex flex-col pt-8 pe-4 gap-1">
<NavbarItem title={$t('users')} href={AppRoute.ADMIN_USERS} icon={mdiAccountMultipleOutline} />
<NavbarItem title={$t('jobs')} href={AppRoute.ADMIN_JOBS} icon={mdiSync} />
<NavbarItem title={$t('settings')} href={AppRoute.ADMIN_SETTINGS} icon={mdiCog} />
<NavbarItem title={$t('external_libraries')} href={AppRoute.ADMIN_LIBRARY_MANAGEMENT} icon={mdiBookshelf} />
<NavbarItem title={$t('server_stats')} href={AppRoute.ADMIN_STATS} icon={mdiServer} />
</div>
<div class="mb-2 me-4">
<BottomInfo />
</div>
</div>
<AdminSidebar />
</AppShellSidebar>
<PageContent {title} {size} {buttons} {children} />
<TitleLayout {title} {buttons}>
<Scrollable class="grow">
<PageContent>
{@render children?.()}
</PageContent>
</Scrollable>
</TitleLayout>
</AppShell>