From 8a09eb5dd29972e47dbd13db57429a2b06dfbbb9 Mon Sep 17 00:00:00 2001 From: Likhith Kolayari Date: Mon, 20 Jun 2022 13:20:36 +0400 Subject: [PATCH 01/21] feat: incorporated market rate calculation with 6 decimals --- .../advertiser-page/advertiser-page-row.jsx | 19 ++++++++--- .../src/components/buy-sell/buy-sell-form.jsx | 32 +++++++++++-------- .../src/components/buy-sell/buy-sell-row.jsx | 20 +++++++++--- .../floating-rate/floating-rate.jsx | 15 +++++++-- .../components/my-ads/create-ad-summary.jsx | 32 +++++++++++-------- .../src/components/my-ads/edit-ad-summary.jsx | 22 +++++++------ .../components/my-ads/my-ads-row-renderer.jsx | 21 ++++++++---- .../order-details-confirm-modal.jsx | 11 ++++--- .../order-details/order-details.jsx | 25 ++++++++++++--- packages/p2p/src/stores/buy-sell-store.js | 8 ++--- packages/p2p/src/utils/format-value.js | 15 ++++++--- 11 files changed, 150 insertions(+), 70 deletions(-) diff --git a/packages/p2p/src/components/advertiser-page/advertiser-page-row.jsx b/packages/p2p/src/components/advertiser-page/advertiser-page-row.jsx index f7d3906eb680..3f16859e635c 100644 --- a/packages/p2p/src/components/advertiser-page/advertiser-page-row.jsx +++ b/packages/p2p/src/components/advertiser-page/advertiser-page-row.jsx @@ -7,6 +7,7 @@ import { useStores } from 'Stores'; import { buy_sell } from 'Constants/buy-sell'; import { ad_type } from 'Constants/floating-rate'; import { localize, Localize } from 'Components/i18next'; +import { setDecimalPlaces, removeTrailingZeros } from 'Utils/format-value.js'; import './advertiser-page.scss'; const AdvertiserPageRow = ({ row: advert, showAdPopup }) => { @@ -25,8 +26,18 @@ const AdvertiserPageRow = ({ row: advert, showAdPopup }) => { const is_buy_advert = advertiser_page_store.counterparty_type === buy_sell.BUY; const is_my_advert = advertiser_page_store.advertiser_details_id === general_store.advertiser_id; - const display_effective_rate = - rate_type === ad_type.FIXED ? price_display : parseFloat(floating_rate_store.exchange_rate * (1 + rate / 100)); + let effective_rate = 0; + let display_effective_rate = 0; + + if (rate_type === ad_type.FIXED) { + effective_rate = price_display; + display_effective_rate = formatMoney(local_currency, effective_rate, true); + } else { + effective_rate = parseFloat(floating_rate_store.exchange_rate * (1 + rate / 100)); + display_effective_rate = removeTrailingZeros( + formatMoney(local_currency, effective_rate, true, setDecimalPlaces(effective_rate, 6)) + ); + } const showAdForm = () => { buy_sell_store.setSelectedAdState(advert); @@ -48,7 +59,7 @@ const AdvertiserPageRow = ({ row: advert, showAdPopup }) => {
- {formatMoney(local_currency, display_effective_rate, true)} {local_currency} + {display_effective_rate} {local_currency}
@@ -95,7 +106,7 @@ const AdvertiserPageRow = ({ row: advert, showAdPopup }) => { {`${min_order_amount_limit_display}-${max_order_amount_limit_display} ${currency}`} - {formatMoney(local_currency, display_effective_rate, true)} {local_currency} + {display_effective_rate} {local_currency} diff --git a/packages/p2p/src/components/buy-sell/buy-sell-form.jsx b/packages/p2p/src/components/buy-sell/buy-sell-form.jsx index daf7f55b1e11..8d23cdc62a35 100644 --- a/packages/p2p/src/components/buy-sell/buy-sell-form.jsx +++ b/packages/p2p/src/components/buy-sell/buy-sell-form.jsx @@ -1,8 +1,9 @@ +import classNames from 'classnames'; import React from 'react'; import PropTypes from 'prop-types'; import { Formik, Field, Form } from 'formik'; import { HintBox, Icon, Input, Text } from '@deriv/components'; -import { getRoundedNumber, getFormattedText, isDesktop, isMobile, useIsMounted } from '@deriv/shared'; +import { getRoundedNumber, formatMoney, isDesktop, isMobile, useIsMounted } from '@deriv/shared'; import { reaction } from 'mobx'; import { observer } from 'mobx-react-lite'; import { localize, Localize } from 'Components/i18next'; @@ -11,7 +12,7 @@ import { useStores } from 'Stores'; import BuySellFormReceiveAmount from './buy-sell-form-receive-amount.jsx'; import PaymentMethodCard from '../my-profile/payment-methods/payment-method-card/payment-method-card.jsx'; import { floatingPointValidator } from 'Utils/validations'; -import classNames from 'classnames'; +import { setDecimalPlaces, removeTrailingZeros } from 'Utils/format-value.js'; const BuySellForm = props => { const isMounted = useIsMounted(); @@ -44,8 +45,18 @@ const BuySellForm = props => { cursor: should_disable_field ? 'not-allowed' : 'pointer', }; - const effective_rate = - rate_type === ad_type.FLOAT ? parseFloat(floating_rate_store.exchange_rate * (1 + rate / 100)) : price; + let effective_rate = 0; + let display_effective_rate = 0; + + if (rate_type === ad_type.FIXED) { + effective_rate = price; + display_effective_rate = formatMoney(local_currency, effective_rate, true); + } else { + effective_rate = parseFloat(floating_rate_store.exchange_rate * (1 + rate / 100)); + display_effective_rate = removeTrailingZeros( + formatMoney(local_currency, effective_rate, true, setDecimalPlaces(effective_rate, 6)) + ); + } React.useEffect( () => { @@ -69,7 +80,7 @@ const BuySellForm = props => { advertiser_page_store.setFormErrorMessage(''); buy_sell_store.setShowRateChangePopup(rate_type === ad_type.FLOAT); - buy_sell_store.setInitialReceiveAmount(getRoundedNumber(effective_rate, buy_sell_store.account_currency)); + buy_sell_store.setInitialReceiveAmount(effective_rate); return () => { buy_sell_store.payment_method_ids = []; @@ -155,7 +166,7 @@ const BuySellForm = props => { /> - {getFormattedText(effective_rate, local_currency)} + {display_effective_rate} {local_currency}
@@ -355,14 +366,7 @@ const BuySellForm = props => { setFieldValue('amount', getRoundedNumber(input_amount)); buy_sell_store.setReceiveAmount( - getRoundedNumber( - input_amount * - getRoundedNumber( - effective_rate, - buy_sell_store.account_currency - ), - buy_sell_store.account_currency - ) + input_amount * effective_rate ); } }} diff --git a/packages/p2p/src/components/buy-sell/buy-sell-row.jsx b/packages/p2p/src/components/buy-sell/buy-sell-row.jsx index b288a590e77a..b251c727625b 100644 --- a/packages/p2p/src/components/buy-sell/buy-sell-row.jsx +++ b/packages/p2p/src/components/buy-sell/buy-sell-row.jsx @@ -9,6 +9,7 @@ import { Localize, localize } from 'Components/i18next'; import UserAvatar from 'Components/user/user-avatar'; import { ad_type } from 'Constants/floating-rate'; import { useStores } from 'Stores'; +import { setDecimalPlaces, removeTrailingZeros } from 'Utils/format-value.js'; import './buy-sell-row.scss'; import TradeBadge from '../trade-badge'; @@ -49,8 +50,19 @@ const BuySellRow = ({ row: advert }) => { const is_my_advert = advert.advertiser_details.id === general_store.advertiser_id; const is_buy_advert = counterparty_type === buy_sell.BUY; const { name: advertiser_name } = advert.advertiser_details; - const display_effective_rate = - rate_type === ad_type.FIXED ? price_display : parseFloat(floating_rate_store.exchange_rate * (1 + rate / 100)); + + let effective_rate = 0; + let display_effective_rate = 0; + + if (rate_type === ad_type.FIXED) { + effective_rate = price_display; + display_effective_rate = formatMoney(local_currency, effective_rate, true); + } else { + effective_rate = parseFloat(floating_rate_store.exchange_rate * (1 + rate / 100)); + display_effective_rate = removeTrailingZeros( + formatMoney(local_currency, effective_rate, true, setDecimalPlaces(effective_rate, 6)) + ); + } if (isMobile()) { return ( @@ -97,7 +109,7 @@ const BuySellRow = ({ row: advert }) => { /> - {formatMoney(local_currency, display_effective_rate, true)} {local_currency} + {display_effective_rate} {local_currency} { - {formatMoney(local_currency, display_effective_rate, true)} {local_currency} + {display_effective_rate} {local_currency} diff --git a/packages/p2p/src/components/floating-rate/floating-rate.jsx b/packages/p2p/src/components/floating-rate/floating-rate.jsx index 84be60c377de..02f1dd1c89e7 100644 --- a/packages/p2p/src/components/floating-rate/floating-rate.jsx +++ b/packages/p2p/src/components/floating-rate/floating-rate.jsx @@ -6,6 +6,7 @@ import { InputField, Text } from '@deriv/components'; import { formatMoney, isMobile, mobileOSDetect } from '@deriv/shared'; import { localize } from 'Components/i18next'; import { useStores } from 'Stores'; +import { setDecimalPlaces, removeTrailingZeros } from 'Utils/format-value.js'; import './floating-rate.scss'; const FloatingRate = ({ @@ -92,7 +93,13 @@ const FloatingRate = ({ line_height='xs' className='floating-rate__mkt-rate--msg' > - 1 {fiat_currency} = {formatMoney(local_currency, floating_rate_store.exchange_rate, true)}{' '} + 1 {fiat_currency} ={' '} + {formatMoney( + local_currency, + floating_rate_store.exchange_rate, + true, + setDecimalPlaces(floating_rate_store.exchange_rate, 6) + )}{' '} {local_currency} @@ -117,7 +124,11 @@ const FloatingRate = ({ line_height='xs' className='floating-rate__hint' > - {localize('Your rate is')} = {formatMoney(local_currency, market_feed, true)} {local_currency} + {localize('Your rate is')} ={' '} + {removeTrailingZeros( + formatMoney(local_currency, market_feed, true, setDecimalPlaces(market_feed, 6)) + )}{' '} + {local_currency} )} diff --git a/packages/p2p/src/components/my-ads/create-ad-summary.jsx b/packages/p2p/src/components/my-ads/create-ad-summary.jsx index a891c1437e44..e6376bb3880a 100644 --- a/packages/p2p/src/components/my-ads/create-ad-summary.jsx +++ b/packages/p2p/src/components/my-ads/create-ad-summary.jsx @@ -5,8 +5,9 @@ import { observer } from 'mobx-react-lite'; import { Text } from '@deriv/components'; import { buy_sell } from 'Constants/buy-sell'; import { Localize } from 'Components/i18next'; -import { useStores } from 'Stores'; import { ad_type } from 'Constants/floating-rate'; +import { useStores } from 'Stores'; +import { setDecimalPlaces, removeTrailingZeros, roundOffDecimal } from 'Utils/format-value.js'; const CreateAdSummary = ({ offer_amount, price_rate, type }) => { const { floating_rate_store, general_store } = useStores(); @@ -17,20 +18,16 @@ const CreateAdSummary = ({ offer_amount, price_rate, type }) => { let display_price_rate = ''; let display_total = ''; - if (market_feed && price_rate) { - display_price_rate = parseFloat(market_feed * (1 + price_rate / 100)); - } else if (price_rate) { - display_price_rate = price_rate; + if (price_rate) { + display_price_rate = market_feed + ? roundOffDecimal(parseFloat(market_feed * (1 + price_rate / 100)), 6) + : price_rate; } - if (market_feed && offer_amount && price_rate) { - display_total = formatMoney( - local_currency_config.currency, - offer_amount * parseFloat(market_feed * (1 + price_rate / 100)), - true - ); - } else if (offer_amount && price_rate) { - display_total = formatMoney(local_currency_config.currency, offer_amount * price_rate, true); + if (offer_amount && price_rate) { + display_total = market_feed + ? formatMoney(local_currency_config.currency, offer_amount * display_price_rate, true) + : formatMoney(local_currency_config.currency, offer_amount * price_rate, true); } if (offer_amount) { @@ -43,7 +40,14 @@ const CreateAdSummary = ({ offer_amount, price_rate, type }) => { Object.assign(values, { local_amount: display_total, local_currency: local_currency_config.currency, - price_rate: formatMoney(local_currency_config.currency, display_price_rate, true), + price_rate: removeTrailingZeros( + formatMoney( + local_currency_config.currency, + display_price_rate, + true, + setDecimalPlaces(display_price_rate, 6) + ) + ), }); if (type === buy_sell.BUY) { diff --git a/packages/p2p/src/components/my-ads/edit-ad-summary.jsx b/packages/p2p/src/components/my-ads/edit-ad-summary.jsx index 3d2e92c2f3ea..c54861885d06 100644 --- a/packages/p2p/src/components/my-ads/edit-ad-summary.jsx +++ b/packages/p2p/src/components/my-ads/edit-ad-summary.jsx @@ -5,8 +5,9 @@ import { observer } from 'mobx-react-lite'; import { Text } from '@deriv/components'; import { buy_sell } from 'Constants/buy-sell'; import { Localize } from 'Components/i18next'; -import { useStores } from 'Stores'; import { ad_type } from 'Constants/floating-rate'; +import { useStores } from 'Stores'; +import { setDecimalPlaces, removeTrailingZeros, roundOffDecimal } from 'Utils/format-value.js'; const EditAdSummary = ({ offer_amount, price_rate, type }) => { const { floating_rate_store, general_store } = useStores(); @@ -19,17 +20,13 @@ const EditAdSummary = ({ offer_amount, price_rate, type }) => { if (price_rate) { display_price_rate = market_feed - ? formatMoney(local_currency_config.currency, parseFloat(market_feed * (1 + price_rate / 100)), true) - : formatMoney(local_currency_config.currency, price_rate, true); + ? roundOffDecimal(parseFloat(market_feed * (1 + price_rate / 100)), 6) + : price_rate; } if (offer_amount && price_rate) { display_total = market_feed - ? formatMoney( - local_currency_config.currency, - offer_amount * parseFloat(market_feed * (1 + price_rate / 100)), - true - ) + ? formatMoney(local_currency_config.currency, offer_amount * display_price_rate, true) : formatMoney(local_currency_config.currency, offer_amount * price_rate, true); } @@ -44,7 +41,14 @@ const EditAdSummary = ({ offer_amount, price_rate, type }) => { Object.assign(values, { local_amount: display_total, local_currency: local_currency_config.currency, - price_rate: display_price_rate, + price_rate: removeTrailingZeros( + formatMoney( + local_currency_config.currency, + display_price_rate, + true, + setDecimalPlaces(display_price_rate, 6) + ) + ), }); if (type === buy_sell.BUY) { diff --git a/packages/p2p/src/components/my-ads/my-ads-row-renderer.jsx b/packages/p2p/src/components/my-ads/my-ads-row-renderer.jsx index 53dfa0d79388..05b0e6e7a6b0 100644 --- a/packages/p2p/src/components/my-ads/my-ads-row-renderer.jsx +++ b/packages/p2p/src/components/my-ads/my-ads-row-renderer.jsx @@ -9,6 +9,7 @@ import { buy_sell } from 'Constants/buy-sell'; import { ad_type } from 'Constants/floating-rate'; import AdStatus from 'Components/my-ads/ad-status.jsx'; import { useStores } from 'Stores'; +import { setDecimalPlaces, removeTrailingZeros } from 'Utils/format-value.js'; import AdType from './ad-type.jsx'; const MyAdsRowRenderer = observer(({ row: advert, setAdvert }) => { @@ -39,10 +40,18 @@ const MyAdsRowRenderer = observer(({ row: advert, setAdvert }) => { const amount_dealt = amount - remaining_amount; const enable_action_point = floating_rate_store.change_ad_alert && floating_rate_store.rate_type !== rate_type; const is_buy_advert = type === buy_sell.BUY; - const display_effective_rate = - rate_type === ad_type.FIXED - ? price_display - : parseFloat(floating_rate_store.exchange_rate * (1 + rate_display / 100)); + let effective_rate = 0; + let display_effective_rate = 0; + + if (rate_type === ad_type.FIXED) { + effective_rate = price_display; + display_effective_rate = formatMoney(local_currency, effective_rate, true); + } else { + effective_rate = parseFloat(floating_rate_store.exchange_rate * (1 + rate_display / 100)); + display_effective_rate = removeTrailingZeros( + formatMoney(local_currency, effective_rate, true, setDecimalPlaces(effective_rate, 6)) + ); + } const is_activate_ad_disabled = floating_rate_store.reached_target_date && enable_action_point; @@ -155,7 +164,7 @@ const MyAdsRowRenderer = observer(({ row: advert, setAdvert }) => {
- {formatMoney(local_currency, display_effective_rate, true)} {local_currency} + {display_effective_rate} {local_currency} {rate_type === ad_type.FLOAT && }
@@ -210,7 +219,7 @@ const MyAdsRowRenderer = observer(({ row: advert, setAdvert }) => {
- {formatMoney(local_currency, display_effective_rate, true)} {local_currency} + {display_effective_rate} {local_currency} {rate_type === ad_type.FLOAT && }
diff --git a/packages/p2p/src/components/order-details/order-details-confirm-modal.jsx b/packages/p2p/src/components/order-details/order-details-confirm-modal.jsx index a2c15988a89c..4839e923d34b 100644 --- a/packages/p2p/src/components/order-details/order-details-confirm-modal.jsx +++ b/packages/p2p/src/components/order-details/order-details-confirm-modal.jsx @@ -1,11 +1,12 @@ import PropTypes from 'prop-types'; import React from 'react'; import { Button, Checkbox, Loading, Modal, Text } from '@deriv/components'; -import { getRoundedNumber, useIsMounted } from '@deriv/shared'; +import { useIsMounted } from '@deriv/shared'; import { Localize } from 'Components/i18next'; -import { requestWS } from 'Utils/websocket'; import FormError from 'Components/form/error.jsx'; import 'Components/order-details/order-details-confirm-modal.scss'; +import { requestWS } from 'Utils/websocket'; +import { setDecimalPlaces, roundOffDecimal } from 'Utils/format-value.js'; const OrderDetailsConfirmModal = ({ order_information, @@ -45,6 +46,8 @@ const OrderDetailsConfirmModal = ({ .finally(() => setIsProcessRequest(false)); }; + const rounded_rate = roundOffDecimal(rate, setDecimalPlaces(rate, 6)); + const getConfirmButtonText = () => { if (is_buy_order_for_user) { return ; @@ -85,7 +88,7 @@ const OrderDetailsConfirmModal = ({ diff --git a/packages/p2p/src/components/order-details/order-details.jsx b/packages/p2p/src/components/order-details/order-details.jsx index 24cbac2c8b19..1370fa02f820 100644 --- a/packages/p2p/src/components/order-details/order-details.jsx +++ b/packages/p2p/src/components/order-details/order-details.jsx @@ -2,7 +2,7 @@ import classNames from 'classnames'; import React from 'react'; import PropTypes from 'prop-types'; import { Button, HintBox, Text, ThemedScrollbars } from '@deriv/components'; -import { getFormattedText, isDesktop, getRoundedNumber } from '@deriv/shared'; +import { formatMoney, getFormattedText, isDesktop } from '@deriv/shared'; import { observer } from 'mobx-react-lite'; import { Localize, localize } from 'Components/i18next'; import Chat from 'Components/orders/chat/chat.jsx'; @@ -15,6 +15,7 @@ import { useStores } from 'Stores'; import PaymentMethodAccordionHeader from './payment-method-accordion-header.jsx'; import PaymentMethodAccordionContent from './payment-method-accordion-content.jsx'; import MyProfileSeparatorContainer from '../my-profile/my-profile-separator-container'; +import { setDecimalPlaces, removeTrailingZeros, roundOffDecimal } from 'Utils/format-value.js'; import 'Components/order-details/order-details.scss'; const OrderDetails = observer(({ onPageReturn }) => { @@ -72,6 +73,9 @@ const OrderDetails = observer(({ onPageReturn }) => { (is_buy_order && !is_my_ad) || (is_sell_order && is_my_ad) ? localize('Buy {{offered_currency}} order', { offered_currency: account_currency }) : localize('Sell {{offered_currency}} order', { offered_currency: account_currency }); + + const decimal_place = setDecimalPlaces(rate, 6); + if (sendbird_store.should_show_chat_on_orders) { return ; } @@ -113,7 +117,12 @@ const OrderDetails = observer(({ onPageReturn }) => { )} {!has_timer_expired && (is_pending_order || is_buyer_confirmed_order) && (
- {getFormattedText(amount_display * getRoundedNumber(rate), local_currency)} + {removeTrailingZeros( + getFormattedText( + amount_display * roundOffDecimal(rate, decimal_place), + local_currency + ) + )}
)}
@@ -143,11 +152,19 @@ const OrderDetails = observer(({ onPageReturn }) => {
diff --git a/packages/p2p/src/stores/buy-sell-store.js b/packages/p2p/src/stores/buy-sell-store.js index e60af1fd754e..470c95bd7a75 100644 --- a/packages/p2p/src/stores/buy-sell-store.js +++ b/packages/p2p/src/stores/buy-sell-store.js @@ -1,10 +1,11 @@ import { action, computed, observable, reaction } from 'mobx'; -import { formatMoney, getDecimalPlaces, getRoundedNumber, isMobile } from '@deriv/shared'; +import { formatMoney, getDecimalPlaces, isMobile } from '@deriv/shared'; import { localize } from 'Components/i18next'; import { buy_sell } from 'Constants/buy-sell'; import { requestWS } from 'Utils/websocket'; import { textValidator, lengthValidator } from 'Utils/validations'; import { countDecimalPlaces } from 'Utils/string'; +import { setDecimalPlaces, removeTrailingZeros, roundOffDecimal } from 'Utils/format-value.js'; import BaseStore from 'Stores/base_store'; export default class BuySellStore extends BaseStore { @@ -408,9 +409,8 @@ export default class BuySellStore extends BaseStore { @action.bound setInitialReceiveAmount(initial_price) { - this.receive_amount = getRoundedNumber( - this.advert.min_order_amount_limit * initial_price, - this.advert.local_currency + this.receive_amount = removeTrailingZeros( + roundOffDecimal(this.advert.min_order_amount_limit * initial_price, setDecimalPlaces(initial_price, 6)) ); } diff --git a/packages/p2p/src/utils/format-value.js b/packages/p2p/src/utils/format-value.js index 282d9332b2d2..76df0694196e 100644 --- a/packages/p2p/src/utils/format-value.js +++ b/packages/p2p/src/utils/format-value.js @@ -13,12 +13,13 @@ export const setDecimalPlaces = (value, expected_decimal_place) => { }; export const removeTrailingZeros = value => { + // Returns the string after truncating extra zeros if (!value) { return ''; } const [input, unit] = value.toString().trim().split(' '); if (input.indexOf('.') === -1) { - return input; + return formatInput(input, unit); } let trim_from = input.length - 1; do { @@ -29,8 +30,12 @@ export const removeTrailingZeros = value => { if (input[trim_from] === '.') { trim_from--; } - const result = value.substr(0, trim_from + 1); - return parseFloat(result) % 1 !== 0 - ? `${result}.00 ${unit ? unit.trim() : ''}` - : `${result} ${unit ? unit.trim() : ''}`; + const result = value.toString().substr(0, trim_from + 1); + return formatInput(result, unit); +}; + +const formatInput = (input, unit) => { + return parseFloat(input.replace(/,/g, '')) % 1 === 0 + ? `${input}.00 ${unit ? unit.trim() : ''}` + : `${input} ${unit ? unit.trim() : ''}`; }; From d2ae7023d333d9ab480e3378382d30be8c0d35e3 Mon Sep 17 00:00:00 2001 From: Likhith Kolayari Date: Mon, 20 Jun 2022 16:18:01 +0400 Subject: [PATCH 02/21] ref: refactored code to generate effective rate --- .../advertiser-page/advertiser-page-row.jsx | 24 +++++-------- .../src/components/buy-sell/buy-sell-form.jsx | 34 +++++++++++------- .../src/components/buy-sell/buy-sell-row.jsx | 35 +++++++++++-------- .../components/my-ads/my-ads-row-renderer.jsx | 32 ++++++++++------- packages/p2p/src/utils/format-value.js | 24 +++++++++++++ 5 files changed, 95 insertions(+), 54 deletions(-) diff --git a/packages/p2p/src/components/advertiser-page/advertiser-page-row.jsx b/packages/p2p/src/components/advertiser-page/advertiser-page-row.jsx index 3f16859e635c..8956765dcd31 100644 --- a/packages/p2p/src/components/advertiser-page/advertiser-page-row.jsx +++ b/packages/p2p/src/components/advertiser-page/advertiser-page-row.jsx @@ -1,13 +1,12 @@ import PropTypes from 'prop-types'; import React from 'react'; import { Button, Table, Text } from '@deriv/components'; -import { formatMoney, isMobile } from '@deriv/shared'; +import { isMobile } from '@deriv/shared'; import { observer } from 'mobx-react-lite'; import { useStores } from 'Stores'; import { buy_sell } from 'Constants/buy-sell'; -import { ad_type } from 'Constants/floating-rate'; import { localize, Localize } from 'Components/i18next'; -import { setDecimalPlaces, removeTrailingZeros } from 'Utils/format-value.js'; +import { generateEffectiveRate } from 'Utils/format-value.js'; import './advertiser-page.scss'; const AdvertiserPageRow = ({ row: advert, showAdPopup }) => { @@ -26,18 +25,13 @@ const AdvertiserPageRow = ({ row: advert, showAdPopup }) => { const is_buy_advert = advertiser_page_store.counterparty_type === buy_sell.BUY; const is_my_advert = advertiser_page_store.advertiser_details_id === general_store.advertiser_id; - let effective_rate = 0; - let display_effective_rate = 0; - - if (rate_type === ad_type.FIXED) { - effective_rate = price_display; - display_effective_rate = formatMoney(local_currency, effective_rate, true); - } else { - effective_rate = parseFloat(floating_rate_store.exchange_rate * (1 + rate / 100)); - display_effective_rate = removeTrailingZeros( - formatMoney(local_currency, effective_rate, true, setDecimalPlaces(effective_rate, 6)) - ); - } + const { display_effective_rate } = generateEffectiveRate({ + price: price_display, + rate_type, + rate, + local_currency, + exchange_rate: floating_rate_store.exchange_rate, + }); const showAdForm = () => { buy_sell_store.setSelectedAdState(advert); diff --git a/packages/p2p/src/components/buy-sell/buy-sell-form.jsx b/packages/p2p/src/components/buy-sell/buy-sell-form.jsx index 8d23cdc62a35..288635a52cd6 100644 --- a/packages/p2p/src/components/buy-sell/buy-sell-form.jsx +++ b/packages/p2p/src/components/buy-sell/buy-sell-form.jsx @@ -3,7 +3,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import { Formik, Field, Form } from 'formik'; import { HintBox, Icon, Input, Text } from '@deriv/components'; -import { getRoundedNumber, formatMoney, isDesktop, isMobile, useIsMounted } from '@deriv/shared'; +import { getRoundedNumber, isDesktop, isMobile, useIsMounted } from '@deriv/shared'; import { reaction } from 'mobx'; import { observer } from 'mobx-react-lite'; import { localize, Localize } from 'Components/i18next'; @@ -12,7 +12,7 @@ import { useStores } from 'Stores'; import BuySellFormReceiveAmount from './buy-sell-form-receive-amount.jsx'; import PaymentMethodCard from '../my-profile/payment-methods/payment-method-card/payment-method-card.jsx'; import { floatingPointValidator } from 'Utils/validations'; -import { setDecimalPlaces, removeTrailingZeros } from 'Utils/format-value.js'; +import { generateEffectiveRate } from 'Utils/format-value.js'; const BuySellForm = props => { const isMounted = useIsMounted(); @@ -45,18 +45,26 @@ const BuySellForm = props => { cursor: should_disable_field ? 'not-allowed' : 'pointer', }; - let effective_rate = 0; - let display_effective_rate = 0; + // let effective_rate = 0; + // let display_effective_rate = 0; - if (rate_type === ad_type.FIXED) { - effective_rate = price; - display_effective_rate = formatMoney(local_currency, effective_rate, true); - } else { - effective_rate = parseFloat(floating_rate_store.exchange_rate * (1 + rate / 100)); - display_effective_rate = removeTrailingZeros( - formatMoney(local_currency, effective_rate, true, setDecimalPlaces(effective_rate, 6)) - ); - } + // if (rate_type === ad_type.FIXED) { + // effective_rate = price; + // display_effective_rate = formatMoney(local_currency, effective_rate, true); + // } else { + // effective_rate = parseFloat(floating_rate_store.exchange_rate * (1 + rate / 100)); + // display_effective_rate = removeTrailingZeros( + // formatMoney(local_currency, effective_rate, true, setDecimalPlaces(effective_rate, 6)) + // ); + // } + + const { effective_rate, display_effective_rate } = generateEffectiveRate({ + price, + rate_type, + rate, + local_currency, + exchange_rate: floating_rate_store.exchange_rate, + }); React.useEffect( () => { diff --git a/packages/p2p/src/components/buy-sell/buy-sell-row.jsx b/packages/p2p/src/components/buy-sell/buy-sell-row.jsx index b251c727625b..bbf5e3a84557 100644 --- a/packages/p2p/src/components/buy-sell/buy-sell-row.jsx +++ b/packages/p2p/src/components/buy-sell/buy-sell-row.jsx @@ -2,14 +2,13 @@ import React from 'react'; import PropTypes from 'prop-types'; import classNames from 'classnames'; import { Table, Text, Button, Icon } from '@deriv/components'; -import { formatMoney, isMobile } from '@deriv/shared'; +import { isMobile } from '@deriv/shared'; import { observer } from 'mobx-react-lite'; import { buy_sell } from 'Constants/buy-sell'; import { Localize, localize } from 'Components/i18next'; import UserAvatar from 'Components/user/user-avatar'; -import { ad_type } from 'Constants/floating-rate'; import { useStores } from 'Stores'; -import { setDecimalPlaces, removeTrailingZeros } from 'Utils/format-value.js'; +import { generateEffectiveRate } from 'Utils/format-value.js'; import './buy-sell-row.scss'; import TradeBadge from '../trade-badge'; @@ -51,18 +50,26 @@ const BuySellRow = ({ row: advert }) => { const is_buy_advert = counterparty_type === buy_sell.BUY; const { name: advertiser_name } = advert.advertiser_details; - let effective_rate = 0; - let display_effective_rate = 0; + // let effective_rate = 0; + // let display_effective_rate = 0; - if (rate_type === ad_type.FIXED) { - effective_rate = price_display; - display_effective_rate = formatMoney(local_currency, effective_rate, true); - } else { - effective_rate = parseFloat(floating_rate_store.exchange_rate * (1 + rate / 100)); - display_effective_rate = removeTrailingZeros( - formatMoney(local_currency, effective_rate, true, setDecimalPlaces(effective_rate, 6)) - ); - } + // if (rate_type === ad_type.FIXED) { + // effective_rate = price_display; + // display_effective_rate = formatMoney(local_currency, effective_rate, true); + // } else { + // effective_rate = parseFloat(floating_rate_store.exchange_rate * (1 + rate / 100)); + // display_effective_rate = removeTrailingZeros( + // formatMoney(local_currency, effective_rate, true, setDecimalPlaces(effective_rate, 6)) + // ); + // } + + const { display_effective_rate } = generateEffectiveRate({ + price: price_display, + rate_type, + rate, + local_currency, + exchange_rate: floating_rate_store.exchange_rate, + }); if (isMobile()) { return ( diff --git a/packages/p2p/src/components/my-ads/my-ads-row-renderer.jsx b/packages/p2p/src/components/my-ads/my-ads-row-renderer.jsx index 05b0e6e7a6b0..6ef3a254cd79 100644 --- a/packages/p2p/src/components/my-ads/my-ads-row-renderer.jsx +++ b/packages/p2p/src/components/my-ads/my-ads-row-renderer.jsx @@ -9,7 +9,7 @@ import { buy_sell } from 'Constants/buy-sell'; import { ad_type } from 'Constants/floating-rate'; import AdStatus from 'Components/my-ads/ad-status.jsx'; import { useStores } from 'Stores'; -import { setDecimalPlaces, removeTrailingZeros } from 'Utils/format-value.js'; +import { generateEffectiveRate } from 'Utils/format-value.js'; import AdType from './ad-type.jsx'; const MyAdsRowRenderer = observer(({ row: advert, setAdvert }) => { @@ -40,18 +40,26 @@ const MyAdsRowRenderer = observer(({ row: advert, setAdvert }) => { const amount_dealt = amount - remaining_amount; const enable_action_point = floating_rate_store.change_ad_alert && floating_rate_store.rate_type !== rate_type; const is_buy_advert = type === buy_sell.BUY; - let effective_rate = 0; - let display_effective_rate = 0; + // let effective_rate = 0; + // let display_effective_rate = 0; - if (rate_type === ad_type.FIXED) { - effective_rate = price_display; - display_effective_rate = formatMoney(local_currency, effective_rate, true); - } else { - effective_rate = parseFloat(floating_rate_store.exchange_rate * (1 + rate_display / 100)); - display_effective_rate = removeTrailingZeros( - formatMoney(local_currency, effective_rate, true, setDecimalPlaces(effective_rate, 6)) - ); - } + // if (rate_type === ad_type.FIXED) { + // effective_rate = price_display; + // display_effective_rate = formatMoney(local_currency, effective_rate, true); + // } else { + // effective_rate = parseFloat(floating_rate_store.exchange_rate * (1 + rate_display / 100)); + // display_effective_rate = removeTrailingZeros( + // formatMoney(local_currency, effective_rate, true, setDecimalPlaces(effective_rate, 6)) + // ); + // } + + const { display_effective_rate } = generateEffectiveRate({ + price: price_display, + rate_type, + rate: rate_display, + local_currency, + exchange_rate: floating_rate_store.exchange_rate, + }); const is_activate_ad_disabled = floating_rate_store.reached_target_date && enable_action_point; diff --git a/packages/p2p/src/utils/format-value.js b/packages/p2p/src/utils/format-value.js index 76df0694196e..1c963f4502d9 100644 --- a/packages/p2p/src/utils/format-value.js +++ b/packages/p2p/src/utils/format-value.js @@ -1,3 +1,6 @@ +import { ad_type } from 'Constants/floating-rate'; +import { formatMoney } from '@deriv/shared'; + export const roundOffDecimal = (number, decimal_place = 2) => { // Rounds of the digit to the specified decimal place return parseFloat(Math.round(number * Math.pow(10, decimal_place)) / Math.pow(10, decimal_place)); @@ -12,6 +15,27 @@ export const setDecimalPlaces = (value, expected_decimal_place) => { return actual_decimal_place > expected_decimal_place ? expected_decimal_place : actual_decimal_place; }; +export const generateEffectiveRate = ({ + price = 0, + rate = 0, + local_currency = {}, + exchange_rate = 0, + rate_type = ad_type.FIXED, +} = {}) => { + let effective_rate = 0; + let display_effective_rate = 0; + if (rate_type === ad_type.FIXED) { + effective_rate = price; + display_effective_rate = formatMoney(local_currency, effective_rate, true); + } else { + effective_rate = parseFloat(exchange_rate * (1 + rate / 100)); + display_effective_rate = removeTrailingZeros( + formatMoney(local_currency, effective_rate, true, setDecimalPlaces(effective_rate, 6)) + ); + } + return { effective_rate, display_effective_rate }; +}; + export const removeTrailingZeros = value => { // Returns the string after truncating extra zeros if (!value) { From 00aef796ca48e5b4c709047953962bc464ae5192 Mon Sep 17 00:00:00 2001 From: Likhith Kolayari Date: Mon, 20 Jun 2022 17:21:39 +0400 Subject: [PATCH 03/21] ref: removed commented code --- .../p2p/src/components/buy-sell/buy-sell-form.jsx | 13 ------------- .../p2p/src/components/buy-sell/buy-sell-row.jsx | 14 -------------- .../src/components/my-ads/my-ads-row-renderer.jsx | 13 ------------- 3 files changed, 40 deletions(-) diff --git a/packages/p2p/src/components/buy-sell/buy-sell-form.jsx b/packages/p2p/src/components/buy-sell/buy-sell-form.jsx index 288635a52cd6..ecbb0075f1ce 100644 --- a/packages/p2p/src/components/buy-sell/buy-sell-form.jsx +++ b/packages/p2p/src/components/buy-sell/buy-sell-form.jsx @@ -45,19 +45,6 @@ const BuySellForm = props => { cursor: should_disable_field ? 'not-allowed' : 'pointer', }; - // let effective_rate = 0; - // let display_effective_rate = 0; - - // if (rate_type === ad_type.FIXED) { - // effective_rate = price; - // display_effective_rate = formatMoney(local_currency, effective_rate, true); - // } else { - // effective_rate = parseFloat(floating_rate_store.exchange_rate * (1 + rate / 100)); - // display_effective_rate = removeTrailingZeros( - // formatMoney(local_currency, effective_rate, true, setDecimalPlaces(effective_rate, 6)) - // ); - // } - const { effective_rate, display_effective_rate } = generateEffectiveRate({ price, rate_type, diff --git a/packages/p2p/src/components/buy-sell/buy-sell-row.jsx b/packages/p2p/src/components/buy-sell/buy-sell-row.jsx index bbf5e3a84557..4991d5b085b6 100644 --- a/packages/p2p/src/components/buy-sell/buy-sell-row.jsx +++ b/packages/p2p/src/components/buy-sell/buy-sell-row.jsx @@ -49,20 +49,6 @@ const BuySellRow = ({ row: advert }) => { const is_my_advert = advert.advertiser_details.id === general_store.advertiser_id; const is_buy_advert = counterparty_type === buy_sell.BUY; const { name: advertiser_name } = advert.advertiser_details; - - // let effective_rate = 0; - // let display_effective_rate = 0; - - // if (rate_type === ad_type.FIXED) { - // effective_rate = price_display; - // display_effective_rate = formatMoney(local_currency, effective_rate, true); - // } else { - // effective_rate = parseFloat(floating_rate_store.exchange_rate * (1 + rate / 100)); - // display_effective_rate = removeTrailingZeros( - // formatMoney(local_currency, effective_rate, true, setDecimalPlaces(effective_rate, 6)) - // ); - // } - const { display_effective_rate } = generateEffectiveRate({ price: price_display, rate_type, diff --git a/packages/p2p/src/components/my-ads/my-ads-row-renderer.jsx b/packages/p2p/src/components/my-ads/my-ads-row-renderer.jsx index 6ef3a254cd79..3eb64b1dac12 100644 --- a/packages/p2p/src/components/my-ads/my-ads-row-renderer.jsx +++ b/packages/p2p/src/components/my-ads/my-ads-row-renderer.jsx @@ -36,22 +36,9 @@ const MyAdsRowRenderer = observer(({ row: advert, setAdvert }) => { // Use separate is_advert_active state to ensure value is updated const [is_advert_active, setIsAdvertActive] = React.useState(is_active); const [is_popover_actions_visible, setIsPopoverActionsVisible] = React.useState(false); - const amount_dealt = amount - remaining_amount; const enable_action_point = floating_rate_store.change_ad_alert && floating_rate_store.rate_type !== rate_type; const is_buy_advert = type === buy_sell.BUY; - // let effective_rate = 0; - // let display_effective_rate = 0; - - // if (rate_type === ad_type.FIXED) { - // effective_rate = price_display; - // display_effective_rate = formatMoney(local_currency, effective_rate, true); - // } else { - // effective_rate = parseFloat(floating_rate_store.exchange_rate * (1 + rate_display / 100)); - // display_effective_rate = removeTrailingZeros( - // formatMoney(local_currency, effective_rate, true, setDecimalPlaces(effective_rate, 6)) - // ); - // } const { display_effective_rate } = generateEffectiveRate({ price: price_display, From eadbd5785113ae56d5af5ec970ac935d2a150abe Mon Sep 17 00:00:00 2001 From: Likhith Kolayari Date: Tue, 21 Jun 2022 16:29:26 +0400 Subject: [PATCH 04/21] fix: round off decimal calculation of effective market rate --- packages/p2p/src/components/my-ads/create-ad-summary.jsx | 9 ++------- packages/p2p/src/components/my-ads/edit-ad-summary.jsx | 9 ++------- .../p2p/src/components/order-details/order-details.jsx | 5 +---- packages/p2p/src/stores/floating-rate-store.js | 4 +++- 4 files changed, 8 insertions(+), 19 deletions(-) diff --git a/packages/p2p/src/components/my-ads/create-ad-summary.jsx b/packages/p2p/src/components/my-ads/create-ad-summary.jsx index e6376bb3880a..e0329f3f88de 100644 --- a/packages/p2p/src/components/my-ads/create-ad-summary.jsx +++ b/packages/p2p/src/components/my-ads/create-ad-summary.jsx @@ -7,7 +7,7 @@ import { buy_sell } from 'Constants/buy-sell'; import { Localize } from 'Components/i18next'; import { ad_type } from 'Constants/floating-rate'; import { useStores } from 'Stores'; -import { setDecimalPlaces, removeTrailingZeros, roundOffDecimal } from 'Utils/format-value.js'; +import { removeTrailingZeros, roundOffDecimal } from 'Utils/format-value.js'; const CreateAdSummary = ({ offer_amount, price_rate, type }) => { const { floating_rate_store, general_store } = useStores(); @@ -41,12 +41,7 @@ const CreateAdSummary = ({ offer_amount, price_rate, type }) => { local_amount: display_total, local_currency: local_currency_config.currency, price_rate: removeTrailingZeros( - formatMoney( - local_currency_config.currency, - display_price_rate, - true, - setDecimalPlaces(display_price_rate, 6) - ) + formatMoney(local_currency_config.currency, display_price_rate, true, 6) ), }); diff --git a/packages/p2p/src/components/my-ads/edit-ad-summary.jsx b/packages/p2p/src/components/my-ads/edit-ad-summary.jsx index c54861885d06..f77ce5e147d5 100644 --- a/packages/p2p/src/components/my-ads/edit-ad-summary.jsx +++ b/packages/p2p/src/components/my-ads/edit-ad-summary.jsx @@ -7,7 +7,7 @@ import { buy_sell } from 'Constants/buy-sell'; import { Localize } from 'Components/i18next'; import { ad_type } from 'Constants/floating-rate'; import { useStores } from 'Stores'; -import { setDecimalPlaces, removeTrailingZeros, roundOffDecimal } from 'Utils/format-value.js'; +import { removeTrailingZeros, roundOffDecimal } from 'Utils/format-value.js'; const EditAdSummary = ({ offer_amount, price_rate, type }) => { const { floating_rate_store, general_store } = useStores(); @@ -42,12 +42,7 @@ const EditAdSummary = ({ offer_amount, price_rate, type }) => { local_amount: display_total, local_currency: local_currency_config.currency, price_rate: removeTrailingZeros( - formatMoney( - local_currency_config.currency, - display_price_rate, - true, - setDecimalPlaces(display_price_rate, 6) - ) + formatMoney(local_currency_config.currency, display_price_rate, true, 6) ), }); diff --git a/packages/p2p/src/components/order-details/order-details.jsx b/packages/p2p/src/components/order-details/order-details.jsx index 1370fa02f820..324c2ecfc247 100644 --- a/packages/p2p/src/components/order-details/order-details.jsx +++ b/packages/p2p/src/components/order-details/order-details.jsx @@ -161,10 +161,7 @@ const OrderDetails = observer(({ onPageReturn }) => { />
diff --git a/packages/p2p/src/stores/floating-rate-store.js b/packages/p2p/src/stores/floating-rate-store.js index c6dd1a7f07ce..3bff6fe38b51 100644 --- a/packages/p2p/src/stores/floating-rate-store.js +++ b/packages/p2p/src/stores/floating-rate-store.js @@ -2,6 +2,7 @@ import { action, computed, observable } from 'mobx'; import { ad_type } from 'Constants/floating-rate'; import BaseStore from 'Stores/base_store'; import ServerTime from 'Utils/server-time'; +import { roundOffDecimal, removeTrailingZeros } from 'Utils/format-value'; export default class FloatingRateStore extends BaseStore { @observable fixed_rate_adverts_status; @@ -66,7 +67,8 @@ export default class FloatingRateStore extends BaseStore { @action.bound setExchangeRate(rate) { - this.exchange_rate = parseFloat(rate); + const fetched_rate = parseFloat(rate); + this.exchange_rate = removeTrailingZeros(roundOffDecimal(fetched_rate, 6)); if (this.previous_exchange_rate === null) { this.previous_exchange_rate = this.exchange_rate; this.current_exchange_rate = this.exchange_rate; From 50abd4367eac4544e381b961fd33165437afbaa1 Mon Sep 17 00:00:00 2001 From: Likhith Kolayari Date: Wed, 22 Jun 2022 08:58:29 +0400 Subject: [PATCH 05/21] fix: formatting decimals in effective rate --- .../p2p/src/components/floating-rate/floating-rate.jsx | 7 +------ 1 file changed, 1 insertion(+), 6 deletions(-) diff --git a/packages/p2p/src/components/floating-rate/floating-rate.jsx b/packages/p2p/src/components/floating-rate/floating-rate.jsx index 02f1dd1c89e7..34374ae19654 100644 --- a/packages/p2p/src/components/floating-rate/floating-rate.jsx +++ b/packages/p2p/src/components/floating-rate/floating-rate.jsx @@ -94,12 +94,7 @@ const FloatingRate = ({ className='floating-rate__mkt-rate--msg' > 1 {fiat_currency} ={' '} - {formatMoney( - local_currency, - floating_rate_store.exchange_rate, - true, - setDecimalPlaces(floating_rate_store.exchange_rate, 6) - )}{' '} + {removeTrailingZeros(formatMoney(local_currency, floating_rate_store.exchange_rate, true, 6))}{' '} {local_currency}
From 572b789ad4150f7b968e48cff585b18f88a5259f Mon Sep 17 00:00:00 2001 From: Likhith Kolayari Date: Wed, 22 Jun 2022 12:09:43 +0400 Subject: [PATCH 06/21] fix: set the form to be dirty when PM is selected --- packages/p2p/src/components/my-ads/edit-ad-form.jsx | 3 +++ 1 file changed, 3 insertions(+) diff --git a/packages/p2p/src/components/my-ads/edit-ad-form.jsx b/packages/p2p/src/components/my-ads/edit-ad-form.jsx index ecc97eba17aa..98630a34a404 100644 --- a/packages/p2p/src/components/my-ads/edit-ad-form.jsx +++ b/packages/p2p/src/components/my-ads/edit-ad-form.jsx @@ -109,6 +109,9 @@ const EditAdForm = () => { selected_methods.push(pm[0]); my_ads_store.payment_method_ids.push(pm[0]); }); + if (my_ads_store.required_ad_type !== rate_type) { + setIsPaymentMethodTouched(!!selected_methods.length); + } } // eslint-disable-next-line react-hooks/exhaustive-deps }, []); From 4e2c51011167baba39cf482964ea5978af3fe5b7 Mon Sep 17 00:00:00 2001 From: Likhith Kolayari Date: Wed, 22 Jun 2022 13:13:19 +0400 Subject: [PATCH 07/21] fix: checking for change when PM methods are modified --- .../src/components/my-ads/buy-ad-payment-methods-list.jsx | 4 +++- .../components/my-ads/edit-ad-form-payment-methods.jsx | 8 +++++++- packages/p2p/src/components/my-ads/edit-ad-form.jsx | 4 ++-- 3 files changed, 12 insertions(+), 4 deletions(-) diff --git a/packages/p2p/src/components/my-ads/buy-ad-payment-methods-list.jsx b/packages/p2p/src/components/my-ads/buy-ad-payment-methods-list.jsx index 6ed1609a86ed..416d6dbd05bf 100644 --- a/packages/p2p/src/components/my-ads/buy-ad-payment-methods-list.jsx +++ b/packages/p2p/src/components/my-ads/buy-ad-payment-methods-list.jsx @@ -7,7 +7,7 @@ import { localize } from 'Components/i18next'; import PropTypes from 'prop-types'; import './buy-ad-payment-methods-list.scss'; -const BuyAdPaymentMethodsList = ({ selected_methods, setSelectedMethods }) => { +const BuyAdPaymentMethodsList = ({ selected_methods, setSelectedMethods, touched }) => { const { my_ads_store, my_profile_store } = useStores(); const [selected_edit_method, setSelectedEditMethod] = React.useState(); const [payment_methods_list, setPaymentMethodsList] = React.useState([]); @@ -33,6 +33,7 @@ const BuyAdPaymentMethodsList = ({ selected_methods, setSelectedMethods }) => { text: my_profile_store.getPaymentMethodDisplayName(value), }, ]); + touched(true); } }; @@ -46,6 +47,7 @@ const BuyAdPaymentMethodsList = ({ selected_methods, setSelectedMethods }) => { ...payment_methods_list.filter(payment_method => payment_method.value !== value), selected_edit_method, ]); + touched(true); } }; diff --git a/packages/p2p/src/components/my-ads/edit-ad-form-payment-methods.jsx b/packages/p2p/src/components/my-ads/edit-ad-form-payment-methods.jsx index 0ef1e9518362..7812f4222474 100644 --- a/packages/p2p/src/components/my-ads/edit-ad-form-payment-methods.jsx +++ b/packages/p2p/src/components/my-ads/edit-ad-form-payment-methods.jsx @@ -71,7 +71,13 @@ const EditAdFormPaymentMethods = ({ is_sell_advert, selected_methods, setSelecte ); } - return ; + return ( + + ); }; export default observer(EditAdFormPaymentMethods); diff --git a/packages/p2p/src/components/my-ads/edit-ad-form.jsx b/packages/p2p/src/components/my-ads/edit-ad-form.jsx index 98630a34a404..52f69a347764 100644 --- a/packages/p2p/src/components/my-ads/edit-ad-form.jsx +++ b/packages/p2p/src/components/my-ads/edit-ad-form.jsx @@ -50,7 +50,7 @@ const EditAdForm = () => { const [is_cancel_edit_modal_open, setIsCancelEditModalOpen] = React.useState(false); const [is_payment_method_touched, setIsPaymentMethodTouched] = React.useState(false); - const set_initial_ad_rate = () => { + const setInitialAdRate = () => { if (my_ads_store.required_ad_type !== my_ads_store.selected_ad_type) { if (my_ads_store.required_ad_type === ad_type.FLOAT) { return is_buy_advert ? '-0.01' : '+0.01'; @@ -133,7 +133,7 @@ const EditAdForm = () => { max_transaction: max_order_amount_display, min_transaction: min_order_amount_display, offer_amount: amount_display, - rate_type: set_initial_ad_rate(), + rate_type: setInitialAdRate(), type, is_active: rate_type !== floating_rate_store.rate_type && floating_rate_store.reached_target_date From 2f73dbad90e00ef28413562c427d83fddeed1211 Mon Sep 17 00:00:00 2001 From: Likhith Kolayari Date: Wed, 22 Jun 2022 14:42:56 +0400 Subject: [PATCH 08/21] fix: enable button for edit ad --- .../p2p/src/components/my-ads/buy-ad-payment-methods-list.jsx | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/p2p/src/components/my-ads/buy-ad-payment-methods-list.jsx b/packages/p2p/src/components/my-ads/buy-ad-payment-methods-list.jsx index 416d6dbd05bf..576aa5b73d91 100644 --- a/packages/p2p/src/components/my-ads/buy-ad-payment-methods-list.jsx +++ b/packages/p2p/src/components/my-ads/buy-ad-payment-methods-list.jsx @@ -58,6 +58,7 @@ const BuyAdPaymentMethodsList = ({ selected_methods, setSelectedMethods, touched setSelectedMethods([...selected_methods, value]); setPaymentMethodsList(payment_methods_list.filter(payment_method => payment_method.value !== value)); } + touched(true); } }; From 117ed8055ae448f2ec10af48f32d4a556342aba3 Mon Sep 17 00:00:00 2001 From: Likhith Kolayari Date: Wed, 22 Jun 2022 18:56:12 +0400 Subject: [PATCH 09/21] fix: enabling submit method for buy ads --- packages/p2p/src/components/my-ads/edit-ad-form.jsx | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/packages/p2p/src/components/my-ads/edit-ad-form.jsx b/packages/p2p/src/components/my-ads/edit-ad-form.jsx index 52f69a347764..862d1b70fc48 100644 --- a/packages/p2p/src/components/my-ads/edit-ad-form.jsx +++ b/packages/p2p/src/components/my-ads/edit-ad-form.jsx @@ -109,9 +109,12 @@ const EditAdForm = () => { selected_methods.push(pm[0]); my_ads_store.payment_method_ids.push(pm[0]); }); - if (my_ads_store.required_ad_type !== rate_type) { - setIsPaymentMethodTouched(!!selected_methods.length); - } + } + if (my_ads_store.required_ad_type !== rate_type) { + const is_payment_method_available = + !!Object.keys({ ...payment_method_details }).length || + !!Object.values({ ...payment_method_names }).length; + setIsPaymentMethodTouched(is_payment_method_available); } // eslint-disable-next-line react-hooks/exhaustive-deps }, []); From 778987b3dcde7a4c93f6a380fdb8290b8422eb72 Mon Sep 17 00:00:00 2001 From: Likhith Kolayari Date: Tue, 28 Jun 2022 10:27:13 +0400 Subject: [PATCH 10/21] fix: decimal round off issue in buy-sell --- .../components/buy-sell/buy-sell-form-receive-amount.jsx | 6 +++++- packages/p2p/src/utils/format-value.js | 3 +++ 2 files changed, 8 insertions(+), 1 deletion(-) diff --git a/packages/p2p/src/components/buy-sell/buy-sell-form-receive-amount.jsx b/packages/p2p/src/components/buy-sell/buy-sell-form-receive-amount.jsx index be849241713d..29f55f04b6c0 100644 --- a/packages/p2p/src/components/buy-sell/buy-sell-form-receive-amount.jsx +++ b/packages/p2p/src/components/buy-sell/buy-sell-form-receive-amount.jsx @@ -2,6 +2,7 @@ import React from 'react'; import { Text } from '@deriv/components'; import { getFormattedText } from '@deriv/shared'; import { Localize } from 'Components/i18next'; +import { roundOffDecimal } from 'Utils/format-value.js'; import { useStores } from 'Stores'; const BuySellFormReceiveAmount = () => { @@ -17,7 +18,10 @@ const BuySellFormReceiveAmount = () => { )} - {getFormattedText(buy_sell_store?.receive_amount, buy_sell_store?.advert?.local_currency)} + {getFormattedText( + roundOffDecimal(buy_sell_store?.receive_amount), + buy_sell_store?.advert?.local_currency + )} ); diff --git a/packages/p2p/src/utils/format-value.js b/packages/p2p/src/utils/format-value.js index 1c963f4502d9..0730c4617e64 100644 --- a/packages/p2p/src/utils/format-value.js +++ b/packages/p2p/src/utils/format-value.js @@ -3,6 +3,9 @@ import { formatMoney } from '@deriv/shared'; export const roundOffDecimal = (number, decimal_place = 2) => { // Rounds of the digit to the specified decimal place + if (number === null || number === undefined) { + return 0; + } return parseFloat(Math.round(number * Math.pow(10, decimal_place)) / Math.pow(10, decimal_place)); }; From e19117fa3c40026b3f6f3a3edbc0a1c2856dfa01 Mon Sep 17 00:00:00 2001 From: Likhith Kolayari Date: Tue, 28 Jun 2022 13:26:40 +0400 Subject: [PATCH 11/21] fix: display min of 2 decimal points --- packages/p2p/src/utils/format-value.js | 11 ++++++++--- 1 file changed, 8 insertions(+), 3 deletions(-) diff --git a/packages/p2p/src/utils/format-value.js b/packages/p2p/src/utils/format-value.js index 0730c4617e64..298b3706fd4f 100644 --- a/packages/p2p/src/utils/format-value.js +++ b/packages/p2p/src/utils/format-value.js @@ -62,7 +62,12 @@ export const removeTrailingZeros = value => { }; const formatInput = (input, unit) => { - return parseFloat(input.replace(/,/g, '')) % 1 === 0 - ? `${input}.00 ${unit ? unit.trim() : ''}` - : `${input} ${unit ? unit.trim() : ''}`; + const plain_input = input.replace(/,/g, ''); + if (parseFloat(plain_input) % 1 === 0) { + return `${input}.00 ${unit ? unit.trim() : ''}`; + } + if (plain_input.split('.')[1].length === 1) { + return `${input}0 ${unit ? unit.trim() : ''}`; + } + return `${input} ${unit ? unit.trim() : ''}`; }; From a946fea46fdda4ed2fde14f8faf80aa29c91a0ef Mon Sep 17 00:00:00 2001 From: Likhith Kolayari Date: Wed, 29 Jun 2022 10:27:24 +0400 Subject: [PATCH 12/21] fix: displying initial value of buy-sell ad --- packages/p2p/src/components/buy-sell/buy-sell-form.jsx | 3 +-- packages/p2p/src/utils/format-value.js | 8 ++++---- 2 files changed, 5 insertions(+), 6 deletions(-) diff --git a/packages/p2p/src/components/buy-sell/buy-sell-form.jsx b/packages/p2p/src/components/buy-sell/buy-sell-form.jsx index ecbb0075f1ce..f4250f7caba6 100644 --- a/packages/p2p/src/components/buy-sell/buy-sell-form.jsx +++ b/packages/p2p/src/components/buy-sell/buy-sell-form.jsx @@ -358,8 +358,7 @@ const BuySellForm = props => { event.target.value, buy_sell_store.account_currency ); - - setFieldValue('amount', getRoundedNumber(input_amount)); + setFieldValue('amount', input_amount); buy_sell_store.setReceiveAmount( input_amount * effective_rate ); diff --git a/packages/p2p/src/utils/format-value.js b/packages/p2p/src/utils/format-value.js index 298b3706fd4f..4b7e7bdfd483 100644 --- a/packages/p2p/src/utils/format-value.js +++ b/packages/p2p/src/utils/format-value.js @@ -31,10 +31,10 @@ export const generateEffectiveRate = ({ effective_rate = price; display_effective_rate = formatMoney(local_currency, effective_rate, true); } else { - effective_rate = parseFloat(exchange_rate * (1 + rate / 100)); - display_effective_rate = removeTrailingZeros( - formatMoney(local_currency, effective_rate, true, setDecimalPlaces(effective_rate, 6)) - ); + const provided_rate = parseFloat(exchange_rate * (1 + rate / 100)); + const decimal_places = setDecimalPlaces(provided_rate, 6); + effective_rate = removeTrailingZeros(roundOffDecimal(provided_rate, decimal_places)); + display_effective_rate = removeTrailingZeros(formatMoney(local_currency, provided_rate, true, decimal_places)); } return { effective_rate, display_effective_rate }; }; From 093d9e4caecdcdd7d72d5c8a9817d918ade54ac1 Mon Sep 17 00:00:00 2001 From: Likhith Kolayari Date: Wed, 29 Jun 2022 11:24:39 +0400 Subject: [PATCH 13/21] Trigger build From 275cf8ed257ef57b5bfd28b7e87968344b40602b Mon Sep 17 00:00:00 2001 From: Likhith Kolayari Date: Wed, 29 Jun 2022 12:16:01 +0400 Subject: [PATCH 14/21] fix: removed unnecessary spacing --- packages/p2p/src/utils/format-value.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/p2p/src/utils/format-value.js b/packages/p2p/src/utils/format-value.js index 4b7e7bdfd483..5bbb55e2fbd0 100644 --- a/packages/p2p/src/utils/format-value.js +++ b/packages/p2p/src/utils/format-value.js @@ -69,5 +69,5 @@ const formatInput = (input, unit) => { if (plain_input.split('.')[1].length === 1) { return `${input}0 ${unit ? unit.trim() : ''}`; } - return `${input} ${unit ? unit.trim() : ''}`; + return `${input}${unit ? ` ${unit.trim()}` : ''}`; }; From 1bfffff009a89e473de56b9c35b460045a5823cc Mon Sep 17 00:00:00 2001 From: Likhith Kolayari Date: Wed, 29 Jun 2022 12:16:38 +0400 Subject: [PATCH 15/21] Trigger build From d49947b229dccf7c76d91b7c79ab61d440ba0845 Mon Sep 17 00:00:00 2001 From: Likhith Kolayari Date: Wed, 29 Jun 2022 12:42:53 +0400 Subject: [PATCH 16/21] fix: effective rate round off in Buy/sell --- packages/p2p/src/components/buy-sell/buy-sell-form.jsx | 9 ++++++--- packages/p2p/src/stores/buy-sell-store.js | 6 ++---- packages/p2p/src/utils/format-value.js | 8 ++++---- 3 files changed, 12 insertions(+), 11 deletions(-) diff --git a/packages/p2p/src/components/buy-sell/buy-sell-form.jsx b/packages/p2p/src/components/buy-sell/buy-sell-form.jsx index f4250f7caba6..9c4c91ddd359 100644 --- a/packages/p2p/src/components/buy-sell/buy-sell-form.jsx +++ b/packages/p2p/src/components/buy-sell/buy-sell-form.jsx @@ -12,7 +12,7 @@ import { useStores } from 'Stores'; import BuySellFormReceiveAmount from './buy-sell-form-receive-amount.jsx'; import PaymentMethodCard from '../my-profile/payment-methods/payment-method-card/payment-method-card.jsx'; import { floatingPointValidator } from 'Utils/validations'; -import { generateEffectiveRate } from 'Utils/format-value.js'; +import { generateEffectiveRate, setDecimalPlaces, roundOffDecimal, removeTrailingZeros } from 'Utils/format-value.js'; const BuySellForm = props => { const isMounted = useIsMounted(); @@ -53,6 +53,8 @@ const BuySellForm = props => { exchange_rate: floating_rate_store.exchange_rate, }); + const calculated_rate = removeTrailingZeros(roundOffDecimal(effective_rate, setDecimalPlaces(effective_rate, 6))); + React.useEffect( () => { my_profile_store.setShouldShowAddPaymentMethodForm(false); @@ -75,7 +77,7 @@ const BuySellForm = props => { advertiser_page_store.setFormErrorMessage(''); buy_sell_store.setShowRateChangePopup(rate_type === ad_type.FLOAT); - buy_sell_store.setInitialReceiveAmount(effective_rate); + buy_sell_store.setInitialReceiveAmount(calculated_rate); return () => { buy_sell_store.payment_method_ids = []; @@ -359,8 +361,9 @@ const BuySellForm = props => { buy_sell_store.account_currency ); setFieldValue('amount', input_amount); + buy_sell_store.setReceiveAmount( - input_amount * effective_rate + input_amount * calculated_rate ); } }} diff --git a/packages/p2p/src/stores/buy-sell-store.js b/packages/p2p/src/stores/buy-sell-store.js index 470c95bd7a75..5b5166ccc0c1 100644 --- a/packages/p2p/src/stores/buy-sell-store.js +++ b/packages/p2p/src/stores/buy-sell-store.js @@ -5,7 +5,7 @@ import { buy_sell } from 'Constants/buy-sell'; import { requestWS } from 'Utils/websocket'; import { textValidator, lengthValidator } from 'Utils/validations'; import { countDecimalPlaces } from 'Utils/string'; -import { setDecimalPlaces, removeTrailingZeros, roundOffDecimal } from 'Utils/format-value.js'; +import { removeTrailingZeros } from 'Utils/format-value.js'; import BaseStore from 'Stores/base_store'; export default class BuySellStore extends BaseStore { @@ -409,9 +409,7 @@ export default class BuySellStore extends BaseStore { @action.bound setInitialReceiveAmount(initial_price) { - this.receive_amount = removeTrailingZeros( - roundOffDecimal(this.advert.min_order_amount_limit * initial_price, setDecimalPlaces(initial_price, 6)) - ); + this.receive_amount = removeTrailingZeros(this.advert.min_order_amount_limit * initial_price); } @action.bound diff --git a/packages/p2p/src/utils/format-value.js b/packages/p2p/src/utils/format-value.js index 5bbb55e2fbd0..5d0bc2d78970 100644 --- a/packages/p2p/src/utils/format-value.js +++ b/packages/p2p/src/utils/format-value.js @@ -31,10 +31,10 @@ export const generateEffectiveRate = ({ effective_rate = price; display_effective_rate = formatMoney(local_currency, effective_rate, true); } else { - const provided_rate = parseFloat(exchange_rate * (1 + rate / 100)); - const decimal_places = setDecimalPlaces(provided_rate, 6); - effective_rate = removeTrailingZeros(roundOffDecimal(provided_rate, decimal_places)); - display_effective_rate = removeTrailingZeros(formatMoney(local_currency, provided_rate, true, decimal_places)); + effective_rate = parseFloat(exchange_rate * (1 + rate / 100)); + display_effective_rate = removeTrailingZeros( + formatMoney(local_currency, effective_rate, true, setDecimalPlaces(effective_rate, 6)) + ); } return { effective_rate, display_effective_rate }; }; From a3d5ebd88620c8ffc250c2f204e6ae60535c7749 Mon Sep 17 00:00:00 2001 From: Likhith Kolayari Date: Wed, 29 Jun 2022 12:44:36 +0400 Subject: [PATCH 17/21] Trigger build From 2d1e327e9d72b51e87c434da8fa74b220a393192 Mon Sep 17 00:00:00 2001 From: Likhith Kolayari Date: Thu, 30 Jun 2022 17:00:58 +0400 Subject: [PATCH 18/21] fix: setting correct ad type --- packages/p2p/src/components/my-ads/edit-ad-summary.jsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/p2p/src/components/my-ads/edit-ad-summary.jsx b/packages/p2p/src/components/my-ads/edit-ad-summary.jsx index f77ce5e147d5..c86dae643c72 100644 --- a/packages/p2p/src/components/my-ads/edit-ad-summary.jsx +++ b/packages/p2p/src/components/my-ads/edit-ad-summary.jsx @@ -10,10 +10,10 @@ import { useStores } from 'Stores'; import { removeTrailingZeros, roundOffDecimal } from 'Utils/format-value.js'; const EditAdSummary = ({ offer_amount, price_rate, type }) => { - const { floating_rate_store, general_store } = useStores(); + const { floating_rate_store, general_store, my_ads_store } = useStores(); const { currency, local_currency_config } = general_store.client; const display_offer_amount = offer_amount ? formatMoney(currency, offer_amount, true) : ''; - const market_feed = floating_rate_store.rate_type === ad_type.FLOAT ? floating_rate_store.exchange_rate : null; + const market_feed = my_ads_store.required_ad_type === ad_type.FLOAT ? floating_rate_store.exchange_rate : null; let display_price_rate = ''; let display_total = ''; From c77d5788ab17ef08e01600f60595a27e3ca2e1b7 Mon Sep 17 00:00:00 2001 From: Likhith Kolayari Date: Thu, 30 Jun 2022 18:17:27 +0400 Subject: [PATCH 19/21] fix: display order rate amount --- .../order-details/order-details.jsx | 20 +++++++------------ 1 file changed, 7 insertions(+), 13 deletions(-) diff --git a/packages/p2p/src/components/order-details/order-details.jsx b/packages/p2p/src/components/order-details/order-details.jsx index 324c2ecfc247..49ed12dea3b1 100644 --- a/packages/p2p/src/components/order-details/order-details.jsx +++ b/packages/p2p/src/components/order-details/order-details.jsx @@ -2,7 +2,7 @@ import classNames from 'classnames'; import React from 'react'; import PropTypes from 'prop-types'; import { Button, HintBox, Text, ThemedScrollbars } from '@deriv/components'; -import { formatMoney, getFormattedText, isDesktop } from '@deriv/shared'; +import { formatMoney, isDesktop } from '@deriv/shared'; import { observer } from 'mobx-react-lite'; import { Localize, localize } from 'Components/i18next'; import Chat from 'Components/orders/chat/chat.jsx'; @@ -80,6 +80,10 @@ const OrderDetails = observer(({ onPageReturn }) => { return ; } + const display_payment_amount = removeTrailingZeros( + formatMoney(local_currency, amount_display * roundOffDecimal(rate, decimal_place), true, decimal_place) + ); + return ( {should_show_lost_funds_banner && ( @@ -117,12 +121,7 @@ const OrderDetails = observer(({ onPageReturn }) => { )} {!has_timer_expired && (is_pending_order || is_buyer_confirmed_order) && (
- {removeTrailingZeros( - getFormattedText( - amount_display * roundOffDecimal(rate, decimal_place), - local_currency - ) - )} + {display_payment_amount} {local_currency}
)}
@@ -152,12 +151,7 @@ const OrderDetails = observer(({ onPageReturn }) => {
Date: Thu, 30 Jun 2022 18:29:11 +0400 Subject: [PATCH 20/21] fix: removed formatted text usage --- .../buy-sell/buy-sell-form-receive-amount.jsx | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/packages/p2p/src/components/buy-sell/buy-sell-form-receive-amount.jsx b/packages/p2p/src/components/buy-sell/buy-sell-form-receive-amount.jsx index 29f55f04b6c0..b3616ce69a0b 100644 --- a/packages/p2p/src/components/buy-sell/buy-sell-form-receive-amount.jsx +++ b/packages/p2p/src/components/buy-sell/buy-sell-form-receive-amount.jsx @@ -1,6 +1,6 @@ import React from 'react'; import { Text } from '@deriv/components'; -import { getFormattedText } from '@deriv/shared'; +import { formatMoney } from '@deriv/shared'; import { Localize } from 'Components/i18next'; import { roundOffDecimal } from 'Utils/format-value.js'; import { useStores } from 'Stores'; @@ -18,10 +18,12 @@ const BuySellFormReceiveAmount = () => { )} - {getFormattedText( + {formatMoney( + buy_sell_store?.advert?.local_currency, roundOffDecimal(buy_sell_store?.receive_amount), - buy_sell_store?.advert?.local_currency - )} + true + )}{' '} + {buy_sell_store?.advert?.local_currency} ); From 8fe2feb5c4009cb7606ea9e2f35ed1ba1f0e302b Mon Sep 17 00:00:00 2001 From: Likhith Kolayari Date: Thu, 30 Jun 2022 20:08:56 +0400 Subject: [PATCH 21/21] fix: removed incorrect round off --- packages/p2p/src/components/order-details/order-details.jsx | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/packages/p2p/src/components/order-details/order-details.jsx b/packages/p2p/src/components/order-details/order-details.jsx index 49ed12dea3b1..37ffedca8050 100644 --- a/packages/p2p/src/components/order-details/order-details.jsx +++ b/packages/p2p/src/components/order-details/order-details.jsx @@ -74,14 +74,12 @@ const OrderDetails = observer(({ onPageReturn }) => { ? localize('Buy {{offered_currency}} order', { offered_currency: account_currency }) : localize('Sell {{offered_currency}} order', { offered_currency: account_currency }); - const decimal_place = setDecimalPlaces(rate, 6); - if (sendbird_store.should_show_chat_on_orders) { return ; } const display_payment_amount = removeTrailingZeros( - formatMoney(local_currency, amount_display * roundOffDecimal(rate, decimal_place), true, decimal_place) + formatMoney(local_currency, amount_display * roundOffDecimal(rate, setDecimalPlaces(rate, 6)), true) ); return (