Incomplete text after selecting same item from list. about graphhopper-maps HOT 5 OPEN

I have been able to reproduce.

The pattern is always the same :

1. Select a new input search
2. The autocomplete works
3. Empty the cell
4. Type something that gives the same autocomplete result (props.point.queryText)
5. Select the same result
6. Input fields doesn't switch to autocomplete suggestion
7. Using console.log, we see that useEffect => setText is not triggered to update the text from "input" to "queryText"

from graphhopper-maps.

if (action instanceof InvalidatePoint) {
  const points = QueryStore.replacePoint(state.queryPoints, {
    ...action.point,
    isInitialized: false,
    queryText: ''
  });
  return {
    ...state,
    queryPoints: points,
  };
} else if (action instanceof ClearPoints) {

Query text must be emptied for the change to be registered by useEffect().

useEffect(() => {
  setText(props.point.queryText);
  console.log('useEffect: '+props.point.queryText);
}, [props.point.queryText]);

Is that correct ? I'm still learning Typescript and web development.

from graphhopper-maps.

Oh, nice. Indeed the first code you mentioned already fixes the problem and is what we need here, I guess! Feel free to create a pull request or I can mention you in the commit to credit you properly :)

from graphhopper-maps.

Unfortunately I had to revert it as it breaks editing the input text: 1. search for something and click the suggestion. 2. click again on the input element and whatever you type the input will be (incorrectly) cleared before it.

from graphhopper-maps.

Understood. Makes total sense. Next time, I'll mark it as untested explicitely (more like an hint to follow).

from graphhopper-maps.