hooks.tsx

const initialGetSuggestions = useCallback(async () => {
  if (props.value.inner.kind === 'value' && props.value.inner.value) {
    const currentSuggestions = await getSuggestions(props.value.inner.value);
    setSuggestions(currentSuggestions);
    setTimeout(() => setVisible(false), 300);
  }
}, []);

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

useEffect(() => {
  setVisible(!!suggestions.length);
}, [suggestions]);