Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(nimbus): change DOU to DAU in Results UI #12067

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
+35 −92
Open

feat(nimbus): change DOU to DAU in Results UI #12067

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
23 changes: 3 additions & 20 deletions experimenter/experimenter/nimbus-ui/src/components/PageResults/TableHighlights/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,6 @@ import {
HIGHLIGHTS_METRICS_LIST,
METRIC,
METRICS_TIPS,
METRIC_TO_GROUP,
TABLE_LABEL,
} from "src/lib/visualization/constants";
import {
Expand All @@ -26,7 +25,6 @@ import {
getExperiment_experimentBySlug_referenceBranch,
getExperiment_experimentBySlug_treatmentBranches,
} from "src/types/getExperiment";
import { NimbusExperimentApplicationEnum } from "src/types/globalTypes";

export type TableHighlightsProps = {
experiment: getExperiment_experimentBySlug;
Expand All @@ -40,21 +38,9 @@ type Branch =
| getExperiment_experimentBySlug_referenceBranch
| getExperiment_experimentBySlug_treatmentBranches;

const getHighlightMetrics = (outcomes: OutcomesList, isDesktop = false) => {
const getHighlightMetrics = (outcomes: OutcomesList) => {
// Make a copy of `HIGHLIGHTS_METRICS_LIST` since we modify it.
const highlightMetricsList = HIGHLIGHTS_METRICS_LIST.map(
(highlightMetric) => {
if (isDesktop && highlightMetric.value === METRIC.DAYS_OF_USE) {
return {
value: METRIC.QUALIFIED_CUMULATIVE_DAYS_OF_USE,
name: "Qualified Cumulative Days of Use",
tooltip: METRICS_TIPS.QUALIFIED_CUMULATIVE_DAYS_OF_USE,
group: METRIC_TO_GROUP[METRIC.QUALIFIED_CUMULATIVE_DAYS_OF_USE],
};
}
return highlightMetric;
},
);
const highlightMetricsList = [...HIGHLIGHTS_METRICS_LIST];
outcomes?.forEach((outcome) => {
if (!outcome?.isDefault) {
return;
Expand Down Expand Up @@ -95,10 +81,7 @@ const TableHighlights = ({
referenceBranch,
}: TableHighlightsProps) => {
const { primaryOutcomes } = useOutcomes(experiment);
const highlightMetricsList = getHighlightMetrics(
primaryOutcomes,
experiment.application === NimbusExperimentApplicationEnum.DESKTOP,
);
const highlightMetricsList = getHighlightMetrics(primaryOutcomes);
const branchDescriptions = getBranchDescriptions(
experiment.referenceBranch,
experiment.treatmentBranches,
Expand Down
2 changes: 1 addition & 1 deletion experimenter/experimenter/nimbus-ui/src/components/PageResults/TableResults/index.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ describe("TableResults", () => {
const EXPECTED_HEADINGS = [
"2-Week Browser Retention",
"Mean Searches Per User",
"Qualified Cumulative Days of Use",
"Daily Active Users",
"Total Users",
];

Expand Down
23 changes: 2 additions & 21 deletions experimenter/experimenter/nimbus-ui/src/components/PageResults/TableResults/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,9 +11,7 @@ import { OutcomesList } from "src/lib/types";
import {
BRANCH_COMPARISON,
GROUP,
METRIC,
METRICS_TIPS,
METRIC_TO_GROUP,
METRIC_TYPE,
RESULTS_METRICS_LIST,
TABLE_LABEL,
Expand All @@ -24,7 +22,6 @@ import {
} from "src/lib/visualization/types";
import { getTableDisplayType } from "src/lib/visualization/utils";
import { getExperiment_experimentBySlug } from "src/types/getExperiment";
import { NimbusExperimentApplicationEnum } from "src/types/globalTypes";

export type TableResultsProps = {
experiment: getExperiment_experimentBySlug;
Expand All @@ -37,18 +34,7 @@ export type TableResultsProps = {

const getResultMetrics = (outcomes: OutcomesList, isDesktop = false) => {
// Make a copy of `RESULTS_METRICS_LIST` since we modify it.
const resultsMetricsList = RESULTS_METRICS_LIST.map((resultMetric) => {
if (isDesktop && resultMetric.value === METRIC.DAYS_OF_USE) {
return {
value: METRIC.QUALIFIED_CUMULATIVE_DAYS_OF_USE,
name: "Qualified Cumulative Days of Use",
tooltip: METRICS_TIPS.QUALIFIED_CUMULATIVE_DAYS_OF_USE,
type: METRIC_TYPE.GUARDRAIL,
group: METRIC_TO_GROUP[METRIC.QUALIFIED_CUMULATIVE_DAYS_OF_USE],
};
}
return resultMetric;
});
const resultsMetricsList = [...RESULTS_METRICS_LIST];
outcomes?.forEach((outcome) => {
if (!outcome?.isDefault) {
return;
Expand All @@ -70,15 +56,10 @@ const TableResults = ({
branchComparison = BRANCH_COMPARISON.UPLIFT,
analysisBasis = "enrollments",
segment = "all",
isDesktop = false,
referenceBranch,
}: TableResultsProps) => {
const { primaryOutcomes } = useOutcomes(experiment);
const resultsMetricsList = getResultMetrics(
primaryOutcomes,
isDesktop ||
experiment.application === NimbusExperimentApplicationEnum.DESKTOP,
);
const resultsMetricsList = getResultMetrics(primaryOutcomes);
const {
analysis: { metadata, overall },
sortedBranchNames,
Expand Down
27 changes: 1 addition & 26 deletions experimenter/experimenter/nimbus-ui/src/components/PageResults/TableResultsWeekly/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,9 +13,6 @@ import {
BRANCH_COMPARISON,
GENERAL_TIPS,
HIGHLIGHTS_METRICS_LIST,
METRIC,
METRICS_TIPS,
METRIC_TO_GROUP,
} from "src/lib/visualization/constants";
import {
AnalysisBases,
Expand All @@ -26,35 +23,13 @@ export type TableResultsWeeklyProps = {
branchComparison?: BranchComparisonValues;
analysisBasis?: AnalysisBases;
segment?: string;
isDesktop?: boolean;
referenceBranch: string;
};

const getHighlightMetrics = (isDesktop = false) => {
// Make a copy of `HIGHLIGHTS_METRICS_LIST` since we modify it.
if (isDesktop) {
const highlightMetricsList = [...HIGHLIGHTS_METRICS_LIST];
return highlightMetricsList.map((highlightMetric) => {
if (highlightMetric.value === METRIC.DAYS_OF_USE) {
return {
value: METRIC.QUALIFIED_CUMULATIVE_DAYS_OF_USE,
name: "Qualified Cumulative Days of Use",
tooltip: METRICS_TIPS.QUALIFIED_CUMULATIVE_DAYS_OF_USE,
group: METRIC_TO_GROUP[METRIC.QUALIFIED_CUMULATIVE_DAYS_OF_USE],
};
}
return highlightMetric;
});
}

return HIGHLIGHTS_METRICS_LIST;
};

const TableResultsWeekly = ({
branchComparison = BRANCH_COMPARISON.UPLIFT,
analysisBasis = "enrollments",
segment = "all",
isDesktop = false,
referenceBranch,
}: TableResultsWeeklyProps) => {
const {
Expand Down Expand Up @@ -90,7 +65,7 @@ const TableResultsWeekly = ({
</span>
<Collapse in={open}>
<div className="mt-2">
{getHighlightMetrics(isDesktop).map((metric, index) => {
{HIGHLIGHTS_METRICS_LIST.map((metric, index) => {
return (
<div key={`${metric.value}_weekly`}>
<h3
Expand Down
4 changes: 0 additions & 4 deletions ...menter/experimenter/nimbus-ui/src/components/PageResults/TableWithTabComparison/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,6 @@ export type TableWithTabComparisonProps = {
className?: string;
analysisBasis?: AnalysisBases;
segment?: string;
isDesktop?: boolean;
referenceBranch: string;
};

Expand All @@ -33,7 +32,6 @@ export const TableWithTabComparison = ({
className = "rounded-bottom mb-5",
analysisBasis = "enrollments",
segment = "all",
isDesktop = false,
referenceBranch,
}: TableWithTabComparisonProps) => (
<Tabs defaultActiveKey={BRANCH_COMPARISON.UPLIFT} className="border-bottom-0">
Expand All @@ -51,7 +49,6 @@ export const TableWithTabComparison = ({
<Table
analysisBasis={analysisBasis}
segment={segment}
isDesktop={isDesktop}
referenceBranch={referenceBranch}
/>
)}
Expand All @@ -74,7 +71,6 @@ export const TableWithTabComparison = ({
branchComparison={BRANCH_COMPARISON.ABSOLUTE}
analysisBasis={analysisBasis}
segment={segment}
isDesktop={isDesktop}
referenceBranch={referenceBranch}
/>
</>
Expand Down
9 changes: 0 additions & 9 deletions experimenter/experimenter/nimbus-ui/src/components/PageResults/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,6 @@ import {
import { GROUP, METRIC_TYPE } from "src/lib/visualization/constants";
import { AnalysisBases, AnalysisError } from "src/lib/visualization/types";
import { getSortedBranchNames } from "src/lib/visualization/utils";
import { NimbusExperimentApplicationEnum } from "src/types/globalTypes";

const PageResults: React.FunctionComponent<RouteComponentProps> = () => {
const { experiment, analysis, useRedirectCondition, useAnalysisRequired } =
Expand Down Expand Up @@ -463,10 +462,6 @@ const PageResults: React.FunctionComponent<RouteComponentProps> = () => {
className="rounded-bottom mb-3 border-top-0"
analysisBasis={selectedAnalysisBasis}
segment={selectedSegment}
isDesktop={
experiment.application ===
NimbusExperimentApplicationEnum.DESKTOP
}
referenceBranch={selectedReferenceBranch}
/>
)}
Expand All @@ -480,10 +475,6 @@ const PageResults: React.FunctionComponent<RouteComponentProps> = () => {
Table={TableResultsWeekly}
analysisBasis={selectedAnalysisBasis}
segment={selectedSegment}
isDesktop={
experiment.application ===
NimbusExperimentApplicationEnum.DESKTOP
}
referenceBranch={selectedReferenceBranch}
/>
)}
Expand Down
23 changes: 12 additions & 11 deletions experimenter/experimenter/nimbus-ui/src/lib/visualization/constants.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ export const METRICS_TIPS = {
DAYS_OF_USE: "Average number of days each client sent a main ping",
QUALIFIED_CUMULATIVE_DAYS_OF_USE:
"Average number of days each client sent a main ping",
DAILY_ACTIVE_USERS: "Average number of client that sent a main ping per day",
};

export const SEGMENT_TIPS = {
Expand Down Expand Up @@ -63,9 +64,8 @@ export const SIGNIFICANCE = {
export const METRIC = {
RETENTION: "retained",
SEARCH: "search_count",
DAYS_OF_USE: "days_of_use",
DAILY_ACTIVE_USERS: "client_level_daily_active_users_v2",
USER_COUNT: "identity",
QUALIFIED_CUMULATIVE_DAYS_OF_USE: "qualified_cumulative_days_of_use",
};

export const METRIC_TYPE = {
Expand Down Expand Up @@ -138,11 +138,12 @@ const GROUPED_METRICS = [
"identity",
"days_of_use",
"qualified_cumulative_days_of_use",
"client_level_daily_active_users_v2",
],
},
];

export const METRIC_TO_GROUP = GROUPED_METRICS.reduce((res, group) => {
const METRIC_TO_GROUP = GROUPED_METRICS.reduce((res, group) => {
group.metrics.forEach((metric) => {
res[metric] = group.name;
});
Expand All @@ -165,10 +166,10 @@ export const HIGHLIGHTS_METRICS_LIST = [
group: METRIC_TO_GROUP[METRIC.SEARCH],
},
{
value: METRIC.DAYS_OF_USE,
name: "Days of Use",
tooltip: METRICS_TIPS.DAYS_OF_USE,
group: METRIC_TO_GROUP[METRIC.DAYS_OF_USE],
value: METRIC.DAILY_ACTIVE_USERS,
name: "Daily Active Users",
tooltip: METRICS_TIPS.DAILY_ACTIVE_USERS,
group: METRIC_TO_GROUP[METRIC.DAILY_ACTIVE_USERS],
},
];

Expand All @@ -190,11 +191,11 @@ export const RESULTS_METRICS_LIST = [
group: METRIC_TO_GROUP[METRIC.SEARCH],
},
{
value: METRIC.DAYS_OF_USE,
name: "Overall Mean Days of Use Per User",
tooltip: METRICS_TIPS.DAYS_OF_USE,
value: METRIC.DAILY_ACTIVE_USERS,
name: "Daily Active users",
tooltip: METRICS_TIPS.DAILY_ACTIVE_USERS,
type: METRIC_TYPE.GUARDRAIL,
group: METRIC_TO_GROUP[METRIC.DAYS_OF_USE],
group: METRIC_TO_GROUP[METRIC.DAILY_ACTIVE_USERS],
},
{
value: METRIC.USER_COUNT,
Expand Down
Loading