diff --git a/src/app/(main)/websites/[websiteId]/WebsiteDetailsPage.tsx b/src/app/(main)/websites/[websiteId]/WebsiteDetailsPage.tsx
index 3eeeb18fd..460792efc 100644
--- a/src/app/(main)/websites/[websiteId]/WebsiteDetailsPage.tsx
+++ b/src/app/(main)/websites/[websiteId]/WebsiteDetailsPage.tsx
@@ -1,13 +1,13 @@
'use client';
import { usePathname } from 'next/navigation';
-import FilterTags from 'components/metrics/FilterTags';
-import { useNavigation } from 'components/hooks';
+import FilterTags from '@/components/metrics/FilterTags';
+import { useNavigation } from '@/components/hooks';
import WebsiteChart from './WebsiteChart';
import WebsiteExpandedView from './WebsiteExpandedView';
import WebsiteHeader from './WebsiteHeader';
import WebsiteMetricsBar from './WebsiteMetricsBar';
import WebsiteTableView from './WebsiteTableView';
-import { FILTER_COLUMNS } from 'lib/constants';
+import { FILTER_COLUMNS } from '@/lib/constants';
export default function WebsiteDetailsPage({ websiteId }: { websiteId: string }) {
const pathname = usePathname();
diff --git a/src/app/(main)/websites/[websiteId]/WebsiteExpandedView.module.css b/src/app/(main)/websites/[websiteId]/WebsiteExpandedView.module.css
index 007fa7f1b..afe2028ae 100644
--- a/src/app/(main)/websites/[websiteId]/WebsiteExpandedView.module.css
+++ b/src/app/(main)/websites/[websiteId]/WebsiteExpandedView.module.css
@@ -59,5 +59,6 @@
align-items: center;
justify-content: space-between;
padding-inline-end: 0;
+ z-index: 10;
}
}
diff --git a/src/app/(main)/websites/[websiteId]/WebsiteExpandedView.tsx b/src/app/(main)/websites/[websiteId]/WebsiteExpandedView.tsx
index 86a7717fa..4858ec734 100644
--- a/src/app/(main)/websites/[websiteId]/WebsiteExpandedView.tsx
+++ b/src/app/(main)/websites/[websiteId]/WebsiteExpandedView.tsx
@@ -1,20 +1,22 @@
-import { Icons, Icon, Text, Dropdown, Item } from 'react-basics';
-import BrowsersTable from 'components/metrics/BrowsersTable';
-import CountriesTable from 'components/metrics/CountriesTable';
-import RegionsTable from 'components/metrics/RegionsTable';
-import CitiesTable from 'components/metrics/CitiesTable';
-import DevicesTable from 'components/metrics/DevicesTable';
-import LanguagesTable from 'components/metrics/LanguagesTable';
-import OSTable from 'components/metrics/OSTable';
-import PagesTable from 'components/metrics/PagesTable';
-import QueryParametersTable from 'components/metrics/QueryParametersTable';
-import ReferrersTable from 'components/metrics/ReferrersTable';
-import HostsTable from 'components/metrics/HostsTable';
-import ScreenTable from 'components/metrics/ScreenTable';
-import EventsTable from 'components/metrics/EventsTable';
-import SideNav from 'components/layout/SideNav';
-import { useNavigation, useMessages, useLocale } from 'components/hooks';
-import LinkButton from 'components/common/LinkButton';
+import { Dropdown, Icon, Icons, Item, Text } from 'react-basics';
+import LinkButton from '@/components/common/LinkButton';
+import { useLocale, useMessages, useNavigation } from '@/components/hooks';
+import SideNav from '@/components/layout/SideNav';
+import BrowsersTable from '@/components/metrics/BrowsersTable';
+import CitiesTable from '@/components/metrics/CitiesTable';
+import CountriesTable from '@/components/metrics/CountriesTable';
+import DevicesTable from '@/components/metrics/DevicesTable';
+import EventsTable from '@/components/metrics/EventsTable';
+import HostsTable from '@/components/metrics/HostsTable';
+import LanguagesTable from '@/components/metrics/LanguagesTable';
+import OSTable from '@/components/metrics/OSTable';
+import PagesTable from '@/components/metrics/PagesTable';
+import QueryParametersTable from '@/components/metrics/QueryParametersTable';
+import ReferrersTable from '@/components/metrics/ReferrersTable';
+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 styles from './WebsiteExpandedView.module.css';
const views = {
@@ -23,6 +25,7 @@ const views = {
exit: PagesTable,
title: PagesTable,
referrer: ReferrersTable,
+ grouped: ReferrersTable,
host: HostsTable,
browser: BrowsersTable,
os: OSTable,
@@ -34,6 +37,8 @@ const views = {
language: LanguagesTable,
event: EventsTable,
query: QueryParametersTable,
+ tag: TagsTable,
+ channel: ChannelsTable,
};
export default function WebsiteExpandedView({
@@ -62,6 +67,11 @@ export default function WebsiteExpandedView({
label: formatMessage(labels.referrers),
url: renderUrl({ view: 'referrer' }),
},
+ {
+ key: 'channel',
+ label: formatMessage(labels.channels),
+ url: renderUrl({ view: 'channel' }),
+ },
{
key: 'browser',
label: formatMessage(labels.browsers),
@@ -117,6 +127,11 @@ export default function WebsiteExpandedView({
label: formatMessage(labels.hosts),
url: renderUrl({ view: 'host' }),
},
+ {
+ key: 'tag',
+ label: formatMessage(labels.tags),
+ url: renderUrl({ view: 'tag' }),
+ },
];
const DetailsComponent = views[view] || (() => null);
diff --git a/src/app/(main)/websites/[websiteId]/WebsiteFilterButton.tsx b/src/app/(main)/websites/[websiteId]/WebsiteFilterButton.tsx
index a6229e958..02b744184 100644
--- a/src/app/(main)/websites/[websiteId]/WebsiteFilterButton.tsx
+++ b/src/app/(main)/websites/[websiteId]/WebsiteFilterButton.tsx
@@ -1,8 +1,8 @@
import { Button, Icon, Icons, Popup, PopupTrigger, Text } from 'react-basics';
-import PopupForm from 'app/(main)/reports/[reportId]/PopupForm';
-import FilterSelectForm from 'app/(main)/reports/[reportId]/FilterSelectForm';
-import { useFields, useMessages, useNavigation, useDateRange } from 'components/hooks';
-import { OPERATOR_PREFIXES } from 'lib/constants';
+import PopupForm from '@/app/(main)/reports/[reportId]/PopupForm';
+import FilterSelectForm from '@/app/(main)/reports/[reportId]/FilterSelectForm';
+import { useFields, useMessages, useNavigation, useDateRange } from '@/components/hooks';
+import { OPERATOR_PREFIXES } from '@/lib/constants';
import styles from './WebsiteFilterButton.module.css';
export function WebsiteFilterButton({
diff --git a/src/app/(main)/websites/[websiteId]/WebsiteHeader.tsx b/src/app/(main)/websites/[websiteId]/WebsiteHeader.tsx
index edd10b99b..b568dd3dc 100644
--- a/src/app/(main)/websites/[websiteId]/WebsiteHeader.tsx
+++ b/src/app/(main)/websites/[websiteId]/WebsiteHeader.tsx
@@ -1,13 +1,13 @@
import classNames from 'classnames';
-import Favicon from 'components/common/Favicon';
-import { useMessages, useTeamUrl, useWebsite } from 'components/hooks';
-import Icons from 'components/icons';
-import ActiveUsers from 'components/metrics/ActiveUsers';
+import Favicon from '@/components/common/Favicon';
+import { useMessages, useTeamUrl, useWebsite } from '@/components/hooks';
+import Icons from '@/components/icons';
+import ActiveUsers from '@/components/metrics/ActiveUsers';
import Link from 'next/link';
import { usePathname } from 'next/navigation';
import { ReactNode } from 'react';
import { Button, Icon, Text } from 'react-basics';
-import Lightning from 'assets/lightning.svg';
+import Lightning from '@/assets/lightning.svg';
import styles from './WebsiteHeader.module.css';
export function WebsiteHeader({
diff --git a/src/app/(main)/websites/[websiteId]/WebsiteMetricsBar.tsx b/src/app/(main)/websites/[websiteId]/WebsiteMetricsBar.tsx
index a6e7ad408..f206d3c9e 100644
--- a/src/app/(main)/websites/[websiteId]/WebsiteMetricsBar.tsx
+++ b/src/app/(main)/websites/[websiteId]/WebsiteMetricsBar.tsx
@@ -1,14 +1,14 @@
-import classNames from 'classnames';
-import { useDateRange, useMessages, useSticky } from 'components/hooks';
-import WebsiteDateFilter from 'components/input/WebsiteDateFilter';
-import MetricCard from 'components/metrics/MetricCard';
-import MetricsBar from 'components/metrics/MetricsBar';
-import { formatShortTime, formatLongNumber } from 'lib/format';
-import WebsiteFilterButton from './WebsiteFilterButton';
-import useWebsiteStats from 'components/hooks/queries/useWebsiteStats';
-import styles from './WebsiteMetricsBar.module.css';
import { Dropdown, Item } from 'react-basics';
-import useStore, { setWebsiteDateCompare } from 'store/websites';
+import classNames from 'classnames';
+import { useDateRange, useMessages, useSticky } from '@/components/hooks';
+import WebsiteDateFilter from '@/components/input/WebsiteDateFilter';
+import MetricCard from '@/components/metrics/MetricCard';
+import MetricsBar from '@/components/metrics/MetricsBar';
+import { formatShortTime, formatLongNumber } from '@/lib/format';
+import useWebsiteStats from '@/components/hooks/queries/useWebsiteStats';
+import useStore, { setWebsiteDateCompare } from '@/store/websites';
+import WebsiteFilterButton from './WebsiteFilterButton';
+import styles from './WebsiteMetricsBar.module.css';
export function WebsiteMetricsBar({
websiteId,
diff --git a/src/app/(main)/websites/[websiteId]/WebsiteProvider.tsx b/src/app/(main)/websites/[websiteId]/WebsiteProvider.tsx
index 3cdfdd5df..198ad030f 100644
--- a/src/app/(main)/websites/[websiteId]/WebsiteProvider.tsx
+++ b/src/app/(main)/websites/[websiteId]/WebsiteProvider.tsx
@@ -1,6 +1,6 @@
'use client';
import { createContext, ReactNode, useEffect } from 'react';
-import { useModified, useWebsite } from 'components/hooks';
+import { useModified, useWebsite } from '@/components/hooks';
import { Loading } from 'react-basics';
export const WebsiteContext = createContext(null);
diff --git a/src/app/(main)/websites/[websiteId]/WebsiteTableView.tsx b/src/app/(main)/websites/[websiteId]/WebsiteTableView.tsx
index 2782cac62..02422075c 100644
--- a/src/app/(main)/websites/[websiteId]/WebsiteTableView.tsx
+++ b/src/app/(main)/websites/[websiteId]/WebsiteTableView.tsx
@@ -1,13 +1,13 @@
-import { Grid, GridRow } from 'components/layout/Grid';
-import PagesTable from 'components/metrics/PagesTable';
-import ReferrersTable from 'components/metrics/ReferrersTable';
-import BrowsersTable from 'components/metrics/BrowsersTable';
-import OSTable from 'components/metrics/OSTable';
-import DevicesTable from 'components/metrics/DevicesTable';
-import WorldMap from 'components/metrics/WorldMap';
-import CountriesTable from 'components/metrics/CountriesTable';
-import EventsTable from 'components/metrics/EventsTable';
-import EventsChart from 'components/metrics/EventsChart';
+import { Grid, GridRow } from '@/components/layout/Grid';
+import PagesTable from '@/components/metrics/PagesTable';
+import ReferrersTable from '@/components/metrics/ReferrersTable';
+import BrowsersTable from '@/components/metrics/BrowsersTable';
+import OSTable from '@/components/metrics/OSTable';
+import DevicesTable from '@/components/metrics/DevicesTable';
+import WorldMap from '@/components/metrics/WorldMap';
+import CountriesTable from '@/components/metrics/CountriesTable';
+import EventsTable from '@/components/metrics/EventsTable';
+import EventsChart from '@/components/metrics/EventsChart';
import { usePathname } from 'next/navigation';
export default function WebsiteTableView({ websiteId }: { websiteId: string }) {
diff --git a/src/app/(main)/websites/[websiteId]/compare/WebsiteComparePage.tsx b/src/app/(main)/websites/[websiteId]/compare/WebsiteComparePage.tsx
index 21cd65972..10a2eed15 100644
--- a/src/app/(main)/websites/[websiteId]/compare/WebsiteComparePage.tsx
+++ b/src/app/(main)/websites/[websiteId]/compare/WebsiteComparePage.tsx
@@ -1,9 +1,9 @@
'use client';
import WebsiteHeader from '../WebsiteHeader';
import WebsiteMetricsBar from '../WebsiteMetricsBar';
-import FilterTags from 'components/metrics/FilterTags';
-import { useNavigation } from 'components/hooks';
-import { FILTER_COLUMNS } from 'lib/constants';
+import FilterTags from '@/components/metrics/FilterTags';
+import { useNavigation } from '@/components/hooks';
+import { FILTER_COLUMNS } from '@/lib/constants';
import WebsiteChart from '../WebsiteChart';
import WebsiteCompareTables from './WebsiteCompareTables';
diff --git a/src/app/(main)/websites/[websiteId]/compare/WebsiteCompareTables.tsx b/src/app/(main)/websites/[websiteId]/compare/WebsiteCompareTables.tsx
index 1b21103da..ce7f5b47b 100644
--- a/src/app/(main)/websites/[websiteId]/compare/WebsiteCompareTables.tsx
+++ b/src/app/(main)/websites/[websiteId]/compare/WebsiteCompareTables.tsx
@@ -1,24 +1,25 @@
+import { useDateRange, useMessages, useNavigation } from '@/components/hooks';
+import { Grid, GridRow } from '@/components/layout/Grid';
+import SideNav from '@/components/layout/SideNav';
+import BrowsersTable from '@/components/metrics/BrowsersTable';
+import ChangeLabel from '@/components/metrics/ChangeLabel';
+import CitiesTable from '@/components/metrics/CitiesTable';
+import CountriesTable from '@/components/metrics/CountriesTable';
+import DevicesTable from '@/components/metrics/DevicesTable';
+import EventsTable from '@/components/metrics/EventsTable';
+import LanguagesTable from '@/components/metrics/LanguagesTable';
+import MetricsTable from '@/components/metrics/MetricsTable';
+import OSTable from '@/components/metrics/OSTable';
+import PagesTable from '@/components/metrics/PagesTable';
+import QueryParametersTable from '@/components/metrics/QueryParametersTable';
+import ReferrersTable from '@/components/metrics/ReferrersTable';
+import RegionsTable from '@/components/metrics/RegionsTable';
+import ScreenTable from '@/components/metrics/ScreenTable';
+import TagsTable from '@/components/metrics/TagsTable';
+import { getCompareDate } from '@/lib/date';
+import { formatNumber } from '@/lib/format';
import { useState } from 'react';
-import SideNav from 'components/layout/SideNav';
-import { useDateRange, useMessages, useNavigation } from 'components/hooks';
-import PagesTable from 'components/metrics/PagesTable';
-import ReferrersTable from 'components/metrics/ReferrersTable';
-import BrowsersTable from 'components/metrics/BrowsersTable';
-import OSTable from 'components/metrics/OSTable';
-import DevicesTable from 'components/metrics/DevicesTable';
-import ScreenTable from 'components/metrics/ScreenTable';
-import CountriesTable from 'components/metrics/CountriesTable';
-import RegionsTable from 'components/metrics/RegionsTable';
-import CitiesTable from 'components/metrics/CitiesTable';
-import LanguagesTable from 'components/metrics/LanguagesTable';
-import EventsTable from 'components/metrics/EventsTable';
-import QueryParametersTable from 'components/metrics/QueryParametersTable';
-import { Grid, GridRow } from 'components/layout/Grid';
-import MetricsTable from 'components/metrics/MetricsTable';
-import useStore from 'store/websites';
-import { getCompareDate } from 'lib/date';
-import { formatNumber } from 'lib/format';
-import ChangeLabel from 'components/metrics/ChangeLabel';
+import useStore from '@/store/websites';
import styles from './WebsiteCompareTables.module.css';
const views = {
@@ -35,6 +36,7 @@ const views = {
language: LanguagesTable,
event: EventsTable,
query: QueryParametersTable,
+ tag: TagsTable,
};
export function WebsiteCompareTables({ websiteId }: { websiteId: string }) {
@@ -109,6 +111,16 @@ export function WebsiteCompareTables({ websiteId }: { websiteId: string }) {
label: formatMessage(labels.queryParameters),
url: renderUrl({ view: 'query' }),
},
+ {
+ key: 'host',
+ label: formatMessage(labels.hosts),
+ url: renderUrl({ view: 'host' }),
+ },
+ {
+ key: 'tag',
+ label: formatMessage(labels.tags),
+ url: renderUrl({ view: 'tag' }),
+ },
];
const renderChange = ({ x, y }) => {
diff --git a/src/app/(main)/websites/[websiteId]/compare/page.tsx b/src/app/(main)/websites/[websiteId]/compare/page.tsx
index b3009fcaa..bdd29bd54 100644
--- a/src/app/(main)/websites/[websiteId]/compare/page.tsx
+++ b/src/app/(main)/websites/[websiteId]/compare/page.tsx
@@ -1,7 +1,9 @@
import WebsiteComparePage from './WebsiteComparePage';
import { Metadata } from 'next';
-export default function ({ params: { websiteId } }) {
+export default async function ({ params }: { params: { websiteId: string } }) {
+ const { websiteId } = await params;
+
return
;
}
diff --git a/src/app/(main)/websites/[websiteId]/events/EventProperties.tsx b/src/app/(main)/websites/[websiteId]/events/EventProperties.tsx
index 794a5053d..453aa9a85 100644
--- a/src/app/(main)/websites/[websiteId]/events/EventProperties.tsx
+++ b/src/app/(main)/websites/[websiteId]/events/EventProperties.tsx
@@ -1,9 +1,9 @@
import { GridColumn, GridTable } from 'react-basics';
-import { useEventDataProperties, useEventDataValues, useMessages } from 'components/hooks';
-import { LoadingPanel } from 'components/common/LoadingPanel';
-import PieChart from 'components/charts/PieChart';
+import { useEventDataProperties, useEventDataValues, useMessages } from '@/components/hooks';
+import { LoadingPanel } from '@/components/common/LoadingPanel';
+import PieChart from '@/components/charts/PieChart';
import { useState } from 'react';
-import { CHART_COLORS } from 'lib/constants';
+import { CHART_COLORS } from '@/lib/constants';
import styles from './EventProperties.module.css';
export function EventProperties({ websiteId }: { websiteId: string }) {
@@ -54,7 +54,7 @@ export function EventProperties({ websiteId }: { websiteId: string }) {
{propertyName && (
)}
diff --git a/src/app/(main)/websites/[websiteId]/events/EventsDataTable.tsx b/src/app/(main)/websites/[websiteId]/events/EventsDataTable.tsx
index 32eb985c6..ce9048d31 100644
--- a/src/app/(main)/websites/[websiteId]/events/EventsDataTable.tsx
+++ b/src/app/(main)/websites/[websiteId]/events/EventsDataTable.tsx
@@ -1,6 +1,6 @@
-import { useWebsiteEvents } from 'components/hooks';
+import { useWebsiteEvents } from '@/components/hooks';
import EventsTable from './EventsTable';
-import DataTable from 'components/common/DataTable';
+import DataTable from '@/components/common/DataTable';
import { ReactNode } from 'react';
export default function EventsDataTable({
diff --git a/src/app/(main)/websites/[websiteId]/events/EventsMetricsBar.tsx b/src/app/(main)/websites/[websiteId]/events/EventsMetricsBar.tsx
index d039b67f7..e90a7790a 100644
--- a/src/app/(main)/websites/[websiteId]/events/EventsMetricsBar.tsx
+++ b/src/app/(main)/websites/[websiteId]/events/EventsMetricsBar.tsx
@@ -1,9 +1,9 @@
-import { useMessages } from 'components/hooks';
-import useWebsiteSessionStats from 'components/hooks/queries/useWebsiteSessionStats';
-import WebsiteDateFilter from 'components/input/WebsiteDateFilter';
-import MetricCard from 'components/metrics/MetricCard';
-import MetricsBar from 'components/metrics/MetricsBar';
-import { formatLongNumber } from 'lib/format';
+import { useMessages } from '@/components/hooks';
+import useWebsiteSessionStats from '@/components/hooks/queries/useWebsiteSessionStats';
+import WebsiteDateFilter from '@/components/input/WebsiteDateFilter';
+import MetricCard from '@/components/metrics/MetricCard';
+import MetricsBar from '@/components/metrics/MetricsBar';
+import { formatLongNumber } from '@/lib/format';
import { Flexbox } from 'react-basics';
export function EventsMetricsBar({ websiteId }: { websiteId: string }) {
diff --git a/src/app/(main)/websites/[websiteId]/events/EventsPage.tsx b/src/app/(main)/websites/[websiteId]/events/EventsPage.tsx
index 7dfc0394c..cf4c19ef4 100644
--- a/src/app/(main)/websites/[websiteId]/events/EventsPage.tsx
+++ b/src/app/(main)/websites/[websiteId]/events/EventsPage.tsx
@@ -2,10 +2,10 @@
import WebsiteHeader from '../WebsiteHeader';
import EventsDataTable from './EventsDataTable';
import EventsMetricsBar from './EventsMetricsBar';
-import EventsChart from 'components/metrics/EventsChart';
-import { GridRow } from 'components/layout/Grid';
-import MetricsTable from 'components/metrics/MetricsTable';
-import { useMessages } from 'components/hooks';
+import EventsChart from '@/components/metrics/EventsChart';
+import { GridRow } from '@/components/layout/Grid';
+import MetricsTable from '@/components/metrics/MetricsTable';
+import { useMessages } from '@/components/hooks';
import { Item, Tabs } from 'react-basics';
import { useState } from 'react';
import EventProperties from './EventProperties';
diff --git a/src/app/(main)/websites/[websiteId]/events/EventsTable.tsx b/src/app/(main)/websites/[websiteId]/events/EventsTable.tsx
index 42eb8f7ad..8e6cdf764 100644
--- a/src/app/(main)/websites/[websiteId]/events/EventsTable.tsx
+++ b/src/app/(main)/websites/[websiteId]/events/EventsTable.tsx
@@ -1,9 +1,9 @@
import { GridTable, GridColumn, Icon } from 'react-basics';
-import { useMessages, useTeamUrl, useTimezone } from 'components/hooks';
-import Empty from 'components/common/Empty';
-import Avatar from 'components/common/Avatar';
+import { useMessages, useTeamUrl, useTimezone } from '@/components/hooks';
+import Empty from '@/components/common/Empty';
+import Avatar from '@/components/common/Avatar';
import Link from 'next/link';
-import Icons from 'components/icons';
+import Icons from '@/components/icons';
export function EventsTable({ data = [] }) {
const { formatTimezoneDate } = useTimezone();
diff --git a/src/app/(main)/websites/[websiteId]/events/page.tsx b/src/app/(main)/websites/[websiteId]/events/page.tsx
index b5dc4d62c..1b8882445 100644
--- a/src/app/(main)/websites/[websiteId]/events/page.tsx
+++ b/src/app/(main)/websites/[websiteId]/events/page.tsx
@@ -1,7 +1,9 @@
import { Metadata } from 'next';
import EventsPage from './EventsPage';
-export default async function ({ params: { websiteId } }) {
+export default async function ({ params }: { params: { websiteId: string } }) {
+ const { websiteId } = await params;
+
return