SelectableSearchInput state doesn't update when input changes

[ChristianMoll]

Describe the bug

The SelectableSearchInput component has a state searchValue, this is displayed within the text input.
The component also accepts an input object value which has a property text.
If the text property of the value input changes the value that is sent when submitting the input does change but the shown value inside the input doesn't.
One simple way to avoid this would be to add a useEffect to the SelectableSearchInput to update the state when the input changes. i.E.

 useEffect(() => {
    setSearchValue(
      props.value.text
    );
  }, [props.value.text]);

To Reproduce
Steps to reproduce the behavior:

1. Use the SelectableSearchInput
2. Update the props.value.text through code
3. Press enter or click the SearchIcon button
4. The value being passed to the onSubmit handler is not the same being shown in the input.

Expected behavior
The shown value is in sync with the value that is sent on submitting.

[CarlosCortizasCT]

Hi @ChristianMoll

Thanks for letting us know about this issue.

Can we ask you please to provide an example use case where this scenario can be a problem? 🙏

[ChristianMoll]

Hi @CarlosCortizasCT

Thanks for the fast response.

In our case it is a problem when we restore the state of the SelectableSearchInput from the myview in the customer search.

Other hypothetical scenarios could be restoring a form draft that uses a SelectableSearchInput when the user wants to continue with it or a SelectableSearchInput which is pre-filled based on the value of another input.

[CarlosCortizasCT]

Related to this issue #2573