Skip to content

Commit

Permalink
fix use sample data button
Browse files Browse the repository at this point in the history
  • Loading branch information
@liuyl
liuyl committed Sep 3, 2023
1 parent 772eb0a commit d3b5ef3
Show file tree
Hide file tree
Showing 4 changed files with 51 additions and 40 deletions.
6 changes: 5 additions & 1 deletion frontend/src/components/uploader/report-config/CSVBasedReportConfig.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,11 +17,15 @@ const sampleDataPrefills: PrefillConfig = {
selectedColumns: {
userId: {
type: "metric",
aggregationOption: "distinct",
aggregationOption: "nunique",
expectedValue: 0.03,
fieldType: "VARCHAR",
}
},
metricColumn: {
columnNames: ["userId"],
aggregationOption: "nunique",
},
dateColumn: "eventTime",
groupByColumns: ["country", "gender", "majorOsVersion", "phoneBrand", "age", "language", "platform"],
baseDateRange: {
Expand Down
68 changes: 37 additions & 31 deletions frontend/src/components/uploader/report-config/MetricConfig.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,40 +2,27 @@ import { ArrowDownIcon, ArrowUpIcon } from "@heroicons/react/24/outline";
import {
Text
} from "@tremor/react";
import { useEffect, useState } from "react";
import {
AggregationType,
ColumnType,
MetricColumn,
TargetDirection
} from "../../../types/report-config";
import SingleSelector from "../SingleSelector";

type Props = {
getValidMetricColumns: () => string[];
selectedColumns: { [key: string]: { type: string } };
onSelectMetrics: (metrics: string[], type: ColumnType) => void;
onSelectMetricAggregationOption: (metricColumn: MetricColumn, supportingMetric: boolean) => void;
metricColumn?: MetricColumn;
setMetricColumn: (metricColumn: MetricColumn) => void;
targetDirection: TargetDirection;
setTargetDirection: (direction: TargetDirection) => void;
}


const MetricConfig = (props: Props) => {
const { getValidMetricColumns, onSelectMetricAggregationOption, targetDirection, setTargetDirection } = props;
const [metricType, setMetricType] = useState<AggregationType>("sum");
const [metricColumns, setMetricColumns] = useState<string[]>(["", ""]);
const [metricColumnsType, setMetricColumnsType] = useState<AggregationType[]>(["sum", "sum"]);

useEffect(() => {
if (metricColumns.length > 0) {
onSelectMetricAggregationOption({
columnNames: metricColumns,
aggregationOption: metricType,
columnAggregationTypes: metricType === "ratio" ? metricColumnsType : undefined,
} as MetricColumn, false);
}
}, [metricColumns, metricType, metricColumnsType, onSelectMetricAggregationOption]);
const { getValidMetricColumns, metricColumn, setMetricColumn, targetDirection, setTargetDirection } = props;
const metricType = metricColumn?.aggregationOption;
const metricColumns = metricColumn?.columnNames;
const metricColumnsType = metricColumn?.columnAggregationTypes;

const singularMetrics = () => {
return (
Expand All @@ -47,9 +34,12 @@ const MetricConfig = (props: Props) => {
}
labels={getValidMetricColumns()}
values={getValidMetricColumns()}
selectedValue={metricColumns[0]}
selectedValue={metricColumns ? metricColumns[0] : ""}
onValueChange={(metric) => {
setMetricColumns([metric])
setMetricColumn({
...metricColumn,
columnNames: [metric],
})
}}
/>);
};
Expand All @@ -66,9 +56,13 @@ const MetricConfig = (props: Props) => {
}
labels={["Sum", "Count", "Distinct"]}
values={["sum", "count", "nunique"]}
selectedValue={metricColumnsType[0]}
selectedValue={metricColumnsType ? metricColumnsType[0] : ""}
onValueChange={(metric) => {
setMetricColumnsType([metric as AggregationType, metricColumnsType[1]]);
// setMetricColumnsType([metric as AggregationType, metricColumnsType[1]]);
setMetricColumn({
...metricColumn,
columnAggregationTypes: [metric as AggregationType, metricColumnsType ? metricColumnsType[1] : "sum"],
})
}}
/>
<SingleSelector
Expand All @@ -79,9 +73,12 @@ const MetricConfig = (props: Props) => {
}
labels={getValidMetricColumns()}
values={getValidMetricColumns()}
selectedValue={metricColumns[0]}
selectedValue={metricColumns ? metricColumns[0] : ""}
onValueChange={(metric) => {
setMetricColumns([metric, metricColumns[1]])
setMetricColumn({
...metricColumn,
columnNames: [metric, metricColumns ? metricColumns[1] : ""],
})
}}
/>

Expand All @@ -94,9 +91,12 @@ const MetricConfig = (props: Props) => {
}
labels={["Sum", "Count", "Distinct"]}
values={["sum", "count", "nunique"]}
selectedValue={metricColumnsType[1]}
selectedValue={metricColumnsType ? metricColumnsType[1] : ""}
onValueChange={(metric) => {
setMetricColumnsType([metricColumnsType[0], metric as AggregationType]);
setMetricColumn({
...metricColumn,
columnAggregationTypes: [metricColumnsType ? metricColumnsType[0] : "sum", metric as AggregationType],
})
}}
/>
<SingleSelector
Expand All @@ -107,9 +107,12 @@ const MetricConfig = (props: Props) => {
}
labels={getValidMetricColumns()}
values={getValidMetricColumns()}
selectedValue={metricColumns[1]}
selectedValue={metricColumns ? metricColumns[1] : ""}
onValueChange={(metric) => {
setMetricColumns([metricColumns[0], metric])
setMetricColumn({
...metricColumn,
columnNames: [metricColumns ? metricColumns[0] : "", metric],
})
}}
/>

Expand All @@ -127,9 +130,12 @@ const MetricConfig = (props: Props) => {
}
labels={["Sum", "Count", "Distinct", "Ratio"]}
values={["sum", "count", "nunique", "ratio"]}
selectedValue={metricType}
selectedValue={metricType ? metricType : ""}
onValueChange={(metric) => {
setMetricType(metric as AggregationType);
setMetricColumn({
...metricColumn,
aggregationOption: metric as AggregationType,
})
}}
/>

Expand Down
10 changes: 5 additions & 5 deletions frontend/src/components/uploader/report-config/ReportConfig.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -87,6 +87,7 @@ function ReportConfig({
useEffect(() => {
if (prefilledConfigs) {
setSelectedColumns(prefilledConfigs.selectedColumns);
setMetricColumn(prefilledConfigs.metricColumn);
setDateColumn(prefilledConfigs.dateColumn);
setGroupByColumns(prefilledConfigs.groupByColumns);
}
Expand Down Expand Up @@ -225,7 +226,7 @@ function ReportConfig({
}

function canSubmit() {
const hasMetricColumn = metricColumn !== undefined && metricColumn.columnNames.length > 0;
const hasMetricColumn = metricColumn !== undefined && metricColumn.columnNames && metricColumn.columnNames.length > 0;

const hasDimensionColumn = groupByColumns.length > 0;

Expand Down Expand Up @@ -270,7 +271,7 @@ function ReportConfig({
selectedColumns[h]["type"] === "date")
)
)
.filter((h) => !metricColumn || metricColumn.columnNames.indexOf(h) === -1)
.filter((h) => !metricColumn || metricColumn.columnNames?.indexOf(h) === -1)
.filter((h) => dateColumn !== h)
.filter((h) => {
if (Object.keys(rowCountByColumn).length === 0) {
Expand Down Expand Up @@ -373,9 +374,8 @@ function ReportConfig({
{/* Analysing metric single selector */}
<MetricConfig
getValidMetricColumns={getValidMetricColumns}
selectedColumns={selectedColumns}
onSelectMetrics={onSelectMetrics}
onSelectMetricAggregationOption={onSelectMetricAggregationOption}
metricColumn={metricColumn}
setMetricColumn={setMetricColumn}
targetDirection={targetDirection}
setTargetDirection={setTargetDirection}
/>
Expand Down
7 changes: 4 additions & 3 deletions frontend/src/types/report-config.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,12 +2,12 @@ import { DateRangePickerValue } from "@tremor/react";
import { FieldType } from "./data-source";

export type ColumnType = "metric" | "supporting_metric" | "dimension" | "date";
export type AggregationType = "sum" | "count" | "distinct" | "ratio";
export type AggregationType = "sum" | "count" | "nunique" | "ratio";
export type TargetDirection = "increasing" | "decreasing";

export interface MetricColumn {
aggregationOption: AggregationType;
columnNames: string[];
aggregationOption?: AggregationType;
columnNames?: string[];
columnAggregationTypes?: AggregationType[];
expectedValue?: number;
}
Expand Down Expand Up @@ -35,6 +35,7 @@ export interface PrefillConfig {
selectedColumns: {
[key: string]: ColumnConfig;
};
metricColumn: MetricColumn;
dateColumn: string;
groupByColumns: string[];
baseDateRange: DateRangePickerValue;
Expand Down

0 comments on commit d3b5ef3

Please sign in to comment.