Merged in BF/bug-select-variant (pull request #382)

BF/bug select variant

1 files changed, 6 insertions, 2 deletions

diff --git a/src-migrate/modules/product-detail/components/Information.tsx b/src-migrate/modules/product-detail/components/Information.tsx
index ec606423..b9f4be91 100644
--- a/src-migrate/modules/product-detail/components/Information.tsx
+++ b/src-migrate/modules/product-detail/components/Information.tsx
@@ -35,7 +35,7 @@ const Information = ({ product }: Props) => {
   const [inputValue, setInputValue] = useState<string | null>(
     selectedVariant?.code + ' - ' + selectedVariant?.attributes[0]
   );
-
+  const [disableFilter, setDisableFilter] = useState<boolean>(false);
   const inputRef = useRef<HTMLInputElement>(null);
 
   const [variantOptions, setVariantOptions] = useState<any[]>(
@@ -68,6 +68,7 @@ const Information = ({ product }: Props) => {
   }, [selectedVariant]);
 
   const handleOnChange = (vals: any) => {
+    setDisableFilter(true);
     let code = vals.replace(/\s-\s.*$/, '').trim();
     let variant = variantOptions.find((item) => item.code === code);
     setSelectedVariant(variant);
@@ -85,6 +86,7 @@ const Information = ({ product }: Props) => {
   };
 
   const handleOnKeyUp = (e: any) => {
+    setDisableFilter(false);
     setInputValue(e.target.value);
   };
 
@@ -98,6 +100,7 @@ const Information = ({ product }: Props) => {
           </span>{' '}
         </label>
         <AutoComplete
+          disableFilter={disableFilter}
           openOnFocus
           className='form-input'
           onChange={(vals) => handleOnChange(vals)}
@@ -107,8 +110,9 @@ const Information = ({ product }: Props) => {
               ref={inputRef}
               value={inputValue as string}
               onChange={(e) => handleOnKeyUp(e)}
+              onFocus={() => setDisableFilter(true)}
             />
-            <InputRightElement>
+            <InputRightElement className='mr-4'>
               <ChevronDownIcon
                 className='h-6 w-6 text-gray-500'
                 onClick={() => inputRef?.current?.focus()}