Props is not defined (but I see the props) [update: solved?]

JavaScript
1

Below is my original post. I think I figured out the problem. You can’t use react-redux connect with a functional component?? I changed it to a class component and it works. Is that correct??

I have a react functional component that works fine as long as I don’t attempt to console.log(props). If I omit the console.log, I can use the React Chrome dev tools to inspect the component and indeed, I do see all the props I am expecting. But as soon as I try to console.log(props), the browser throws and error and says props is not defined. I’m going crazy. Any help would be greatly appreciated.

import React from 'react'
import { Icon, Container } from 'semantic-ui-react'
import LoginForm from '../../features/auth/Login/LoginForm_usingv2'
import { connect } from 'react-redux'

const HomePage = () => {
// console.log(props)
  return (
    <div>
      <Container >
        <LoginForm />
       </Container>
    </div>
  );
};
const mapState = state => {
  return {
    mystate: state
  }
}
export default connect(mapState)(HomePage);