import React, { useEffect } from "react";
import { connect } from "react-redux";
import { bindActionCreators } from "redux";
import PropTypes from "prop-types";
import { loadSystemDateTime, loadSystemVersion } from "../actionCreators";
import SystemComponent from "./SystemComponent";

const SystemContainer = ({ actions }) => {
  useEffect(() => {
    actions.loadSystemDateTime();
    actions.loadSystemVersion();
  }, []);

  return <SystemComponent />;
};

SystemContainer.propTypes = {
  actions: PropTypes.object.isRequired,
  system: PropTypes.object.isRequired
};

function mapStateToProps(state) {
  return {
    system: state.system
  };
}

function mapDispatchToProps(dispatch) {
  return {
    actions: bindActionCreators(
      { loadSystemDateTime, loadSystemVersion },
      dispatch
    )
  };
}

export default connect(mapStateToProps, mapDispatchToProps)(SystemContainer);