React prop being marked as undefined - reactjs

Question

So I have been working on a nodejs website until I ran until a really stupid error which had me stopped for a solid hour. All of my other redux actions work except for the logout which gives me this error.
Failed prop type: The prop logout is marked as required in Logout, but its value is undefined.
Here is the code for the logout component
import React, { Component, Fragment } from "react";
import { Link } from "react-router-dom";
import { connect } from "react-redux";
import { logout } from "../../actions/authActions";
import PropTypes from "prop-types";
export class Logout extends Component {
static propTypes = {
logout: PropTypes.func.isRequired
};
render() {
return (
<div>
<Link onClick={this.props.logout} to="#">
Logout
</Link>
</div>
);
}
}
export default connect(null, { logout })(Logout);
Here is the action code
export const logout = () => {
return {
type: LOGOUT_SUCCESS
};
};
The value is clearly defined. Please let me know what here is not working

Answer 1

Found the issue,
If my redux understanding is correct, I cannot export the class and connect as well. So I had to remove the class export and change it to this
import React, { Component } from "react";
import { Link } from "react-router-dom";
import { connect } from "react-redux";
import { logout } from "../../actions/authActions";
import PropTypes from "prop-types";
class Logout extends Component {
static propTypes = {
logout: PropTypes.func.isRequired
};
render() {
return (
<div>
<Link onClick={this.props.logout} to="#">
Logout
</Link>
</div>
);
}
}
const mapStateToProps = state => ({
isAuthenticated: state.auth.isAuthenticated
// error: state.error
});
export default connect(mapStateToProps, { logout })(Logout);