import React from 'react';
import PropTypes from 'prop-types';

export class DangerousHTML extends React.Component {
    static propTypes = {
        children: PropTypes.node.isRequired,
        testAutomationId: PropTypes.string
    };

    static defaultProps = {
        testAutomationId: null
    };

    render() {
        let {children, testAutomationId, ...props} = this.props;

        if (testAutomationId) {
            props['data-test-automation-id'] = testAutomationId;
        }

        if (typeof children === 'string') {
            props.dangerouslySetInnerHTML = {__html: children};
        } else {
            props.children = children;
        }

        return <div className="inline-block" {...props} />;
    }
}
