Files
umami/src/app/(main)/websites/[websiteId]/WebsiteHeader.tsx
2025-05-18 03:34:37 -07:00

40 lines
1.4 KiB
TypeScript

import { Column, Row, Heading } from '@umami/react-zen';
import { Favicon } from '@/components/common/Favicon';
import { ActiveUsers } from '@/components/metrics/ActiveUsers';
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 { WebsiteMenu } from '@/app/(main)/websites/[websiteId]/WebsiteMenu';
export function WebsiteHeader({
websiteId,
showFilter = true,
allowEdit = true,
}: {
websiteId: string;
showFilter?: boolean;
allowEdit?: boolean;
}) {
const website = useWebsite();
const { 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}</Heading>
</Row>
<ActiveUsers websiteId={websiteId} />
<Row alignItems="center" gap="3">
{showFilter && <WebsiteFilterButton websiteId={websiteId} />}
<WebsiteDateFilter websiteId={websiteId} />
{allowEdit && <WebsiteMenu websiteId={websiteId} />}
</Row>
</Row>
<FilterBar websiteId={websiteId} />
</Column>
);
}