bitburner-src/src/ui/React/StdButtonPurchased.tsx

/**
 * Stateless button that represents something that has been purchased.
 */
import * as React from "react";

interface IStdButtonPurchasedProps {
    onClick?: (e: React.MouseEvent<HTMLElement>) => any;
    style?: any;
    text: string;
    tooltip?: string;
}

type IInnerHTMLMarkup = {
    __html: string;
}

export class StdButtonPurchased extends React.Component<IStdButtonPurchasedProps, any> {

    constructor(props: IStdButtonPurchasedProps) {
        super(props);
        this.hasTooltip = this.hasTooltip.bind(this);
        this.tooltip = this.tooltip.bind(this);
    }

    hasTooltip(): boolean {
        return this.props.tooltip != null && this.props.tooltip !== "";
    }

    tooltip(): string {
        if(!this.props.tooltip) return "";
        return this.props.tooltip;
    }

    render(): React.ReactNode {
        let className = "std-button-bought";
        if (this.hasTooltip()) {
            className += " tooltip";
        }

        // Tooltip will be set using inner HTML
        let tooltipMarkup: IInnerHTMLMarkup = {
            __html: "",
        }
        if (this.hasTooltip()) {
            tooltipMarkup = {
                __html: this.tooltip(),
            }
        }

        return (
            <button className={className} onClick={this.props.onClick} style={this.props.style}>
                {this.props.text}
                {
                    this.hasTooltip() &&
                    <span className={"tooltiptext"} dangerouslySetInnerHTML={tooltipMarkup}></span>
                }
            </button>
        )
    }
}