React.createElement(
    'ul',
    { id: 'list-drafts' },
    undefined.state.drafts.length > 0 ? undefined.state.drafts.map(function (draft) {
        return React.createElement(
            'li',

var ReviewsWidgetSidebar = React.createClass({
    getInitialState: () => {
        return {
            drafts: []
        };
    },

    componentDidMount: () => {
        GetApi.call('data/get-drafts', {}, function (drafts) {
            this.setState({ drafts: drafts });
        });
    },

    render: () => {
        return (
            <div>
                <ul id="list-drafts">
                    {
                        (this.state.drafts.length > 0) ?
                            this.state.drafts.map((draft) => {
                                return (
                                    <li data-id={draft.id} data-is-unread={draft.is_unread}>
                                        {draft.text}
                                    </li>
                                );
                            }) :
                            `
                                <li style={{textAlign: 'center'}}>
                                    Loading... <img src="/img/loading.gif" />
                                </li>
                            `
                    }
                </ul>
            </div>
        );
    }
});