diff --git a/components/messages.js b/components/messages.js
index d41c4430..38834c67 100644
--- a/components/messages.js
+++ b/components/messages.js
@@ -81,6 +81,7 @@ export const labels = defineMessages({
devices: { id: 'label.devices', defaultMessage: 'Devices' },
countries: { id: 'label.countries', defaultMessage: 'Countries' },
languages: { id: 'label.languages', defaultMessage: 'Languages' },
+ event: { id: 'label.event', defaultMessage: 'Event' },
events: { id: 'label.events', defaultMessage: 'Events' },
query: { id: 'label.query', defaultMessage: 'Query' },
queryParameters: { id: 'label.query-parameters', defaultMessage: 'Query parameters' },
diff --git a/components/pages/event-data/EventDataTable.js b/components/pages/event-data/EventDataTable.js
index 2724962f..4f938f8a 100644
--- a/components/pages/event-data/EventDataTable.js
+++ b/components/pages/event-data/EventDataTable.js
@@ -7,20 +7,25 @@ export function EventDataTable({ data = [] }) {
const { formatMessage, labels } = useMessages();
const { resolveUrl } = usePageQuery();
+ function linkToView(row, cell) {
+ return (
+
+ {cell}
+
+ );
+ }
+
if (data.length === 0) {
return ;
}
return (
+
+ {row => linkToView(row, row.event)}
+
- {row => {
- return (
-
- {row.field}
-
- );
- }}
+ {row => linkToView(row, row.field)}
{({ total }) => total.toLocaleString()}
diff --git a/components/pages/event-data/EventDataValueTable.js b/components/pages/event-data/EventDataValueTable.js
index 2a20c9b0..fedda654 100644
--- a/components/pages/event-data/EventDataValueTable.js
+++ b/components/pages/event-data/EventDataValueTable.js
@@ -5,7 +5,7 @@ import Icons from 'components/icons';
import PageHeader from 'components/layout/PageHeader';
import Empty from 'components/common/Empty';
-export function EventDataTable({ data = [], field }) {
+export function EventDataTable({ data = [], field, event }) {
const { formatMessage, labels } = useMessages();
const { resolveUrl } = usePageQuery();
@@ -20,7 +20,9 @@ export function EventDataTable({ data = [], field }) {
{formatMessage(labels.back)}
- {field}
+
+ {event} - {field}
+
>
);
};
diff --git a/components/pages/websites/WebsiteEventData.js b/components/pages/websites/WebsiteEventData.js
index 7dc68d41..41fc9839 100644
--- a/components/pages/websites/WebsiteEventData.js
+++ b/components/pages/websites/WebsiteEventData.js
@@ -5,7 +5,7 @@ import { EventDataMetricsBar } from 'components/pages/event-data/EventDataMetric
import { useDateRange, useApi, usePageQuery } from 'hooks';
import styles from './WebsiteEventData.module.css';
-function useFields(websiteId, field) {
+function useFields(websiteId, field, event) {
const [dateRange] = useDateRange(websiteId);
const { startDate, endDate } = dateRange;
const { get, useQuery } = useApi();
@@ -17,6 +17,7 @@ function useFields(websiteId, field) {
startAt: +startDate,
endAt: +endDate,
field,
+ withEventNames: true,
}),
{ enabled: !!(websiteId && startDate && endDate) },
);
@@ -26,15 +27,15 @@ function useFields(websiteId, field) {
export default function WebsiteEventData({ websiteId }) {
const {
- query: { view },
+ query: { view, event },
} = usePageQuery();
- const { data } = useFields(websiteId, view);
+ const { data } = useFields(websiteId, view, event);
return (
{!view && }
- {view && }
+ {view && }
);
}