Add ability to filter by number of surgeries performed by surgeon

visdesignlab · Jan 29, 2025 · 4ecefda · 4ecefda
1 parent bb9e0f5
commit 4ecefda
Show file tree

Hide file tree

Showing 6 changed files with 67 additions and 4 deletions.
diff --git a/frontend/src/Components/Utilities/FilterInterface/FilterBoard.tsx b/frontend/src/Components/Utilities/FilterInterface/FilterBoard.tsx
@@ -1,9 +1,9 @@
 import {
-  Box, Button, IconButton, List, ListItem, ListItemButton, ListItemSecondaryAction, ListItemText, TextField, Tooltip,
+  Box, Button, IconButton, List, ListItem, ListItemButton, ListItemSecondaryAction, ListItemText, Slider, TextField, Tooltip,
 } from '@mui/material';
 import CloseIcon from '@mui/icons-material/Close';
 import { observer } from 'mobx-react';
-import { useContext, useState } from 'react';
+import { useContext, useMemo, useState } from 'react';
 import ReplayIcon from '@mui/icons-material/Replay';
 import { DesktopDatePicker, LocalizationProvider } from '@mui/x-date-pickers';
 import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns';
@@ -22,7 +22,7 @@ function FilterBoard() {
   const store = useContext(Store);
 
   const {
-    rawDateRange, outcomeFilter, surgeryUrgencySelection, currentSelectPatientGroup, currentOutputFilterSet, bloodFilter,
+    rawDateRange, outcomeFilter, surgeryUrgencySelection, currentSelectPatientGroup, currentOutputFilterSet, bloodFilter, surgeonCasesPerformed,
   } = store.provenanceState;
   const [beginDate, setBeginDate] = useState<number | null>(rawDateRange[0]);
   const [endDate, setEndDate] = useState<number | null>(rawDateRange[1]);
@@ -58,6 +58,12 @@ function FilterBoard() {
     return false;
   };
 
+  const fullSurgeonCasesPerformedRange = useMemo(() => {
+    const min = 0;
+    const max = Math.max(...Object.values(store.surgeonCasesPerformedRange));
+    return [min, max] as [number, number];
+  }, [store.surgeonCasesPerformedRange]);
+
   return (
     <Box p={1}>
       <List dense>
@@ -178,6 +184,38 @@ function FilterBoard() {
         </ListItem>
         <SurgeryUrgencyChipGroup />
 
+        <ListItem>
+          <ListItemText primary={<Title>Surgeon Cases Performed</Title>} />
+          <ListItemSecondaryAction>
+
+            <IconButton
+              onClick={() => { store.configStore.changeSurgeonCasesPerformed(fullSurgeonCasesPerformedRange); }}
+              disabled={surgeonCasesPerformed[0] === fullSurgeonCasesPerformedRange[0] && surgeonCasesPerformed[1] === fullSurgeonCasesPerformedRange[1]}
+            >
+              <Tooltip title="Clear">
+                <ReplayIcon />
+              </Tooltip>
+            </IconButton>
+
+          </ListItemSecondaryAction>
+        </ListItem>
+        <ListItem>
+          <ListItemText
+            secondary={(
+              <Slider
+                value={surgeonCasesPerformed}
+                onChange={(event, value) => { store.configStore.changeSurgeonCasesPerformed(value as [number, number]); }}
+                marks={[
+                  0,
+                  Math.max(...Object.values(store.surgeonCasesPerformedRange)),
+                ].map((d) => ({ value: d, label: d.toString() }))}
+                max={Math.max(...Object.values(store.surgeonCasesPerformedRange))}
+                step={1}
+              />
+            )}
+          />
+        </ListItem>
+
         <ListItem>
           <ListItemText primary={<Title>Selection Filter</Title>} />
           <ListItemSecondaryAction>

diff --git a/frontend/src/Interfaces/Actions/ProjectConfigActions.ts b/frontend/src/Interfaces/Actions/ProjectConfigActions.ts
@@ -34,6 +34,10 @@ export const changeSurgeryUrgencySelection = createAction<ApplicationState, [[bo
   state.surgeryUrgencySelection = surgeryUrgencyInput;
 }).setLabel('changeUrgency');
 
+export const changeSurgeonCasesPerformed = createAction<ApplicationState, [[number, number]], ActionEvents>((state, surgeonCasesPerformed) => {
+  state.surgeonCasesPerformed = surgeonCasesPerformed;
+}).setLabel('changeSurgeonCasesPerformed');
+
 export const changeBloodFilter = createAction<ApplicationState, [BloodComponent | HemoOption, [number, number]], ActionEvents>((state, bloodComponentName, newRange) => {
   state.bloodFilter[bloodComponentName] = newRange;
 }).setLabel('changeBloodFilter');

diff --git a/frontend/src/Interfaces/DefaultState.ts b/frontend/src/Interfaces/DefaultState.ts
@@ -7,6 +7,7 @@ today.setDate(today.getDate() + 1);
 export const defaultState: ApplicationState = {
   layoutArray: [],
   surgeryUrgencySelection: [true, true, true],
+  surgeonCasesPerformed: [0, ManualInfinity],
   outcomeFilter: [],
   rawDateRange: [new Date(2018, 2, 6).getTime(), today.getTime()],
   proceduresSelection: [],

diff --git a/frontend/src/Interfaces/ProjectConfigStore.ts b/frontend/src/Interfaces/ProjectConfigStore.ts
@@ -3,7 +3,7 @@ import {
   BloodComponent, BloodComponentOptions, HemoOption, ScatterYOptions,
 } from '../Presets/DataDict';
 import {
-  changeBloodFilter, changeCostConfig, changeOutcomeFilter, changeSurgeryUrgencySelection, clearAllFilter, dateRangeChange, loadPreset, resetBloodFilter, toggleShowZero,
+  changeBloodFilter, changeCostConfig, changeOutcomeFilter, changeSurgeryUrgencySelection, clearAllFilter, dateRangeChange, loadPreset, resetBloodFilter, toggleShowZero, changeSurgeonCasesPerformed,
 } from './Actions/ProjectConfigActions';
 // eslint-disable-next-line import/no-cycle
 import { RootStore } from './Store';
@@ -82,6 +82,10 @@ export class ProjectConfigStore {
     this.provenance.apply(changeSurgeryUrgencySelection(input));
   }
 
+  changeSurgeonCasesPerformed(input: [number, number]) {
+    this.provenance.apply(changeSurgeonCasesPerformed(input));
+  }
+
   changeCostConfig(componentName: string, newCost: number) {
     this.provenance.apply(changeCostConfig(componentName, newCost));
   }

diff --git a/frontend/src/Interfaces/Store.ts b/frontend/src/Interfaces/Store.ts
@@ -80,6 +80,10 @@ export class RootStore {
       if (!this.provenanceState.surgeryUrgencySelection[SurgeryUrgencyArray.indexOf(d.SURGERY_TYPE_DESC)]) {
         return false;
       }
+      // surgeon cases performed
+      if (this.surgeonCasesPerformedRange[d.SURGEON_PROV_ID] < this.provenanceState.surgeonCasesPerformed[0] || this.surgeonCasesPerformedRange[d.SURGEON_PROV_ID] > this.provenanceState.surgeonCasesPerformed[1]) {
+        return false;
+      }
 
       if (
         this.provenanceState.currentSelectPatientGroup.length > 0
@@ -148,6 +152,17 @@ export class RootStore {
     return filterRange;
   }
 
+  get surgeonCasesPerformedRange() {
+    const surgeonCases = this._allCases.reduce((acc, d) => {
+      if (!acc[d.SURGEON_PROV_ID]) {
+        acc[d.SURGEON_PROV_ID] = 0;
+      }
+      acc[d.SURGEON_PROV_ID] += 1;
+      return acc;
+    }, {} as Record<string, number>);
+    return surgeonCases;
+  }
+
   get dateRange() {
     return [timeFormat('%d-%b-%Y')(new Date(this.provenanceState.rawDateRange[0])), timeFormat('%d-%b-%Y')(new Date(this.provenanceState.rawDateRange[1]))];
   }

diff --git a/frontend/src/Interfaces/Types/StateTypes.ts b/frontend/src/Interfaces/Types/StateTypes.ts
@@ -8,6 +8,7 @@ export type ApplicationState = {
     rawDateRange: number[];
     proceduresSelection: ProcedureEntry[];
     surgeryUrgencySelection: [boolean, boolean, boolean];
+    surgeonCasesPerformed: [number, number];
     totalAggregatedCaseCount: number;
     totalIndividualCaseCount: number;
     currentSelectSet: SelectSet[];