lly/umami
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

mobile-friendly changes

Browse Source
This commit is contained in:
Francis Cao
2026-04-23 11:24:32 -07:00
parent be6154cb68
commit cf2ab575ba
2 changed files with 5 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/(main)/websites/[websiteId]/event-data/EventDataPivotTable.tsx
+4 -3
View File
@@ -7,7 +7,7 @@ import { Empty } from '@/components/common/Empty';
import Link from '@/components/common/Link'; import Link from '@/components/common/Link';
import { LoadingPanel } from '@/components/common/LoadingPanel'; import { LoadingPanel } from '@/components/common/LoadingPanel';
import { Pager } from '@/components/common/Pager'; import { Pager } from '@/components/common/Pager';
import { useEventDataPivotQuery, useEventDataPropertiesQuery, useMessages, useNavigation } from '@/components/hooks'; import { useEventDataPivotQuery, useEventDataPropertiesQuery, useMessages, useMobile, useNavigation } from '@/components/hooks';
export function EventDataPivotTable({ export function EventDataPivotTable({
websiteId, websiteId,
@@ -18,6 +18,7 @@ export function EventDataPivotTable({
}) { }) {
const { t, labels } = useMessages(); const { t, labels } = useMessages();
const { router, updateParams } = useNavigation(); const { router, updateParams } = useNavigation();
const { isMobile } = useMobile();
const propertiesQuery = useEventDataPropertiesQuery(websiteId); const propertiesQuery = useEventDataPropertiesQuery(websiteId);
const pivotQuery = useEventDataPivotQuery(websiteId, eventName); const pivotQuery = useEventDataPivotQuery(websiteId, eventName);
@@ -72,8 +73,8 @@ export function EventDataPivotTable({
renderEmpty={() => <Empty />} renderEmpty={() => <Empty />}
> >
<Column gap="4" minWidth="0" width="100%" maxWidth="100%"> <Column gap="4" minWidth="0" width="100%" maxWidth="100%">
<Column minWidth="0" width="100%" maxWidth="100%" overflow="hidden"> <Column minWidth="0" width="100%" maxWidth="100%" overflow={isMobile ? undefined : 'hidden'}>
<DataTable data={tableQuery?.data} style={{ width: '100%' }}> <DataTable data={tableQuery?.data} style={{ width: '100%' }} displayMode={isMobile ? 'cards' : 'table'}>
<DataColumn id="session" label={t(labels.session)} width="0.75fr"> <DataColumn id="session" label={t(labels.session)} width="0.75fr">
{(row: any) => ( {(row: any) => (
<Link href={updateParams({ session: row.sessionId })}> <Link href={updateParams({ session: row.sessionId })}>
src/app/(main)/websites/[websiteId]/event-data/EventDataPropertyChart.tsx
+1 -1
View File
@@ -144,7 +144,7 @@ export function EventDataPropertyChart({
error={valuesQuery.error} error={valuesQuery.error}
minHeight="300px" minHeight="300px"
> >
<Grid columns="1fr 1fr" gap padding="2" alignItems="start"> <Grid columns={{ base: '1fr', md: '1fr 1fr' }} gap padding="2" alignItems="start">
<ListTable title={propertyName} metric={t(labels.count)} data={tableData} /> <ListTable title={propertyName} metric={t(labels.count)} data={tableData} />
{pieChartData && <PieChart type="doughnut" chartData={pieChartData} />} {pieChartData && <PieChart type="doughnut" chartData={pieChartData} />}
</Grid> </Grid>