React Hook "useState" cannot be called inside a callback. React Hooks must be called in a React function component or a custom React Hook function. (react-hooks/rules-of-hooks)

import React, { useState } from "react";

export const WithCounter = (WrappedComponent) => {
  return (props) => {
    const [count, setCount] = useState(0);
    const increment = () => setCount((count) => count + 1);
    return <WrappedComponent count={count} increment={increment} {...props} />;
  };
};

const ClickCounter = (props) => {
  return <button onClick={props.increment}>clicked {props.count} times</button>;
};

export default function App() {
  const Comp = WithCounter(ClickCounter);
  return (
    <div className="App">
      <Comp />
    </div>
  );
}