fixed alot of bugs in overview

This commit is contained in:
Carl-Gerhard Lindesvärd
2024-02-28 22:09:44 +01:00
parent 93cf5dbc0a
commit 5bfe0b9e35
12 changed files with 71 additions and 35 deletions

View File

@@ -18,9 +18,9 @@ export default async function Page({
params: { organizationId, projectId, dashboardId },
}: PageProps) {
const [dashboard, reports] = await Promise.all([
getDashboardById(dashboardId),
getDashboardById(dashboardId, projectId),
getReportsByDashboardId(dashboardId),
getExists(organizationId, projectId),
getExists(organizationId),
]);
if (!dashboard) {

View File

@@ -23,12 +23,10 @@ export default function LayoutProjectSelector({
className="w-auto min-w-0 max-sm:max-w-[100px]"
placeholder={'Select project'}
onChange={(value) => {
// If we are on a page with only organizationId and projectId (as params)
// we know its safe to just replace the current projectId
// since the rest of the url is to a static page
// e.g. /[organizationId]/[projectId]/events
if (organizationId && projectId) {
router.push(pathname.replace(projectId, value));
const split = pathname.replace(projectId, value).split('/');
// slicing here will remove everything after /{orgId}/{projectId}/dashboards [slice here] /xxx/xxx/xxx
router.push(split.slice(0, 4).join('/'));
} else {
router.push(`/${organizationId}/${value}`);
}

View File

@@ -17,7 +17,7 @@ export default function OverviewMetrics({ projectId }: OverviewMetricsProps) {
const { previous, range, interval, metric, setMetric, startDate, endDate } =
useOverviewOptions();
const [filters] = useEventQueryFilters();
const isPageFilter = filters.find((filter) => filter.name === 'path');
const reports = [
{
id: 'Visitors',
@@ -29,7 +29,7 @@ export default function OverviewMetrics({ projectId }: OverviewMetricsProps) {
segment: 'user',
filters,
id: 'A',
name: 'session_start',
name: isPageFilter ? 'screen_view' : 'session_start',
displayName: 'Visitors',
},
],
@@ -49,10 +49,10 @@ export default function OverviewMetrics({ projectId }: OverviewMetricsProps) {
endDate,
events: [
{
segment: 'event',
segment: 'session',
filters,
id: 'A',
name: 'session_start',
name: isPageFilter ? 'screen_view' : 'session_start',
displayName: 'Sessions',
},
],
@@ -122,7 +122,7 @@ export default function OverviewMetrics({ projectId }: OverviewMetricsProps) {
filters: [
{
id: '1',
name: 'properties._bounce',
name: 'properties.__bounce',
operator: 'is',
value: ['true'],
},
@@ -171,8 +171,8 @@ export default function OverviewMetrics({ projectId }: OverviewMetricsProps) {
],
id: 'A',
property: 'duration',
name: 'screen_view',
displayName: 'Visit duration',
name: isPageFilter ? 'screen_view' : 'session_end',
displayName: isPageFilter ? 'Time on page' : 'Visit duration',
},
],
breakdowns: [],

View File

@@ -31,7 +31,7 @@ export default function OverviewTopDevices({
segment: 'user',
filters,
id: 'A',
name: 'session_start',
name: '*',
},
],
breakdowns: [
@@ -61,7 +61,7 @@ export default function OverviewTopDevices({
segment: 'user',
filters,
id: 'A',
name: 'session_start',
name: '*',
},
],
breakdowns: [
@@ -91,7 +91,7 @@ export default function OverviewTopDevices({
segment: 'user',
filters,
id: 'A',
name: 'session_start',
name: '*',
},
],
breakdowns: [
@@ -121,7 +121,7 @@ export default function OverviewTopDevices({
segment: 'user',
filters,
id: 'A',
name: 'session_start',
name: '*',
},
],
breakdowns: [
@@ -151,7 +151,7 @@ export default function OverviewTopDevices({
segment: 'user',
filters,
id: 'A',
name: 'session_start',
name: '*',
},
],
breakdowns: [
@@ -189,7 +189,30 @@ export default function OverviewTopDevices({
</WidgetButtons>
</WidgetHead>
<WidgetBody>
<ChartSwitch hideID {...widget.chart} previous={false} />
<ChartSwitch
hideID
{...widget.chart}
previous={false}
onClick={(item) => {
switch (widget.key) {
case 'devices':
setFilter('device', item.name);
break;
case 'browser':
setFilter('browser', item.name);
break;
case 'browser_version':
setFilter('browser_version', item.name);
break;
case 'os':
setFilter('os', item.name);
break;
case 'os_version':
setFilter('os_version', item.name);
break;
}
}}
/>
</WidgetBody>
</Widget>
</>

View File

@@ -29,7 +29,7 @@ export default function OverviewTopGeo({ projectId }: OverviewTopGeoProps) {
segment: 'event',
filters,
id: 'A',
name: 'session_start',
name: '*',
},
],
breakdowns: [
@@ -59,7 +59,7 @@ export default function OverviewTopGeo({ projectId }: OverviewTopGeoProps) {
segment: 'event',
filters,
id: 'A',
name: 'session_start',
name: '*',
},
],
breakdowns: [
@@ -89,7 +89,7 @@ export default function OverviewTopGeo({ projectId }: OverviewTopGeoProps) {
segment: 'event',
filters,
id: 'A',
name: 'session_start',
name: '*',
},
],
breakdowns: [
@@ -165,7 +165,7 @@ export default function OverviewTopGeo({ projectId }: OverviewTopGeoProps) {
segment: 'event',
filters,
id: 'A',
name: 'session_start',
name: '*',
},
],
breakdowns: [

View File

@@ -18,6 +18,7 @@ export default function OverviewTopSources({
const { interval, range, previous, startDate, endDate } =
useOverviewOptions();
const [filters, setFilter] = useEventQueryFilters();
const isPageFilter = filters.find((filter) => filter.name === 'path');
const [widget, setWidget, widgets] = useOverviewWidget('sources', {
all: {
title: 'Top sources',
@@ -31,7 +32,7 @@ export default function OverviewTopSources({
segment: 'event',
filters: filters,
id: 'A',
name: 'session_start',
name: isPageFilter ? 'screen_view' : 'session_start',
},
],
breakdowns: [
@@ -61,7 +62,7 @@ export default function OverviewTopSources({
segment: 'event',
filters: filters,
id: 'A',
name: 'session_start',
name: isPageFilter ? 'screen_view' : 'session_start',
},
],
breakdowns: [
@@ -91,7 +92,7 @@ export default function OverviewTopSources({
segment: 'event',
filters: filters,
id: 'A',
name: 'session_start',
name: isPageFilter ? 'screen_view' : 'session_start',
},
],
breakdowns: [
@@ -121,7 +122,7 @@ export default function OverviewTopSources({
segment: 'event',
filters,
id: 'A',
name: 'session_start',
name: isPageFilter ? 'screen_view' : 'session_start',
},
],
breakdowns: [
@@ -151,7 +152,7 @@ export default function OverviewTopSources({
segment: 'event',
filters,
id: 'A',
name: 'session_start',
name: isPageFilter ? 'screen_view' : 'session_start',
},
],
breakdowns: [
@@ -181,7 +182,7 @@ export default function OverviewTopSources({
segment: 'event',
filters,
id: 'A',
name: 'session_start',
name: isPageFilter ? 'screen_view' : 'session_start',
},
],
breakdowns: [
@@ -211,7 +212,7 @@ export default function OverviewTopSources({
segment: 'event',
filters,
id: 'A',
name: 'session_start',
name: isPageFilter ? 'screen_view' : 'session_start',
},
],
breakdowns: [
@@ -241,7 +242,7 @@ export default function OverviewTopSources({
segment: 'event',
filters,
id: 'A',
name: 'session_start',
name: isPageFilter ? 'screen_view' : 'session_start',
},
],
breakdowns: [

View File

@@ -29,7 +29,6 @@ export function MetricCard({
unit,
}: MetricCardProps) {
const { previousIndicatorInverted } = useChartContext();
const color = _color || theme?.colors['chart-0'];
const number = useNumber();
const renderValue = (value: number, unitClassName?: string) => {

View File

@@ -112,6 +112,10 @@ export function ReportEvents() {
value: 'user',
label: 'Unique users',
},
{
value: 'session',
label: 'Unique sessions',
},
{
value: 'user_average',
label: 'Average event per user',
@@ -136,6 +140,10 @@ export function ReportEvents() {
<>
<Users size={12} /> Unique users
</>
) : event.segment === 'session' ? (
<>
<Users size={12} /> Unique sessions
</>
) : event.segment === 'user_average' ? (
<>
<Users size={12} /> Average event per user

View File

@@ -7,7 +7,8 @@ export const round = (num: number, decimals = 2) => {
export const average = (arr: (number | null)[]) => {
const filtered = arr.filter(
(n): n is number => isNumber(n) && !Number.isNaN(n) && Number.isFinite(n)
(n): n is number =>
isNumber(n) && !Number.isNaN(n) && Number.isFinite(n) && n !== 0
);
const avg = filtered.reduce((p, c) => p + c, 0) / filtered.length;
return Number.isNaN(avg) ? 0 : avg;

View File

@@ -76,6 +76,10 @@ export function getChartSql({
sb.select.count = `countDistinct(profile_id) as count`;
}
if (event.segment === 'session') {
sb.select.count = `countDistinct(session_id) as count`;
}
if (event.segment === 'user_average') {
sb.select.count = `COUNT(*)::float / COUNT(DISTINCT profile_id)::float as count`;
}

View File

@@ -5,10 +5,11 @@ export type IServiceDashboards = Awaited<
ReturnType<typeof getDashboardsByProjectId>
>;
export async function getDashboardById(id: string) {
export async function getDashboardById(id: string, projectId: string) {
const dashboard = await db.dashboard.findUnique({
where: {
id,
project_id: projectId,
},
include: {
project: true,

View File

@@ -26,6 +26,7 @@ export const zChartEvent = z.object({
segment: z.enum([
'event',
'user',
'session',
'user_average',
'one_event_per_user',
'property_sum',