How to use the @reach/utils.usePrevious function in @reach/utils

function useMirrorEffects(type, element, ref) {
  const prevType = usePrevious(type);
  const mirror = useRef(null);
  const mounted = useRef(false);
  useEffect(() => {
    const { ownerDocument } = ref.current || {};
    if (!mounted.current) {
      mounted.current = true;
      mirror.current = createMirror(type, ownerDocument);
      mirror.current.mount(element);
    } else if (!prevType !== type) {
      mirror.current.unmount();
      mirror.current = createMirror(type, ownerDocument);
      mirror.current.mount(element);
    } else {
      mirror.current.update(element, prevType, type);
    }
    // eslint-disable-next-line react-hooks/exhaustive-deps

// Respond to user char key input with typeahead
    const match = findItemFromSearch(menuItems, searchQuery);
    if (searchQuery && match != null) {
      dispatch({
        type: SELECT_ITEM_AT_INDEX,
        payload: { index: match }
      });
    }
    let timeout = window.setTimeout(
      () => searchQuery && dispatch({ type: SEARCH_FOR_ITEM, payload: "" }),
      1000
    );
    return () => window.clearTimeout(timeout);
  }, [dispatch, menuItems, searchQuery]);

  const prevMenuItemsLength = usePrevious(menuItems.length);
  const prevSelected = usePrevious(menuItems[selectionIndex]);
  const prevSelectionIndex = usePrevious(selectionIndex);

  useEffect(() => {
    if (selectionIndex > menuItems.length - 1) {
      /*
       * If for some reason our selection index is larger than our possible
       * index range (let's say the last item is selected and the list
       * dynamically updates), we need to select the last item in the list.
       */
      dispatch({
        type: SELECT_ITEM_AT_INDEX,
        payload: { index: menuItems.length - 1 }
      });
    } else if (
      /*

if (searchQuery && match != null) {
      dispatch({
        type: SELECT_ITEM_AT_INDEX,
        payload: { index: match }
      });
    }
    let timeout = window.setTimeout(
      () => searchQuery && dispatch({ type: SEARCH_FOR_ITEM, payload: "" }),
      1000
    );
    return () => window.clearTimeout(timeout);
  }, [dispatch, menuItems, searchQuery]);

  const prevMenuItemsLength = usePrevious(menuItems.length);
  const prevSelected = usePrevious(menuItems[selectionIndex]);
  const prevSelectionIndex = usePrevious(selectionIndex);

  useEffect(() => {
    if (selectionIndex > menuItems.length - 1) {
      /*
       * If for some reason our selection index is larger than our possible
       * index range (let's say the last item is selected and the list
       * dynamically updates), we need to select the last item in the list.
       */
      dispatch({
        type: SELECT_ITEM_AT_INDEX,
        payload: { index: menuItems.length - 1 }
      });
    } else if (
      /*
       * Checks if
       *  - menu length has changed

function useMessageTimeout(messages, callback, time = 5000) {
  const timeouts = React.useRef([]);
  const lastMessageCount = usePrevious(messages.length);
  React.useEffect(() => {
    if (messages.length && lastMessageCount < messages.length) {
      timeouts.current.push(setTimeout(callback, time));
    }
  }, [messages, lastMessageCount, callback, time]);

  React.useEffect(() => {
    const allTimeouts = timeouts.current;
    return () => {
      allTimeouts.forEach(clearTimeout);
    };
  }, []);
}

const match = findItemFromSearch(menuItems, searchQuery);
    if (searchQuery && match != null) {
      dispatch({
        type: SELECT_ITEM_AT_INDEX,
        payload: { index: match }
      });
    }
    let timeout = window.setTimeout(
      () => searchQuery && dispatch({ type: SEARCH_FOR_ITEM, payload: "" }),
      1000
    );
    return () => window.clearTimeout(timeout);
  }, [dispatch, menuItems, searchQuery]);

  const prevMenuItemsLength = usePrevious(menuItems.length);
  const prevSelected = usePrevious(menuItems[selectionIndex]);
  const prevSelectionIndex = usePrevious(selectionIndex);

  useEffect(() => {
    if (selectionIndex > menuItems.length - 1) {
      /*
       * If for some reason our selection index is larger than our possible
       * index range (let's say the last item is selected and the list
       * dynamically updates), we need to select the last item in the list.
       */
      dispatch({
        type: SELECT_ITEM_AT_INDEX,
        payload: { index: menuItems.length - 1 }
      });
    } else if (
      /*
       * Checks if