Hook that rotates the items of an Array over time like a news ticker tape.

useTickerTape.tsx

const useTickerTape = <TType extends any>(
  values: Iterable<TType>,
  speed: number
) => {
  const [tape, setTape] = useState([...values]);

  useEffect(() => {
    const id = setTimeout(() => {
      const first = tape.shift();
      setTape([...tape, first]);
    }, speed);
    return () => clearTimeout(id);
  }, [tape, speed]);

  return tape;
};