watson/umami
1
0
Fork 0
mirror of https://github.com/umami-software/umami.git synced 2026-02-17 11:05:36 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 4

Website header updates.

Browse source
This commit is contained in:
Mike Cao 2025-04-04 23:26:52 -07:00
parent 2b99274895
commit 96c2c32d14
26 changed files with 137 additions and 247 deletions
Download patch file Download diff file Expand all files Collapse all files

54
src/app/(main)/websites/[websiteId]/WebsiteHeader.tsx
View file

@ -1,16 +1,4 @@
import {
Column,
Row,
Heading,
MenuTrigger,
Button,
Icon,
Icons,
Popover,
Menu,
MenuItem,
MenuSeparator,
} from '@umami/react-zen';
import { Column, Row, Heading } from '@umami/react-zen';
import { Favicon } from '@/components/common/Favicon';
import { ActiveUsers } from '@/components/metrics/ActiveUsers';
import { WebsiteTabs } from '@/app/(main)/websites/[websiteId]/WebsiteTabs';
@ -18,61 +6,35 @@ import { useWebsite } from '@/components/hooks/useWebsite';
import { WebsiteFilterButton } from '@/app/(main)/websites/[websiteId]/WebsiteFilterButton';
import { WebsiteDateFilter } from '@/components/input/WebsiteDateFilter';
import { FilterBar } from '@/components/metrics/FilterBar';
import { useMessages } from '@/components/hooks';
import { WebsiteMenu } from '@/app/(main)/websites/[websiteId]/WebsiteMenu';
import { WebsiteCompareBar } from '@/app/(main)/websites/[websiteId]/WebsiteCompareBar';
export function WebsiteHeader({
websiteId,
showFilter = true,
allowEdit = true,
compareMode = false,
}: {
websiteId: string;
showFilter?: boolean;
allowEdit?: boolean;
compareMode?: boolean;
}) {
const website = useWebsite();
const { formatMessage, labels } = useMessages();
const { name, domain } = website || {};
const items = [
{ label: formatMessage(labels.previousPeriod), value: 'prev' },
{ label: formatMessage(labels.previousYear), value: 'yoy' },
];
const { id: websiteId, name, domain } = website || {};
return (
<Column marginY="6" gap="6">
<Row alignItems="center" justifyContent="space-between" gap="3">
<Row alignItems="center" gap="3">
<Favicon domain={domain} />
<Heading>
{name}
<ActiveUsers websiteId={websiteId} />
</Heading>
<Heading>{name}</Heading>
</Row>
<ActiveUsers websiteId={websiteId} />
<Row alignItems="center" gap="3">
{showFilter && <WebsiteFilterButton websiteId={websiteId} />}
<WebsiteDateFilter websiteId={websiteId} />
{allowEdit && (
<MenuTrigger>
<Button variant="quiet">
<Icon>
<Icons.More />
</Icon>
</Button>
<Popover placement="bottom end">
<Menu>
<MenuItem>Compare dates</MenuItem>
<MenuItem>Share</MenuItem>
<MenuSeparator />
<MenuItem>Settings</MenuItem>
</Menu>
</Popover>
</MenuTrigger>
)}
{allowEdit && <WebsiteMenu websiteId={websiteId} />}
</Row>
</Row>
{compareMode && items.map(item => <div key={item.value}>{item.label}</div>)}
<WebsiteCompareBar websiteId={websiteId} />
<FilterBar websiteId={websiteId} />
<WebsiteTabs websiteId={websiteId} />
</Column>