react hooks Хуки и connect() (redux)

import { makeStyles } from '@material-ui/core/styles';
//............


const useStyles = makeStyles(theme => ({
  '@global': {
    body: {
      backgroundColor: theme.palette.common.white,
    },
  },
  paper: {
    marginTop: theme.spacing(8),
    display: 'flex',
    flexDirection: 'column',
    alignItems: 'center',
  },
  avatar: {
    margin: theme.spacing(1),
    backgroundColor: theme.palette.secondary.main,
  },
  form: {
    width: '100%', // Fix IE 11 issue.
    marginTop: theme.spacing(1),
  },
  submit: {
    margin: theme.spacing(3, 0, 2),
  },
}));

export default function Login2() {
  const classes = useStyles();

  return (
    
    <Container component="main" maxWidth="xs">
      <CssBaseline />
      <div className={classes.paper}>
        <Avatar className={classes.avatar}>
          <LockOutlinedIcon />
        </Avatar>
        <Typography component="h1" variant="h5">
          Sign in
        </Typography>
        <LoginForm2 classes={classes}/>
      </div>
      <Box mt={5}>
        <MadeWithLove />
      </Box>
    </Container>
  );
}

Проблема состоит в том, что переделать компонент в классовый стиль (или как-то передать ему пропс извне с помощью conneсt?):

class Login2 extends React.Component {


  render() {
    const classes = useStyles();
    return (
      this.props.isUserAuthed ? <Redirect to={RoutePath('index')} /> :
      <Container component="main" maxWidth="xs">
        <CssBaseline />
        <div className={classes.paper}>
          <Avatar className={classes.avatar}>
            <LockOutlinedIcon />
          </Avatar>
          <Typography component="h1" variant="h5">
            Sign in
          </Typography>
          <LoginForm2 classes={classes}/>
        </div>
        <Box mt={5}>
          <MadeWithLove />
        </Box>
      </Container>
    );
  }
}

export default connect(state => ({
  isError: getIsError(state),
  isUserAuthed: getIsUserAuthed(state),
}))(Login2);

Решение

connect() можно применить к имени функции точно так же как и к имени класса, например:

export default connect(state => ({
    isError: getIsError(state),
    userName: getUserName(state)
}))(withStyles(styles)(CampaignForm));

или :

export default connect(state => ({
    isError: getIsError(state),
    userName: getUserName(state)
}))(CampaignForm);