Оптимизация и рефакторинг React‑компонента

Необходимо выполнить рефакторинг представленного React‑компонента, устранив потенциальные проблемы и улучшив его структуру и читаемость.

import React from 'react';

const PleaseReviewMe = () => {
  const [count, setCount] = React.useState(1);
  const [items, setItems] = React.useState([{ id: 1 }]);

  React.useLayoutEffect(() => {
    document.addEventListener('click', () => {
      setInterval(() => console.log(count), 1000);
    });
  });

  const click = React.useCallback(() => {
    setCount(count + 1);
    setItems([...items, { id: count + 1 }]);
  });

  return (
    <React.Fragment>
      Current count: {count}
      <ul>
        {items.map((item) => (
          <li>{item.id}</li>
        ))}
      </ul>
      <button onClick={() => click()}>add once</button>
    </React.Fragment>
  );
};

export default PleaseReviewMe;