Show CityAutocomplete clear (×) button for any truthy value, not just resolved cities
Previously hasValue was computed from `selectedCity` — which required
the dictionaries to be loaded AND the raw code to map to a known city.
If the dictionaries were slow or the user typed free text, the clear
button stayed hidden and the filter became stuck with no way to wipe it.
Angular's CityAutocomplete uses `[ngClass]="{'has-value': city}"` on
the raw two-way-bound model, so any truthy value reveals the clear
button. Mirror that: `hasValue` is now true whenever the resolved
city, the outbound code, or the AutoComplete inputValue (free text or
suggestion object) is truthy.
This commit is contained in:
@@ -124,7 +124,16 @@ export const CityAutocomplete: FC<CityAutocompleteProps> = ({
|
||||
}
|
||||
return null;
|
||||
})();
|
||||
const hasValue = Boolean(selectedCity);
|
||||
// Mirror Angular's `[ngClass]="{ 'has-value': city }"` — any truthy
|
||||
// model value (resolved city OR a free-typed string OR the raw code
|
||||
// before dictionaries load) should reveal the clear button. Otherwise
|
||||
// users can't wipe a partial input when the dictionary hasn't caught
|
||||
// up yet.
|
||||
const hasValue = Boolean(
|
||||
selectedCity ||
|
||||
value ||
|
||||
(typeof inputValue === "string" ? inputValue : inputValue?.name),
|
||||
);
|
||||
|
||||
return (
|
||||
<div ref={rootRef} className="city-autocomplete">
|
||||
|
||||
Reference in New Issue
Block a user