mirror of
https://github.com/Sonny93/my-links.git
synced 2025-12-08 22:53:25 +00:00
feat: add collection description and visibility in dashboard header
This commit is contained in:
@@ -1,6 +1,16 @@
|
||||
import { Visibility } from '#enums/visibility';
|
||||
import { Link } from '@inertiajs/react';
|
||||
import { route } from '@izzyjs/route/client';
|
||||
import { ActionIcon, AppShell, Burger, Group, Menu, Text } from '@mantine/core';
|
||||
import {
|
||||
ActionIcon,
|
||||
AppShell,
|
||||
Badge,
|
||||
Burger,
|
||||
Flex,
|
||||
Group,
|
||||
Menu,
|
||||
Text,
|
||||
} from '@mantine/core';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { BsThreeDotsVertical } from 'react-icons/bs';
|
||||
import { GoPencil } from 'react-icons/go';
|
||||
@@ -32,7 +42,19 @@ export function DashboardHeader({ navbar, aside }: DashboardHeaderProps) {
|
||||
hiddenFrom="sm"
|
||||
size="sm"
|
||||
/>
|
||||
<Text lineClamp={1}>{activeCollection?.name}</Text>
|
||||
<Flex direction="column">
|
||||
<Text lineClamp={1}>
|
||||
{activeCollection?.name}{' '}
|
||||
{activeCollection?.visibility === Visibility.PUBLIC && (
|
||||
<Badge variant="light">{t('visibility.public')}</Badge>
|
||||
)}
|
||||
</Text>
|
||||
{activeCollection?.description && (
|
||||
<Text c="dimmed" size="sm">
|
||||
{activeCollection.description}
|
||||
</Text>
|
||||
)}
|
||||
</Flex>
|
||||
</Group>
|
||||
<Group>
|
||||
<Menu withinPortal shadow="md" width={225}>
|
||||
|
||||
@@ -26,6 +26,9 @@ interface DashboardPageProps {
|
||||
activeCollection: CollectionWithLinks;
|
||||
}
|
||||
|
||||
const HEADER_SIZE_WITH_DESCRIPTION = 60;
|
||||
const HEADER_SIZE_WITHOUT_DESCRIPTION = 50;
|
||||
|
||||
export default function MantineDashboard(props: Readonly<DashboardPageProps>) {
|
||||
const [openedNavbar, { toggle: toggleNavbar, close: closeNavbar }] =
|
||||
useDisclosure();
|
||||
@@ -71,7 +74,11 @@ export default function MantineDashboard(props: Readonly<DashboardPageProps>) {
|
||||
<div className={classes.app_wrapper}>
|
||||
<AppShell
|
||||
layout="alt"
|
||||
header={{ height: 50 }}
|
||||
header={{
|
||||
height: !!activeCollection?.description
|
||||
? HEADER_SIZE_WITH_DESCRIPTION
|
||||
: HEADER_SIZE_WITHOUT_DESCRIPTION,
|
||||
}}
|
||||
navbar={{
|
||||
width: 300,
|
||||
breakpoint: 'sm',
|
||||
|
||||
Reference in New Issue
Block a user