diff --git a/packages/common/src/select/select.js b/packages/common/src/select/select.js index ae4555364..224b1de55 100644 --- a/packages/common/src/select/select.js +++ b/packages/common/src/select/select.js @@ -12,7 +12,7 @@ const Select = ({ simpleValue = true, isMulti, pluckSingleValue = true, - options: propsOptions = [], + options: propsOptions, loadOptions, loadingMessage, placeholder = 'Choose...', diff --git a/packages/common/src/use-select/use-select.js b/packages/common/src/use-select/use-select.js index 98c911e1a..07503438a 100644 --- a/packages/common/src/use-select/use-select.js +++ b/packages/common/src/use-select/use-select.js @@ -1,4 +1,4 @@ -import { useEffect, useReducer } from 'react'; +import { useEffect, useReducer, useState } from 'react'; import isEqual from 'lodash/isEqual'; @@ -58,7 +58,7 @@ const handleSelectChange = (option, simpleValue, isMulti, onChange, allOptions, const useSelect = ({ loadOptions, optionsTransformer, - options: propsOptions, + options: initialOptions = [], noValueUpdates, onChange, value, @@ -69,9 +69,16 @@ const useSelect = ({ simpleValue, compareValues, }) => { - const [state, originalDispatch] = useReducer(reducer, { optionsTransformer, propsOptions }, init); + const [propsOptions, setPropsCache] = useState(initialOptions); + const [state, originalDispatch] = useReducer(reducer, { optionsTransformer, propsOptions: initialOptions }, init); const dispatch = (action) => originalDispatch({ ...action, optionsTransformer }); + useEffect(() => { + if (!isEqual(initialOptions, propsOptions)) { + setPropsCache(initialOptions); + } + }, [initialOptions]); + const isMounted = useIsMounted(); const updateOptions = () => {