fix(dashboard): time interval still wrong on funnel and retention
This commit is contained in:
@@ -2,9 +2,6 @@ import { useTRPC } from '@/integrations/trpc/react';
|
|||||||
import type { RouterOutputs } from '@/trpc/client';
|
import type { RouterOutputs } from '@/trpc/client';
|
||||||
import { useQuery } from '@tanstack/react-query';
|
import { useQuery } from '@tanstack/react-query';
|
||||||
|
|
||||||
import { useOverviewOptions } from '@/components/overview/useOverviewOptions';
|
|
||||||
import type { IReportInput } from '@openpanel/validation';
|
|
||||||
|
|
||||||
import { AspectContainer } from '../aspect-container';
|
import { AspectContainer } from '../aspect-container';
|
||||||
import { ReportChartEmpty } from '../common/empty';
|
import { ReportChartEmpty } from '../common/empty';
|
||||||
import { ReportChartError } from '../common/error';
|
import { ReportChartError } from '../common/error';
|
||||||
@@ -13,45 +10,18 @@ import { useReportChartContext } from '../context';
|
|||||||
import { Chart, Summary, Tables } from './chart';
|
import { Chart, Summary, Tables } from './chart';
|
||||||
|
|
||||||
export function ReportFunnelChart() {
|
export function ReportFunnelChart() {
|
||||||
const {
|
const { isLazyLoading, report, shareId } = useReportChartContext();
|
||||||
report: {
|
|
||||||
id,
|
|
||||||
series,
|
|
||||||
range,
|
|
||||||
projectId,
|
|
||||||
options,
|
|
||||||
startDate,
|
|
||||||
endDate,
|
|
||||||
previous,
|
|
||||||
breakdowns,
|
|
||||||
interval,
|
|
||||||
},
|
|
||||||
isLazyLoading,
|
|
||||||
shareId,
|
|
||||||
} = useReportChartContext();
|
|
||||||
const { range: overviewRange, startDate: overviewStartDate, endDate: overviewEndDate, interval: overviewInterval } = useOverviewOptions();
|
|
||||||
|
|
||||||
const funnelOptions = options?.type === 'funnel' ? options : undefined;
|
|
||||||
|
|
||||||
const trpc = useTRPC();
|
const trpc = useTRPC();
|
||||||
const input: IReportInput = {
|
|
||||||
series,
|
|
||||||
range: overviewRange ?? range,
|
|
||||||
projectId,
|
|
||||||
interval: overviewInterval ?? interval ?? 'day',
|
|
||||||
chartType: 'funnel',
|
|
||||||
breakdowns,
|
|
||||||
previous,
|
|
||||||
metric: 'sum',
|
|
||||||
startDate: overviewStartDate ?? startDate,
|
|
||||||
endDate: overviewEndDate ?? endDate,
|
|
||||||
limit: 20,
|
|
||||||
options: funnelOptions,
|
|
||||||
};
|
|
||||||
const res = useQuery(
|
const res = useQuery(
|
||||||
trpc.chart.funnel.queryOptions(input, {
|
trpc.chart.funnel.queryOptions(
|
||||||
enabled: !isLazyLoading && input.series.length > 0,
|
{
|
||||||
}),
|
...report,
|
||||||
|
shareId,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
enabled: !isLazyLoading && report.series.length > 0,
|
||||||
|
},
|
||||||
|
),
|
||||||
);
|
);
|
||||||
|
|
||||||
if (isLazyLoading || res.isLoading) {
|
if (isLazyLoading || res.isLoading) {
|
||||||
|
|||||||
@@ -1,7 +1,6 @@
|
|||||||
import { useTRPC } from '@/integrations/trpc/react';
|
import { useTRPC } from '@/integrations/trpc/react';
|
||||||
import { keepPreviousData, useQuery } from '@tanstack/react-query';
|
import { keepPreviousData, useQuery } from '@tanstack/react-query';
|
||||||
|
|
||||||
import { useOverviewOptions } from '@/components/overview/useOverviewOptions';
|
|
||||||
import { AspectContainer } from '../aspect-container';
|
import { AspectContainer } from '../aspect-container';
|
||||||
import { ReportChartEmpty } from '../common/empty';
|
import { ReportChartEmpty } from '../common/empty';
|
||||||
import { ReportChartError } from '../common/error';
|
import { ReportChartError } from '../common/error';
|
||||||
@@ -11,33 +10,14 @@ import { Chart } from './chart';
|
|||||||
import CohortTable from './table';
|
import CohortTable from './table';
|
||||||
|
|
||||||
export function ReportRetentionChart() {
|
export function ReportRetentionChart() {
|
||||||
const {
|
const { isLazyLoading, report, shareId } = useReportChartContext();
|
||||||
report: {
|
const eventSeries = report.series.filter((item) => item.type === 'event');
|
||||||
id,
|
|
||||||
series,
|
|
||||||
range,
|
|
||||||
projectId,
|
|
||||||
options,
|
|
||||||
startDate,
|
|
||||||
endDate,
|
|
||||||
interval,
|
|
||||||
},
|
|
||||||
isLazyLoading,
|
|
||||||
shareId,
|
|
||||||
} = useReportChartContext();
|
|
||||||
const {
|
|
||||||
range: overviewRange,
|
|
||||||
startDate: overviewStartDate,
|
|
||||||
endDate: overviewEndDate,
|
|
||||||
interval: overviewInterval,
|
|
||||||
} = useOverviewOptions();
|
|
||||||
const eventSeries = series.filter((item) => item.type === 'event');
|
|
||||||
const firstEvent = (eventSeries[0]?.filters?.[0]?.value ?? []).map(String);
|
const firstEvent = (eventSeries[0]?.filters?.[0]?.value ?? []).map(String);
|
||||||
const secondEvent = (eventSeries[1]?.filters?.[0]?.value ?? []).map(String);
|
const secondEvent = (eventSeries[1]?.filters?.[0]?.value ?? []).map(String);
|
||||||
const isEnabled =
|
const isEnabled =
|
||||||
firstEvent.length > 0 && secondEvent.length > 0 && !isLazyLoading;
|
firstEvent.length > 0 && secondEvent.length > 0 && !isLazyLoading;
|
||||||
|
|
||||||
const retentionOptions = options?.type === 'retention' ? options : undefined;
|
const retentionOptions = report.options?.type === 'retention' ? report.options : undefined;
|
||||||
const criteria = retentionOptions?.criteria ?? 'on_or_after';
|
const criteria = retentionOptions?.criteria ?? 'on_or_after';
|
||||||
|
|
||||||
const trpc = useTRPC();
|
const trpc = useTRPC();
|
||||||
@@ -46,14 +26,14 @@ export function ReportRetentionChart() {
|
|||||||
{
|
{
|
||||||
firstEvent,
|
firstEvent,
|
||||||
secondEvent,
|
secondEvent,
|
||||||
projectId,
|
projectId: report.projectId,
|
||||||
range: overviewRange ?? range,
|
range: report.range,
|
||||||
startDate: overviewStartDate ?? startDate,
|
startDate: report.startDate,
|
||||||
endDate: overviewEndDate ?? endDate,
|
endDate: report.endDate,
|
||||||
criteria,
|
criteria,
|
||||||
interval: overviewInterval ?? interval,
|
interval: report.interval,
|
||||||
shareId,
|
shareId,
|
||||||
id,
|
id: 'id' in report ? report.id : undefined,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
placeholderData: keepPreviousData,
|
placeholderData: keepPreviousData,
|
||||||
|
|||||||
Reference in New Issue
Block a user