import template from "./TabPane.html";

class TabPane {

    require = ["^antdTabs"];

    state = {
        activeKey: null,
        key: this.props.key,
    };

    constructor($element, $attrs, $controllers) {
        let [antdTabs] = $controllers;

        if (antdTabs) {
            this.antdTabs = antdTabs.getContext();
            this.antdTabs.state.labels.push({
                name: this.props.tab,
                key: this.props.key,
            });
            this.antdTabs.state.childrens.push($scope);
            this.state.activeKey = this.antdTabs.state.activeKey;
        }
    }

    componentDidUpdate(prevProps) {
        if (prevProps.tab !== this.props.tab) {
            if (newVal) {
                let item = this.antdTabs.state.labels.find(function (item) {
                    return item.key === this.props.key;
                });
                if (item) {
                    item.name = newVal;
                }
            }
        }
    }

    render() {
        return template;
    }
}

TabPane.propTypes = {
    key: PropTypes.string,
    tab: PropTypes.string,
}