fix: better name for hermesfilters; listen for onReset for filters (#…

…5405)
determined-ai · Nov 10, 2022 · 75969d3 · 75969d3
1 parent bf0d2a8
commit 75969d3
Showing 1 changed file with 7 additions and 6 deletions.
diff --git a/webui/react/src/pages/ExperimentDetails/ExperimentVisualization/HpParallelCoordinates.tsx b/webui/react/src/pages/ExperimentDetails/ExperimentVisualization/HpParallelCoordinates.tsx
@@ -88,7 +88,7 @@ const HpParallelCoordinates: React.FC<Props> = ({
   const [filteredTrialIdMap, setFilteredTrialIdMap] = useState<Record<number, boolean>>();
   const [selectedRowKeys, setSelectedRowKeys] = useState<number[]>([]);
   const [showCompareTrials, setShowCompareTrials] = useState(false);
-  const [hermesCreatedFeatures, setHermesCreatedFeatures] = useState<HermesInternalFilters>({});
+  const [hermesCreatedFilters, setHermesCreatedFilters] = useState<HermesInternalFilters>({});
 
   const hyperparameters = useMemo(() => {
     return fullHParams.reduce((acc, key) => {
@@ -121,7 +121,7 @@ const HpParallelCoordinates: React.FC<Props> = ({
 
     // Figure out which trials are filtered out based on user filters.
 
-    Object.entries(hermesCreatedFeatures).forEach(([key, list]) => {
+    Object.entries(hermesCreatedFilters).forEach(([key, list]) => {
       if (!chartData.data[key] || list.length === 0) return;
 
       chartData.data[key].forEach((value, index) => {
@@ -143,7 +143,7 @@ const HpParallelCoordinates: React.FC<Props> = ({
     });
 
     setFilteredTrialIdMap(newFilteredTrialIdMap);
-  }, [chartData, hermesCreatedFeatures]);
+  }, [chartData, hermesCreatedFilters]);
 
   useEffect(() => {
     resetFilteredTrials();
@@ -155,9 +155,10 @@ const HpParallelCoordinates: React.FC<Props> = ({
 
   const config: Hermes.RecursivePartial<Hermes.Config> = useMemo(
     () => ({
-      filters: hermesCreatedFeatures,
+      filters: hermesCreatedFilters,
       hooks: {
-        onFilterChange: setHermesCreatedFeatures,
+        onFilterChange: setHermesCreatedFilters,
+        onReset: () => setHermesCreatedFilters({}),
       },
       style: {
         axes: { label: { placement: 'after' } },
@@ -171,7 +172,7 @@ const HpParallelCoordinates: React.FC<Props> = ({
         padding: [4, 120, 4, 16],
       },
     }),
-    [colorScale, setHermesCreatedFeatures, hermesCreatedFeatures, selectedMetric],
+    [colorScale, setHermesCreatedFilters, hermesCreatedFilters, selectedMetric],
   );
 
   const dimensions = useMemo(() => {