<commit_before>import React from 'react';
import PropTypes from 'prop-types';
import BigNumber from 'bignumber.js';
import TrustButton from './Session/TrustButton';
import OfferMakerResultMessage from './OfferMakerResultMessage';
import Driver from '../lib/Driver';

export default class OfferMakerOverview extends React.Component {
    static capDigits(input) {
        try {
            return new BigNumber(input).toFixed(7).toString();
        } catch (e) {
            return input;
        }
    }

    getBalance() {
        const { targetAsset } = this.props;
        const maxOffer = this.calculateMaxOffer();
        const maxOfferView = this.constructor.capDigits(maxOffer);

        return (
            <div>
                <div className="OfferMaker__youHave">
                    {targetAsset.isNative() ?
                        (<span>You may trade up to {maxOfferView} XLM (due to <a href="#account">
                                                               minimum balance requirements</a>.)</span>) :
                        (<span>You have {maxOfferView} {targetAsset.getCode()}</span>)
                    }
                </div>
                {this.isInsufficientBalance() &&
                    <p className="OfferMaker__insufficientBalance">
                        Error: You do not have enough {targetAsset.getCode()} to create this offer.
                    </p>
                }
            </div>
        );
    }
    getInputSummaryMessage(capitalizedSide, baseBuying, counterSelling, minValue) {
        const { valid, amount, total } = this.props.offerState;
        if (!valid) {
            return null;
        }

        const invalidPrecision = (amount < minValue) || (total < minValue);
        const errorPrecisionMessage = invalidPrecision ?
            (<p className="OfferMaker__insufficientBalance">
                Error: Minimal amount of assets for trading is {this.constructor.capDigits(minValue)}
            </p>) : null;

        return (
            <div>
                {errorPrecisionMessage}
                <div className="s-alert s-alert--info">
                    {capitalizedSide} {this.constructor.capDigits(amount)} {baseBuying.getCode()} for{' '}
                    {this.constructor.capDigits(total)} {counterSelling.getCode()}
                </div>
            </div>
        );
    }

    getSubmitButton(capitalizedSide, baseBuying, minValue) {
        const { valid, buttonState, amount, total } = this.props.offerState;
        const isButtonReady = buttonState === 'ready';
        const invalidPrecision = (amount < minValue) || (total < minValue);

        return (
            <input
                type="submit"
                className="s-button"
                value={isButtonReady ? `${capitalizedSide} ${baseBuying.getCode()}` : 'Creating offer...'}
                disabled={!valid || this.isInsufficientBalance() || !isButtonReady || invalidPrecision} />
        );
    }

    getTrustNeededAssets(baseBuying, counterSelling) {
        const { account } = this.props.d.session;
        const baseBalance = account.getBalance(baseBuying);
        const counterBalance = account.getBalance(counterSelling);

        const trustNeededAssets = [];
        if (baseBalance === null) {
            trustNeededAssets.push(baseBuying);
        }
        if (counterBalance === null) {
            trustNeededAssets.push(counterSelling);
        }
        return trustNeededAssets;
    }

    calculateMaxOffer() {
        const { targetAsset } = this.props;
        const { account } = this.props.d.session;
        const maxLumenSpend = account.maxLumenSpend();

        const targetBalance = targetAsset.isNative() ? maxLumenSpend : account.getBalance(targetAsset);
        const reservedBalance = account.getReservedBalance(targetAsset);

        return (parseFloat(targetBalance) > parseFloat(reservedBalance)) ?
            targetBalance - reservedBalance : 0;
    }

    isInsufficientBalance() {
        const isBuy = this.props.side === 'buy';
        const maxOffer = this.calculateMaxOffer();
        const { amount, total } = this.props.offerState;

        return Number(isBuy ? total : amount) > Number(maxOffer);
    }

    render() {
        const login = this.props.d.session.state === 'in';
        const { baseBuying, counterSelling } = this.props.d.orderbook.data;
        const isBuy = this.props.side === 'buy';
        const capitalizedSide = isBuy ? 'Buy' : 'Sell';

        if (!login) {
            return (
                <div>
                    {this.getInputSummaryMessage(capitalizedSide, baseBuying, counterSelling)}
                    <span className="OfferMaker__message">
                        <a href="#account">Log in</a> to create an offer
                    </span>
                </div>
            );
        }


        const trustNeededAssets = this.getTrustNeededAssets(baseBuying, counterSelling);

        if (trustNeededAssets.length) {
            return (
                <div>
                    <p className="OfferMaker__enable">To trade, activate these assets on your account:</p>
                    <div className="row__multipleButtons">
                        {trustNeededAssets.map(asset => (
                            <TrustButton
                                key={`${asset.getCode()}-${asset.getIssuer()}`}
                                d={this.props.d}
                                asset={asset}
                                message={`${asset.getCode()} accepted`}
                                trustMessage={`Accept ${asset.getCode()}`} />
                        ))}
                    </div>
                </div>
            );
        }

        // A “stroop” is the smallest amount unit. It is one ten-millionth: 1/10000000 or 0.0000001.

        const minValue = 0.0000001;

        return (
            <div className="OfferMaker__overview">
                {this.getBalance()}
                {this.getInputSummaryMessage(capitalizedSide, baseBuying, counterSelling, minValue)}
                <OfferMakerResultMessage offerState={this.props.offerState} />
                {this.getSubmitButton(capitalizedSide, baseBuying, minValue)}
            </div>
        );
    }
}
OfferMakerOverview.propTypes = {
    side: PropTypes.oneOf(['buy', 'sell']).isRequired,
    d: PropTypes.instanceOf(Driver).isRequired,
    targetAsset: PropTypes.objectOf(PropTypes.string),
    offerState: PropTypes.shape({
        valid: PropTypes.bool,
        amount: PropTypes.string,
        total: PropTypes.string,<commit_msg>Small message tweak.<commit_after>import React from 'react';
import PropTypes from 'prop-types';
import BigNumber from 'bignumber.js';
import TrustButton from './Session/TrustButton';
import OfferMakerResultMessage from './OfferMakerResultMessage';
import Driver from '../lib/Driver';

export default class OfferMakerOverview extends React.Component {
    static capDigits(input) {
        try {
            return new BigNumber(input).toFixed(7).toString();
        } catch (e) {
            return input;
        }
    }

    getBalance() {
        const { targetAsset } = this.props;
        const maxOffer = this.calculateMaxOffer();
        const maxOfferView = this.constructor.capDigits(maxOffer);

        return (
            <div>
                <div className="OfferMaker__youHave">
                    {targetAsset.isNative() ?
                        (<span>You may trade up to {maxOfferView} XLM (due to <a href="#account">
                                                               minimum balance requirements</a>.)</span>) :
                        (<span>You have {maxOfferView} {targetAsset.getCode()}</span>)
                    }
                </div>
                {this.isInsufficientBalance() &&
                    <p className="OfferMaker__insufficientBalance">
                        Error: You do not have enough {targetAsset.getCode()} to create this offer.
                    </p>
                }
            </div>
        );
    }
    getInputSummaryMessage(capitalizedSide, baseBuying, counterSelling, minValue) {
        const { valid, amount, total } = this.props.offerState;
        if (!valid) {
            return null;
        }

        const invalidPrecision = (amount < minValue) || (total < minValue);
        const errorPrecisionMessage = invalidPrecision ?
            (<p className="OfferMaker__insufficientBalance">
                Error: Minimal amount of any asset for trading is {this.constructor.capDigits(minValue)}
            </p>) : null;

        return (
            <div>
                {errorPrecisionMessage}
                <div className="s-alert s-alert--info">
                    {capitalizedSide} {this.constructor.capDigits(amount)} {baseBuying.getCode()} for{' '}
                    {this.constructor.capDigits(total)} {counterSelling.getCode()}
                </div>
            </div>
        );
    }

    getSubmitButton(capitalizedSide, baseBuying, minValue) {
        const { valid, buttonState, amount, total } = this.props.offerState;
        const isButtonReady = buttonState === 'ready';
        const invalidPrecision = (amount < minValue) || (total < minValue);

        return (
            <input
                type="submit"
                className="s-button"
                value={isButtonReady ? `${capitalizedSide} ${baseBuying.getCode()}` : 'Creating offer...'}
                disabled={!valid || this.isInsufficientBalance() || !isButtonReady || invalidPrecision} />
        );
    }

    getTrustNeededAssets(baseBuying, counterSelling) {
        const { account } = this.props.d.session;
        const baseBalance = account.getBalance(baseBuying);
        const counterBalance = account.getBalance(counterSelling);

        const trustNeededAssets = [];
        if (baseBalance === null) {
            trustNeededAssets.push(baseBuying);
        }
        if (counterBalance === null) {
            trustNeededAssets.push(counterSelling);
        }
        return trustNeededAssets;
    }

    calculateMaxOffer() {
        const { targetAsset } = this.props;
        const { account } = this.props.d.session;
        const maxLumenSpend = account.maxLumenSpend();

        const targetBalance = targetAsset.isNative() ? maxLumenSpend : account.getBalance(targetAsset);
        const reservedBalance = account.getReservedBalance(targetAsset);

        return (parseFloat(targetBalance) > parseFloat(reservedBalance)) ?
            targetBalance - reservedBalance : 0;
    }

    isInsufficientBalance() {
        const isBuy = this.props.side === 'buy';
        const maxOffer = this.calculateMaxOffer();
        const { amount, total } = this.props.offerState;

        return Number(isBuy ? total : amount) > Number(maxOffer);
    }

    render() {
        const login = this.props.d.session.state === 'in';
        const { baseBuying, counterSelling } = this.props.d.orderbook.data;
        const isBuy = this.props.side === 'buy';
        const capitalizedSide = isBuy ? 'Buy' : 'Sell';

        if (!login) {
            return (
                <div>
                    {this.getInputSummaryMessage(capitalizedSide, baseBuying, counterSelling)}
                    <span className="OfferMaker__message">
                        <a href="#account">Log in</a> to create an offer
                    </span>
                </div>
            );
        }


        const trustNeededAssets = this.getTrustNeededAssets(baseBuying, counterSelling);

        if (trustNeededAssets.length) {
            return (
                <div>
                    <p className="OfferMaker__enable">To trade, activate these assets on your account:</p>
                    <div className="row__multipleButtons">
                        {trustNeededAssets.map(asset => (
                            <TrustButton
                                key={`${asset.getCode()}-${asset.getIssuer()}`}
                                d={this.props.d}
                                asset={asset}
                                message={`${asset.getCode()} accepted`}
                                trustMessage={`Accept ${asset.getCode()}`} />
                        ))}
                    </div>
                </div>
            );
        }

        // The smallest asset amount unit is one ten-millionth: 1/10000000 or 0.0000001.
        // https://www.stellar.org/developers/guides/concepts/assets.html#amount-precision-and-representation

        const minValue = 0.0000001;

        return (
            <div className="OfferMaker__overview">
                {this.getBalance()}
                {this.getInputSummaryMessage(capitalizedSide, baseBuying, counterSelling, minValue)}
                <OfferMakerResultMessage offerState={this.props.offerState} />
                {this.getSubmitButton(capitalizedSide, baseBuying, minValue)}
            </div>
        );
    }
}
OfferMakerOverview.propTypes = {
    side: PropTypes.oneOf(['buy', 'sell']).isRequired,
    d: PropTypes.instanceOf(Driver).isRequired,
    targetAsset: PropTypes.objectOf(PropTypes.string),
    offerState: PropTypes.shape({
        valid: PropTypes.bool,
        amount: PropTypes.string,
        total: PropTypes.string,
{'fraction_non_alphanumeric': 0.11152919927754365, 'fraction_numerical': 0.004063816977724262, 'mean_word_length': 1.8292527144986162, 'pattern_counts': {'":': 0, '<': 81, '<?xml version=': 0, '>': 79, 'https://': 1, 'lorem ipsum': 0, 'www.': 1, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 2, 'word_list_counts': {'cursed_substrings.json': 4, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2349544', 'n_tokens_mistral': 3650, 'n_tokens_neox': 3473, 'n_words': 696}