diff --git a/app/assets/javascripts/components/AutocompleteTagInput.tsx b/app/assets/javascripts/components/AutocompleteTagInput.tsx index a92c94143..cfce139d2 100644 --- a/app/assets/javascripts/components/AutocompleteTagInput.tsx +++ b/app/assets/javascripts/components/AutocompleteTagInput.tsx @@ -21,6 +21,7 @@ export const AutocompleteTagInput: FunctionalComponent = ({ const [dropdownVisible, setDropdownVisible] = useState(false); const [dropdownMaxHeight, setDropdownMaxHeight] = useState('auto'); + const [hintVisible, setHintVisible] = useState(true); const getActiveNoteTagResults = (query: string) => { const { activeNote } = appState.notes; @@ -53,7 +54,9 @@ export const AutocompleteTagInput: FunctionalComponent = ({ const onSearchQueryChange = (event: Event) => { const query = (event.target as HTMLInputElement).value; - setTagResults(getActiveNoteTagResults(query)); + const tags = getActiveNoteTagResults(query); + setTagResults(tags); + setHintVisible(query !== '' && !tags.some((tag) => tag.title === query)); setSearchQuery(query); }; @@ -124,7 +127,7 @@ export const AutocompleteTagInput: FunctionalComponent = ({ ); })} - {searchQuery !== '' && ( + {hintVisible && ( <> {tagResults.length > 0 && (