"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
var __importStar = (this && this.__importStar) || function (mod) {
    if (mod && mod.__esModule) return mod;
    var result = {};
    if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
    result["default"] = mod;
    return result;
};
Object.defineProperty(exports, "__esModule", { value: true });
require("../stylesheets/bbb/botbuilder.scss");
require("../stylesheets/story-card.scss");
const classnames_1 = __importDefault(require("classnames"));
const React = __importStar(require("react"));
const react_router_dom_1 = require("react-router-dom");
class BotCard extends React.Component {
    constructor(props, context) {
        super(props, context);
        this.onClick = this.onClick.bind(this);
    }
    makeBotUrl(bot) {
        const tld = process.env.APP_DOMAIN;
        // @ts-ignore
        const protocol = tld.includes('localhost') ? 'http' : 'https';
    }
    render() {
        const { bot } = this.props;
        return (React.createElement(react_router_dom_1.Link, { className: "story-card story-card--card", to: `/bots/${bot.emoji_id}` },
            React.createElement("div", { className: classnames_1.default('story-card__inner') },
                React.createElement("div", { className: "story-card__title" }, bot.name),
                React.createElement("div", { className: "story-card__image bot_id" }, bot.emoji_id),
                React.createElement("div", { className: "story-card__no-messages" }, "..."),
                React.createElement("div", { className: "story-card__tools" },
                    React.createElement("span", { className: "story-card__delete icon-trash", onClick: (e) => this.deleteBot(e, bot.emoji_id) })))));
    }
    deleteBot(e, emoji_id) {
        this.props.deleteBot(emoji_id);
        return e.stopPropagation();
    }
    onClick(e) {
        e.stopPropagation();
        console.log('CLICK');
    }
}
class AddBot extends React.Component {
    constructor(props, context) {
        super(props, context);
        this.state = {
            botName: ''
        };
        this.onClick = this.onClick.bind(this);
        this.setRef = this.setRef.bind(this);
        this.onKeyUp = this.onKeyUp.bind(this);
        this.onCreateBot = this.onCreateBot.bind(this);
    }
    render() {
        const { autoFocus, isCard } = this.props;
        return (React.createElement("div", { className: classnames_1.default('story-card story-card--form', {
                'story-card--list-item': !isCard
            }), onClick: this.onClick },
            React.createElement("div", { className: "story-card__form-inner" },
                React.createElement("label", { className: "story-card__form-label" }, "Bot name"),
                React.createElement("input", { placeholder: "Ex. My First Bot", type: "text", className: "story-card__form-input", ref: this.setRef, autoFocus: autoFocus, onKeyUp: this.onKeyUp })),
            React.createElement("div", { className: "btn btn--small btn--primary", onClick: this.onCreateBot }, "Create Bot")));
    }
    onCreateBot(e) {
        this.props.addBot(this.state.botName);
    }
    onKeyUp(event) {
        if (event.which === 13) {
            if (event.target.value === '')
                return;
            event.target.blur();
            this.props.addBot(this.state.botName);
            return;
        }
        this.setState({ botName: event.target.value });
    }
    onClick() {
        if (!this._input)
            return;
        this._input.focus();
    }
    setRef(el) {
        this._input = el;
    }
}
AddBot.defaultProps = {
    autoFocus: false,
    isCard: true,
    addBot: (e) => console.log('Should be adding bot', e)
};
exports.AddBot = AddBot;
exports.default = BotCard;
//# sourceMappingURL=botcard.js.map