Merge pull request #323 from dd3tech/fix/single-select-options

Fix(SingleSelect): Update state options

Author: arielsrodriguez

src/components/Form/SingleSelect.tsx

@@ -82,6 +82,7 @@ function SingleSelect({
   const [selectedOption, setSelectedOption] = useState<ISelectOption | null>(
     null
   )
+  const [newValue, setNewValue] = useState(value)
   const [options, setOptions] = useState<ISelectOption[]>(optionsList)
 
   const handleClick = () => {
@@ -124,6 +125,10 @@ function SingleSelect({
     onChangeSelect?.(option)
   }
 
+  useEffect(() => {
+    setOptions(optionsList)
+  }, [optionsList])
+
   useEffect(() => {
     const handleClickOutside = (e: globalThis.MouseEvent) => {
       if (selectRef.current && !selectRef.current.contains(e.target as Node)) {
@@ -138,14 +143,18 @@ function SingleSelect({
   }, [])
 
   useEffect(() => {
-    if (!value) return
+    if (!newValue) return
     setOptions(
       optionsList.map((option) =>
         option.value === value ? { ...option, selected: true } : option
       )
     )
   }, [])
 
+  useEffect(() => {
+    setNewValue(value)
+  }, [value])
+
   return (
     <div
       ref={selectRef}
@@ -171,7 +180,7 @@ function SingleSelect({
         )}
         <input
           placeholder={isFilter ? placeholder : ''}
-          value={selectedOption?.label}
+          value={selectedOption?.label || newValue}
           {...otherProps}
           className={composeClasses(
             'outline-none w-full bg-transparent truncate text-sm',