high order component

RatingsPage.js

import { connect } from "react-redux";
import React, { Component } from "react";
import PropTypes from "prop-types";
// Import Components
import RatingList from "./components/RatingList/RatingList";
// Import Actions
import { fetchRatings } from "./RatingsActions";
// import Reducer
import { getRatings } from "./RatingsReducer";
class RatingsPage extends Component {
    debugger;
    render() {
        return (
            <div>
                <RatingList ratings={this.props.ratings} />
            </div>
        );
    }
}
// Retrieve data from store as props
const mapStateToProps = (state) => {
    return {
        ratings: getRatings(state)
    }
};
const mapDispatchToProps = (dispatch) => {
    return {
        dispatch,
        fetchRatings: dispatch(fetchRatings()),
    };
}
RatingsPage.propTypes = {
    ratings: PropTypes.arrayOf(PropTypes.object),
    dispatch: PropTypes.func.isRequired,
};
export default connect(mapStateToProps, mapDispatchToProps)(RatingsPage);