<commit_before>const classNames = require('classnames');
const React = require('react');
const PropTypes = require('prop-types');

const NextStepButton = require('./next-step-button.jsx');
const ModalTitle = require('../modal/base/modal-title.jsx');
const ModalInnerContent = require('../modal/base/modal-inner-content.jsx');
const InfoButton = require('../info-button/info-button.jsx');

require('./join-flow-step.scss');

const JoinFlowStep = ({
    children,
    innerClassName,
    description,
    footerContent,
    headerImgSrc,
    infoMessage,
    nextButton,
    onSubmit,
    title,
    waiting
}) => (
    <form onSubmit={onSubmit}>
        <div className="join-flow-outer-content">
            {headerImgSrc && (
                <div className="join-flow-header-image">
                    <img src={headerImgSrc} />
                </div>
            )}
            <div>
                <ModalInnerContent
                    className={classNames(
                        'join-flow-inner-content',
                        innerClassName
                    )}
                >
                    {title && (
                        <ModalTitle
                            className="join-flow-title"
                            title={title}
                        />
                    )}
                    {description && (
                        <div className="join-flow-description">
                            {description}
                            {infoMessage && (
                                <InfoButton message={infoMessage} />
                            )}
                        </div>
                    )}
                    {children}
                </ModalInnerContent>
            </div>
            {footerContent && (
                <div className="join-flow-footer-message">
                    {footerContent}
                </div>
            )}
            <NextStepButton
                content={nextButton}
                waiting={waiting}
            />
        </div>
    </form>
);

JoinFlowStep.propTypes = {
    children: PropTypes.node,
    description: PropTypes.string,
    footerContent: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
    headerImgSrc: PropTypes.string,
    infoMessage: PropTypes.string,
    innerClassName: PropTypes.string,
    nextButton: PropTypes.node,
    onSubmit: PropTypes.func,
    title: PropTypes.string,
    waiting: PropTypes.bool
};

module.exports = JoinFlowStep;<commit_msg>join flow step takes a descriptionClassName<commit_after>const classNames = require('classnames');
const React = require('react');
const PropTypes = require('prop-types');

const NextStepButton = require('./next-step-button.jsx');
const ModalTitle = require('../modal/base/modal-title.jsx');
const ModalInnerContent = require('../modal/base/modal-inner-content.jsx');
const InfoButton = require('../info-button/info-button.jsx');

require('./join-flow-step.scss');

const JoinFlowStep = ({
    children,
    innerClassName,
    description,
    descriptionClassName,
    footerContent,
    headerImgSrc,
    infoMessage,
    nextButton,
    onSubmit,
    title,
    waiting
}) => (
    <form onSubmit={onSubmit}>
        <div className="join-flow-outer-content">
            {headerImgSrc && (
                <div className="join-flow-header-image">
                    <img src={headerImgSrc} />
                </div>
            )}
            <div>
                <ModalInnerContent
                    className={classNames(
                        'join-flow-inner-content',
                        innerClassName
                    )}
                >
                    {title && (
                        <ModalTitle
                            className="join-flow-title"
                            title={title}
                        />
                    )}
                    {description && (
                        <div
                            className={classNames(
                                'join-flow-description',
                                descriptionClassName
                            )}
                        >
                            {description}
                            {infoMessage && (
                                <InfoButton message={infoMessage} />
                            )}
                        </div>
                    )}
                    {children}
                </ModalInnerContent>
            </div>
            {footerContent && (
                <div className="join-flow-footer-message">
                    {footerContent}
                </div>
            )}
            <NextStepButton
                content={nextButton}
                waiting={waiting}
            />
        </div>
    </form>
);

JoinFlowStep.propTypes = {
    children: PropTypes.node,
    description: PropTypes.string,
    descriptionClassName: PropTypes.string,
    footerContent: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
    headerImgSrc: PropTypes.string,
    infoMessage: PropTypes.string,
    innerClassName: PropTypes.string,
    nextButton: PropTypes.node,
    onSubmit: PropTypes.func,
    title: PropTypes.string,
    waiting: PropTypes.bool
};

module.exports = JoinFlowStep;
{'fraction_non_alphanumeric': 0.1102257636122178, 'fraction_numerical': 0.0, 'mean_word_length': 1.3183817062445031, 'pattern_counts': {'":': 0, '<': 39, '<?xml version=': 0, '>': 41, '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': '403017', 'n_tokens_mistral': 1287, 'n_tokens_neox': 1246, 'n_words': 205}