Files
website/src/layouts/admin/AdminLayout.astro
bytedream d0051a0bff
All checks were successful
deploy / build-and-deploy (push) Successful in 19s
fix admin sidebar layout
2025-12-03 17:17:42 +01:00

163 lines
4.3 KiB
Plaintext

---
import '@styles/adminLayout.css';
import BaseLayout from '../BaseLayout.astro';
import { ClientRouter } from 'astro:transitions';
import Popup from '@components/popup/Popup.svelte';
import ConfirmPopup from '@components/popup/ConfirmPopup.svelte';
import { Session } from '@util/session.ts';
interface Props {
title: string;
}
const { title } = Astro.props;
const session = Session.sessionFromCookies(Astro.cookies);
const preTabs = [
{
href: '',
name: 'Startseite',
iconClass: 'iconify-[heroicons--computer-desktop-20-solid]'
}
];
const adminTabs = [
{
href: 'admin/users',
name: 'Registrierte Nutzer',
iconClass: 'iconify-[heroicons--user]',
subTabs: [
{
href: 'admin/users/direct_invitations',
name: 'Direkte Einladungen',
iconClass: 'iconify-[heroicons--envelope]'
},
{
href: 'admin/users/blocked',
name: 'Blockierte Nutzer',
iconClass: 'iconify-[heroicons--user-minus]'
}
],
enabled: session?.permissions.users
},
{
href: 'admin/reports',
name: 'Reports',
iconClass: 'iconify-[heroicons--flag]',
enabled: session?.permissions.reports
},
{
href: 'admin/feedback',
name: 'Feedback',
iconClass: 'iconify-[heroicons--book-open]',
enabled: session?.permissions.feedback
},
{
href: 'admin/admins',
name: 'Website Admins',
iconClass: 'iconify-[heroicons--code-bracket-16-solid]',
subTabs: [
{
href: 'admin/admins/strike_reasons',
name: 'Strikegründe',
iconClass: 'iconify-[heroicons--shield-exclamation]'
}
],
enabled: session?.permissions.admin
},
{
href: 'admin/settings',
name: 'Einstellungen',
iconClass: 'iconify-[heroicons--adjustments-horizontal]',
enabled: session?.permissions.settings
},
{
href: 'admin/tools',
name: 'Tools',
iconClass: 'iconify-[heroicons--wrench-screwdriver]',
enabled: session?.permissions.tools
}
];
---
<BaseLayout title={title}>
<ClientRouter />
<div class="flex flex-row max-h-screen h-screen overflow-hidden">
<div class="bg-base-200 w-72 flex flex-col justify-between overflow-scroll">
<ul class="menu">
{
preTabs.map((tab) => (
<li>
<a href={tab.href}>
<span class="iconify" class:list={tab.iconClass} />
<span>{tab.name}</span>
</a>
</li>
))
}
<div class="divider mx-1 my-1"></div>
{
adminTabs.map(
(tab) =>
tab.enabled && (
<li>
<a href={tab.href}>
<span class="iconify" class:list={tab.iconClass} />
<span>{tab.name}</span>
</a>
{tab.subTabs && (
<ul>
{tab.subTabs.map((subTab) => (
<li>
<a href={subTab.href}>
<span class="iconify" class:list={subTab.iconClass} />
<span>{subTab.name}</span>
</a>
</li>
))}
</ul>
)}
</li>
)
)
}
</ul>
<ul class="menu w-full">
{
Astro.slots.has('actions') && (
<fieldset class="fieldset bg-base-300 border-base-100 rounded-box border p-2">
<slot name="actions" />
</fieldset>
)
}
<div class="divider mx-1 my-0"></div>
<li>
<button id="logout">
<span class="iconify iconify-[heroicons--arrow-left-end-on-rectangle]"></span>
<span>Ausloggen</span>
</button>
</li>
</ul>
</div>
<div class="w-full overflow-scroll relative">
<slot />
</div>
</div>
</BaseLayout>
<Popup client:idle />
<ConfirmPopup client:idle />
<script>
import { actions } from 'astro:actions';
document.addEventListener('astro:page-load', () => {
const logout = document.getElementById('logout') as HTMLButtonElement;
logout.addEventListener('click', async () => {
await actions.session.logout();
window.location.href = `${document.baseURI}admin/login`;
});
});
</script>