export default function useSearchField()

in src/hooks/useSearchField/index.ts [52:155]
87 lines of code
13 McCabe index (conditional complexity)

export default function useSearchField(flowID: string, runNumber: string): SearchFieldReturnType {
  const { t } = useTranslation();
  const [qp, setQp] = useQueryParams({ q: StringParam });
  const [searchValue, setSearchValue] = useState(qp.q ? qp.q : isCached(flowID, runNumber) ? cache.text : '');
  const [searchResults, setSearchResults] = useState<SearchResultModel>(
    isCached(flowID, runNumber) ? cache.results : notAskedSearchResults,
  );
  const [enabled, setEnabled] = useState(true);

  const updateSearchResults = useCallback(
    (newResults: SearchResultModel) => {
      setSearchResults({
        ...newResults,
        // Only display items that were searchable, unsearchable result indicates error
        result: newResults.result.filter((r) => r.searchable),
      });
      cache.results = newResults;
      cache.id = flowID + runNumber;
    },
    [flowID, runNumber],
  );

  const updateText = useCallback(
    (str: string, forceUpdate?: boolean) => {
      setSearchValue(str);
      setQp({ q: str }, 'replaceIn');
      cache.text = str;
      cache.id = flowID + runNumber;

      if (forceUpdate) {
        setEnabled(false);
      }
    },
    [setQp, runNumber, flowID],
  );

  useEffect(() => {
    if (!enabled) {
      setEnabled(true);
    }
  }, [enabled]);

  const onError = useCallback(() => {
    updateSearchResults({ result: [], status: 'Error', errorMsg: t('search.failed-to-search') });
  }, [t, updateSearchResults]);

  const onUpdate = useCallback(
    (event: SearchResult) => {
      if (event.type === 'result' && Array.isArray(event.matches)) {
        updateSearchResults({ result: event.matches || [], status: 'Ok' });
      } else if (event.type === 'error' && event.message) {
        updateSearchResults({ status: 'Error', errorMsg: event.message, result: [] });
      }
    },
    [updateSearchResults],
  );

  const onConnecting = useCallback(() => {
    // if (searchResults.status !== 'Loading') {
    //   updateSearchResults({ ...searchResults, status: 'Loading' });
    // }

    setSearchResults((existingSearchResults) => {
      cache.results = { ...existingSearchResults, status: 'Loading' };
      cache.id = flowID + runNumber;
      return {
        ...existingSearchResults,
        status: 'Loading',
        // Only display items that were searchable, unsearchable result indicates error
        result: existingSearchResults.result.filter((r) => r.searchable),
      };
    });
  }, [flowID, runNumber]);

  useSearchRequest({
    url: `/search/flows/${flowID}/runs/${runNumber}`,
    searchValue: searchValue,
    onUpdate,
    onConnecting,
    onError,
    enabled,
  });

  useEffect(() => {
    if (searchValue === '') {
      setSearchResults(notAskedSearchResults);
    }
  }, [searchValue, setSearchResults]);

  useEffect(() => {
    if (qp.q) {
      cache.text = qp.q;
      cache.id = flowID + runNumber;
    }
  }, [qp.q, flowID, runNumber]);

  return useMemo(
    () => ({
      results: searchResults,
      fieldProps: { text: searchValue, setText: updateText },
    }),
    [searchResults, searchValue, updateText],
  );
}