diff --git a/src/app/(main)/websites/[websiteId]/(reports)/breakdown/Breakdown.tsx b/src/app/(main)/websites/[websiteId]/(reports)/breakdown/Breakdown.tsx
index 404e7de2..a4c00d4a 100644
--- a/src/app/(main)/websites/[websiteId]/(reports)/breakdown/Breakdown.tsx
+++ b/src/app/(main)/websites/[websiteId]/(reports)/breakdown/Breakdown.tsx
@@ -59,7 +59,7 @@ export function Breakdown({ websiteId, selectedFields = [], startDate, endDate }
{row => {
- const n = (row?.['totaltime'] / row?.['visits']) * 100;
+ const n = row?.['totaltime'] / row?.['visits'];
return `${+n < 0 ? '-' : ''}${formatShortTime(Math.abs(~~n), ['m', 's'], ' ')}`;
}}
diff --git a/src/components/metrics/CountriesTable.tsx b/src/components/metrics/CountriesTable.tsx
deleted file mode 100644
index 52c82803..00000000
--- a/src/components/metrics/CountriesTable.tsx
+++ /dev/null
@@ -1,42 +0,0 @@
-import { FilterLink } from '@/components/common/FilterLink';
-import { useCountryNames } from '@/components/hooks';
-import { useLocale, useMessages, useFormat } from '@/components/hooks';
-import { MetricsTable, MetricsTableProps } from './MetricsTable';
-import { TypeIcon } from '@/components/common/TypeIcon';
-import { MetricsExpandedTable } from '@/components/metrics/MetricsExpandedTable';
-
-export interface CountriesTableProps extends MetricsTableProps {
- isExpanded?: boolean;
-}
-
-export function CountriesTable({ isExpanded, ...props }: CountriesTableProps) {
- const { locale } = useLocale();
- const { countryNames } = useCountryNames(locale);
- const { formatMessage, labels } = useMessages();
- const { formatCountry } = useFormat();
-
- const renderLabel = ({ label: code }) => {
- return (
-
-
-
- );
- };
-
- const Component = isExpanded ? MetricsExpandedTable : MetricsTable;
-
- return (
-
- );
-}
diff --git a/src/components/metrics/ListExpandedTable.tsx b/src/components/metrics/ListExpandedTable.tsx
deleted file mode 100644
index a413f0e4..00000000
--- a/src/components/metrics/ListExpandedTable.tsx
+++ /dev/null
@@ -1,47 +0,0 @@
-import { useMessages } from '@/components/hooks';
-import { formatShortTime } from '@/lib/format';
-import { DataColumn, DataTable } from '@umami/react-zen';
-import { ReactNode } from 'react';
-
-export interface ListExpandedTableProps {
- data?: any[];
- title?: string;
- renderLabel?: (row: any, index: number) => ReactNode;
-}
-
-export function ListExpandedTable({ data = [], title, renderLabel }: ListExpandedTableProps) {
- const { formatMessage, labels } = useMessages();
-
- return (
-
-
- {row =>
- renderLabel
- ? renderLabel({ x: row?.['name'], country: row?.['country'] }, Number(row.id))
- : (row?.['name'] ?? formatMessage(labels.unknown))
- }
-
-
- {row => row?.['visitors']?.toLocaleString()}
-
-
- {row => row?.['visits']?.toLocaleString()}
-
-
- {row => row?.['pageviews']?.toLocaleString()}
-
-
- {row => {
- const n = (Math.min(row?.['visits'], row?.['bounces']) / row?.['visits']) * 100;
- return Math.round(+n) + '%';
- }}
-
-
- {row => {
- const n = (row?.['totaltime'] / row?.['visits']) * 100;
- return `${+n < 0 ? '-' : ''}${formatShortTime(Math.abs(~~n), ['m', 's'], ' ')}`;
- }}
-
-
- );
-}
diff --git a/src/components/metrics/MetricsExpandedTable.tsx b/src/components/metrics/MetricsExpandedTable.tsx
index f90f1b70..35da0ee6 100644
--- a/src/components/metrics/MetricsExpandedTable.tsx
+++ b/src/components/metrics/MetricsExpandedTable.tsx
@@ -6,6 +6,7 @@ import { Close } from '@/components/icons';
import { DownloadButton } from '@/components/input/DownloadButton';
import { formatShortTime } from '@/lib/format';
import { MetricLabel } from '@/components/metrics/MetricLabel';
+import { SESSION_COLUMNS } from '@/lib/constants';
export interface MetricsExpandedTableProps {
websiteId: string;
@@ -34,6 +35,7 @@ export function MetricsExpandedTable({
const [search, setSearch] = useState('');
const { formatMessage, labels } = useMessages();
const isType = ['browser', 'country', 'device', 'os'].includes(type);
+ const showBounceDuration = SESSION_COLUMNS.includes(type);
const { data, isLoading, isFetching, error } = useWebsiteExpandedMetricsQuery(websiteId, {
type,
@@ -85,22 +87,31 @@ export function MetricsExpandedTable({
{row => row?.['pageviews']?.toLocaleString()}
-
- {row => {
- const n = (Math.min(row?.['visits'], row?.['bounces']) / row?.['visits']) * 100;
- return Math.round(+n) + '%';
- }}
-
-
- {row => {
- const n = (row?.['totaltime'] / row?.['visits']) * 100;
- return `${+n < 0 ? '-' : ''}${formatShortTime(Math.abs(~~n), ['m', 's'], ' ')}`;
- }}
-
+ {showBounceDuration && [
+
+ {row => {
+ const n = (Math.min(row?.['visits'], row?.['bounces']) / row?.['visits']) * 100;
+ return Math.round(+n) + '%';
+ }}
+ ,
+
+
+ {row => {
+ const n = row?.['totaltime'] / row?.['visits'];
+ return `${+n < 0 ? '-' : ''}${formatShortTime(Math.abs(~~n), ['m', 's'], ' ')}`;
+ }}
+ ,
+ ]}
)}