type MessageQueueHook<T> = {
  +enqueue: (queueItems: $ReadOnlyArray<T>) => void,
};
function useActivititesQueue<T>(
  performActivity: (queueItem: T) => void | Promise<void>,
): MessageQueueHook<T> {
  const [queue, setQueue] = React.useState<$ReadOnlyArray<T>>();
  const [isProcessing, setProcessing] = React.useState(false);

  const processNextMessage = React.useCallback(async () => {
    if (isProcessing || queue.length === 0) {
      return;
    }
    setProcessing(true);
    const nextActivity = queue[0];
    await performActivity(nextActivity);
    setQueue(currentQueue => currentQueue.slice(1));
    setProcessing(false);
  }, [isProcessing, queue, performActivity]);

  const enqueue = React.useCallback(
    (queueItems: $ReadOnlyArray<T>) =>
      setQueue(prevQueue => [...prevQueue, ...queueItems]),
    [],
  );

  React.useEffect(() => {
    if (isProcessing) {
      return;
    }
    void processNextMessage();
  }, [isProcessing, processNextMessage]);

  return { enqueue };
}