HOC.js

const CalculateWrapper = (WrappedComponent, operation) => (props) => (
  <div>
    <div>{props.x + operation + props.y}</div>
    <WrappedComponent {...props} />
  </div>
)

const Increment = (props) => ( <h1>{props.x + props.y}</h1> )

const Decrease = (props) => ( <h1>{props.x - props.y}</h1> )

class App extends Component {
  render() {
    const CalculateIncrement = CalculateWrapper(Increment, '+')
    const CalculateDecrease = CalculateWrapper(Decrease, '-')
    return (
      <div className="App">
        <CalculateIncrement x={10} y={20} />
        <CalculateDecrease x={10} y={20} />
      </div>
    );
  }
}