<commit_before>import React from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';

import { get } from '../../store';

import { areWeFunYet, translate as $t } from '../../helpers';
import ExternalLink from './external-link.js';
import DisplayIf from './display-if';

let showLicense = areWeFunYet();

export const LoadingMessage = props => {
    let message = props.message || $t('client.spinner.generic');

    return (
        <div className="loading-message">
            <h3>{$t('client.spinner.title')}</h3>
            <div>
                <div className="spinner" />
                <div>{message}</div>
                <DisplayIf condition={showLicense}>
                    <div>
                        {$t('client.spinner.license')}
                        <ExternalLink href="https://liberapay.com/Kresus">Kresus</ExternalLink>
                    </div>
                </DisplayIf>
            </div>
        </div>
    );
};

LoadingMessage.propTypes = {
    // Message indicating why we're doing background loading (and the UI is
    // frozen).
    message: PropTypes.string
};

export const LoadingOverlay = connect(state => {
    return {
        processingReason: get.backgroundProcessingReason(state)
    };
})(props => {
    return (
        <DisplayIf condition={props.processingReason !== null}>
            <div id="loading-overlay">
                <LoadingMessage message={$t(props.processingReason)} />
            </div>
        </DisplayIf>
    );
});<commit_msg>Fix "Missing translation key for 'null'"<commit_after>import React from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';

import { get } from '../../store';

import { areWeFunYet, translate as $t } from '../../helpers';
import ExternalLink from './external-link.js';
import DisplayIf from './display-if';

let showLicense = areWeFunYet();

export const LoadingMessage = props => {
    let message = props.message || $t('client.spinner.generic');

    return (
        <div className="loading-message">
            <h3>{$t('client.spinner.title')}</h3>
            <div>
                <div className="spinner" />
                <div>{message}</div>
                <DisplayIf condition={showLicense}>
                    <div>
                        {$t('client.spinner.license')}
                        <ExternalLink href="https://liberapay.com/Kresus">Kresus</ExternalLink>
                    </div>
                </DisplayIf>
            </div>
        </div>
    );
};

LoadingMessage.propTypes = {
    // Message indicating why we're doing background loading (and the UI is
    // frozen).
    message: PropTypes.string
};

export const LoadingOverlay = connect(state => {
    return {
        processingReason: get.backgroundProcessingReason(state)
    };
})(props => {
    if (!props.processingReason) {
        return null;
    }

    return (
        <div id="loading-overlay">
            <LoadingMessage message={$t(props.processingReason)} />
        </div>
    );
});
{'fraction_non_alphanumeric': 0.14650934119960668, 'fraction_numerical': 0.0013110455588331695, 'mean_word_length': 2.098477157360406, 'pattern_counts': {'":': 0, '<': 41, '<?xml version=': 0, '>': 47, 'https://': 2, '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': '3721731', 'n_tokens_mistral': 841, 'n_tokens_neox': 820, 'n_words': 191}