В данном компоненте React есть потенциальная проблема с инициализацией состояния arr через useState(someFunc(props.arr)).

Проблема в том, что функция someFunc вызывается при каждом рендере, хотя для инициализации состояния достаточно вызвать её один раз. Чтобы избежать лишних вычислений, можно использовать ленивую инициализацию состояния, передав функцию в useState:

const LazyInit = (props) => {
  const [arr, setArr] = useState(() => someFunc(props.arr));

  const onClick = () => {
    setArr(prev => prev.concat(prev.length + 1));
  };

  return (
    <>
      <button onClick={onClick}>Increment</button>
      <ul>
        {arr.map((n, index) => <li key={index}>{n}</li>)}
      </ul>
    </>
  );
};

Так someFunc вызовется только один раз при инициализации состояния.

Также стоит обратить внимание, что в onClick добавляется элемент prev.length + 1, что может не соответствовать логике сортировки или уникальности элементов. Если нужно поддерживать отсортированный массив, после добавления элемента стоит снова отсортировать массив.

Пример с сортировкой при добавлении:

const onClick = () => {
  setArr(prev => {
    const newArr = prev.concat(prev.length + 1);
    return [...newArr].sort((a, b) => a - b);
  });
};