/**
 * NewViewRestrictedPayeePanel.js
 */

import React, { Component, Fragment } from "react";
import PropTypes from "prop-types";
import { observer } from "mobx-react";
import Col from "react-bootstrap/lib/Col";
import Row from "react-bootstrap/lib/Row";

import { BaseContext } from "frontend-react-f4-base-commons";
const { connect } = BaseContext;
import { BaseComponents } from "frontend-react-f4-base-ui";
const { strings } = BaseComponents;

import BoViewPortlet from "../BoViewPortlet/BoViewPortlet";
import BoViewField from "../BoViewField/BoViewField";
import BoViewPanel from "../BoViewPanel/BoViewPanel";
import ConfirmAckPage from "../ConfirmAckPage/ConfirmAckPage";
import YesOrNoEnum from "../../enums/YesOrNoEnum";

@observer
@connect
class NewViewRestrictedPayeePanel extends Component {
  constructor(props) {
    super(props);
  }

  getContent = () => {
    const { data } = this.props;
    return (
      <BoViewPanel {...this.props}>
        <BoViewPortlet
          portletTitle={strings.formatString(
            strings.global_objinfo,
            strings.global_restrictedpayeenm
          )}
        >
          <div className="boviewfield-row">
            <BoViewField
              isHighlighted
              label={strings.global_restrictedpayeenm}
              value={data.payeeName}
            />
          </div>
          <div className="boviewfield-row">
            <BoViewField
              md={10}
              label={strings.global_amount}
              value={data.amount}
            />
          </div>
          <div className="boviewfield-row">
            <BoViewField
              md={10}
              label={strings.global_action}
              // value={
              //   data.isAllowed === true
              //     ? YesOrNoEnum.YES.descriptionKey
              //     : YesOrNoEnum.NO.descriptionKey
              // }

              value={
                data.isAllowed === true
                  ? "Allow Payee but with Override"
                  : "Disallow Payee"
              }
            />
          </div>
          <div className="boviewfield-row">
            <BoViewField
              md={10}
              label={strings.global_character_ignore}
              value={data.charToIgnore}
            />
          </div>
        </BoViewPortlet>
      </BoViewPanel>
    );
  };

  getConfirmAck = () => {
    return <ConfirmAckPage {...this.props}>{this.getContent()}</ConfirmAckPage>;
  };
  render() {
    const { data, isConfirm, isAck, isView } = this.props;

    return (
      <Fragment>{isView ? this.getContent() : this.getConfirmAck()}</Fragment>
    );
  }
}

NewViewRestrictedPayeePanel.propTypes = {
  // props definition
};

NewViewRestrictedPayeePanel.defaultProps = {
  // default props
};

export default NewViewRestrictedPayeePanel;