From 2a78bb5003869713aa083bda441a39f26a9db1f5 Mon Sep 17 00:00:00 2001
From: Iacopo Leardini <iacopo.lea@gmail.com>
Date: Fri, 18 Oct 2024 11:27:41 +0200
Subject: [PATCH] add invalid on option click behaviour

---
 src/stories/dropdowns/autocomplete/index.stories.tsx | 7 ++++++-
 src/stories/dropdowns/autocomplete/index.tsx         | 5 ++---
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/src/stories/dropdowns/autocomplete/index.stories.tsx b/src/stories/dropdowns/autocomplete/index.stories.tsx
index a1853dcc..8cef70b3 100644
--- a/src/stories/dropdowns/autocomplete/index.stories.tsx
+++ b/src/stories/dropdowns/autocomplete/index.stories.tsx
@@ -37,7 +37,12 @@ const TemplateCreatable: Story<AutocompleteProps> = (args) => {
         onCreateNewOption={async (inputValue) => {
           // mock a promise to create a new item
           return await new Promise((resolve) => setTimeout(() => {
-            resolve({ label: inputValue, value: inputValue, id: inputValue });
+            if (inputValue === "invalid") {
+              alert("Invalid value");
+              resolve(false);
+            } else {
+              resolve({ label: inputValue, value: inputValue, id: inputValue });
+            }
           }, 1000));
         }}
         onOptionClick={({ selectionValue }) => {
diff --git a/src/stories/dropdowns/autocomplete/index.tsx b/src/stories/dropdowns/autocomplete/index.tsx
index bd79b011..80a87556 100644
--- a/src/stories/dropdowns/autocomplete/index.tsx
+++ b/src/stories/dropdowns/autocomplete/index.tsx
@@ -20,7 +20,7 @@ export interface AutocompleteProps extends IComboboxProps {
   onOptionClick?: ({ inputValue, selectionValue }: OnOptionClickArgs) => void;
   onInputChange?: (inputValue: string) => void;
   isCreatable?: boolean;
-  onCreateNewOption?: (inputValue: string) => Promise<IOption>;
+  onCreateNewOption?: (inputValue: string) => Promise<IOption | false>;
   options: Array<IOptGroup | IOption>;
 }
 // debounce a function call
@@ -96,7 +96,6 @@ const Autocomplete = ({ options, onOptionClick, onInputChange, onChange, isCreat
       if (typeof onInputChange === 'function') onInputChange(sanitizedInputValue);
     }
     if (event.type === "option:click" && typeof onOptionClick === 'function') {
-      // setSelectionValue(event.selectionValue);
       setInputValue(undefined);
       onOptionClick({ inputValue: event.inputValue, selectionValue: event.selectionValue });
     }
@@ -131,7 +130,7 @@ const Autocomplete = ({ options, onOptionClick, onInputChange, onChange, isCreat
           onClickCapture={async (e) => {
             if (typeof onCreateNewOption === 'function') {
               const newOption = await onCreateNewOption(e.currentTarget.title);
-              setOption(pre => [...pre, newOption]);
+              if (newOption) setOption(pre => [...pre, newOption]);
             }
           }}
         >