{"size": 1272, "ext": "js", "max_stars_repo_path": "app/components/PaymentStatus/index.js", "max_stars_repo_name": "ubex-ai/ubex-web-gui", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "app/components/PaymentStatus/index.js", "max_issues_repo_name": "ubex-ai/ubex-web-gui", "max_issues_repo_issues_event_min_datetime": "2020-04-04T18:18:20.000Z", "max_issues_repo_issues_event_max_datetime": "2020-12-18T22:55:41.000Z", "max_forks_repo_path": "app/components/PaymentStatus/index.js", "max_forks_repo_name": "ubex-ai/ubex-web-gui", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": 4, "max_forks_count": null, "avg_line_length": 28.9090909091, "max_line_length": 89, "alphanum_fraction": 0.6493710692}
/**
 *
 * PaymentStatus
 *
 */

import React from 'react';
// import PropTypes from 'prop-types';
// import styled from 'styled-components';

import { FormattedMessage } from 'react-intl';
import messages from './messages';
import { Button, Modal, ModalBody, ModalFooter, ModalHeader } from 'reactstrap';

/* eslint-disable react/prefer-stateless-function */
class PaymentStatus extends React.Component {
	render() {
		const { isOpen, onCancel, amount, status } = this.props;
		return (
			<Modal isOpen={!!isOpen}>
				<ModalHeader toggle={onCancel}>
					{status === 'success' ? 'Payment completed' : 'Payment error'}
				</ModalHeader>
				<ModalBody className="topUp-modal__transaction-success">
					{status === 'success' ? (
						<i className="fas fa-check-circle topUp-modal__transaction-success--icon" />
					) : (
						<i className="fas fa-times-circle topUp-modal__transaction-error--icon" />
					)}
					<div>
						<h3>{status === 'success' ? 'Payment completed' : 'Payment error'}</h3>
						{status === 'error' && <h6>Oops. Something went wrong, please try again later</h6>}
						{status === 'success' && <h5>Deposit amount ${amount}</h5>}
					</div>
				</ModalBody>
			</Modal>
		);
	}
}

PaymentStatus.propTypes = {};

export default PaymentStatus;
