Passing props to a react component wrapped in withRouter() function

The problem is that while destructuring, you want to destructure props but you are not passing any prop named props to LogoName component

You can change your argument to

const LogoName = withRouter((props) => (
  <h1
    {...props}
    onClick={() => {props.history.push('/')}}>
    BandMate
  </h1>
));

However you can still destructure the props like @Danny also suggested by using the spread operator syntax like

const LogoName = withRouter(({history, ...props}) => (
  <h1
    {...props}
    onClick={() => {history.push('/')}}>
    BandMate
  </h1>
));

You're close, just spread the props in your function signature as well:

const LogoName = withRouter(({ history, ...props }) => (
  <h1
    {...props}
    onClick={() => {history.push('/')}}>
    BandMate
  </h1>
));

Related