import React from "react";
import PropTypes from "prop-types";
import IDUtil from "../../../../util/IDUtil";
import classNames from "classnames";
/*
HTML markup & CSS attributes:
	- regular span => .bg__classification
*/

export default class Classification extends React.Component {
    constructor(props) {
        super(props);
    }

    delete = () => {
        if (confirm("Are you sure you want to delete this code?")) {
            this.props.delete(this.props.classification);
        }
    };

    click = (e) => {
        this.props.click(this.props.classification, e.shiftKey);
    };

    render() {
        const deleteButton = this.props.delete ? (
            <div className="delete" title="Delete" onClick={this.delete} />
        ) : null;

        return (
            <span
                className={classNames(
                    IDUtil.cssClassName("classification-type"),
                    "vocabulary-" +
                        this.props.classification.vocabulary.toLowerCase(),
                    this.props.className
                )}
                title={
                    this.props.classification.id
                        ? this.props.classification.id
                        : "Custom annotation"
                }
                onClick={this.props.click ? this.click : null}
            >
                {deleteButton}
                {this.props.classification.label}
            </span>
        );
    }
}

Classification.propTypes = {
    classification: PropTypes.object,
    className: PropTypes.string,
    delete: PropTypes.func,
    click: PropTypes.func,
};