From a8fb532b74cc097dbf4fdce7990112f3849f490d Mon Sep 17 00:00:00 2001
From: Marco Salazar <marco@elementl.com>
Date: Mon, 9 Oct 2023 09:06:32 -0400
Subject: [PATCH] generic hook

---
 .../ui-core/src/launchpad/LaunchpadHooksContext.tsx |  6 ++++--
 .../ui-core/src/ui/Filters/useStaticSetFilter.tsx   | 13 ++++++++++++-
 2 files changed, 16 insertions(+), 3 deletions(-)

diff --git a/js_modules/dagster-ui/packages/ui-core/src/launchpad/LaunchpadHooksContext.tsx b/js_modules/dagster-ui/packages/ui-core/src/launchpad/LaunchpadHooksContext.tsx
index e3dd0ca036f7a..3759101e9bb3e 100644
--- a/js_modules/dagster-ui/packages/ui-core/src/launchpad/LaunchpadHooksContext.tsx
+++ b/js_modules/dagster-ui/packages/ui-core/src/launchpad/LaunchpadHooksContext.tsx
@@ -17,13 +17,13 @@ type LaunchpadHooksContextValue = {
     error: GenericError | PythonErrorFragment;
     fallback?: React.ReactNode;
   }>;
-  // TODO (salazarm): Remove this prop after cloud PR lands to override UserDisplay instead
-  RunCreatedByCell?: any;
+  StaticFilterSorter?: Record<string, (a: any, b: any) => number>;
 };
 
 export const LaunchpadHooksContext = React.createContext<LaunchpadHooksContextValue>({
   LaunchRootExecutionButton: undefined,
   useLaunchWithTelemetry: undefined,
+  StaticFilterSorter: undefined,
 });
 
 export function useLaunchPadHooks() {
@@ -33,6 +33,7 @@ export function useLaunchPadHooks() {
     MaterializeButton: OverrideMaterializeButton,
     UserDisplay: OverrideUserDisplay,
     PythonErrorInfoHeader,
+    StaticFilterSorter,
   } = React.useContext(LaunchpadHooksContext);
 
   return {
@@ -41,5 +42,6 @@ export function useLaunchPadHooks() {
     MaterializeButton: OverrideMaterializeButton ?? Button,
     PythonErrorInfoHeader,
     UserDisplay: OverrideUserDisplay ?? UserDisplay,
+    StaticFilterSorter,
   };
 }
diff --git a/js_modules/dagster-ui/packages/ui-core/src/ui/Filters/useStaticSetFilter.tsx b/js_modules/dagster-ui/packages/ui-core/src/ui/Filters/useStaticSetFilter.tsx
index 8272542e74f20..14ae372c1feca 100644
--- a/js_modules/dagster-ui/packages/ui-core/src/ui/Filters/useStaticSetFilter.tsx
+++ b/js_modules/dagster-ui/packages/ui-core/src/ui/Filters/useStaticSetFilter.tsx
@@ -2,6 +2,7 @@ import {Box, Checkbox, IconName, Popover} from '@dagster-io/ui-components';
 import React from 'react';
 
 import {useUpdatingRef} from '../../hooks/useUpdatingRef';
+import {LaunchpadHooksContext} from '../../launchpad/LaunchpadHooksContext';
 
 import {FilterObject, FilterTag, FilterTagHighlightedText} from './useFilter';
 
@@ -33,7 +34,7 @@ export function useStaticSetFilter<TValue>({
   name,
   icon,
   getKey,
-  allValues,
+  allValues: _unsortedValues,
   renderLabel,
   renderActiveStateLabel,
   initialState,
@@ -43,6 +44,16 @@ export function useStaticSetFilter<TValue>({
   allowMultipleSelections = true,
   matchType = 'any-of',
 }: Args<TValue>): StaticSetFilter<TValue> {
+  const {StaticFilterSorter} = React.useContext(LaunchpadHooksContext);
+
+  const allValues = React.useMemo(() => {
+    const sorter = StaticFilterSorter?.[name];
+    if (sorter) {
+      return _unsortedValues.sort(sorter);
+    }
+    return _unsortedValues;
+  }, [StaticFilterSorter, name, _unsortedValues]);
+
   const [state, setState] = React.useState(() => new Set(initialState || []));
 
   React.useEffect(() => {