import { Component } from 'inferno';
import { createElement } from 'inferno-create-element';
import { renderToString } from 'inferno-server';

const classNames = {
    button: "betton",
    buttonActive: "bettonactef",
    buttonDisabled: "bettondeselbled",
};

function propsToClassName(className: string, props: Object, classes: Object): ClassNameProp {
    let c = classes[className];
    const mods = Object.keys(props)
        .filter(k => typeof props[k] === "boolean" && props[k] === true);
    if(mods.length > 0) {
        c = `${c} ${mods.map(
            mod => classes[ `${className}${ mod.charAt(0).toUpperCase() + mod.slice(1) }` ]
        ).join(' ')}`;
    }

    return { className: c };
}

interface ClassNameProp {
    className: string,
}

interface ButtonProps {
    disabled?: boolean,
    active?: boolean,
}

class Button extends Component<ButtonProps> {
    public render() {
        return createElement('div', propsToClassName("button", this.props, classNames));
    }
}

console.log(renderToString(createElement(Button, {disabled: true, active: true})));