diff options
| -rw-r--r-- | src-migrate/modules/product-detail/components/Information.tsx | 8 |
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()} |