From 97451f16f8f7da636bc9f4f000ec0ef66af9061d Mon Sep 17 00:00:00 2001
From: SarahBellaha <sarah.bellaha@sncf.fr>
Date: Wed, 9 Oct 2024 10:49:42 +0200
Subject: [PATCH] ui-core: add prop to disable default filtering in combo box
 component

Signed-off-by: SarahBellaha <sarah.bellaha@sncf.fr>
---
 ui-core/src/components/inputs/ComboBox/ComboBox.tsx | 11 +++++++++--
 ui-core/src/stories/ComboBox.stories.tsx            | 13 +++++++++++--
 2 files changed, 20 insertions(+), 4 deletions(-)

diff --git a/ui-core/src/components/inputs/ComboBox/ComboBox.tsx b/ui-core/src/components/inputs/ComboBox/ComboBox.tsx
index daaeba1e..208d9032 100644
--- a/ui-core/src/components/inputs/ComboBox/ComboBox.tsx
+++ b/ui-core/src/components/inputs/ComboBox/ComboBox.tsx
@@ -23,6 +23,7 @@ export type ComboBoxProps<T> = InputProps & {
   exactSearch?: boolean;
   value?: string;
   onSelectSuggestion?: (option: T | undefined) => void;
+  disableDefaultFilter?: boolean;
 };
 
 const ComboBox = <T,>({
@@ -35,6 +36,7 @@ const ComboBox = <T,>({
   value,
   small,
   onSelectSuggestion,
+  disableDefaultFilter = false,
   ...inputProps
 }: ComboBoxProps<T>) => {
   const [filteredSuggestions, setFilteredSuggestions] = useState<T[]>([]);
@@ -46,8 +48,13 @@ const ComboBox = <T,>({
   const inputRef = useRef<HTMLInputElement>(null);
 
   const sortedSuggestions = useMemo(
-    () => suggestions.sort((a, b) => getSuggestionLabel(a).localeCompare(getSuggestionLabel(b))),
-    [suggestions, getSuggestionLabel]
+    () =>
+      !disableDefaultFilter
+        ? [...suggestions].sort((a, b) =>
+            getSuggestionLabel(a).localeCompare(getSuggestionLabel(b))
+          )
+        : suggestions,
+    [suggestions, getSuggestionLabel, disableDefaultFilter]
   );
 
   const showSuggestions = isInputFocused && filteredSuggestions.length > 0 && !inputProps.disabled;
diff --git a/ui-core/src/stories/ComboBox.stories.tsx b/ui-core/src/stories/ComboBox.stories.tsx
index 0e833c52..b7c47c0b 100644
--- a/ui-core/src/stories/ComboBox.stories.tsx
+++ b/ui-core/src/stories/ComboBox.stories.tsx
@@ -9,8 +9,9 @@ type Suggestion = { id: string; label: string };
 
 const suggestions = [
   { id: '1', label: 'Manuel' },
-  { id: '2', label: 'Manuela' },
-  { id: '3', label: 'Manuella' },
+  { id: '2', label: 'Consuela' },
+  { id: '3', label: 'Juan' },
+  { id: '4', label: 'Manolo' },
 ] as Suggestion[];
 
 const meta: Meta<typeof ComboBox> = {
@@ -97,3 +98,11 @@ export const SmallInput: Story = {
     small: true,
   },
 };
+
+export const DisabledDefaultFilter: Story = {
+  args: {
+    label: 'Name',
+    type: 'text',
+    disableDefaultFilter: true,
+  },
+};