diff --git a/src/frontend/src/components/nav/MainMenu.tsx b/src/frontend/src/components/nav/MainMenu.tsx index f17d786c34..68e2c8b0c6 100644 --- a/src/frontend/src/components/nav/MainMenu.tsx +++ b/src/frontend/src/components/nav/MainMenu.tsx @@ -5,6 +5,7 @@ import { IconLogout, IconPlugConnected, IconSettings, + IconUserBolt, IconUserCog } from '@tabler/icons-react'; import { Link } from 'react-router-dom'; @@ -34,6 +35,15 @@ export function MainMenu() { + {userState.user?.is_staff && ( + } + component={Link} + to="/settings/admin" + > + Admin Center + + )} Settings diff --git a/src/frontend/src/components/nav/PanelGroup.tsx b/src/frontend/src/components/nav/PanelGroup.tsx index 1e939e2050..bf532bddeb 100644 --- a/src/frontend/src/components/nav/PanelGroup.tsx +++ b/src/frontend/src/components/nav/PanelGroup.tsx @@ -35,18 +35,21 @@ export type PanelType = { * @param activePanel : string - The name of the currently active panel (defaults to the first panel) * @param setActivePanel : (panel: string) => void - Function to set the active panel * @param onPanelChange : (panel: string) => void - Callback when the active panel changes + * @param collabsible : boolean - If true, the panel group can be collapsed (defaults to true) * @returns */ export function PanelGroup({ pageKey, panels, selectedPanel, - onPanelChange + onPanelChange, + collabsible = true }: { pageKey: string; panels: PanelType[]; selectedPanel?: string; onPanelChange?: (panel: string) => void; + collabsible?: boolean; }): ReactNode { const [activePanel, setActivePanel] = useLocalStorage({ key: `panel-group-active-panel-${pageKey}`, @@ -105,18 +108,20 @@ export function PanelGroup({ ) )} - setExpanded(!expanded)} - > - {expanded ? ( - - ) : ( - - )} - + {collabsible && ( + setExpanded(!expanded)} + > + {expanded ? ( + + ) : ( + + )} + + )} {panels.map( (panel, idx) => diff --git a/src/frontend/src/components/nav/SettingsHeader.tsx b/src/frontend/src/components/nav/SettingsHeader.tsx index b0542d4d3e..cb68564249 100644 --- a/src/frontend/src/components/nav/SettingsHeader.tsx +++ b/src/frontend/src/components/nav/SettingsHeader.tsx @@ -14,12 +14,12 @@ export function SettingsHeader({ switch_text, switch_link }: { - title: string; + title: string | ReactNode; shorthand?: string; subtitle: string | ReactNode; switch_condition?: boolean; - switch_text: string | ReactNode; - switch_link: string; + switch_text?: string | ReactNode; + switch_link?: string; }) { return ( @@ -29,7 +29,7 @@ export function SettingsHeader({ {subtitle} - {switch_condition && ( + {switch_text && switch_link && switch_condition && ( {switch_text} diff --git a/src/frontend/src/pages/Index/Settings/AdminCenter.tsx b/src/frontend/src/pages/Index/Settings/AdminCenter.tsx new file mode 100644 index 0000000000..681ceea6e6 --- /dev/null +++ b/src/frontend/src/pages/Index/Settings/AdminCenter.tsx @@ -0,0 +1,105 @@ +import { Trans, t } from '@lingui/macro'; +import { + Anchor, + Divider, + Group, + Paper, + SimpleGrid, + Stack, + Text, + Title +} from '@mantine/core'; +import { useMemo } from 'react'; +import { Link } from 'react-router-dom'; + +import { PlaceholderPill } from '../../../components/items/Placeholder'; +import { PanelGroup, PanelType } from '../../../components/nav/PanelGroup'; +import { SettingsHeader } from '../../../components/nav/SettingsHeader'; +import { GlobalSettingList } from '../../../components/settings/SettingList'; + +/** + * System settings page + */ +export default function AdminCenter() { + const adminCenterPanels: PanelType[] = useMemo(() => { + return [ + { + name: 'user', + label: t`User Management`, + content: ( + + + + + + Settings + + + + + Select settings relevant for user lifecycle. More available + in + + + + System settings + + + + + + ) + } + ]; + }, []); + + const QuickAction = () => ( + + + <Trans>Quick Actions</Trans> + + + + + Add a new user + + + + + + + + + + + + + ); + + return ( + <> + + Admin Center} + subtitle={ + Advanced Amininistrative Options for InvenTree + } + switch_link="/settings/system" + switch_text="System Settings" + /> + + + + + ); +} diff --git a/src/frontend/src/router.tsx b/src/frontend/src/router.tsx index d432ed5ea0..7342229306 100644 --- a/src/frontend/src/router.tsx +++ b/src/frontend/src/router.tsx @@ -92,6 +92,9 @@ export const SystemSettings = Loadable( export const PluginSettings = Loadable( lazy(() => import('./pages/Index/Settings/PluginSettings')) ); +export const AdminCenter = Loadable( + lazy(() => import('./pages/Index/Settings/AdminCenter')) +); export const NotFound = Loadable(lazy(() => import('./pages/NotFound'))); export const Login = Loadable(lazy(() => import('./pages/Auth/Login'))); @@ -113,7 +116,8 @@ export const routes = ( } />, } />, - } /> + } /> + } /> } /> } /> } />