118 lines
3.6 KiB
TypeScript
118 lines
3.6 KiB
TypeScript
// frontend/src/pages/administration/AdministrationPage.tsx
|
|
|
|
import { useLocation, Navigate } from 'react-router'
|
|
import {
|
|
CalendarDaysIcon,
|
|
ChatBubbleLeftRightIcon,
|
|
KeyIcon,
|
|
UserGroupIcon,
|
|
UsersIcon,
|
|
VideoCameraIcon,
|
|
} from '@heroicons/react/20/solid'
|
|
import Tabs from '../../components/Tabs'
|
|
import UsersAdministration from './users/UsersAdministration'
|
|
import FeedbackAdministration from './feedback/FeedbackAdministration'
|
|
import MilestoneAdministration from './milestone/MilestoneAdministration'
|
|
import ChatsAdministration from './chats/ChatsAdministration'
|
|
import CalendarAdministration from './calendar/CalendarAdministration'
|
|
import ActiveDirectoryAdministration from './active-directory/ActiveDirectoryAdministration'
|
|
|
|
export default function AdministrationPage() {
|
|
const location = useLocation()
|
|
|
|
const pathname = location.pathname.replace(/\/$/, '')
|
|
const pathParts = pathname.split('/').filter(Boolean)
|
|
const section = pathParts[1] ?? 'benutzer'
|
|
|
|
const administrationTabs = [
|
|
{
|
|
name: 'Benutzer',
|
|
href: '/administration/benutzer',
|
|
icon: UsersIcon,
|
|
current: section === 'benutzer',
|
|
},
|
|
{
|
|
name: 'Teams & Chats',
|
|
href: '/administration/chats/teams',
|
|
icon: UserGroupIcon,
|
|
current: section === 'chats',
|
|
},
|
|
{
|
|
name: 'Active Directory',
|
|
href: '/administration/active-directory',
|
|
icon: KeyIcon,
|
|
current: section === 'active-directory',
|
|
},
|
|
{
|
|
name: 'Milestone',
|
|
href: '/administration/milestone',
|
|
icon: VideoCameraIcon,
|
|
current: section === 'milestone',
|
|
},
|
|
{
|
|
name: 'Kalender',
|
|
href: '/administration/kalender',
|
|
icon: CalendarDaysIcon,
|
|
current: section === 'kalender',
|
|
},
|
|
{
|
|
name: 'Feedback',
|
|
href: '/administration/feedback',
|
|
icon: ChatBubbleLeftRightIcon,
|
|
current: section === 'feedback',
|
|
},
|
|
]
|
|
|
|
if (section === 'teams') {
|
|
return <Navigate to="/administration/chats/teams" replace />
|
|
}
|
|
|
|
if (section === 'channels') {
|
|
return <Navigate to="/administration/chats/channels" replace />
|
|
}
|
|
|
|
if (
|
|
!['benutzer', 'chats', 'milestone', 'active-directory', 'kalender', 'feedback'].includes(
|
|
section,
|
|
)
|
|
) {
|
|
return <Navigate to="/administration/benutzer" replace />
|
|
}
|
|
|
|
return (
|
|
<main className="flex h-full min-h-0 flex-col overflow-hidden">
|
|
<h1 className="sr-only">Administration</h1>
|
|
|
|
<div className="shrink-0 border-b border-gray-200 bg-white dark:border-white/10 dark:bg-gray-900">
|
|
<Tabs
|
|
tabs={administrationTabs}
|
|
variant="underline-icons"
|
|
align="center"
|
|
ariaLabel="Administration"
|
|
/>
|
|
</div>
|
|
|
|
<div className="min-h-0 flex-1 overflow-y-auto [scrollbar-gutter:stable]">
|
|
<div className="px-4 py-10 sm:px-6 lg:px-8">
|
|
<div className="mb-8">
|
|
<h1 className="text-2xl font-semibold text-gray-900 dark:text-white">
|
|
Administration
|
|
</h1>
|
|
|
|
<p className="mt-2 text-sm text-gray-500 dark:text-gray-400">
|
|
Benutzer, Kommunikation, Kalender und Integrationen verwalten.
|
|
</p>
|
|
</div>
|
|
|
|
{section === 'benutzer' && <UsersAdministration />}
|
|
{section === 'chats' && <ChatsAdministration />}
|
|
{section === 'milestone' && <MilestoneAdministration />}
|
|
{section === 'active-directory' && <ActiveDirectoryAdministration />}
|
|
{section === 'kalender' && <CalendarAdministration />}
|
|
{section === 'feedback' && <FeedbackAdministration />}
|
|
</div>
|
|
</div>
|
|
</main>
|
|
)
|
|
}
|