Converted mutation queries.

This commit is contained in:
Mike Cao 2025-08-24 15:20:19 -07:00
parent 3f167e05ba
commit 0f9669f886
34 changed files with 259 additions and 350 deletions

View file

@ -17,80 +17,98 @@ export function CompareTables({ websiteId }: { websiteId: string }) {
updateParams,
query: { view = 'path' },
} = useNavigation();
const { startDate, endDate } = getCompareDate(
dateCompare,
dateRange.startDate,
dateRange.endDate,
);
const params = {
startAt: startDate.getTime(),
endAt: endDate.getTime(),
};
const renderPath = (view: string) => {
return updateParams({ view });
};
const items = [
{
id: 'path',
label: formatMessage(labels.path),
path: updateParams({ view: 'path' }),
path: renderPath('path'),
},
{
id: 'channel',
label: formatMessage(labels.channels),
path: renderPath('channel'),
},
{
id: 'referrer',
label: formatMessage(labels.referrers),
path: updateParams({ view: 'referrer' }),
path: renderPath('referrer'),
},
{
id: 'browser',
label: formatMessage(labels.browsers),
path: updateParams({ view: 'browser' }),
path: renderPath('browser'),
},
{
id: 'os',
label: formatMessage(labels.os),
path: updateParams({ view: 'os' }),
path: renderPath('os'),
},
{
id: 'device',
label: formatMessage(labels.devices),
path: updateParams({ view: 'device' }),
path: renderPath('device'),
},
{
id: 'country',
label: formatMessage(labels.countries),
path: updateParams({ view: 'country' }),
path: renderPath('country'),
},
{
id: 'region',
label: formatMessage(labels.regions),
path: updateParams({ view: 'region' }),
path: renderPath('region'),
},
{
id: 'city',
label: formatMessage(labels.cities),
path: updateParams({ view: 'city' }),
path: renderPath('city'),
},
{
id: 'language',
label: formatMessage(labels.languages),
path: updateParams({ view: 'language' }),
path: renderPath('language'),
},
{
id: 'screen',
label: formatMessage(labels.screens),
path: updateParams({ view: 'screen' }),
path: renderPath('screen'),
},
{
id: 'event',
label: formatMessage(labels.events),
path: updateParams({ view: 'event' }),
path: renderPath('event'),
},
{
id: 'hostname',
label: formatMessage(labels.hostname),
path: updateParams({ view: 'hostname' }),
path: renderPath('hostname'),
},
{
id: 'tag',
label: formatMessage(labels.tags),
path: updateParams({ view: 'tag' }),
path: renderPath('tag'),
},
];
const renderChange = props => {
const { label: x, count: y } = props;
const prev = data.find(d => d.x === x)?.y;
const value = y - prev;
const change = Math.abs(((y - prev) / prev) * 100);
const renderChange = ({ label, count }) => {
const prev = data.find(d => d.x === label)?.y;
const value = count - prev;
const change = Math.abs(((count - prev) / prev) * 100);
return (
!isNaN(change) && (
@ -101,19 +119,8 @@ export function CompareTables({ websiteId }: { websiteId: string }) {
);
};
const handleChange = id => {
router.push(updateParams({ view: id }));
};
const { startDate, endDate } = getCompareDate(
dateCompare,
dateRange.startDate,
dateRange.endDate,
);
const params = {
startAt: startDate.getTime(),
endAt: endDate.getTime(),
const handleChange = (id: any) => {
router.push(renderPath(id));
};
return (
@ -133,8 +140,8 @@ export function CompareTables({ websiteId }: { websiteId: string }) {
))}
</Select>
</Row>
<Panel>
<Grid columns={{ xs: '1fr', lg: '1fr 1fr' }} gap="6">
<Panel minHeight="300px">
<Grid columns={{ xs: '1fr', lg: '1fr 1fr' }} gap="6" height="100%">
<Column gap="6">
<Row alignItems="center" justifyContent="space-between">
<Heading size="2">{formatMessage(labels.previous)}</Heading>