'use strict';

import React from 'react';
import PropTypes from 'prop-types';
import {Popup} from './Popup';
import {Button} from '../Button';
import {DangerousHTML} from '../DangerousHTML';
import lang from '../../../lang/common/index-en_US';

type Props = {
    buttonYesStyle?: string;
    submitText?: string;
    cancelText: string;
    submitAction?: Function;
    cancelAction: Function;
    noAutoClose?: boolean;
    closeAsCancel?: boolean;
} & DefaultProps;

type DefaultProps = {
    submitAction: Function;
    buttonYesStyle: string;
    title: string;
    submitText: string;
    cancelText: string;
    testAutomationId: 'confirm';
    noAutoClose: boolean;
};

export class Confirm extends React.Component<Props & DefaultProps> {
    static propTypes = {
        buttonYesStyle: PropTypes.string,
        submitText: PropTypes.string,
        cancelText: PropTypes.string,
        submitAction: PropTypes.func.isRequired,
        cancelAction: PropTypes.func.isRequired,
        noAutoClose: PropTypes.bool,
        shouldDeriveDescFromBody: PropTypes.bool,
        closeAsCancel: PropTypes.bool
    };

    static defaultProps = {
        buttonYesStyle: 'primary',
        get title() {
            return lang.CONFIRMATION;
        },
        get submitText() {
            return lang.YES;
        },
        get cancelText() {
            return lang.NO;
        },
        testAutomationId: 'confirm',
        noAutoClose: false,
        shouldDeriveDescFromBody: true,
        closeAsCancel: true
    };

    constructor(props, context) {
        super(props, context);

        this.submitAction = this.submitAction.bind(this);
        this.cancelAction = this.cancelAction.bind(this);
    }

    submitAction() {
        if (!this.props.noAutoClose) {
            Popup.close();
        }
        this.props.submitAction();
    }

    cancelAction() {
        if (!this.props.noAutoClose) {
            Popup.close();
        }
        if (typeof this.props.cancelAction === 'function') {
            this.props.cancelAction();
        }
    }

    handleClose = () => {
        if (this.props.closeAsCancel) {
            this.cancelAction();
        } else {
            Popup.close();
        }
    };

    render() {
        let {
            buttonYesStyle,
            submitText,
            cancelText,
            noAutoClose,
            submitAction,
            ...props
        } = this.props;
        let buttons = [
            <Button key="buttonNo" testAutomationId="buttonNo" onClick={this.cancelAction}>
                <DangerousHTML>{cancelText}</DangerousHTML>
            </Button>,
            <Button
                key="buttonYes"
                bsStyle={buttonYesStyle}
                testAutomationId="buttonYes"
                onClick={this.submitAction}>
                <DangerousHTML>{submitText}</DangerousHTML>
            </Button>
        ];
        return <Popup {...props as any} onClose={this.handleClose} bsSize="sm" footer={buttons} />;
    }
}
