No option is selected if setting the options after the value

[bviala]

Hello. Not sure if bug or feature request: In projects dealing with APIs, it can happen that you know the value of a select (eg a ressource id provided as query param) before you have fetched the list of options.

Currently if you do that, the select stays in its default state, showing no option selected.

Sample code

const Example = () => {
  const [testOptions, setTestOptions] = useState([]);
  const [testValue, setTestValue] = useState();

  useEffect(() => {
    init();
  }, []);

  const init = () => {
    setTimeout(() => {
      setTestOptions([
        {
          name: 'aaaa',
          value: '1',
        },
        {
          name: 'vvvv',
          value: '2',
        },
      ]);
    }, 400);

    setTimeout(() => {
      setTestValue('2');
    }, 200);
  };

  return (
    <SelectSearch options={testOptions} value={testValue}></SelectSearch>
  );
}

Expected behavior When setting a value first, then the options, the component should render as selected if an option is matching the value

[poornerd]

+1

[bouguila]

any solution/workaround for this one?