Add debug control

empower-ai · Sep 29, 2023 · 6f47a96 · 6f47a96
1 parent 247a009
commit 6f47a96
Show file tree

Hide file tree

Showing 3 changed files with 65 additions and 7 deletions.
diff --git a/frontend/src/components/main-dashboard/MainDashboard.tsx b/frontend/src/components/main-dashboard/MainDashboard.tsx
@@ -203,6 +203,7 @@ export default function MainDashboard() {
         ];
       }
     }
+
     return (
       <Sidebar
         elements={[

diff --git a/frontend/src/components/main-dashboard/SidebarReportConfig.tsx b/frontend/src/components/main-dashboard/SidebarReportConfig.tsx
@@ -1,6 +1,10 @@
-import { Button, Flex, Text } from "@tremor/react";
+import { Button, Divider, Flex, Text } from "@tremor/react";
 import { useRef, useState } from "react";
+import { useDispatch, useSelector } from "react-redux";
+import getSettings from "../../common/server-data/settings";
 import { Filter } from "../../common/types";
+import { RootState } from "../../store";
+import { setShouldUsePScore } from "../../store/comparisonInsight";
 import { Schema } from "../../types/data-source";
 import { DateRangeRelatedData } from "../../types/report-config";
 import {
@@ -34,6 +38,11 @@ export function SidebarReportConfig({
   dateRangeData,
   onSubmit,
 }: Props) {
+  const dispatch = useDispatch();
+  const shouldUsePScore = useSelector(
+    (state: RootState) => state.comparisonInsight.shouldUsePScore
+  );
+
   const [localFilters, setLocalFilters] = useState<Filter[]>(filters);
   const [localDimensions, setLocalDimensions] = useState<string[]>(dimensions);
   const [localBaseDateRangeData, setLocalBaseDateRangeData] =
@@ -82,6 +91,34 @@ export function SidebarReportConfig({
       hasChangeInComparisonDateRange
     );
   }
+
+  function renderDebugControl() {
+    if (!getSettings().showDebugInfo) {
+      return null;
+    }
+
+    return (
+      <>
+        <Divider className="py-0 my-0" />
+        <Text color="red">DEBUG CONTROL</Text>
+        <Flex>
+          <Text>Use PScore</Text>
+          <label className="label cursor-pointer content-center">
+            <input
+              type="checkbox"
+              className="toggle"
+              onChange={() => {
+                dispatch(setShouldUsePScore(!shouldUsePScore));
+              }}
+              checked={shouldUsePScore}
+            />
+          </label>
+        </Flex>
+        <Divider className="py-0 my-0" />
+      </>
+    );
+  }
+
   return (
     <>
       <Flex
@@ -129,6 +166,7 @@ export function SidebarReportConfig({
           }
           ref={filtersDropDownRef}
         />
+        {renderDebugControl()}
         <Flex justifyContent="end" className="gap-1">
           <Button
             disabled={!hasLocalChange() || localDimensions.length === 0}

diff --git a/frontend/src/store/comparisonInsight.ts b/frontend/src/store/comparisonInsight.ts
@@ -47,6 +47,7 @@ export interface ComparisonInsightState {
   groupRows: boolean;
   mode: "impact" | "outlier";
   sensitivity: "low" | "medium" | "high";
+  shouldUsePScore: boolean;
 }
 
 const THRESHOLD = {
@@ -186,7 +187,8 @@ function buildRowStatusMap(
   metric: InsightMetric,
   groupRows: boolean,
   mode: "impact" | "outlier" = "impact",
-  sensitivity: "low" | "medium" | "high" = "medium"
+  sensitivity: "low" | "medium" | "high" = "medium",
+  shouldUsePScore: boolean
 ): [
   {
     [key: string]: RowStatus;
@@ -203,7 +205,8 @@ function buildRowStatusMap(
     const changeDev = sliceInfo.changeDev;
     return (
       mode === "impact" ||
-      (changeDev > THRESHOLD[sensitivity] && sliceInfo.confidence < 0.05)
+      (changeDev > THRESHOLD[sensitivity] &&
+        (!shouldUsePScore || sliceInfo.confidence < 0.05))
     );
   });
 
@@ -423,6 +426,7 @@ const initialState: ComparisonInsightState = {
   groupRows: true,
   mode: "outlier",
   sensitivity: "medium",
+  shouldUsePScore: true,
 };
 
 export const comparisonMetricsSlice = createSlice({
@@ -454,7 +458,8 @@ export const comparisonMetricsSlice = createSlice({
         state.analyzingMetrics,
         true,
         state.mode,
-        state.sensitivity
+        state.sensitivity,
+        state.shouldUsePScore
       );
       state.tableRowStatusByDimension = buildRowStatusByDimensionMap(
         state.analyzingMetrics
@@ -470,7 +475,8 @@ export const comparisonMetricsSlice = createSlice({
         state.analyzingMetrics,
         true,
         state.mode,
-        state.sensitivity
+        state.sensitivity,
+        state.shouldUsePScore
       );
     },
     setSensitivity: (
@@ -482,7 +488,8 @@ export const comparisonMetricsSlice = createSlice({
         state.analyzingMetrics,
         true,
         state.mode,
-        state.sensitivity
+        state.sensitivity,
+        state.shouldUsePScore
       );
     },
     toggleRow: (
@@ -549,7 +556,18 @@ export const comparisonMetricsSlice = createSlice({
         state.analyzingMetrics,
         state.groupRows,
         state.mode,
-        state.sensitivity
+        state.sensitivity,
+        state.shouldUsePScore
+      );
+    },
+    setShouldUsePScore: (state, action: PayloadAction<boolean>) => {
+      state.shouldUsePScore = action.payload;
+      [state.tableRowStatus, state.tableRowCSV] = buildRowStatusMap(
+        state.analyzingMetrics,
+        state.groupRows,
+        state.mode,
+        state.sensitivity,
+        state.shouldUsePScore
       );
     },
   },
@@ -564,6 +582,7 @@ export const {
   toggleGroupRows,
   setMode,
   setSensitivity,
+  setShouldUsePScore,
 } = comparisonMetricsSlice.actions;
 
 export default comparisonMetricsSlice.reducer;