watson/umami
1
0
Fork 0
mirror of https://github.com/umami-software/umami.git synced 2026-02-15 18:15:35 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

Add link and pixel selectors to top nav

Browse source
This commit is contained in:
Mike Cao 2026-02-12 17:01:37 -08:00
parent dd2d6bca45
commit a1f3ad89f6
6 changed files with 255 additions and 17 deletions
Download patch file Download diff file Expand all files Collapse all files

56
src/app/(main)/TopNav.tsx
View file

@ -2,16 +2,26 @@
import { Icon, Row } from '@umami/react-zen';
import { useNavigation } from '@/components/hooks';
import { Slash } from '@/components/icons';
import { LinkSelect } from '@/components/input/LinkSelect';
import { PixelSelect } from '@/components/input/PixelSelect';
import { TeamsButton } from '@/components/input/TeamsButton';
import { WebsiteSelect } from '@/components/input/WebsiteSelect';
export function TopNav() {
const { websiteId, teamId, router, renderUrl } = useNavigation();
const { websiteId, linkId, pixelId, teamId, router, renderUrl } = useNavigation();
const handleWebsiteChange = (value: string) => {
router.push(renderUrl(`/websites/${value}`));
};
const handleLinkChange = (value: string) => {
router.push(renderUrl(`/links/${value}`));
};
const handlePixelChange = (value: string) => {
router.push(renderUrl(`/pixels/${value}`));
};
return (
<Row
position="sticky"
@ -26,20 +36,44 @@ export function TopNav() {
>
<Row alignItems="center" backgroundColor="surface-raised" borderRadius>
<TeamsButton />
{websiteId && (
{(websiteId || linkId || pixelId) && (
<>
<Icon size="sm" color="muted" style={{ opacity: 0.7, margin: '0 6px' }}>
<Slash />
</Icon>
<WebsiteSelect
websiteId={websiteId}
teamId={teamId}
onChange={handleWebsiteChange}
buttonProps={{
variant: 'quiet',
style: { minHeight: 40, minWidth: 200, maxWidth: 200 },
}}
/>
{websiteId && (
<WebsiteSelect
websiteId={websiteId}
teamId={teamId}
onChange={handleWebsiteChange}
buttonProps={{
variant: 'quiet',
style: { minHeight: 40, minWidth: 200, maxWidth: 200 },
}}
/>
)}
{linkId && (
<LinkSelect
linkId={linkId}
teamId={teamId}
onChange={handleLinkChange}
buttonProps={{
variant: 'quiet',
style: { minHeight: 40, minWidth: 200, maxWidth: 200 },
}}
/>
)}
{pixelId && (
<PixelSelect
pixelId={pixelId}
teamId={teamId}
onChange={handlePixelChange}
buttonProps={{
variant: 'quiet',
style: { minHeight: 40, minWidth: 200, maxWidth: 200 },
}}
/>
)}
</>
)}
</Row>