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

add mobile navbar to share page

Browse source
This commit is contained in:
Francis Cao 2026-01-27 23:54:43 -08:00
parent 752f395d83
commit b958403224
1 changed files with 27 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

27
src/app/share/[...shareId]/SharePage.tsx
View file

@ -1,5 +1,5 @@
'use client'; 'use client';
import { Column, Grid, useTheme } from '@umami/react-zen'; import { Column, Grid, Icon, Row, Text, useTheme } from '@umami/react-zen';
import { useRouter } from 'next/navigation'; import { useRouter } from 'next/navigation';
import { useEffect, useMemo } from 'react'; import { useEffect, useMemo } from 'react';
import { AttributionPage } from '@/app/(main)/websites/[websiteId]/(reports)/attribution/AttributionPage'; import { AttributionPage } from '@/app/(main)/websites/[websiteId]/(reports)/attribution/AttributionPage';
@ -19,6 +19,8 @@ import { WebsitePage } from '@/app/(main)/websites/[websiteId]/WebsitePage';
import { WebsiteProvider } from '@/app/(main)/websites/WebsiteProvider'; import { WebsiteProvider } from '@/app/(main)/websites/WebsiteProvider';
import { PageBody } from '@/components/common/PageBody'; import { PageBody } from '@/components/common/PageBody';
import { useShareTokenQuery } from '@/components/hooks'; import { useShareTokenQuery } from '@/components/hooks';
import { MobileMenuButton } from '@/components/input/MobileMenuButton';
import { Logo } from '@/components/svg';
import { ShareFooter } from './ShareFooter'; import { ShareFooter } from './ShareFooter';
import { ShareHeader } from './ShareHeader'; import { ShareHeader } from './ShareHeader';
import { ShareNav } from './ShareNav'; import { ShareNav } from './ShareNav';
@ -94,6 +96,8 @@ export function SharePage({ shareId, path = '' }: { shareId: string; path?: stri
} }
const { websiteId, parameters = {}, whiteLabel } = shareToken; const { websiteId, parameters = {}, whiteLabel } = shareToken;
const logoName = whiteLabel?.name || 'umami';
const logoImage = whiteLabel?.image;
// Redirect to only allowed section - return null while redirecting // Redirect to only allowed section - return null while redirecting
if ( if (
@ -117,6 +121,25 @@ export function SharePage({ shareId, path = '' }: { shareId: string; path?: stri
return ( return (
<Column backgroundColor="2"> <Column backgroundColor="2">
<Grid columns={{ xs: '1fr', lg: 'auto 1fr' }} width="100%" height="100%"> <Grid columns={{ xs: '1fr', lg: 'auto 1fr' }} width="100%" height="100%">
<Row display={{ xs: 'flex', lg: 'none' }} alignItems="center" gap padding="3">
<Grid columns="auto 1fr" flexGrow={1} backgroundColor="3" borderRadius>
<MobileMenuButton>
{({ close }) => {
return <ShareNav shareId={shareId} parameters={parameters} onItemClick={close} />;
}}
</MobileMenuButton>
<Row alignItems="center" justifyContent="center" gap>
{whiteLabel?.image ? (
<img src={logoImage} alt={logoName} style={{ height: 24 }} />
) : (
<Icon>
<Logo />
</Icon>
)}
<Text weight="bold">{logoName}</Text>
</Row>
</Grid>
</Row>
<Column <Column
display={{ xs: 'none', lg: 'flex' }} display={{ xs: 'none', lg: 'flex' }}
width="240px" width="240px"
@ -125,8 +148,10 @@ export function SharePage({ shareId, path = '' }: { shareId: string; path?: stri
backgroundColor backgroundColor
marginRight="2" marginRight="2"
> >
<Column display={{ xs: 'none', lg: 'flex' }}>
<ShareNav shareId={shareId} parameters={parameters} /> <ShareNav shareId={shareId} parameters={parameters} />
</Column> </Column>
</Column>
<PageBody gap> <PageBody gap>
<WebsiteProvider websiteId={websiteId}> <WebsiteProvider websiteId={websiteId}>
<ShareHeader whiteLabel={whiteLabel} /> <ShareHeader whiteLabel={whiteLabel} />