portal/modal.js

// @flow

import React from 'react';
import { connect } from 'react-redux';
import Modal from 'src/components/common/Modal/Modal';
import BuyGameCard from 'src/components/Portal/Store/BuyGameCard/BuyGameCard';
import ActivationDetailsCard from 'src/components/Portal/MyGames/ActivationDetailsCard/ActivationDetailsCard';
import ReleaseNotes from 'src/components/Portal/ReleaseNotes/ReleaseNotes';
import InstallReady from 'src/components/Portal/ReleaseNotes/InstallReady/InstallReady';
import DownloadUpdate from 'src/components/Portal/ReleaseNotes/DownloadUpdate/DownloadUpdate';
import { HIDE_MODAL } from 'src/actions/modal';

type PropsT = {
  modalName: React$Element<any>,
  hideModal: Function,
};

const modals = {
  BuyGameCard,
  ActivationDetailsCard,
  ReleaseNotes,
  DownloadUpdate,
  InstallReady,
};

const PortalModal = (props: PropsT) => {
  const { modalName, hideModal, position, size, data, onHide } = props;

  const ModalContent = modals[modalName];

  const handleOnHide = () => {
    if (onHide) {
      onHide();
    }

    hideModal();
  };
  return (
    <Modal
      show={!!modalName}
      onHide={handleOnHide}
      size={size}
      position={position}
    >
      {ModalContent && <ModalContent {...data} />}
    </Modal>
  );
};

function mapStateToProps({
  modal: { modalName, position, size, data, onHide },
}) {
  return {
    modalName,
    position,
    size,
    data,
    onHide,
  };
}

const actions = {
  hideModal: () => ({
    type: HIDE_MODAL,
  }),
};

export default connect(mapStateToProps, actions)(PortalModal);