{"size": 1183, "ext": "js", "max_stars_repo_path": "client/src/components/Modal/ModalFooter/ModalFooter.js", "max_stars_repo_name": "Rammina/Amussement", "max_stars_repo_stars_event_min_datetime": "2021-09-29T03:25:47.000Z", "max_stars_repo_stars_event_max_datetime": "2022-03-18T17:45:53.000Z", "max_issues_repo_path": "client/src/components/Modal/ModalFooter/ModalFooter.js", "max_issues_repo_name": "Rammina/Amussement", "max_issues_repo_issues_event_min_datetime": "2020-11-01T11:14:27.000Z", "max_issues_repo_issues_event_max_datetime": "2022-03-27T08:58:40.000Z", "max_forks_repo_path": "client/src/components/Modal/ModalFooter/ModalFooter.js", "max_forks_repo_name": "Rammina/Amussement", "max_forks_repo_forks_event_min_datetime": "2021-11-26T15:30:27.000Z", "max_forks_repo_forks_event_max_datetime": "2021-11-26T15:30:27.000Z"}
{"max_stars_count": 3, "max_issues_count": 13, "max_forks_count": 1, "avg_line_length": 27.511627907, "max_line_length": 80, "alphanum_fraction": 0.639898563}
import "./ModalFooter.scss";

import React from "react";

import CancelButton from "../../buttons/CancelButton";

//note: test the use of context, remove props. from the variables
const ModalFooter = (props) => {
  // simplify/return properties from parent component (e.g. className)
  const getClassName = () => (props.componentClass ? props.componentClass : "");
  const getFooterClassName = () =>
    props.footerClassName ? props.footerClassName : "";

  const renderCancelButton = () => {
    if (props.noCancelButton) return null;
    return (
      <CancelButton
        componentClass={getClassName()}
        hideOnMobile={true}
        onClickHandler={() => {
          props.onModalClose();
        }}
        autoFocusOnCancel={props.autoFocusOnCancel || false}
      />
    );
  };

  const renderActionButtons = () => {
    if (!props.actionButtons) return null;
    return props.actionButtons;
  };

  return (
    <div className={`modal-footer ${getClassName()} ${getFooterClassName()}`}>
      <div className="modal-footer-buttons-container">
        {renderCancelButton()}
        {renderActionButtons()}
      </div>
    </div>
  );
};
export default ModalFooter;
