<commit_before>import React, { Component } from 'react';
import PropTypes from "prop-types";
import cx from "classnames";

class EditBar extends Component {
    static propTypes = {
        title: PropTypes.string.isRequired,
        subtitle: PropTypes.string,
        buttons: PropTypes.oneOfType([
            PropTypes.element,
            PropTypes.array
        ]).isRequired,
        admin: PropTypes.bool
    }

    static defaultProps = {
        admin: false
    }

    render () {
        const { admin, buttons, subtitle, title } = this.props;
        return (
            <div
                className={cx(
                    'EditHeader wrapper py1 flex align-center',
                    { 'EditHeader--admin' : admin }
                )}
                ref="editHeader"
            >
                <span className="EditHeader-title">{title}</span>
                { subtitle && (
                    <span className="EditHeader-subtitle mx1">
                        {subtitle}
                    </span>
                )}
                <span className="flex-align-right">
                    {buttons}
                </span>
            </div>
        )
    }
}

export default EditBar;<commit_msg>Use `display: flex` for edit bar buttons, fixes IE11 layout glitch<commit_after>import React, { Component } from 'react';
import PropTypes from "prop-types";
import cx from "classnames";

class EditBar extends Component {
    static propTypes = {
        title: PropTypes.string.isRequired,
        subtitle: PropTypes.string,
        buttons: PropTypes.oneOfType([
            PropTypes.element,
            PropTypes.array
        ]).isRequired,
        admin: PropTypes.bool
    }

    static defaultProps = {
        admin: false
    }

    render () {
        const { admin, buttons, subtitle, title } = this.props;
        return (
            <div
                className={cx(
                    'EditHeader wrapper py1 flex align-center',
                    { 'EditHeader--admin' : admin }
                )}
                ref="editHeader"
            >
                <span className="EditHeader-title">{title}</span>
                { subtitle && (
                    <span className="EditHeader-subtitle mx1">
                        {subtitle}
                    </span>
                )}
                <span className="flex-align-right flex">
                    {buttons}
                </span>
            </div>
        )
    }
}

export default EditBar;
{'fraction_non_alphanumeric': 0.10047846889952153, 'fraction_numerical': 0.0023923444976076554, 'mean_word_length': 1.353658536585366, 'pattern_counts': {'":': 0, '<': 19, '<?xml version=': 0, '>': 19, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '7049180', 'n_tokens_mistral': 638, 'n_tokens_neox': 612, 'n_words': 146}