- {group === REPORT_PARAMETERS.groups && (
+ {id === 'fields' && (
<>
{label}
>
)}
- {group === REPORT_PARAMETERS.filters && (
+ {id === 'filters' && (
<>
{label}
{value[0]}
diff --git a/components/pages/reports/insights/InsightsTable.js b/components/pages/reports/insights/InsightsTable.js
index 24960254..0d5298e4 100644
--- a/components/pages/reports/insights/InsightsTable.js
+++ b/components/pages/reports/insights/InsightsTable.js
@@ -1,29 +1,42 @@
-import { useContext } from 'react';
+import { useContext, useEffect, useState } from 'react';
import { GridTable, GridColumn } from 'react-basics';
import { useFormat, useMessages } from 'hooks';
import { ReportContext } from '../Report';
+import EmptyPlaceholder from 'components/common/EmptyPlaceholder';
export function InsightsTable() {
+ const [fields, setFields] = useState();
const { report } = useContext(ReportContext);
const { formatMessage, labels } = useMessages();
- const { groups = [] } = report?.parameters || {};
const { formatValue } = useFormat();
+ useEffect(
+ () => {
+ setFields(report?.parameters?.fields);
+ },
+ // eslint-disable-next-line react-hooks/exhaustive-deps
+ [report?.data],
+ );
+
+ if (!fields) {
+ return
;
+ }
+
return (
- {groups.map(({ name, label }) => {
+ {fields.map(({ name, label }) => {
return (
{row => formatValue(row[name], name)}
);
})}
-
- {row => row.views.toLocaleString()}
-
{row => row.visitors.toLocaleString()}
+
+ {row => row.views.toLocaleString()}
+
);
}
diff --git a/pages/api/reports/insights.ts b/pages/api/reports/insights.ts
index 44f72063..decb1f81 100644
--- a/pages/api/reports/insights.ts
+++ b/pages/api/reports/insights.ts
@@ -27,7 +27,7 @@ export default async (
const {
websiteId,
dateRange: { startDate, endDate },
- groups,
+ fields,
filters,
} = req.body;
@@ -35,7 +35,7 @@ export default async (
return unauthorized(res);
}
- const data = await getInsights(websiteId, groups, {
+ const data = await getInsights(websiteId, fields, {
...filters,
startDate: new Date(startDate),
endDate: new Date(endDate),
diff --git a/queries/analytics/reports/getInsights.ts b/queries/analytics/reports/getInsights.ts
index b7c8777d..4c47052b 100644
--- a/queries/analytics/reports/getInsights.ts
+++ b/queries/analytics/reports/getInsights.ts
@@ -5,7 +5,7 @@ import { EVENT_TYPE } from 'lib/constants';
import { QueryFilters } from 'lib/types';
export async function getInsights(
- ...args: [websiteId: string, groups: { name: string; type: string }[], filters: QueryFilters]
+ ...args: [websiteId: string, fields: { name: string; type?: string }[], filters: QueryFilters]
) {
return runQuery({
[PRISMA]: () => relationalQuery(...args),
@@ -15,7 +15,7 @@ export async function getInsights(
async function relationalQuery(
websiteId: string,
- groups: { name: string; type: string }[],
+ fields: { name: string; type?: string }[],
filters: QueryFilters,
): Promise<
{
@@ -49,7 +49,7 @@ async function relationalQuery(
async function clickhouseQuery(
websiteId: string,
- groups: { name: string; type: string }[],
+ fields: { name: string; type?: string }[],
filters: QueryFilters,
): Promise<
{
@@ -66,14 +66,14 @@ async function clickhouseQuery(
return rawQuery(
`
select
- ${parseFields(groups)}
+ ${parseFields(fields)}
from website_event
where website_id = {websiteId:UUID}
and created_at between {startDate:DateTime} and {endDate:DateTime}
and event_type = {eventType:UInt32}
${filterQuery}
- group by ${groups.map(({ name }) => name).join(',')}
- order by 1 desc
+ group by ${fields.map(({ name }) => name).join(',')}
+ order by 1 desc, 2 desc
limit 500
`,
params,