"use strict";
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
    if (k2 === undefined) k2 = k;
    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
}) : (function(o, m, k, k2) {
    if (k2 === undefined) k2 = k;
    o[k2] = m[k];
}));
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
    Object.defineProperty(o, "default", { enumerable: true, value: v });
}) : function(o, v) {
    o["default"] = v;
});
var __importStar = (this && this.__importStar) || function (mod) {
    if (mod && mod.__esModule) return mod;
    var result = {};
    if (mod != null) for (var k in mod) if (k !== "default" && Object.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
    __setModuleDefault(result, mod);
    return result;
};
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const prop_types_1 = __importDefault(require("prop-types"));
const react_1 = __importStar(require("react"));
const react_native_1 = require("react-native");
const Color_1 = __importDefault(require("./Color"));
const utils_1 = require("./utils");
const styles = react_native_1.StyleSheet.create({
    container: {
        flexDirection: 'row',
        flexWrap: 'wrap',
        maxWidth: 300,
    },
    quickReply: {
        justifyContent: 'center',
        alignItems: 'center',
        borderWidth: 1,
        maxWidth: 200,
        paddingVertical: 7,
        paddingHorizontal: 12,
        minHeight: 50,
        borderRadius: 13,
        margin: 3,
    },
    quickReplyText: {
        overflow: 'visible',
    },
    sendLink: {
        borderWidth: 0,
    },
    sendLinkText: {
        color: Color_1.default.defaultBlue,
        fontWeight: '600',
        fontSize: 17,
    },
});
const sameReply = (currentReply) => (reply) => currentReply.value === reply.value;
const diffReply = (currentReply) => (reply) => currentReply.value !== reply.value;
class QuickReplies extends react_1.Component {
    constructor() {
        super(...arguments);
        this.state = {
            replies: [],
        };
        this.handlePress = (reply) => () => {
            const { currentMessage } = this.props;
            const { replies } = this.state;
            if (currentMessage) {
                const { type } = currentMessage.quickReplies;
                switch (type) {
                    case 'radio': {
                        this.handleSend([reply])();
                        return;
                    }
                    case 'checkbox': {
                        if (replies.find(sameReply(reply))) {
                            this.setState({
                                replies: this.state.replies.filter(diffReply(reply)),
                            });
                        }
                        else {
                            this.setState({ replies: [...this.state.replies, reply] });
                        }
                        return;
                    }
                    default: {
                        utils_1.warning(`onQuickReply unknown type: ${type}`);
                    }
                }
            }
        };
        this.handleSend = (replies) => () => {
            const { currentMessage } = this.props;
            if (this.props.onQuickReply) {
                this.props.onQuickReply(replies.map((reply) => (Object.assign(Object.assign({}, reply), { messageId: currentMessage._id }))));
            }
        };
        this.shouldComponentDisplay = () => {
            const { currentMessage, nextMessage } = this.props;
            const hasReplies = !!currentMessage && !!currentMessage.quickReplies;
            const hasNext = !!nextMessage && !!nextMessage._id;
            const { keepIt } = currentMessage.quickReplies;
            if (hasReplies && !hasNext) {
                return true;
            }
            if (hasReplies && hasNext && keepIt) {
                return true;
            }
            return false;
        };
        this.renderQuickReplySend = () => {
            const { replies } = this.state;
            const { sendText, renderQuickReplySend: customSend } = this.props;
            return (react_1.default.createElement(react_native_1.TouchableOpacity, { style: [styles.quickReply, styles.sendLink], onPress: this.handleSend(replies) }, customSend ? (customSend()) : (react_1.default.createElement(react_native_1.Text, { style: styles.sendLinkText }, sendText))));
        };
    }
    render() {
        const { currentMessage, color, quickReplyStyle } = this.props;
        const { replies } = this.state;
        if (!this.shouldComponentDisplay()) {
            return null;
        }
        const { type } = currentMessage.quickReplies;
        return (react_1.default.createElement(react_native_1.View, { style: styles.container },
            currentMessage.quickReplies.values.map((reply, index) => {
                const selected = type === 'checkbox' && replies.find(sameReply(reply));
                return (react_1.default.createElement(react_native_1.TouchableOpacity, { onPress: this.handlePress(reply), style: [
                        styles.quickReply,
                        quickReplyStyle,
                        { borderColor: color },
                        selected && { backgroundColor: color },
                    ], key: `${reply.value}-${index}` },
                    react_1.default.createElement(react_native_1.Text, { numberOfLines: 10, ellipsizeMode: "tail", style: [
                            styles.quickReplyText,
                            { color: selected ? Color_1.default.white : color },
                        ] }, reply.title)));
            }),
            replies.length > 0 && this.renderQuickReplySend()));
    }
}
exports.default = QuickReplies;
QuickReplies.defaultProps = {
    currentMessage: {
        quickReplies: [],
    },
    onQuickReply: () => { },
    color: Color_1.default.peterRiver,
    sendText: 'Send',
    keepReplies: false,
    renderQuickReplySend: undefined,
    quickReplyStyle: undefined,
};
QuickReplies.propTypes = {
    currentMessage: prop_types_1.default.object.isRequired,
    onQuickReply: prop_types_1.default.func,
    color: prop_types_1.default.string,
    sendText: prop_types_1.default.string,
    keepReplies: prop_types_1.default.bool,
    renderQuickReplySend: prop_types_1.default.func,
    quickReplyStyle: utils_1.StylePropType,
};
//# sourceMappingURL=QuickReplies.js.map