Updated tables. Added MenuButton.

This commit is contained in:
Mike Cao 2025-05-07 04:10:27 -07:00
parent 92b283486e
commit a15c7cd596
27 changed files with 334 additions and 207 deletions

View file

@ -53,72 +53,72 @@ export function WebsiteCompareTables({ websiteId }: { websiteId: string }) {
const items = [
{
key: 'url',
id: 'url',
label: formatMessage(labels.pages),
url: renderUrl({ view: 'url' }),
},
{
key: 'referrer',
id: 'referrer',
label: formatMessage(labels.referrers),
url: renderUrl({ view: 'referrer' }),
},
{
key: 'browser',
id: 'browser',
label: formatMessage(labels.browsers),
url: renderUrl({ view: 'browser' }),
},
{
key: 'os',
id: 'os',
label: formatMessage(labels.os),
url: renderUrl({ view: 'os' }),
},
{
key: 'device',
id: 'device',
label: formatMessage(labels.devices),
url: renderUrl({ view: 'device' }),
},
{
key: 'country',
id: 'country',
label: formatMessage(labels.countries),
url: renderUrl({ view: 'country' }),
},
{
key: 'region',
id: 'region',
label: formatMessage(labels.regions),
url: renderUrl({ view: 'region' }),
},
{
key: 'city',
id: 'city',
label: formatMessage(labels.cities),
url: renderUrl({ view: 'city' }),
},
{
key: 'language',
id: 'language',
label: formatMessage(labels.languages),
url: renderUrl({ view: 'language' }),
},
{
key: 'screen',
id: 'screen',
label: formatMessage(labels.screens),
url: renderUrl({ view: 'screen' }),
},
{
key: 'event',
id: 'event',
label: formatMessage(labels.events),
url: renderUrl({ view: 'event' }),
},
{
key: 'query',
id: 'query',
label: formatMessage(labels.queryParameters),
url: renderUrl({ view: 'query' }),
},
{
key: 'host',
id: 'host',
label: formatMessage(labels.hosts),
url: renderUrl({ view: 'host' }),
},
{
key: 'tag',
id: 'tag',
label: formatMessage(labels.tags),
url: renderUrl({ view: 'tag' }),
},

View file

@ -17,6 +17,7 @@ import { RegionsTable } from '@/components/metrics/RegionsTable';
import { ScreenTable } from '@/components/metrics/ScreenTable';
import { TagsTable } from '@/components/metrics/TagsTable';
import { ChannelsTable } from '@/components/metrics/ChannelsTable';
import { Panel } from '@/components/common/Panel';
const views = {
url: PagesTable,
@ -134,27 +135,29 @@ export function WebsiteExpandedView({
const DetailsComponent = views[view] || (() => null);
return (
<Grid columns="auto 1fr" gap="6" marginTop="6">
<Column gap="6" width="200px">
<LinkButton href={renderUrl({ view: undefined })} variant="quiet" scroll={false}>
<Icon rotate={180}>
<Icons.Arrow />
</Icon>
<Text>{formatMessage(labels.back)}</Text>
</LinkButton>
<SideMenu items={items} selectedKey={view} />
</Column>
<Column>
<DetailsComponent
websiteId={websiteId}
domainName={domainName}
animate={false}
virtualize={true}
itemCount={25}
allowFilter={true}
allowSearch={true}
/>
</Column>
</Grid>
<Panel>
<Grid columns="auto 1fr" gap="6">
<Column gap="6" width="200px" border="right" paddingRight="3">
<LinkButton href={renderUrl({ view: undefined })} variant="quiet" scroll={false}>
<Icon rotate={180}>
<Icons.Arrow />
</Icon>
<Text>{formatMessage(labels.back)}</Text>
</LinkButton>
<SideMenu items={items} selectedKey={view} />
</Column>
<Column>
<DetailsComponent
websiteId={websiteId}
domainName={domainName}
animate={false}
virtualize={true}
itemCount={25}
allowFilter={true}
allowSearch={true}
/>
</Column>
</Grid>
</Panel>
);
}