From f69a1eef9546dbf2e1e40ec6328ade2f0dae7261 Mon Sep 17 00:00:00 2001 From: ram Date: Mon, 24 Jun 2024 23:12:35 +0530 Subject: [PATCH 01/14] Updated the stake mobile view --- web/public/assets/stake/Group 5950.svg | 9 + web/public/assets/stake/Group 5977.svg | 12 + web/src/config/icons/dark.js | 2 + web/src/config/lang/en.json | 6 +- web/src/containers/Stake/CeFiStake.scss | 501 ++++++ web/src/containers/Stake/DesktopStake.js | 50 +- web/src/containers/Stake/MobileStake.js | 302 ++-- web/src/containers/Stake/_Stake.scss | 139 ++ .../Stake/components/CeFiUserStake.js | 1433 ++++++++--------- .../Stake/components/StakesAndEarnings.js | 14 +- .../StakeDetails/_StakeDetails.scss | 2 +- .../Summary/components/_ReferralList.scss | 7 + web/src/containers/_containers.scss | 1 + web/src/index.css | 549 ++++++- 14 files changed, 2006 insertions(+), 1021 deletions(-) create mode 100644 web/public/assets/stake/Group 5950.svg create mode 100644 web/public/assets/stake/Group 5977.svg diff --git a/web/public/assets/stake/Group 5950.svg b/web/public/assets/stake/Group 5950.svg new file mode 100644 index 0000000000..aaa6ceab0b --- /dev/null +++ b/web/public/assets/stake/Group 5950.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/web/public/assets/stake/Group 5977.svg b/web/public/assets/stake/Group 5977.svg new file mode 100644 index 0000000000..cbb0bad16d --- /dev/null +++ b/web/public/assets/stake/Group 5977.svg @@ -0,0 +1,12 @@ + + + + + + + + + + + + diff --git a/web/src/config/icons/dark.js b/web/src/config/icons/dark.js index 83d0aedcd7..3d39e35ca7 100644 --- a/web/src/config/icons/dark.js +++ b/web/src/config/icons/dark.js @@ -283,6 +283,8 @@ const nestedIcons = { STAKING_VARIABLE: '/assets/stake/variable_icon.svg', STAKING_UNLOCK: '/assets/stake/unlock-unstake-icon.svg', STAKING_BACKGROUND: '/assets/stake/stake-background.jpg', + STAKING_CEFI_LOGO: '/assets/stake/Group 5977.svg', + STAKING__LOCK: '/assets/stake/Group 5950.svg', META_MASK_NOT_FOUND: '/assets/icons/metamask-fox-stake-not-detected.svg', STAKING_ACCOUNT: '', METAMASK: '', diff --git a/web/src/config/lang/en.json b/web/src/config/lang/en.json index e168e3cc2e..508e540ceb 100644 --- a/web/src/config/lang/en.json +++ b/web/src/config/lang/en.json @@ -933,13 +933,15 @@ "FORFEITURE_OF_EARNINGS_DETAILS_LABEL": "Forfeiture of earnings", "STAKE_AMOUNT_LABEL": "Stake amount", "DISCLAIMER_NOTICE": "Disclaimer: Please note that for amounts valued in USD exceeding $1,000 will require completing ID verification. This value is inclusive of earnings, and the platform reserves the right to request additional user information.", - "SETTLEMENT_NOTICE": "Settlement: A 24h settlement period will be applied upon unstaking.", + "SETTLEMENT_NOTICE_TITLE": "Settlement:", + "SETTLEMENT_NOTICE": "{0} A 24h settlement period will be applied upon unstaking.", "CONFIRM_BUTTON": "Confirm", "STAKE_RULES_NOTICE": "As soon as you've staked you will be committed to the rules of the pool.", "I_UNDERSTAND_AGAIN_BUTTON": "I UNDERSTAND", "CONGRATULATIONS_NOTICE": "Congratulations!", "EARNINGS_START_NOTICE": "Your stake will start earning rewards.", - "REVIEW_PROGRESS_LABEL": "You can review the progress of your stake on the Active Stakes page.", + "REVIEW_PROGRESS_LABEL": "You can review the progress of your stake on the {0}", + "REVIEW_PROGRESS_ACTIVE_LINK": " Active Stakes page", "TIME_REMAINING_LABEL": "Time remaining", "PENALTY_UPON_INITIAL_STAKE_PRINCIPLE_LABEL_2": "Penalty upon initial stake principle", "FORFEITURE_OF_EARNINGS_LABEL_2": "Forfeiture of earnings", diff --git a/web/src/containers/Stake/CeFiStake.scss b/web/src/containers/Stake/CeFiStake.scss index 8768d96075..e736c038a5 100644 --- a/web/src/containers/Stake/CeFiStake.scss +++ b/web/src/containers/Stake/CeFiStake.scss @@ -3,6 +3,7 @@ color: var(--labels_important-active-labels-text-graphics); padding: 0rem 1rem; } + .cefi_stake .ant-table-tbody > tr > td { background-color: var(--base_background); color: var(--labels_important-active-labels-text-graphics); @@ -12,9 +13,11 @@ .cefi_stake .ant-table-tbody > tr.ant-table-placeholder:hover > td { background-color: var(--base_background); } + .cefi_stake .ant-table-tbody > tr.ant-table-row:hover > td { background-color: var(--base_background); } + .stake_theme { color: var(--labels_important-active-labels-text-graphics); } @@ -22,6 +25,7 @@ .stake_table_theme { background-color: var(--base_background); } + .stakepool_card { background-color: var(--base_secondary-navigation-bar); } @@ -56,3 +60,500 @@ background-color: var(--base_wallet-sidebar-and-popup); color: var(--labels_important-active-labels-text-graphics); } + +.stake_half_opacity { + opacity: 0.4; +} + +.stake_opacity { + opacity: 1; +} + +.tabOption-half-opacity { + opacity: 0.7; +} + +.stake_table_theme { + .stake_detail_text { + color: var(--labels_secondary-inactive-label-text-graphics); + } + .stake_detail_line { + width: 5%; + border-bottom: 1px solid + var(--labels_secondary-inactive-label-text-graphics); + } + .action_model_popup_wrapper { + display: flex; + gap: 30px; + height: 15%; + .action_model_popup_content { + width: 100%; + display: flex; + justify-content: center; + align-items: center; + background-image: url(/assets/images/staking_3.png); + background-size: cover; + } + } + + .stake_popup_button_wrapper { + display: flex; + flex-direction: row; + gap: 15px; + justify-content: space-between; + margin-top: 5%; + + .stake_popup_button { + width: 100%; + background-color: var(--specials_buttons-links-and-highlights); + color: var(--labels_important-active-labels-text-graphics); + height: 3rem; + border: none; + } + } + + .stake_amount_popup_wrapper, + .confirm_stake_popup_wrapper { + display: flex; + justify-content: center; + flex-direction: column; + align-items: center; + + .stake_amount_theme, + .confirm_stake_theme { + display: flex; + justify-content: center; + flex-direction: column; + align-items: center; + height: 16rem; + background-image: url(/assets/images/staking_2.png); + background-size: cover; + width: 100%; + margin-bottom: 3%; + } + + .confirm_stake_theme { + background-image: url(/assets/images/staking_1.png); + } + + .stake_amount_popup_content, + .confirm_stake_content_wrapper { + width: 100%; + + .stake_amount_field, + .confirm_stake_field { + background-color: var(--base_background); + } + .stake_amount_field { + .ant-input { + background-color: var(--base_background); + color: var(--labels_important-active-labels-text-graphics); + padding-left: 3%; + } + } + } + } + + .confirm_stake_popup_wrapper { + .confirm_stake_theme { + margin-bottom: 5% !important; + } + + .confirm_stake_content_wrapper { + .confirm_stake_field { + margin-bottom: 3% !important; + } + } + } + + .stake_duration_model_wrapper { + .danger_message_wrapper, + .success_message_wrapper, + .warning_message_wrapper { + padding: 5%; + background-color: var(--highcharts-negative-color); + margin: 5% 0 8%; + font-size: 12px; + } + + .success_message_wrapper { + background-color: var(--specials_checks-okay-done) !important; + } + + .warning_message_wrapper { + background-color: var(--specials_pending-waiting-caution) !important; + } + } + + .confirmation_model_popup_wrapper { + display: flex; + justify-content: center; + flex-direction: column; + align-items: center; + + .confirmation_model_content { + display: flex; + justify-content: center; + flex-direction: column; + align-items: center; + text-align: center; + + .confirmation_label { + font-size: 12px; + font-weight: bold; + .active_link { + color: var(--specials_buttons-links-and-highlights); + text-decoration: underline; + } + .active_link:hover { + cursor: pointer; + } + } + } + } + + .review_unstake_popup_wrapper, + .unstake_confirm_popup_wrapper { + display: flex; + justify-content: center; + flex-direction: column; + align-items: center; + + .review_unstake_content, + .unstake_confirm_content { + display: flex; + justify-content: center; + flex-direction: column; + height: 12rem; + .unstake_header { + display: flex; + align-items: center; + gap: 10px; + } + } + .review_unstack_wrapper { + display: flex; + flex-direction: row; + gap: 15px; + align-items: center; + margin-top: 5%; + .review_settle_notice { + font-size: 12px; + } + } + } +} + +.terms_condition_dialog_wrapper { + .ReactModal__Content { + width: 35%; + } +} + +.stake_amount_dialog, +.duartion_model_dialog_wrapper, +.confirm_stake_dialog_wrapper { + .ReactModal__Content { + width: 20%; + } +} + +.stake_details_dialog_wrapper { + .ReactModal__Content { + width: 32%; + } +} + +.dialog-mobile-content { + .stake_detail_line { + width: 5%; + border-bottom: 1px solid + var(--labels_secondary-inactive-label-text-graphics); + } + .stake_detail_text { + color: var(--labels_secondary-inactive-label-text-graphics); + } + .action_model_popup_wrapper { + display: flex; + flex-direction: column; + width: 100%; + height: auto; + .action_model_popup_content { + height: 20rem; + } + .action_model_content { + .action_model_header { + font-size: 18px; + } + .action_model_agreement_wrapper { + overflow-y: scroll; + .action_model_agreement_content { + font-size: 13px; + } + } + } + } + .stake_popup_button_wrapper { + .stake_popup_button { + height: unset; + } + } + .stake_amount_popup_wrapper { + .stake_amount_theme { + height: 20rem; + h3 { + font-size: 20px; + } + } + .stake_amount_popup_content { + font-size: 13px; + } + } + .stake_duration_model_wrapper { + h1 { + font-size: 26px; + } + .stake_text_header { + font-size: 14px; + } + .stake_text { + font-size: 13px; + } + } + .stake_detail_popup_wrapper { + font-size: 13px; + h1 { + font-size: 26px; + } + } + .confirm_stake_popup_wrapper { + h3 { + font-size: 20px; + } + .confirm_stake_theme { + height: 20rem; + } + .confirm_stake_content_wrapper { + font-size: 12px; + .confirm_stake_content { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + line-height: 20px; + .rules_notice_text { + text-align: center; + } + } + } + .stakepool_card_icon { + position: absolute; + margin-bottom: 2%; + } + } + .confirmation_model_popup_wrapper { + .confirmation_model_content { + font-size: 14px; + .confirmation_amount_text { + font-size: 20px; + } + .successful_stack_text { + font-size: 18px !important; + } + .congrats_text { + font-weight: 700 !important; + } + .confirmation_label { + font-size: 14px; + font-weight: normal; + } + } + } + .review_unstake_popup_wrapper, + .unstake_confirm_popup_wrapper { + align-items: start; + font-size: 14px; + .review_unstake_content, + .unstake_confirm_content { + height: auto !important; + h3, + h2 { + font-size: 24px; + } + .unstake_header { + .unstaked-logo { + svg { + width: 6rem; + height: 6rem; + } + } + } + } + } +} + +.stake_table_wrapper { + .stake-tabs { + width: 100%; + padding: 3%; + + .stake-cefi-content-wrapper { + display: flex; + justify-content: space-between; + margin-bottom: 5%; + gap: 10px; + + .stake-cefi-value { + width: 100%; + display: 'flex'; + justify-content: 'flex-end'; + } + } + + .stakepool_card_wrapper { + display: flex; + justify-content: center; + flex-wrap: wrap; + gap: 15px; + + .stakepool_card { + width: 35%; + padding: 2%; + display: flex; + justify-content: center; + flex-direction: column; + align-items: center; + border-top: 1px solid var(--specials_pending-waiting-caution); + + .stakepool_card_icon { + position: relative; + bottom: 40px; + } + + .stakepool_button { + margin-top: 20%; + background-color: var(--specials_buttons-links-and-highlights); + padding: 12%; + border-radius: 20px; + width: 12rem; + color: var(--labels_important-active-labels-text-graphics); + text-align: center; + display: flex; + justify-content: center; + align-items: center; + border: none; + } + } + } + } + + .mystakes-tab { + width: 100%; + padding: 3%; + + .mystakes-content-wrapper { + display: flex; + justify-content: space-between; + margin-bottom: 5%; + gap: 10px; + + .estimated-total-stake { + width: 100%; + display: flex; + justify-content: flex-end; + } + + .total-estimated-stake { + margin-bottom: 20px; + } + + .stack-amount, + .stack-reward { + font-size: 18px; + } + } + + .tabOption { + margin-right: 5px; + padding: 10px; + border-radius: 10px; + cursor: pointer; + } + + .mystakes-table-wrapper { + table { + .duration-field { + display: flex; + flex-direction: row; + width: 100%; + gap: 10px; + } + + .stake-status-field { + display: flex; + gap: 20px; + + .stake-status-content { + color: var(--specials_pending-waiting-caution); + } + + .stake-table-button { + background-color: var(--specials_buttons-links-and-highlights); + } + } + } + } + } +} + +.layout-mobile { + .stake-wrapper { + .stake-tabs { + width: 100%; + padding: 4%; + + .stake-cefi-content-wrapper { + display: flex; + align-items: flex-start; + justify-content: space-between; + gap: 5%; + margin-bottom: 15%; + } + } + } + + .stake_table_wrapper { + .stake_table_theme { + .stakepool_card_wrapper { + .stakepool_card { + width: 100%; + height: 100%; + padding: 0 10% 10% 10%; + + .stakepool_card_icon { + bottom: 18px; + } + } + } + + .tabOption { + border: 1px solid var(--labels_important-active-labels-text-graphics); + } + } + } + + .mobileZoom { + zoom: 0.55; + position: relative; + left: 0 !important; + + .ant-table-content { + overflow-x: scroll; + } + } + + .mobileZoom .ant-table-thead > tr > th { + padding: 1rem 5rem; + font-size: 18px; + } +} diff --git a/web/src/containers/Stake/DesktopStake.js b/web/src/containers/Stake/DesktopStake.js index 2a2d3af516..2d6abfcd06 100644 --- a/web/src/containers/Stake/DesktopStake.js +++ b/web/src/containers/Stake/DesktopStake.js @@ -229,16 +229,9 @@ class Stake extends Component { {this.state.selectedStaking === 'defi' && } -
+
{this.state.selectedStaking === 'cefi' && ( -
+
Earn rewards for staking your digital assets
-
+
{this.props?.constants?.features?.cefi_stake && this.props?.constants?.features?.stake_page && (
{ this.setState({ selectedStaking: 'defi', @@ -329,16 +310,11 @@ class Stake extends Component { DeFi Staking { this.setState({ selectedStaking: 'cefi', diff --git a/web/src/containers/Stake/MobileStake.js b/web/src/containers/Stake/MobileStake.js index 621b3fa1b3..89aabc9d83 100644 --- a/web/src/containers/Stake/MobileStake.js +++ b/web/src/containers/Stake/MobileStake.js @@ -6,13 +6,7 @@ import { Button as AntBtn } from 'antd'; import { openConnectViaDesktop } from 'actions/appActions'; import STRINGS from 'config/localizedStrings'; -import { - IconTitle, - HeaderSection, - EditWrapper, - Button, - Coin, -} from 'components'; +import { HeaderSection, EditWrapper, Button, Coin, Image } from 'components'; import withConfig from 'components/ConfigProvider/withConfig'; import Account from './components/Account'; @@ -48,29 +42,29 @@ class Stake extends Component { const { display_name } = coins[STAKING_INDEX_COIN]; return ( -
-
+
+
+
+
+ +
+
+ + {STRINGS['STAKE.TITLE']} + +
+
+
+
{this.props?.constants?.features?.cefi_stake && this.props?.constants?.features?.stake_page && ( -
+
{ this.setState({ selectedStaking: 'defi', @@ -80,16 +74,11 @@ class Stake extends Component { DeFi Staking { this.setState({ selectedStaking: 'cefi', @@ -112,137 +101,132 @@ class Stake extends Component { {this.state.selectedStaking === 'defi' && ( <> -
- +
-
-
- -
-
- - {STRINGS['STAKE.DEFI_TEXT']} - -
+
+ +
+
+ + {STRINGS['STAKE.DEFI_TEXT']} +
- -
- {STRINGS.formatString( - STRINGS['STAKE.CURRENT_ETH_BLOCK'], - - )} -
-
- {STRINGS.formatString( - STRINGS['STAKE.ON_EXCHANGE_XHT'], - display_name, - , - '' - )}
+ +
+ {STRINGS.formatString( + STRINGS['STAKE.CURRENT_ETH_BLOCK'], + + )} +
+
+ {STRINGS.formatString( + STRINGS['STAKE.ON_EXCHANGE_XHT'], + display_name, + , + '' + )}
-
- - - - - - - - - - - - - {stakables.map((tokenData, index) => { - const { symbol } = tokenData; - const { fullname, icon_id, display_name } = coins[symbol]; - const commonCellProps = {}; - return ( - - + + ); + })} + +
- - - {STRINGS['STAKE_TABLE.CURRENCY']} - - - - {STRINGS['STAKE_TABLE.AVAILABLE']} - - - - {STRINGS['STAKE_TABLE.TOTAL']} - - - - {STRINGS['STAKE_TABLE.REWARD_RATE']} - - - - {STRINGS['STAKE_TABLE.EARNINGS']} - - - - {STRINGS['STAKE_TABLE.STAKE']} - -
- -
- -
- {fullname} - - {display_name} - + +
+ + + + + + + + + + + + + {stakables.map((tokenData, index) => { + const { symbol } = tokenData; + const { fullname, icon_id, display_name } = coins[ + symbol + ]; + const commonCellProps = {}; + return ( + + + + + + + - - - - - - - ); - })} - -
+ + + {STRINGS['STAKE_TABLE.CURRENCY']} + + + + {STRINGS['STAKE_TABLE.AVAILABLE']} + + + + {STRINGS['STAKE_TABLE.TOTAL']} + + + + {STRINGS['STAKE_TABLE.REWARD_RATE']} + + + + {STRINGS['STAKE_TABLE.EARNINGS']} + + + + {STRINGS['STAKE_TABLE.STAKE']} + +
+ +
+ +
+ {fullname} + + {display_name} + +
+
+ 		+ + + + + + + + +
+ {}} + disabled={true} + > + {STRINGS['STAKE_TABLE.STAKE']} +
- - 		- - - - - - - - -
- {}} - disabled={true} - > - {STRINGS['STAKE_TABLE.STAKE']} - -
-
+
+
diff --git a/web/src/containers/Stake/_Stake.scss b/web/src/containers/Stake/_Stake.scss index 47fa1f8368..af26663cfc 100644 --- a/web/src/containers/Stake/_Stake.scss +++ b/web/src/containers/Stake/_Stake.scss @@ -10,3 +10,142 @@ .area-disabled { opacity: 0.5; } + +.wallet-wrapper { + .cefi-stake { + width: 50px; + height: 40px; + margin-bottom: 10px; + } + .stake-button-wrapper { + margin: 2% 0; + display: flex; + justify-content: center; + .stakingOption { + margin-right: 5px; + padding: 10px; + border-radius: 10px; + cursor: pointer; + } + .stakingoption-opacity { + opacity: 1; + } + .stakingoption-half-opacity { + opacity: 0.7; + } + } +} + +.layout-mobile { + .stake-wrapper { + padding: 0 !important; + + .stake-icon-container { + display: flex; + align-items: center; + justify-content: center; + + .stake-icon-wrapper { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + + .stake-title { + font-size: 20px; + font-weight: bold; + } + + .stake-icon { + svg { + width: 5rem !important; + } + } + } + + .icon_title-wrapper { + margin-top: 0; + } + } + + .stake-button-wrapper { + margin: 4% 0; + display: flex; + justify-content: center; + + .stake-button-container { + width: 46%; + display: flex; + flex-direction: row; + justify-content: center; + gap: 4%; + + .defi-button, + .cefi-button { + padding: 10px; + border-radius: 10px; + cursor: pointer; + } + + .stake-text-bold { + font-weight: bold; + opacity: 1; + } + + .stake-text-normal { + font-weight: normal; + opacity: 0.7; + } + } + } + + .wallet-container { + .wallet-assets_block { + border-top: 1px solid var(--calculated_secondary-border); + .estimated-stake-content { + min-width: max-content; + padding-top: 0.5rem; + text-align: right; + display: flex; + flex-direction: column; + align-items: flex-end; + justify-content: flex-end; + .stake-estimated-table { + width: 40%; + + .kit-divider { + width: 100%; + } + } + } + } + } + + .stake-table { + overflow-x: scroll; + + table th { + .edit-wrapper__container, + td { + width: 15rem; + display: flex; + align-items: center; + justify-content: flex-start !important; + } + + tbody td { + display: flex; + align-items: center; + justify-content: flex-start; + } + } + + table th:last-child { + .edit-wrapper__container, + td { + justify-content: center !important; + } + } + } + } +} diff --git a/web/src/containers/Stake/components/CeFiUserStake.js b/web/src/containers/Stake/components/CeFiUserStake.js index 56c1e7c5b5..8a354211ff 100644 --- a/web/src/containers/Stake/components/CeFiUserStake.js +++ b/web/src/containers/Stake/components/CeFiUserStake.js @@ -3,7 +3,6 @@ import React, { useState, useEffect } from 'react'; import { Button as AntBtn, Tabs, - Modal, Input, Spin, Table, @@ -11,7 +10,6 @@ import { Progress, } from 'antd'; -import { CloseOutlined } from '@ant-design/icons'; import { requestUserStakePools, createStaker, @@ -27,8 +25,9 @@ import { isMobile } from 'react-device-detect'; import STRINGS from 'config/localizedStrings'; import { formatToCurrency } from 'utils/currency'; import '../CeFiStake.scss'; -import { NotLoggedIn } from 'components'; +import { Dialog, Image, NotLoggedIn } from 'components'; import { EditWrapper } from 'components'; +import icons from 'config/icons/dark'; const TabPane = Tabs.TabPane; @@ -101,15 +100,8 @@ const CeFiUserStake = ({ balance, coins, theme }) => { return (
{data?.stake?.duration ? ( - -
+ +
{ showInfo={false} />
-
{data?.stake?.duration} days
+
{data?.stake?.duration} days
 ) : ( '∞ Perpetual' @@ -158,15 +150,15 @@ const CeFiUserStake = ({ balance, coins, theme }) => { key: 'earnt', render: (_user_id, data) => { // const incrementUnit = - // coins[data.reward_currency || data.currency].increment_unit; + // coins[data.reward_currency || data.currency].increment_unit; const min = coins[data.reward_currency || data.currency].min; // const decimalPoint = new BigNumber(incrementUnit).dp(); // const sourceAmount = - // data?.reward && - // new BigNumber(data?.reward - data?.slashed) - // .decimalPlaces(decimalPoint) - // .toNumber(); + // data?.reward && + // new BigNumber(data?.reward - data?.slashed) + // .decimalPlaces(decimalPoint) + // .toNumber(); const formattedAmount = data?.reward && formatToCurrency(data?.reward - data?.slashed, min); @@ -185,9 +177,9 @@ const CeFiUserStake = ({ balance, coins, theme }) => { key: 'status', render: (_user_id, data) => { return ( -
+
{data.status === 'unstaking' ? ( - + UNSTAKING... ) : data.status === 'closed' ? ( @@ -213,10 +205,7 @@ const CeFiUserStake = ({ balance, coins, theme }) => { message.error(error.response.data.message); } }} - style={{ - backgroundColor: '#5D63FF', - }} - className="ant-btn green-btn ant-tooltip-open ant-btn-primary stake_theme" + className="ant-btn green-btn ant-tooltip-open ant-btn-primary stake_theme stake-table-button" > {data.stake.early_unstake && calculateRemainingDays(data?.stake?.duration, data.created_at) @@ -275,13 +264,13 @@ const CeFiUserStake = ({ balance, coins, theme }) => { }; // const pageChange = (count, pageSize) => { - // const { page, limit, isRemaining } = queryFilters; - // const pageCount = count % 5 === 0 ? 5 : count % 5; - // const apiPageTemp = Math.floor(count / 5); - // if (limit === pageSize * pageCount && apiPageTemp >= page && isRemaining) { - // requestExchangeStakers(page + 1, limit); - // } - // setQueryFilters({ ...queryFilters, currentTablePage: count }); + // const { page, limit, isRemaining } = queryFilters; + // const pageCount = count % 5 === 0 ? 5 : count % 5; + // const apiPageTemp = Math.floor(count / 5); + // if (limit === pageSize * pageCount && apiPageTemp >= page && isRemaining) { + // requestExchangeStakers(page + 1, limit); + // } + // setQueryFilters({ ...queryFilters, currentTablePage: count }); // }; const formatDate = (date) => { @@ -307,90 +296,64 @@ const CeFiUserStake = ({ balance, coins, theme }) => { const readBeforeActionModel = () => { return ( <> - } - className="stake_table_theme stake_theme" - bodyStyle={{}} - visible={readBeforeAction} - width={800} - footer={null} - onCancel={() => { + { setReadBeforeAction(false); }} > -
-
+
+

Staking 101

-
+

{STRINGS['CEFI_STAKE.READ_BEFORE_AGREE_AND_EARN']}

-
- {STRINGS['CEFI_STAKE.AGREEMENT_INTRODUCTION_1']}{' '} - - {STRINGS['CEFI_STAKE.AGREEMENT_INTRODUCTION_2']} - {' '} - {STRINGS['CEFI_STAKE.AGREEMENT_INTRODUCTION_3']} +
+
+ {STRINGS['CEFI_STAKE.AGREEMENT_INTRODUCTION_1']}{' '} + + {STRINGS['CEFI_STAKE.AGREEMENT_INTRODUCTION_2']} + {' '} + {STRINGS['CEFI_STAKE.AGREEMENT_INTRODUCTION_3']} +
- -
+
{ setReadBeforeAction(false); }} - style={{ - backgroundColor: '#5D63FF', - color: 'white', - flex: 1, - height: 35, - }} type="default" > {STRINGS['CEFI_STAKE.BACK_BUTTON']} { setReadBeforeAction(false); setStakeAmount(true); }} - style={{ - backgroundColor: '#5D63FF', - color: 'white', - flex: 1, - height: 35, - }} type="default" > {STRINGS['CEFI_STAKE.I_UNDERSTAND_BUTTON']}
- +
); }; @@ -398,104 +361,79 @@ const CeFiUserStake = ({ balance, coins, theme }) => { const stakeAmountModel = () => { return ( <> - } - className="stake_table_theme stake_theme" - bodyStyle={{}} - visible={stakeAmount} - width={400} + { + onCloseDialog={() => { setStakeAmount(false); }} > -
-
+
+

{selectedPool.name}

-
APY: {selectedPool.apy}%
-
+
- + {selectedPool.currency.toUpperCase()} available: {' '} - {balance[`${selectedPool.currency}_available`]} + + {balance[`${selectedPool.currency}_available`]} +
-
- +
+ {STRINGS['CEFI_STAKE.AMOUNT_TO_STAKE_LABEL']}:
-
+
{ setStakerAmount(e.target.value); }} + prefix={stakePools + .filter( + (pool) => pool.status === 'active' && pool.onboarding + ) + .map((pool) => { + return ( +
+ +
+ ); + })} + suffix={selectedPool.currency.toUpperCase()} value={stakerAmount} />
{/*
- Staking pool's maximum amount allowed is 1,000 ABC -
*/} + Staking pool's maximum amount allowed is 1,000 ABC +
*/}
-
+
{ setReadBeforeAction(true); setStakeAmount(false); }} - style={{ - backgroundColor: '#5D63FF', - color: 'white', - flex: 1, - height: 35, - }} type="default" > {STRINGS['CEFI_STAKE.BACK_BUTTON']} { if (stakerAmount < selectedPool.min_amount) { message.error( @@ -518,19 +456,13 @@ const CeFiUserStake = ({ balance, coins, theme }) => { setStakeAmount(false); setDuration(true); }} - style={{ - backgroundColor: '#5D63FF', - color: 'white', - flex: 1, - height: 35, - }} type="default" disabled={!stakerAmount} > {STRINGS['CEFI_STAKE.NEXT_BUTTON']}
- +
); }; @@ -538,131 +470,102 @@ const CeFiUserStake = ({ balance, coins, theme }) => { const durationModel = () => { return ( <> - } - className="stake_table_theme stake_theme" - bodyStyle={{}} - visible={duration} - width={420} - footer={null} - onCancel={() => { + { setDuration(false); }} > -
-

- {STRINGS['CEFI_STAKE.DURATION_LABEL']} -

-
+
+
+ +

+ {STRINGS['CEFI_STAKE.DURATION_LABEL']} +

+
+
{STRINGS['CEFI_STAKE.LOCKUP_DURATION_LABEL']}:{' '} - {selectedPool.duration - ? `${selectedPool.duration} days` - : 'Perpetual'} + + {selectedPool.duration + ? `${selectedPool.duration} days` + : 'Perpetual'} +
-
-
+
-
{selectedPool.slashing && ( <> -

Slashing

-
+

Slashing

+
{ STRINGS[ 'CEFI_STAKE.PENALTY_UPON_INITIAL_STAKE_PRINCIPLE_LABEL' ] } - : -{selectedPool.slashing_principle_percentage}%{' '} + : + + {' '} + -{selectedPool.slashing_principle_percentage}%{' '} +
-
+
{STRINGS['CEFI_STAKE.FORFEITURE_OF_EARNINGS_LABEL']}: - - {selectedPool.slashing_earning_percentage}% + + {selectedPool.slashing_earning_percentage}% +
)} {selectedPool.slashing && ( -
+
{STRINGS['CEFI_STAKE.SLASHING_RULES_ENFORCED_LABEL']}
{STRINGS['CEFI_STAKE.SLASHING_RULES_NOTICE']}
)} {!selectedPool.duration && ( -
+
{STRINGS['CEFI_STAKE.UNSTAKE_ANYTIME_LABEL']}
)} {selectedPool.duration && !selectedPool.early_unstake ? ( -
+
{STRINGS['CEFI_STAKE.FULL_DURATION_LOCK_LABEL']}
) : ( <> )}
-
+
{ setStakeAmount(true); setDuration(false); }} - style={{ - backgroundColor: '#5D63FF', - color: 'white', - flex: 1, - height: 35, - }} type="default" > {STRINGS['CEFI_STAKE.BACK_BUTTON']} { setDuration(false); setStakeDetails(true); }} - style={{ - backgroundColor: '#5D63FF', - color: 'white', - flex: 1, - height: 35, - }} type="default" > {STRINGS['CEFI_STAKE.PROCEED_BUTTON']}
- +
); }; @@ -670,99 +573,91 @@ const CeFiUserStake = ({ balance, coins, theme }) => { const stakeDetailsModel = () => { return ( <> - } - className="stake_table_theme stake_theme" - bodyStyle={{}} - visible={stakeDetails} - width={450} - footer={null} - onCancel={() => { + { setStakeDetails(false); }} > -
+

{STRINGS['CEFI_STAKE.CHECK_STAKE_DETAILS_BUTTON']}

- {STRINGS['CEFI_STAKE.STAKING_POOL_LABEL']}: {selectedPool.name} + {STRINGS['CEFI_STAKE.STAKING_POOL_LABEL']}:{' '} + {selectedPool.name}
- {STRINGS['CEFI_STAKE.ANNUAL_PERCENTAGE_YIELD_LABEL']}:{' '} - {selectedPool.apy}% APY + {STRINGS['CEFI_STAKE.ANNUAL_PERCENTAGE_YIELD_LABEL']}: + + {' '} + {selectedPool.apy}% APY +
- {STRINGS['CEFI_STAKE.DURATION_LABEL']}: {selectedPool.duration}{' '} - days{' '} + {STRINGS['CEFI_STAKE.DURATION_LABEL']}:{' '} + + {selectedPool.duration} days{' '} +
{STRINGS['CEFI_STAKE.PENALTY_UPON_INITIAL_STAKE_PRINCIPLE_LABEL']} - : -{selectedPool.slashing_principle_percentage}% + :{' '} + + -{selectedPool.slashing_principle_percentage}% +
- {STRINGS['CEFI_STAKE.FORFEITURE_OF_EARNINGS_DETAILS_LABEL']}: - - {selectedPool.slashing_earning_percentage}% + {STRINGS['CEFI_STAKE.FORFEITURE_OF_EARNINGS_DETAILS_LABEL']}:{' '} + + -{selectedPool.slashing_earning_percentage}% +
-
- {STRINGS['CEFI_STAKE.STAKE_AMOUNT_LABEL']}: {stakerAmount}{' '} - {selectedPool.currency.toUpperCase()} +
+ {STRINGS['CEFI_STAKE.STAKE_AMOUNT_LABEL']}:{' '} + + {stakerAmount} {selectedPool.currency.toUpperCase()} +
- -
+ {isMobile &&
} +
{selectedPool.disclaimer}
-
- {STRINGS['CEFI_STAKE.SETTLEMENT_NOTICE']} +
+ {STRINGS.formatString( + STRINGS['CEFI_STAKE.SETTLEMENT_NOTICE'], + + {STRINGS['CEFI_STAKE.SETTLEMENT_NOTICE_TITLE']} + + )}
-
+
{ setDuration(true); setStakeDetails(false); }} - style={{ - backgroundColor: '#5D63FF', - color: 'white', - flex: 1, - height: 35, - }} type="default" > {STRINGS['CEFI_STAKE.BACK_BUTTON']} { setStakeDetails(false); setConfirmStake(true); }} - style={{ - backgroundColor: '#5D63FF', - color: 'white', - flex: 1, - height: 35, - }} type="default" > {STRINGS['CEFI_STAKE.PROCEED_BUTTON']}
- +
); }; @@ -770,68 +665,53 @@ const CeFiUserStake = ({ balance, coins, theme }) => { const confirmStakeModel = () => { return ( <> - } - className="stake_table_theme stake_theme" - bodyStyle={{}} - visible={confirmStake} - width={400} - footer={null} - onCancel={() => { + { setConfirmStake(false); }} > -
-
+
+

{STRINGS['CEFI_STAKE.CONFIRM_BUTTON']}{' '} {selectedPool.currency.toUpperCase()} Stake

-
-
- - Here we go!{' '} - -
-
- {STRINGS['CEFI_STAKE.STAKE_RULES_NOTICE']} + {isMobile && + stakePools + .filter((pool) => pool.status === 'active' && pool.onboarding) + .map((pool) => { + return ( +
+ +
+ ); + })} +
+
+
+ + Here we go!{' '} + +
+
+ {STRINGS['CEFI_STAKE.STAKE_RULES_NOTICE']} +
-
+
{' '} Do you understand?
-
+
setConfirmText(e.target.value)} value={confirmText} @@ -840,31 +720,23 @@ const CeFiUserStake = ({ balance, coins, theme }) => {
-
+
{ setStakeDetails(true); setConfirmStake(false); }} - style={{ - backgroundColor: '#5D63FF', - color: 'white', - flex: 1, - height: 35, - }} type="default" > {STRINGS['CEFI_STAKE.BACK_BUTTON']} { try { await createStaker({ @@ -891,20 +763,13 @@ const CeFiUserStake = ({ balance, coins, theme }) => { setStakeAmount(false); setReadBeforeAction(false); }} - style={{ - backgroundColor: '#5D63FF', - color: 'white', - flex: 1, - height: 35, - opacity: confirmText !== 'I UNDERSTAND' ? 0.4 : 1, - }} disabled={confirmText !== 'I UNDERSTAND'} type="default" > I UNDERSTAND, STAKE
- +
); }; @@ -912,97 +777,87 @@ const CeFiUserStake = ({ balance, coins, theme }) => { const confirmationModel = () => { return ( <> - } - className="stake_table_theme stake_theme" - bodyStyle={{}} - visible={confirmation} - width={450} - footer={null} - onCancel={() => { + { setConfirmation(false); }} > -
-
-

+
+
+ {isMobile && + stakePools + .filter((pool) => pool.status === 'active' && pool.onboarding) + .map((pool) => { + return ( +
+ +
+ ); + })} +

{stakerAmount} {selectedPool.currency.toUpperCase()}

-
Successfully staked
-
-
-
+
Successfully staked
+
+
{STRINGS['CEFI_STAKE.CONGRATULATIONS_NOTICE']}
-
+
{STRINGS['CEFI_STAKE.EARNINGS_START_NOTICE']}
-
+
{' '} - {STRINGS['CEFI_STAKE.REVIEW_PROGRESS_LABEL']} + {STRINGS.formatString( + STRINGS['CEFI_STAKE.REVIEW_PROGRESS_LABEL'], + { + setConfirmation(false); + handleTabChange('1'); + setStakerAmount(); + setSelectedPool(); + }} + > + {STRINGS['CEFI_STAKE.REVIEW_PROGRESS_ACTIVE_LINK']} + + )}
-
+
{ setConfirmation(false); setStakerAmount(); setSelectedPool(); }} - style={{ - backgroundColor: '#5D63FF', - color: 'white', - flex: 1, - height: 35, - }} type="default" > {STRINGS['CEFI_STAKE.CLOSE_BUTTON']} { setConfirmation(false); handleTabChange('1'); setStakerAmount(); setSelectedPool(); }} - style={{ - backgroundColor: '#5D63FF', - color: 'white', - flex: 1, - height: 35, - }} type="default" > VIEW ACTIVE STAKES
- +

); }; @@ -1010,146 +865,183 @@ const CeFiUserStake = ({ balance, coins, theme }) => { const reviewUnstakeModel = () => { return ( <> - } + { + isOpen={reviewUnstake} + onCloseDialog={() => { setReviewUnstake(false); }} > -
-
+
+

Review and unstake

-
- - {STRINGS['CEFI_STAKE.TIME_REMAINING_LABEL']}: - {' '} - {selectedStaker?.stake?.duration ? ( - <> - {calculateRemainingDays( - selectedStaker?.stake?.duration, - selectedStaker.created_at - )}{' '} - days ( - {selectedStaker?.stake?.duration && - formatDate(selectedStaker?.closing)} - ) - - ) : ( - 'Perpetual' - )} + {isMobile && ( +
+ {isMobile && + stakePools + .filter( + (pool) => pool.status === 'active' && pool.onboarding + ) + .map((pool) => { + return ( +
+ +
+ ); + })} +
+
+ + {STRINGS['UNSTAKE.AMOUNT_TO_RECEIVE']}: + {' '} + + {selectedStaker.reward_currency + ? selectedStaker.reward > 0 + ? `${roundToIncrementUnit( + new BigNumber(selectedStaker.reward) + .minus( + new BigNumber( + selectedStaker.slashedValues.slashingEarning + ) + ) + .toNumber(), + selectedStaker.reward_currency + )} ${selectedStaker.reward_currency.toUpperCase()}` + : 'No reward amount to receive' + : `${new BigNumber(selectedStaker.amount) + .minus( + new BigNumber( + selectedStaker.slashedValues.slashingPrinciple + ) + ) + .plus( + new BigNumber(selectedStaker.reward).minus( + new BigNumber( + selectedStaker.slashedValues.slashingEarning + ) + ) + ) + .toNumber()} ${selectedStaker.currency.toUpperCase()}`} + +
+ + ({STRINGS['CEFI_STAKE.REQUIRES_24H_TO_SETTLE_NOTICE']}) + +
+
+ )} +
+ {STRINGS['CEFI_STAKE.TIME_REMAINING_LABEL']}:{' '} + + {selectedStaker?.stake?.duration ? ( + <> + {calculateRemainingDays( + selectedStaker?.stake?.duration, + selectedStaker.created_at + )}{' '} + days ( + {selectedStaker?.stake?.duration && + formatDate(selectedStaker?.closing)} + ) + + ) : ( + 'Perpetual' + )} +
-
- +
+ {STRINGS['CEFI_STAKE.PENALTY_UPON_INITIAL_STAKE_PRINCIPLE']}: {' '} - {roundToIncrementUnit( - selectedStaker.slashedValues.slashingPrinciple, - selectedStaker.currency - )}{' '} - {selectedStaker.currency.toUpperCase()} (- - {selectedStaker?.stake?.slashing_principle_percentage - ? `${selectedStaker?.stake?.slashing_principle_percentage}%` - : '-'} - ) + + {roundToIncrementUnit( + selectedStaker.slashedValues.slashingPrinciple, + selectedStaker.currency + )}{' '} + {selectedStaker.currency.toUpperCase()} (- + {selectedStaker?.stake?.slashing_principle_percentage + ? `${selectedStaker?.stake?.slashing_principle_percentage}%` + : '-'} + ) +
- + {STRINGS['CEFI_STAKE.FORFEITURE_OF_EARNINGS_LABEL']}: {' '} - {roundToIncrementUnit( - selectedStaker.slashedValues.slashingEarning, - selectedStaker.reward_currency || selectedStaker.currency - )}{' '} - {( - selectedStaker.reward_currency || selectedStaker.currency - ).toUpperCase()}{' '} - (- - {selectedStaker?.stake?.slashing_earning_percentage - ? `${selectedStaker?.stake?.slashing_earning_percentage}%` - : '-'} - ) + + {roundToIncrementUnit( + selectedStaker.slashedValues.slashingEarning, + selectedStaker.reward_currency || selectedStaker.currency + )}{' '} + {( + selectedStaker.reward_currency || selectedStaker.currency + ).toUpperCase()}{' '} + (- + {selectedStaker?.stake?.slashing_earning_percentage + ? `${selectedStaker?.stake?.slashing_earning_percentage}%` + : '-'} + ) +
- -
- + {isMobile &&
} +
+ {selectedStaker.reward_currency && 'Reward'}{' '} {STRINGS['CEFI_STAKE.AMOUNT_TO_RECEIVE_LABEL']}: {' '} - {selectedStaker.reward_currency - ? selectedStaker.reward > 0 - ? `${roundToIncrementUnit( - new BigNumber(selectedStaker.reward) - .minus( - new BigNumber( - selectedStaker.slashedValues.slashingEarning + + {selectedStaker.reward_currency + ? selectedStaker.reward > 0 + ? `${roundToIncrementUnit( + new BigNumber(selectedStaker.reward) + .minus( + new BigNumber( + selectedStaker.slashedValues.slashingEarning + ) ) + .toNumber(), + selectedStaker.reward_currency + )} ${selectedStaker.reward_currency.toUpperCase()}` + : 'No reward amount to receive' + : `${new BigNumber(selectedStaker.amount) + .minus( + new BigNumber( + selectedStaker.slashedValues.slashingPrinciple ) - .toNumber(), - selectedStaker.reward_currency - )} ${selectedStaker.reward_currency.toUpperCase()}` - : 'No reward amount to receive' - : `${new BigNumber(selectedStaker.amount) - .minus( - new BigNumber( - selectedStaker.slashedValues.slashingPrinciple ) - ) - .plus( - new BigNumber(selectedStaker.reward).minus( - new BigNumber( - selectedStaker.slashedValues.slashingEarning + .plus( + new BigNumber(selectedStaker.reward).minus( + new BigNumber( + selectedStaker.slashedValues.slashingEarning + ) ) ) - ) - .toNumber()} ${selectedStaker.currency.toUpperCase()}`} + .toNumber()} ${selectedStaker.currency.toUpperCase()}`} + +
+
+ ({STRINGS['CEFI_STAKE.REQUIRES_24H_TO_SETTLE_NOTICE']})
-
({STRINGS['CEFI_STAKE.REQUIRES_24H_TO_SETTLE_NOTICE']})
-
+
{ setReviewUnstake(false); }} - style={{ - backgroundColor: '#5D63FF', - color: 'white', - flex: 1, - height: 35, - }} type="default" > Cancel { try { await deleteStaker({ id: selectedStaker.id }); @@ -1160,7 +1052,7 @@ const CeFiUserStake = ({ balance, coins, theme }) => { setStakePools(stakes.data); // message.success( - // `Successfuly unstaked in ${selectedStaker.id}` + // `Successfuly unstaked in ${selectedStaker.id}` // ); } catch (error) { message.error(error.response.data.message); @@ -1170,18 +1062,12 @@ const CeFiUserStake = ({ balance, coins, theme }) => { setReviewUnstake(false); setUnstakeConfirm(true); }} - style={{ - backgroundColor: '#5D63FF', - color: 'white', - flex: 1, - height: 35, - }} type="default" > UNSTAKE
- +
); }; @@ -1189,109 +1075,141 @@ const CeFiUserStake = ({ balance, coins, theme }) => { const unstakeConfirmModel = () => { return ( <> - } - className="stake_table_theme stake_theme" - bodyStyle={{}} - visible={unstakeConfirm} - width={400} - footer={null} - onCancel={() => { + { setUnstakeConfirm(false); }} > -
-
-

- You've successfully unstaked{' '} - {selectedStaker.currency.toUpperCase()} -

-
- +
+
+
+ +

+ You've successfully unstaked{' '} + {selectedStaker.currency.toUpperCase()} +

+
+ {isMobile && ( +
+ {isMobile && + stakePools + .filter( + (pool) => pool.status === 'active' && pool.onboarding + ) + .map((pool) => { + return ( +
+ +
+ ); + })} +
+
+ + {STRINGS['UNSTAKE.AMOUNT_TO_RECEIVE']}: + {' '} + + {selectedStaker.reward_currency + ? selectedStaker.reward > 0 + ? `${roundToIncrementUnit( + new BigNumber(selectedStaker.reward) + .minus( + new BigNumber( + selectedStaker.slashedValues.slashingEarning + ) + ) + .toNumber(), + selectedStaker.reward_currency + )} ${selectedStaker.reward_currency.toUpperCase()}` + : 'No reward amount to receive' + : `${new BigNumber(selectedStaker.amount) + .minus( + new BigNumber( + selectedStaker.slashedValues.slashingPrinciple + ) + ) + .plus( + new BigNumber(selectedStaker.reward).minus( + new BigNumber( + selectedStaker.slashedValues.slashingEarning + ) + ) + ) + .toNumber()} ${selectedStaker.currency.toUpperCase()}`} + +
+
+
+ )} + {isMobile &&
} +
+ {selectedStaker.reward_currency && 'Reward'}{' '} {STRINGS['CEFI_STAKE.AMOUNT_TO_RECEIVE_LABEL']}: {' '} - {selectedStaker.reward_currency - ? selectedStaker.reward > 0 - ? `${roundToIncrementUnit( - new BigNumber(selectedStaker.reward) - .minus( - new BigNumber( - selectedStaker.slashedValues.slashingEarning + + {selectedStaker.reward_currency + ? selectedStaker.reward > 0 + ? `${roundToIncrementUnit( + new BigNumber(selectedStaker.reward) + .minus( + new BigNumber( + selectedStaker.slashedValues.slashingEarning + ) ) + .toNumber(), + selectedStaker.reward_currency + )} ${selectedStaker.reward_currency.toUpperCase()}` + : 'No reward amount to receive' + : `${new BigNumber(selectedStaker.amount) + .minus( + new BigNumber( + selectedStaker.slashedValues.slashingPrinciple ) - .toNumber(), - selectedStaker.reward_currency - )} ${selectedStaker.reward_currency.toUpperCase()}` - : 'No reward amount to receive' - : `${new BigNumber(selectedStaker.amount) - .minus( - new BigNumber( - selectedStaker.slashedValues.slashingPrinciple ) - ) - .plus( - new BigNumber(selectedStaker.reward).minus( - new BigNumber( - selectedStaker.slashedValues.slashingEarning + .plus( + new BigNumber(selectedStaker.reward).minus( + new BigNumber( + selectedStaker.slashedValues.slashingEarning + ) ) ) - ) - .toNumber()} ${selectedStaker.currency.toUpperCase()}`} + .toNumber()} ${selectedStaker.currency.toUpperCase()}`} + +
+
+ ({STRINGS['CEFI_STAKE.REQUIRES_24H_TO_SETTLE_NOTICE']})
-
({STRINGS['CEFI_STAKE.REQUIRES_24H_TO_SETTLE_NOTICE']})
-
+
{ setUnstakeConfirm(false); setSelectedStaker(); }} - style={{ - backgroundColor: '#5D63FF', - color: 'white', - flex: 1, - height: 35, - }} type="default" > {STRINGS['CEFI_STAKE.CLOSE_BUTTON']} { setUnstakeConfirm(false); setSelectedStaker(); }} - style={{ - backgroundColor: '#5D63FF', - color: 'white', - flex: 1, - height: 35, - }} type="default" > @@ -1299,7 +1217,7 @@ const CeFiUserStake = ({ balance, coins, theme }) => {
- +
); }; @@ -1348,7 +1266,7 @@ const CeFiUserStake = ({ balance, coins, theme }) => { }; return ( -
+
{readBeforeAction && readBeforeActionModel()} {stakeAmount && stakeAmountModel()} {duration && durationModel()} @@ -1365,87 +1283,56 @@ const CeFiUserStake = ({ balance, coins, theme }) => { onChange={handleTabChange} > -
-
-
-
+
+
+
+ {isMobile && ( + + )} +
+
+
{STRINGS['CEFI_STAKE.STAKE_POOL_TITLE']}
-
{STRINGS['CEFI_STAKE.INTRODUCTION_1']}
-
-
- {/*
- {userStakeData?.length > 0 && ( -
{STRINGS['CEFI_STAKE.CURRENT_STAKING_VALUE']}:
- )} -
- {accumulateAmount(userStakeData).map((stake) => ( -
- {stake.currency.toUpperCase()}: {stake.amount} -
- ))} -
-
*/} +
{STRINGS['CEFI_STAKE.INTRODUCTION_1']}
+ {!isMobile && ( +
+ {/*
+ {userStakeData?.length > 0 && ( +
{STRINGS['CEFI_STAKE.CURRENT_STAKING_VALUE']}:
+ )} +
+ {accumulateAmount(userStakeData).map((stake) => ( +
+ {stake.currency.toUpperCase()}: {stake.amount} +
+ ))} +
+
*/} +
+ )}
-
+
{stakePools .filter((pool) => pool.status === 'active' && pool.onboarding) .map((pool) => { // const alreadyStaked = - // (userStakeData || [])?.filter( - // (staker) => - // staker.stake_id == pool.id && staker.status !== 'closed' - // )?.length > 0; + // (userStakeData || [])?.filter( + // (staker) => + // staker.stake_id == pool.id && staker.status !== 'closed' + // )?.length > 0; const alreadyStaked = false; return ( -
-
+
+
{ alt="" />
-

- {pool.name} -

+ {isMobile ? ( +

{pool.name}

+ ) : ( +

{pool.name}

+ )}
{pool.duration ? ( <> - + {STRINGS['CEFI_STAKE.DURATION_LABEL']}: {' '} {pool.duration} days @@ -1474,53 +1358,40 @@ const CeFiUserStake = ({ balance, coins, theme }) => { )}
- + APY: {' '} {pool.apy}%
-
- Min:{' '} + Min:{' '} {pool.min_amount} {pool.currency.toUpperCase()}
- Max:{' '} + Max:{' '} {pool.max_amount} {pool.currency.toUpperCase()}
{pool?.reward_currency && ( -
+
{STRINGS['CEFI_STAKE.REWARDS_IN_LABEL']}{' '} - + {pool.reward_currency.toUpperCase()}
)}
{ setReadBeforeAction(true); setSelectedPool(pool); }} disabled={alreadyStaked} - style={{ - marginTop: 30, - backgroundColor: '#5D63FF', - padding: 20, - borderRadius: 20, - width: 160, - color: 'white', - textAlign: 'center', - display: 'flex', - justifyContent: 'center', - alignItems: 'center', - opacity: alreadyStaked ? 0.4 : 1, - }} > {' '} {alreadyStaked ? 'STAKED' : 'STAKE'}{' '} @@ -1533,114 +1404,86 @@ const CeFiUserStake = ({ balance, coins, theme }) => {
-
-
-
-
+
+
+
+
{STRINGS['CEFI_STAKE.ALL_STAKING_EVENTS']}
-
- {STRINGS['CEFI_STAKE.MONITOR_ACTIVE_STAKES']} -
-
+
{STRINGS['CEFI_STAKE.MONITOR_ACTIVE_STAKES']}
+
{STRINGS['CEFI_STAKE.USE_FILTERS_FOR_HISTORICAL_EVENTS']}
-
-
-
- {userStakeData?.length > 0 && ( -
- {STRINGS['CEFI_STAKE.ESTIMATED_TOTAL_STAKED']} -
- )} -
- {accumulateAmount( - userStakeData.filter((staker) => - ['staking', 'unstaking'].includes(staker.status) - ) - ).map((stake) => ( + {!isMobile && ( +
+
+
+ {userStakeData?.length > 0 && (
- {stake.currency.toUpperCase()}: {stake.amount} + {STRINGS['CEFI_STAKE.ESTIMATED_TOTAL_STAKED']}
- ))} -
-
-
- {userStakeData?.length > 0 && ( -
- {STRINGS['CEFI_STAKE.ESTIMATED_EARNINGS_VALUE']} -
- )} -
- {accumulateReward(userStakeData).map((stake) => { - const min = coins[stake.currency].min; - - // const incrementUnit = - // coins[stake.currency].increment_unit; - // const decimalPoint = new BigNumber( - // incrementUnit - // ).dp(); - // const sourceAmount = - // stake?.reward && - // new BigNumber(stake?.reward) - // .decimalPlaces(decimalPoint) - // .toNumber(); - - const formattedAmount = - stake?.reward && - formatToCurrency(stake?.reward, min); - - return ( + )} +
+ {accumulateAmount( + userStakeData.filter((staker) => + ['staking', 'unstaking'].includes(staker.status) + ) + ).map((stake) => (
- {( - stake.reward_currency || stake.currency - ).toUpperCase()} - : {formattedAmount} + {stake.currency.toUpperCase()}: {stake.amount}
- ); - })} + ))} +
+
+
+ {userStakeData?.length > 0 && ( +
+ {STRINGS['CEFI_STAKE.ESTIMATED_EARNINGS_VALUE']} +
+ )} +
+ {accumulateReward(userStakeData).map((stake) => { + const min = coins[stake.currency].min; + + // const incrementUnit = + // coins[stake.currency].increment_unit; + // const decimalPoint = new BigNumber( + // incrementUnit + // ).dp(); + // const sourceAmount = + // stake?.reward && + // new BigNumber(stake?.reward) + // .decimalPlaces(decimalPoint) + // .toNumber(); + + const formattedAmount = + stake?.reward && + formatToCurrency(stake?.reward, min); + + return ( +
+ {( + stake.reward_currency || stake.currency + ).toUpperCase()} + : {formattedAmount} +
+ ); + })} +
-
+ )}
-
+
{ setTabOption('active'); }} @@ -1650,15 +1493,11 @@ const CeFiUserStake = ({ balance, coins, theme }) => { { setTabOption('history'); }} @@ -1668,7 +1507,7 @@ const CeFiUserStake = ({ balance, coins, theme }) => {
-
+
{ return data.id; }} // pagination={{ - // current: queryFilters.currentTablePage, - // onChange: pageChange, + // current: queryFilters.currentTablePage, + // onChange: pageChange, // }} pagination={false} /> diff --git a/web/src/containers/Stake/components/StakesAndEarnings.js b/web/src/containers/Stake/components/StakesAndEarnings.js index 651fa1ab36..f0b6137b0e 100644 --- a/web/src/containers/Stake/components/StakesAndEarnings.js +++ b/web/src/containers/Stake/components/StakesAndEarnings.js @@ -27,16 +27,8 @@ const StakesAndEarnings = ({ totalEarningsValue, totalStakesValue, coins }) => { ); return ( -
-
+
+
{STRINGS['STAKE.ESTIMATED_STAKED']} @@ -45,7 +37,7 @@ const StakesAndEarnings = ({ totalEarningsValue, totalStakesValue, coins }) => {
-
+
{STRINGS['STAKE.ESTIMATED_EARNINGS']} diff --git a/web/src/containers/StakeDetails/_StakeDetails.scss b/web/src/containers/StakeDetails/_StakeDetails.scss index 8b97d2e054..1c13bb5db4 100644 --- a/web/src/containers/StakeDetails/_StakeDetails.scss +++ b/web/src/containers/StakeDetails/_StakeDetails.scss @@ -161,7 +161,7 @@ color: $colors-notifications-blue; background-color: $specials_highlight-box; border-radius: 0.5rem; - margin: 1rem 0.5rem; + margin: 1rem 0rem; font-weight: bold; &:hover { diff --git a/web/src/containers/Summary/components/_ReferralList.scss b/web/src/containers/Summary/components/_ReferralList.scss index df099d01a6..02f241ac4f 100644 --- a/web/src/containers/Summary/components/_ReferralList.scss +++ b/web/src/containers/Summary/components/_ReferralList.scss @@ -494,6 +494,13 @@ .referral-label-mobile { font-size: 14px; } + + .new-referral-wrapper { + .new-referral-label { + font-size: 16px; + margin: 2% 0 3% 0%; + } + } } .history-referral-container { .referral-history-content { diff --git a/web/src/containers/_containers.scss b/web/src/containers/_containers.scss index 4bf1eba815..78716f7f91 100644 --- a/web/src/containers/_containers.scss +++ b/web/src/containers/_containers.scss @@ -26,6 +26,7 @@ @import './ConfirmChangePassword/ConfirmChangePassword'; @import './StakeDetails/StakeDetails'; @import './Stake/Stake'; +@import './Stake/CeFiStake.scss'; @import './Apps/Apps'; @import './CoinPage/CoinPage'; @import './Summary/components/ReferralList'; diff --git a/web/src/index.css b/web/src/index.css index 64c9692854..a8f9930283 100644 --- a/web/src/index.css +++ b/web/src/index.css @@ -377,8 +377,8 @@ table th { height: auto; flex: 1; } .app_container.layout-mobile .app_container-content { - min-height: calc( 100vh - 10rem); - max-height: calc( 100vh - 10rem); + min-height: calc( 100vh - 10rem); + max-height: calc( 100vh - 10rem); max-width: 100vw; overflow-y: scroll; } .app_container.layout-mobile .app_container-content.chart-embed { @@ -396,8 +396,8 @@ table th { .app_container.layout-mobile .app_container-content .app_container-main.no_bottom_navigation { height: 100%; } .app_container.layout-mobile .content-with-bar { - min-height: calc( 100vh - 17rem); - max-height: calc( 100vh - 17rem); + min-height: calc( 100vh - 17rem); + max-height: calc( 100vh - 17rem); max-width: 100vw; padding: 1rem; margin: 0; @@ -4324,8 +4324,8 @@ table th { .layout-mobile .quote-container { background-color: transparent; overflow-y: scroll; - min-height: calc( 100vh - 17rem); - max-height: calc( 100vh - 17rem); } + min-height: calc( 100vh - 17rem); + max-height: calc( 100vh - 17rem); } .layout-mobile .quote-container .quick_trade-wrapper { flex: 1 1; flex-direction: column; @@ -4498,7 +4498,7 @@ table th { .layout-mobile .presentation_container.verification_container { padding-top: 0 !important; - max-height: calc( 100vh - 10rem); } + max-height: calc( 100vh - 10rem); } .layout-mobile .presentation_container.verification_container .header-content { font-size: 13px !important; } @@ -5387,7 +5387,7 @@ table th { .digital-market-wrapper .custom-header-wrapper { color: var(--labels_secondary-inactive-label-text-graphics); - font-family: "Raleway"; + font-family: 'Raleway'; font-weight: bold; } .digital-market-wrapper .custom-border-bottom { @@ -6441,7 +6441,7 @@ table th { color: var(--specials_buttons-links-and-highlights); background-color: var(--calculated_specials_highlight-box); border-radius: 0.5rem; - margin: 1rem 0.5rem; + margin: 1rem 0rem; font-weight: bold; } .staking-account__connect:hover { opacity: 0.8; } @@ -6527,6 +6527,522 @@ table th { .area-disabled { opacity: 0.5; } +.wallet-wrapper .cefi-stake { + width: 50px; + height: 40px; + margin-bottom: 10px; } + +.wallet-wrapper .stake-button-wrapper { + margin: 2% 0; + display: flex; + justify-content: center; } + .wallet-wrapper .stake-button-wrapper .stakingOption { + margin-right: 5px; + padding: 10px; + border-radius: 10px; + cursor: pointer; } + .wallet-wrapper .stake-button-wrapper .stakingoption-opacity { + opacity: 1; } + .wallet-wrapper .stake-button-wrapper .stakingoption-half-opacity { + opacity: 0.7; } + +.layout-mobile .stake-wrapper { + padding: 0 !important; } + .layout-mobile .stake-wrapper .stake-icon-container { + display: flex; + align-items: center; + justify-content: center; } + .layout-mobile .stake-wrapper .stake-icon-container .stake-icon-wrapper { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; } + .layout-mobile .stake-wrapper .stake-icon-container .stake-icon-wrapper .stake-title { + font-size: 20px; + font-weight: bold; } + .layout-mobile .stake-wrapper .stake-icon-container .stake-icon-wrapper .stake-icon svg { + width: 5rem !important; } + .layout-mobile .stake-wrapper .stake-icon-container .icon_title-wrapper { + margin-top: 0; } + .layout-mobile .stake-wrapper .stake-button-wrapper { + margin: 4% 0; + display: flex; + justify-content: center; } + .layout-mobile .stake-wrapper .stake-button-wrapper .stake-button-container { + width: 46%; + display: flex; + flex-direction: row; + justify-content: center; + gap: 4%; } + .layout-mobile .stake-wrapper .stake-button-wrapper .stake-button-container .defi-button, + .layout-mobile .stake-wrapper .stake-button-wrapper .stake-button-container .cefi-button { + padding: 10px; + border-radius: 10px; + cursor: pointer; } + .layout-mobile .stake-wrapper .stake-button-wrapper .stake-button-container .stake-text-bold { + font-weight: bold; + opacity: 1; } + .layout-mobile .stake-wrapper .stake-button-wrapper .stake-button-container .stake-text-normal { + font-weight: normal; + opacity: 0.7; } + .layout-mobile .stake-wrapper .wallet-container .wallet-assets_block { + border-top: 1px solid var(--calculated_secondary-border); } + .layout-mobile .stake-wrapper .wallet-container .wallet-assets_block .estimated-stake-content { + min-width: max-content; + padding-top: 0.5rem; + text-align: right; + display: flex; + flex-direction: column; + align-items: flex-end; + justify-content: flex-end; } + .layout-mobile .stake-wrapper .wallet-container .wallet-assets_block .estimated-stake-content .stake-estimated-table { + width: 40%; } + .layout-mobile .stake-wrapper .wallet-container .wallet-assets_block .estimated-stake-content .stake-estimated-table .kit-divider { + width: 100%; } + .layout-mobile .stake-wrapper .stake-table { + overflow-x: scroll; } + .layout-mobile .stake-wrapper .stake-table table th .edit-wrapper__container, + .layout-mobile .stake-wrapper .stake-table table th td { + width: 15rem; + display: flex; + align-items: center; + justify-content: flex-start !important; } + .layout-mobile .stake-wrapper .stake-table table th tbody td { + display: flex; + align-items: center; + justify-content: flex-start; } + .layout-mobile .stake-wrapper .stake-table table th:last-child .edit-wrapper__container, + .layout-mobile .stake-wrapper .stake-table table th:last-child td { + justify-content: center !important; } + +.cefi_stake .ant-table-thead > tr > th { + background-color: var(--base_background); + color: var(--labels_important-active-labels-text-graphics); + padding: 0rem 1rem; } + +.cefi_stake .ant-table-tbody > tr > td { + background-color: var(--base_background); + color: var(--labels_important-active-labels-text-graphics); + border-bottom: 1px solid #25262c; } + +.cefi_stake .ant-table-tbody > tr.ant-table-placeholder:hover > td { + background-color: var(--base_background); } + +.cefi_stake .ant-table-tbody > tr.ant-table-row:hover > td { + background-color: var(--base_background); } + +.stake_theme { + color: var(--labels_important-active-labels-text-graphics); } + +.stake_table_theme { + background-color: var(--base_background); } + +.stakepool_card { + background-color: var(--base_secondary-navigation-bar); } + +.stake_theme > .ant-modal-content { + background-color: var(--base_background); } + +.stakepool_card > .ant-modal-content { + background-color: var(--base_secondary-navigation-bar); } + +.mobileZoom { + zoom: 0.55; + position: relative; + left: -50px; } + +.mobileZoom .ant-table-thead > tr > th { + padding: 16px 4px; } + +.mobileZoom .ant-table-tbody > tr > td { + padding: 16px 4px; } + +.stakingOption { + background-color: var(--base_wallet-sidebar-and-popup); } + +.tabOption { + background-color: var(--base_wallet-sidebar-and-popup); + color: var(--labels_important-active-labels-text-graphics); } + +.stake_half_opacity { + opacity: 0.4; } + +.stake_opacity { + opacity: 1; } + +.tabOption-half-opacity { + opacity: 0.7; } + +.stake_table_theme .stake_detail_text { + color: var(--labels_secondary-inactive-label-text-graphics); } + +.stake_table_theme .stake_detail_line { + width: 5%; + border-bottom: 1px solid var(--labels_secondary-inactive-label-text-graphics); } + +.stake_table_theme .action_model_popup_wrapper { + display: flex; + gap: 30px; + height: 15%; } + .stake_table_theme .action_model_popup_wrapper .action_model_popup_content { + width: 100%; + display: flex; + justify-content: center; + align-items: center; + background-image: url(/assets/images/staking_3.png); + background-size: cover; } + +.stake_table_theme .stake_popup_button_wrapper { + display: flex; + flex-direction: row; + gap: 15px; + justify-content: space-between; + margin-top: 5%; } + .stake_table_theme .stake_popup_button_wrapper .stake_popup_button { + width: 100%; + background-color: var(--specials_buttons-links-and-highlights); + color: var(--labels_important-active-labels-text-graphics); + height: 3rem; + border: none; } + +.stake_table_theme .stake_amount_popup_wrapper, +.stake_table_theme .confirm_stake_popup_wrapper { + display: flex; + justify-content: center; + flex-direction: column; + align-items: center; } + .stake_table_theme .stake_amount_popup_wrapper .stake_amount_theme, + .stake_table_theme .stake_amount_popup_wrapper .confirm_stake_theme, + .stake_table_theme .confirm_stake_popup_wrapper .stake_amount_theme, + .stake_table_theme .confirm_stake_popup_wrapper .confirm_stake_theme { + display: flex; + justify-content: center; + flex-direction: column; + align-items: center; + height: 16rem; + background-image: url(/assets/images/staking_2.png); + background-size: cover; + width: 100%; + margin-bottom: 3%; } + .stake_table_theme .stake_amount_popup_wrapper .confirm_stake_theme, + .stake_table_theme .confirm_stake_popup_wrapper .confirm_stake_theme { + background-image: url(/assets/images/staking_1.png); } + .stake_table_theme .stake_amount_popup_wrapper .stake_amount_popup_content, + .stake_table_theme .stake_amount_popup_wrapper .confirm_stake_content_wrapper, + .stake_table_theme .confirm_stake_popup_wrapper .stake_amount_popup_content, + .stake_table_theme .confirm_stake_popup_wrapper .confirm_stake_content_wrapper { + width: 100%; } + .stake_table_theme .stake_amount_popup_wrapper .stake_amount_popup_content .stake_amount_field, + .stake_table_theme .stake_amount_popup_wrapper .stake_amount_popup_content .confirm_stake_field, + .stake_table_theme .stake_amount_popup_wrapper .confirm_stake_content_wrapper .stake_amount_field, + .stake_table_theme .stake_amount_popup_wrapper .confirm_stake_content_wrapper .confirm_stake_field, + .stake_table_theme .confirm_stake_popup_wrapper .stake_amount_popup_content .stake_amount_field, + .stake_table_theme .confirm_stake_popup_wrapper .stake_amount_popup_content .confirm_stake_field, + .stake_table_theme .confirm_stake_popup_wrapper .confirm_stake_content_wrapper .stake_amount_field, + .stake_table_theme .confirm_stake_popup_wrapper .confirm_stake_content_wrapper .confirm_stake_field { + background-color: var(--base_background); } + .stake_table_theme .stake_amount_popup_wrapper .stake_amount_popup_content .stake_amount_field .ant-input, + .stake_table_theme .stake_amount_popup_wrapper .confirm_stake_content_wrapper .stake_amount_field .ant-input, + .stake_table_theme .confirm_stake_popup_wrapper .stake_amount_popup_content .stake_amount_field .ant-input, + .stake_table_theme .confirm_stake_popup_wrapper .confirm_stake_content_wrapper .stake_amount_field .ant-input { + background-color: var(--base_background); + color: var(--labels_important-active-labels-text-graphics); + padding-left: 3%; } + +.stake_table_theme .confirm_stake_popup_wrapper .confirm_stake_theme { + margin-bottom: 5% !important; } + +.stake_table_theme .confirm_stake_popup_wrapper .confirm_stake_content_wrapper .confirm_stake_field { + margin-bottom: 3% !important; } + +.stake_table_theme .stake_duration_model_wrapper .danger_message_wrapper, +.stake_table_theme .stake_duration_model_wrapper .success_message_wrapper, +.stake_table_theme .stake_duration_model_wrapper .warning_message_wrapper { + padding: 5%; + background-color: var(--highcharts-negative-color); + margin: 5% 0 8%; + font-size: 12px; } + +.stake_table_theme .stake_duration_model_wrapper .success_message_wrapper { + background-color: var(--specials_checks-okay-done) !important; } + +.stake_table_theme .stake_duration_model_wrapper .warning_message_wrapper { + background-color: var(--specials_pending-waiting-caution) !important; } + +.stake_table_theme .confirmation_model_popup_wrapper { + display: flex; + justify-content: center; + flex-direction: column; + align-items: center; } + .stake_table_theme .confirmation_model_popup_wrapper .confirmation_model_content { + display: flex; + justify-content: center; + flex-direction: column; + align-items: center; + text-align: center; } + .stake_table_theme .confirmation_model_popup_wrapper .confirmation_model_content .confirmation_label { + font-size: 12px; + font-weight: bold; } + .stake_table_theme .confirmation_model_popup_wrapper .confirmation_model_content .confirmation_label .active_link { + color: var(--specials_buttons-links-and-highlights); + text-decoration: underline; } + .stake_table_theme .confirmation_model_popup_wrapper .confirmation_model_content .confirmation_label .active_link:hover { + cursor: pointer; } + +.stake_table_theme .review_unstake_popup_wrapper, +.stake_table_theme .unstake_confirm_popup_wrapper { + display: flex; + justify-content: center; + flex-direction: column; + align-items: center; } + .stake_table_theme .review_unstake_popup_wrapper .review_unstake_content, + .stake_table_theme .review_unstake_popup_wrapper .unstake_confirm_content, + .stake_table_theme .unstake_confirm_popup_wrapper .review_unstake_content, + .stake_table_theme .unstake_confirm_popup_wrapper .unstake_confirm_content { + display: flex; + justify-content: center; + flex-direction: column; + height: 12rem; } + .stake_table_theme .review_unstake_popup_wrapper .review_unstake_content .unstake_header, + .stake_table_theme .review_unstake_popup_wrapper .unstake_confirm_content .unstake_header, + .stake_table_theme .unstake_confirm_popup_wrapper .review_unstake_content .unstake_header, + .stake_table_theme .unstake_confirm_popup_wrapper .unstake_confirm_content .unstake_header { + display: flex; + align-items: center; + gap: 10px; } + .stake_table_theme .review_unstake_popup_wrapper .review_unstack_wrapper, + .stake_table_theme .unstake_confirm_popup_wrapper .review_unstack_wrapper { + display: flex; + flex-direction: row; + gap: 15px; + align-items: center; + margin-top: 5%; } + .stake_table_theme .review_unstake_popup_wrapper .review_unstack_wrapper .review_settle_notice, + .stake_table_theme .unstake_confirm_popup_wrapper .review_unstack_wrapper .review_settle_notice { + font-size: 12px; } + +.terms_condition_dialog_wrapper .ReactModal__Content { + width: 35%; } + +.stake_amount_dialog .ReactModal__Content, +.duartion_model_dialog_wrapper .ReactModal__Content, +.confirm_stake_dialog_wrapper .ReactModal__Content { + width: 20%; } + +.stake_details_dialog_wrapper .ReactModal__Content { + width: 32%; } + +.dialog-mobile-content .stake_detail_line { + width: 5%; + border-bottom: 1px solid var(--labels_secondary-inactive-label-text-graphics); } + +.dialog-mobile-content .stake_detail_text { + color: var(--labels_secondary-inactive-label-text-graphics); } + +.dialog-mobile-content .action_model_popup_wrapper { + display: flex; + flex-direction: column; + width: 100%; + height: auto; } + .dialog-mobile-content .action_model_popup_wrapper .action_model_popup_content { + height: 20rem; } + .dialog-mobile-content .action_model_popup_wrapper .action_model_content .action_model_header { + font-size: 18px; } + .dialog-mobile-content .action_model_popup_wrapper .action_model_content .action_model_agreement_wrapper { + overflow-y: scroll; } + .dialog-mobile-content .action_model_popup_wrapper .action_model_content .action_model_agreement_wrapper .action_model_agreement_content { + font-size: 13px; } + +.dialog-mobile-content .stake_popup_button_wrapper .stake_popup_button { + height: unset; } + +.dialog-mobile-content .stake_amount_popup_wrapper .stake_amount_theme { + height: 20rem; } + .dialog-mobile-content .stake_amount_popup_wrapper .stake_amount_theme h3 { + font-size: 20px; } + +.dialog-mobile-content .stake_amount_popup_wrapper .stake_amount_popup_content { + font-size: 13px; } + +.dialog-mobile-content .stake_duration_model_wrapper h1 { + font-size: 26px; } + +.dialog-mobile-content .stake_duration_model_wrapper .stake_text_header { + font-size: 14px; } + +.dialog-mobile-content .stake_duration_model_wrapper .stake_text { + font-size: 13px; } + +.dialog-mobile-content .stake_detail_popup_wrapper { + font-size: 13px; } + .dialog-mobile-content .stake_detail_popup_wrapper h1 { + font-size: 26px; } + +.dialog-mobile-content .confirm_stake_popup_wrapper h3 { + font-size: 20px; } + +.dialog-mobile-content .confirm_stake_popup_wrapper .confirm_stake_theme { + height: 20rem; } + +.dialog-mobile-content .confirm_stake_popup_wrapper .confirm_stake_content_wrapper { + font-size: 12px; } + .dialog-mobile-content .confirm_stake_popup_wrapper .confirm_stake_content_wrapper .confirm_stake_content { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + line-height: 20px; } + .dialog-mobile-content .confirm_stake_popup_wrapper .confirm_stake_content_wrapper .confirm_stake_content .rules_notice_text { + text-align: center; } + +.dialog-mobile-content .confirm_stake_popup_wrapper .stakepool_card_icon { + position: absolute; + margin-bottom: 2%; } + +.dialog-mobile-content .confirmation_model_popup_wrapper .confirmation_model_content { + font-size: 14px; } + .dialog-mobile-content .confirmation_model_popup_wrapper .confirmation_model_content .confirmation_amount_text { + font-size: 20px; } + .dialog-mobile-content .confirmation_model_popup_wrapper .confirmation_model_content .successful_stack_text { + font-size: 18px !important; } + .dialog-mobile-content .confirmation_model_popup_wrapper .confirmation_model_content .congrats_text { + font-weight: 700 !important; } + .dialog-mobile-content .confirmation_model_popup_wrapper .confirmation_model_content .confirmation_label { + font-size: 14px; + font-weight: normal; } + +.dialog-mobile-content .review_unstake_popup_wrapper, +.dialog-mobile-content .unstake_confirm_popup_wrapper { + align-items: start; + font-size: 14px; } + .dialog-mobile-content .review_unstake_popup_wrapper .review_unstake_content, + .dialog-mobile-content .review_unstake_popup_wrapper .unstake_confirm_content, + .dialog-mobile-content .unstake_confirm_popup_wrapper .review_unstake_content, + .dialog-mobile-content .unstake_confirm_popup_wrapper .unstake_confirm_content { + height: auto !important; } + .dialog-mobile-content .review_unstake_popup_wrapper .review_unstake_content h3, + .dialog-mobile-content .review_unstake_popup_wrapper .review_unstake_content h2, + .dialog-mobile-content .review_unstake_popup_wrapper .unstake_confirm_content h3, + .dialog-mobile-content .review_unstake_popup_wrapper .unstake_confirm_content h2, + .dialog-mobile-content .unstake_confirm_popup_wrapper .review_unstake_content h3, + .dialog-mobile-content .unstake_confirm_popup_wrapper .review_unstake_content h2, + .dialog-mobile-content .unstake_confirm_popup_wrapper .unstake_confirm_content h3, + .dialog-mobile-content .unstake_confirm_popup_wrapper .unstake_confirm_content h2 { + font-size: 24px; } + .dialog-mobile-content .review_unstake_popup_wrapper .review_unstake_content .unstake_header .unstaked-logo svg, + .dialog-mobile-content .review_unstake_popup_wrapper .unstake_confirm_content .unstake_header .unstaked-logo svg, + .dialog-mobile-content .unstake_confirm_popup_wrapper .review_unstake_content .unstake_header .unstaked-logo svg, + .dialog-mobile-content .unstake_confirm_popup_wrapper .unstake_confirm_content .unstake_header .unstaked-logo svg { + width: 6rem; + height: 6rem; } + +.stake_table_wrapper .stake-tabs { + width: 100%; + padding: 3%; } + .stake_table_wrapper .stake-tabs .stake-cefi-content-wrapper { + display: flex; + justify-content: space-between; + margin-bottom: 5%; + gap: 10px; } + .stake_table_wrapper .stake-tabs .stake-cefi-content-wrapper .stake-cefi-value { + width: 100%; + display: 'flex'; + justify-content: 'flex-end'; } + .stake_table_wrapper .stake-tabs .stakepool_card_wrapper { + display: flex; + justify-content: center; + flex-wrap: wrap; + gap: 15px; } + .stake_table_wrapper .stake-tabs .stakepool_card_wrapper .stakepool_card { + width: 35%; + padding: 2%; + display: flex; + justify-content: center; + flex-direction: column; + align-items: center; + border-top: 1px solid var(--specials_pending-waiting-caution); } + .stake_table_wrapper .stake-tabs .stakepool_card_wrapper .stakepool_card .stakepool_card_icon { + position: relative; + bottom: 40px; } + .stake_table_wrapper .stake-tabs .stakepool_card_wrapper .stakepool_card .stakepool_button { + margin-top: 20%; + background-color: var(--specials_buttons-links-and-highlights); + padding: 12%; + border-radius: 20px; + width: 12rem; + color: var(--labels_important-active-labels-text-graphics); + text-align: center; + display: flex; + justify-content: center; + align-items: center; + border: none; } + +.stake_table_wrapper .mystakes-tab { + width: 100%; + padding: 3%; } + .stake_table_wrapper .mystakes-tab .mystakes-content-wrapper { + display: flex; + justify-content: space-between; + margin-bottom: 5%; + gap: 10px; } + .stake_table_wrapper .mystakes-tab .mystakes-content-wrapper .estimated-total-stake { + width: 100%; + display: flex; + justify-content: flex-end; } + .stake_table_wrapper .mystakes-tab .mystakes-content-wrapper .total-estimated-stake { + margin-bottom: 20px; } + .stake_table_wrapper .mystakes-tab .mystakes-content-wrapper .stack-amount, + .stake_table_wrapper .mystakes-tab .mystakes-content-wrapper .stack-reward { + font-size: 18px; } + .stake_table_wrapper .mystakes-tab .tabOption { + margin-right: 5px; + padding: 10px; + border-radius: 10px; + cursor: pointer; } + .stake_table_wrapper .mystakes-tab .mystakes-table-wrapper table .duration-field { + display: flex; + flex-direction: row; + width: 100%; + gap: 10px; } + .stake_table_wrapper .mystakes-tab .mystakes-table-wrapper table .stake-status-field { + display: flex; + gap: 20px; } + .stake_table_wrapper .mystakes-tab .mystakes-table-wrapper table .stake-status-field .stake-status-content { + color: var(--specials_pending-waiting-caution); } + .stake_table_wrapper .mystakes-tab .mystakes-table-wrapper table .stake-status-field .stake-table-button { + background-color: var(--specials_buttons-links-and-highlights); } + +.layout-mobile .stake-wrapper .stake-tabs { + width: 100%; + padding: 4%; } + .layout-mobile .stake-wrapper .stake-tabs .stake-cefi-content-wrapper { + display: flex; + align-items: flex-start; + justify-content: space-between; + gap: 5%; + margin-bottom: 15%; } + +.layout-mobile .stake_table_wrapper .stake_table_theme .stakepool_card_wrapper .stakepool_card { + width: 100%; + height: 100%; + padding: 0 10% 10% 10%; } + .layout-mobile .stake_table_wrapper .stake_table_theme .stakepool_card_wrapper .stakepool_card .stakepool_card_icon { + bottom: 18px; } + +.layout-mobile .stake_table_wrapper .stake_table_theme .tabOption { + border: 1px solid var(--labels_important-active-labels-text-graphics); } + +.layout-mobile .mobileZoom { + zoom: 0.55; + position: relative; + left: 0 !important; } + .layout-mobile .mobileZoom .ant-table-content { + overflow-x: scroll; } + +.layout-mobile .mobileZoom .ant-table-thead > tr > th { + padding: 1rem 5rem; + font-size: 18px; } + .add-app-button { border-radius: 24px; height: 24px !important; @@ -7183,6 +7699,11 @@ table th { .layout-mobile .referral-list-wrapper .referral-popup-earning-wrapper .referral-label-mobile, .layout-mobile .referral-list-wrapper .referral-final-popup .referral-label-mobile { font-size: 14px; } + .layout-mobile .referral-list-wrapper .refer-code-popup-wrapper .new-referral-wrapper .new-referral-label, + .layout-mobile .referral-list-wrapper .referral-popup-earning-wrapper .new-referral-wrapper .new-referral-label, + .layout-mobile .referral-list-wrapper .referral-final-popup .new-referral-wrapper .new-referral-label { + font-size: 16px; + margin: 2% 0 3% 0%; } .layout-mobile .referral-list-wrapper .history-referral-container .referral-history-content { display: flex; flex-direction: row; @@ -7452,7 +7973,7 @@ table th { padding: 0.3rem 0; } .modal-market-menu .app-bar-add-tab-content .scroll-view { overflow-y: auto; - height: calc( 100vh - 19rem - 8rem); } + height: calc( 100vh - 19rem - 8rem); } .modal-market-menu .app-bar-tab-overflow-content { background-color: var(--base_background); color: var(--labels_secondary-inactive-label-text-graphics); @@ -9926,14 +10447,14 @@ table th { right: 0 !important; min-width: 100vw; max-width: 100vw; - min-height: calc( 100vh - 4rem); - max-height: calc( 100vh - 4rem); + min-height: calc( 100vh - 4rem); + max-height: calc( 100vh - 4rem); border-radius: 0 !important; padding: 0 !important; } .layout-mobile .ReactModal__Content .dialog-mobile-content { padding: 2.5rem !important; - min-height: calc( 100vh - 8rem); - max-height: calc( 100vh - 8rem); + min-height: calc( 100vh - 8rem); + max-height: calc( 100vh - 8rem); display: flex; } .layout-mobile.LogoutModal .ReactModal__Content { From efb7d17084a567cd09d8b5701df4459a7769fa88 Mon Sep 17 00:00:00 2001 From: ram Date: Mon, 24 Jun 2024 23:17:37 +0530 Subject: [PATCH 02/14] Updated the index.css --- web/src/index.css | 24 ++++++++++++------------ 1 file changed, 12 insertions(+), 12 deletions(-) diff --git a/web/src/index.css b/web/src/index.css index a8f9930283..6978973adb 100644 --- a/web/src/index.css +++ b/web/src/index.css @@ -377,8 +377,8 @@ table th { height: auto; flex: 1; } .app_container.layout-mobile .app_container-content { - min-height: calc( 100vh - 10rem); - max-height: calc( 100vh - 10rem); + min-height: calc( 100vh - 10rem); + max-height: calc( 100vh - 10rem); max-width: 100vw; overflow-y: scroll; } .app_container.layout-mobile .app_container-content.chart-embed { @@ -396,8 +396,8 @@ table th { .app_container.layout-mobile .app_container-content .app_container-main.no_bottom_navigation { height: 100%; } .app_container.layout-mobile .content-with-bar { - min-height: calc( 100vh - 17rem); - max-height: calc( 100vh - 17rem); + min-height: calc( 100vh - 17rem); + max-height: calc( 100vh - 17rem); max-width: 100vw; padding: 1rem; margin: 0; @@ -4324,8 +4324,8 @@ table th { .layout-mobile .quote-container { background-color: transparent; overflow-y: scroll; - min-height: calc( 100vh - 17rem); - max-height: calc( 100vh - 17rem); } + min-height: calc( 100vh - 17rem); + max-height: calc( 100vh - 17rem); } .layout-mobile .quote-container .quick_trade-wrapper { flex: 1 1; flex-direction: column; @@ -4498,7 +4498,7 @@ table th { .layout-mobile .presentation_container.verification_container { padding-top: 0 !important; - max-height: calc( 100vh - 10rem); } + max-height: calc( 100vh - 10rem); } .layout-mobile .presentation_container.verification_container .header-content { font-size: 13px !important; } @@ -7973,7 +7973,7 @@ table th { padding: 0.3rem 0; } .modal-market-menu .app-bar-add-tab-content .scroll-view { overflow-y: auto; - height: calc( 100vh - 19rem - 8rem); } + height: calc( 100vh - 19rem - 8rem); } .modal-market-menu .app-bar-tab-overflow-content { background-color: var(--base_background); color: var(--labels_secondary-inactive-label-text-graphics); @@ -10447,14 +10447,14 @@ table th { right: 0 !important; min-width: 100vw; max-width: 100vw; - min-height: calc( 100vh - 4rem); - max-height: calc( 100vh - 4rem); + min-height: calc( 100vh - 4rem); + max-height: calc( 100vh - 4rem); border-radius: 0 !important; padding: 0 !important; } .layout-mobile .ReactModal__Content .dialog-mobile-content { padding: 2.5rem !important; - min-height: calc( 100vh - 8rem); - max-height: calc( 100vh - 8rem); + min-height: calc( 100vh - 8rem); + max-height: calc( 100vh - 8rem); display: flex; } .layout-mobile.LogoutModal .ReactModal__Content { From 6fc9edbf9d89bdd5ed1c41ab8b5e58e83d31fcf8 Mon Sep 17 00:00:00 2001 From: fetok12 Date: Tue, 25 Jun 2024 02:58:17 +0300 Subject: [PATCH 03/14] p2p-feedback-6 --- .../utils/hollaex-tools-lib/tools/common.js | 9 + server/utils/hollaex-tools-lib/tools/p2p.js | 85 +++--- .../containers/Admin/Trades/p2pSettings.js | 33 ++- web/src/containers/P2P/P2PDash.js | 245 ++++++++++++++++- web/src/containers/P2P/P2POrder.js | 248 +++++++++++++++++- web/src/containers/P2P/P2PPostDeal.js | 16 +- 6 files changed, 582 insertions(+), 54 deletions(-) diff --git a/server/utils/hollaex-tools-lib/tools/common.js b/server/utils/hollaex-tools-lib/tools/common.js index 8a1ab99f8b..6f93ac17c5 100644 --- a/server/utils/hollaex-tools-lib/tools/common.js +++ b/server/utils/hollaex-tools-lib/tools/common.js @@ -390,6 +390,15 @@ const joinKitConfig = (existingKitConfig = {}, newKitConfig = {}) => { if (newKitConfig.p2p_config.user_fee == null) { throw new Error('buyer_fee cannot be null'); } + + const percentagePattern = /^(100(\.00?)?|(\d{1,2})(\.\d{1,2})?)$/; + + if (!percentagePattern.test(newKitConfig.p2p_config.merchant_fee)) { + throw new Error('merchant_fee must be in percentage format'); + } + if (!percentagePattern.test(newKitConfig.p2p_config.user_fee)) { + throw new Error('buyer_fee must be in percentage format'); + } } if (newKitConfig.referral_history_config) { diff --git a/server/utils/hollaex-tools-lib/tools/p2p.js b/server/utils/hollaex-tools-lib/tools/p2p.js index dd13c8ec47..6115387d50 100644 --- a/server/utils/hollaex-tools-lib/tools/p2p.js +++ b/server/utils/hollaex-tools-lib/tools/p2p.js @@ -202,7 +202,8 @@ const createP2PDeal = async (data) => { side, buying_asset, spending_asset, - margin, + spread, + exchange_rate, total_order_amount, min_order_value, max_order_value, @@ -221,40 +222,45 @@ const createP2PDeal = async (data) => { //Check Merhcant Tier if (p2pConfig.starting_merchant_tier > merchant.verification_level) { throw new Error('Your tier does not support creating P2P deals'); - } + }; if (!subscribedToCoin(spending_asset)) { throw new Error('Invalid coin ' + spending_asset); - } + }; if (!subscribedToCoin(buying_asset)) { throw new Error('Invalid coin ' + buying_asset); - } + }; const balance = await getP2PAccountBalance(merchant_id, buying_asset); - if(new BigNumber(balance).comparedTo(new BigNumber(total_order_amount)) !== 1) { + if (new BigNumber(balance).comparedTo(new BigNumber(total_order_amount)) !== 1) { throw new Error(FUNDING_ACCOUNT_INSUFFICIENT_BALANCE); - } - if(min_order_value < 0) { - throw new Error('cannot be less than 0'); - } + }; + + if (min_order_value < 0) { + throw new Error('min order alue cannot be less than 0'); + }; - if(max_order_value < 0) { + if (max_order_value < 0) { throw new Error('max order value cannot be less than 0'); - } + }; - if(min_order_value > max_order_value) { - throw new Error('min order value cannot be bigger than max'); - } + if (min_order_value > max_order_value) { + throw new Error('min order value cannot be bigger than max order value'); + }; - if (margin < 0) { - throw new Error('Margin cannot be less than 0'); - } + if (spread < 0) { + throw new Error('spread cannot be less than 0'); + }; + + if (exchange_rate < 0) { + throw new Error('exchange rate cannot be less than 0'); + }; if (side !== 'sell') { throw new Error('side can only be sell'); - } + }; data.status = true; @@ -287,7 +293,8 @@ const updateP2PDeal = async (data) => { side, buying_asset, spending_asset, - margin, + spread, + exchange_rate, total_order_amount, min_order_value, max_order_value, @@ -330,40 +337,44 @@ const updateP2PDeal = async (data) => { if (!subscribedToCoin(spending_asset)) { throw new Error('Invalid coin ' + spending_asset); - } + }; if (!subscribedToCoin(buying_asset)) { throw new Error('Invalid coin ' + buying_asset); - } + }; const balance = await getP2PAccountBalance(merchant_id, buying_asset); - if(new BigNumber(balance).comparedTo(new BigNumber(total_order_amount)) !== 1) { + if (new BigNumber(balance).comparedTo(new BigNumber(total_order_amount)) !== 1) { throw new Error(FUNDING_ACCOUNT_INSUFFICIENT_BALANCE); - } - if(min_order_value < 0) { - throw new Error('cannot be less than 0'); - } + }; + if (min_order_value < 0) { + throw new Error('min order alue cannot be less than 0'); + }; - if(max_order_value < 0) { - throw new Error('cannot be less than 0'); - } + if (max_order_value < 0) { + throw new Error('max order value cannot be less than 0'); + }; - if(min_order_value > max_order_value) { - throw new Error('cannot be bigger'); - } + if (min_order_value > max_order_value) { + throw new Error('min order value cannot be bigger than max order value'); + }; - if (margin < 0) { - throw new Error('Margin cannot be less than 0'); - } + if (spread < 0) { + throw new Error('spread cannot be less than 0'); + }; + + if (exchange_rate < 0) { + throw new Error('exchange rate cannot be less than 0'); + }; if (side !== 'sell') { throw new Error('side can only be sell'); - } + }; if (data.status == null) { data.status = true; - } + }; return p2pDeal.update(data, { fields: [ diff --git a/web/src/containers/Admin/Trades/p2pSettings.js b/web/src/containers/Admin/Trades/p2pSettings.js index 2be21e534a..341653c3bf 100644 --- a/web/src/containers/Admin/Trades/p2pSettings.js +++ b/web/src/containers/Admin/Trades/p2pSettings.js @@ -1226,7 +1226,7 @@ const P2PSettings = ({ coins, pairs, p2p_config, features }) => { )}
- {!p2p_config?.enable && ( + {p2pConfig?.side == null && (
{ {' '} {symbol?.toUpperCase()} + { + setFiatCurrencies( + [...fiatCurrencies].filter( + (x) => x !== symbol + ) + ); + }} + > + X +
); @@ -1497,6 +1515,7 @@ const P2PSettings = ({ coins, pairs, p2p_config, features }) => { className="select-box" placeholder="Select a tier level:" value={userTier} + style={{ width: 120 }} onChange={(e) => { setUserTier(e); }} @@ -1521,7 +1540,7 @@ const P2PSettings = ({ coins, pairs, p2p_config, features }) => { showSearch className="select-box" placeholder="Select a tier level:" - style={{ marginBottom: 40 }} + style={{ marginBottom: 40, width: 120 }} value={merchantTier} onChange={(e) => { setMerchantTier(e); @@ -1802,7 +1821,7 @@ const P2PSettings = ({ coins, pairs, p2p_config, features }) => {
{ - setStep(0); + setStep(1); }} style={{ cursor: 'pointer' }} > @@ -1832,7 +1851,7 @@ const P2PSettings = ({ coins, pairs, p2p_config, features }) => {
{ - setStep(0); + setStep(3); }} style={{ cursor: 'pointer' }} > @@ -1858,7 +1877,7 @@ const P2PSettings = ({ coins, pairs, p2p_config, features }) => {
{ - setStep(0); + setStep(4); }} style={{ cursor: 'pointer' }} > @@ -1884,7 +1903,7 @@ const P2PSettings = ({ coins, pairs, p2p_config, features }) => {
{ - setStep(0); + setStep(4); }} style={{ cursor: 'pointer' }} > @@ -1910,7 +1929,7 @@ const P2PSettings = ({ coins, pairs, p2p_config, features }) => {
{ - setStep(0); + setStep(4); }} style={{ cursor: 'pointer' }} > diff --git a/web/src/containers/P2P/P2PDash.js b/web/src/containers/P2P/P2PDash.js index 92bb973184..f9738df305 100644 --- a/web/src/containers/P2P/P2PDash.js +++ b/web/src/containers/P2P/P2PDash.js @@ -5,7 +5,7 @@ import { ReactSVG } from 'react-svg'; import { Switch, message } from 'antd'; import { IconTitle, EditWrapper, Coin } from 'components'; import STRINGS from 'config/localizedStrings'; -import { Button, Select, Input, InputNumber } from 'antd'; +import { Button, Select, Input, InputNumber, Modal, Rate } from 'antd'; // import { Link } from 'react-router'; import withConfig from 'components/ConfigProvider/withConfig'; import { @@ -17,6 +17,8 @@ import { COUNTRIES_OPTIONS } from 'utils/countries'; import { formatToCurrency } from 'utils/currency'; import { isMobile } from 'react-device-detect'; import classnames from 'classnames'; +import { CloseOutlined } from '@ant-design/icons'; +import { fetchFeedback, fetchP2PProfile } from './actions/p2pActions'; import './_P2P.scss'; const P2PDash = ({ @@ -48,6 +50,10 @@ const P2PDash = ({ const [filterMethod, setFilterMethod] = useState(); const [methods, setMethods] = useState([]); const [loading, setLoading] = useState(false); + const [displayUserFeedback, setDisplayUserFeedback] = useState(false); + const [userFeedback, setUserFeedback] = useState([]); + const [userProfile, setUserProfile] = useState(); + const [selectedProfile, setSelectedProfile] = useState(); const inputRef = useRef(null); useEffect(() => { fetchDeals({ status: true }) @@ -89,6 +95,222 @@ const P2PDash = ({ padding: 20, }} > + {displayUserFeedback && ( + } + className="stake_table_theme stake_theme" + bodyStyle={{}} + visible={displayUserFeedback} + width={500} + footer={null} + onCancel={() => { + setDisplayUserFeedback(false); + }} + > +
+
+

+ {selectedProfile?.full_name || ( + + {STRINGS['P2P.ANONYMOUS']} + + )} + {` `}( + + {STRINGS['P2P.TAB_PROFILE']} + + ) +

+ +
+
+
+
+
+ + {STRINGS['P2P.TOTAL_ORDERS']} + +
+
+ {userProfile?.totalTransactions} times +
+
+
+
+ + {STRINGS['P2P.COMPLETION_RATE']} + +
+
+ {(userProfile?.completionRate || 0).toFixed(2)}% +
+
+
+
+ + {STRINGS['P2P.POSITIVE_FEEDBACK']} + +
+
+ {(userProfile?.positiveFeedbackRate || 0).toFixed(2)}% +
+
+ + {STRINGS['P2P.POSITIVE']} + {' '} + {userProfile?.positiveFeedbackCount} /{' '} + + {STRINGS['P2P.NEGATIVE']} + {' '} + {userProfile?.negativeFeedbackCount} +
+
+
+
+ +
+ Feedback({userFeedback.length || 0}) +
+ {userFeedback.length == 0 ? ( +
+ + {STRINGS['P2P.NO_FEEDBACK']} + +
+ ) : ( +
+ + + + + + + + {userFeedback.map((deal) => { + return ( + + + + + ); + })} + +
+ + {STRINGS['P2P.COMMENT']} + + + + {STRINGS['P2P.RATING']} + +
+ {deal.comment} + + +
+ )} +
+
+
+ + )} + {/*
- {STRINGS['P2P.AMOUNT']} + {STRINGS['P2P.AMOUNT']}(Fiat)
{ - changeProfileTab(deal.merchant); + onClick={async () => { + // changeProfileTab(deal.merchant); + + try { + setSelectedProfile(deal.merchant); + const feedbacks = await fetchFeedback({ + merchant_id: deal.merchant.id, + }); + const profile = await fetchP2PProfile({ + user_id: deal.merchant.id, + }); + setUserFeedback(feedbacks.data); + setUserProfile(profile); + setDisplayUserFeedback(true); + } catch (error) { + return error; + } }} style={{ position: 'relative', diff --git a/web/src/containers/P2P/P2POrder.js b/web/src/containers/P2P/P2POrder.js index dd554ce19c..5e6bec4037 100644 --- a/web/src/containers/P2P/P2POrder.js +++ b/web/src/containers/P2P/P2POrder.js @@ -14,6 +14,7 @@ import { updateTransaction, createFeedback, fetchFeedback, + fetchP2PProfile, } from './actions/p2pActions'; import { withRouter } from 'react-router'; import { formatToCurrency } from 'utils/currency'; @@ -56,6 +57,10 @@ const P2POrder = ({ const [displayCancelWarning, setDisplayCancelWarning] = useState(); const [displayConfirmWarning, setDisplayConfirmWarning] = useState(); const [lastClickTime, setLastClickTime] = useState(0); + const [displayUserFeedback, setDisplayUserFeedback] = useState(false); + const [userFeedback, setUserFeedback] = useState([]); + const [userProfile, setUserProfile] = useState(); + const [selectedProfile, setSelectedProfile] = useState(); const ref = useRef(null); const buttonRef = useRef(null); @@ -372,6 +377,222 @@ const P2POrder = ({
+ {displayUserFeedback && ( + } + className="stake_table_theme stake_theme" + bodyStyle={{}} + visible={displayUserFeedback} + width={500} + footer={null} + onCancel={() => { + setDisplayUserFeedback(false); + }} + > +
+
+

+ {selectedProfile?.full_name || ( + + {STRINGS['P2P.ANONYMOUS']} + + )} + {` `}( + + {STRINGS['P2P.TAB_PROFILE']} + + ) +

+ +
+
+
+
+
+ + {STRINGS['P2P.TOTAL_ORDERS']} + +
+
+ {userProfile?.totalTransactions} times +
+
+
+
+ + {STRINGS['P2P.COMPLETION_RATE']} + +
+
+ {(userProfile?.completionRate || 0).toFixed(2)}% +
+
+
+
+ + {STRINGS['P2P.POSITIVE_FEEDBACK']} + +
+
+ {(userProfile?.positiveFeedbackRate || 0).toFixed(2)}% +
+
+ + {STRINGS['P2P.POSITIVE']} + {' '} + {userProfile?.positiveFeedbackCount} /{' '} + + {STRINGS['P2P.NEGATIVE']} + {' '} + {userProfile?.negativeFeedbackCount} +
+
+
+
+ +
+ Feedback({userFeedback.length || 0}) +
+ {userFeedback.length == 0 ? ( +
+ + {STRINGS['P2P.NO_FEEDBACK']} + +
+ ) : ( + + + + + + + + + {userFeedback.map((deal) => { + return ( + + + + + ); + })} + +
+ + {STRINGS['P2P.COMMENT']} + + + + {STRINGS['P2P.RATING']} + +
+ {deal.comment} + + +
+ )} +
+
+
+ + )} + {displayFeedbackModal && ( -
+
{ + try { + if (user.id === selectedOrder?.merchant_id) return; + setSelectedProfile(selectedOrder?.merchant); + const feedbacks = await fetchFeedback({ + merchant_id: selectedOrder?.merchant_id, + }); + const profile = await fetchP2PProfile({ + user_id: selectedOrder?.merchant_id, + }); + setUserFeedback(feedbacks.data); + setUserProfile(profile); + setDisplayUserFeedback(true); + } catch (error) { + return error; + } + }} + > {user.id === selectedOrder?.merchant_id ? ( {STRINGS['P2P.USER_NAME']} @@ -1564,6 +1804,12 @@ const P2POrder = ({
{ setChatMessage(e.target.value); }} diff --git a/web/src/containers/P2P/P2PPostDeal.js b/web/src/containers/P2P/P2PPostDeal.js index b6b1d14a6e..02023a7002 100644 --- a/web/src/containers/P2P/P2PPostDeal.js +++ b/web/src/containers/P2P/P2PPostDeal.js @@ -6,7 +6,7 @@ import { Button, Steps, message, Modal } from 'antd'; import { IconTitle, EditWrapper } from 'components'; import STRINGS from 'config/localizedStrings'; import withConfig from 'components/ConfigProvider/withConfig'; -import { Switch, Select, Input } from 'antd'; +import { Switch, Select, Input, InputNumber } from 'antd'; import { postDeal, editDeal } from './actions/p2pActions'; import { CloseOutlined } from '@ant-design/icons'; import { formatToCurrency } from 'utils/currency'; @@ -281,12 +281,15 @@ const P2PPostDeal = ({ : ''}
- { if (!buyingAsset) return; - setExchangeRate(e.target.value); + if (isNaN(e)) return; + if (e >= 0) { + setExchangeRate(e); + } }} />
@@ -298,11 +301,14 @@ const P2PPostDeal = ({
- { - setSpread(e.target.value); + if (isNaN(e)) return; + if (e >= 0) { + setSpread(e); + } }} />
From 81714a53f61297ea3066fd465f91e302f3f3c83e Mon Sep 17 00:00:00 2001 From: ram Date: Tue, 25 Jun 2024 22:20:40 +0530 Subject: [PATCH 04/14] Updated the stake page web and mobile view --- web/src/config/lang/en.json | 24 +- web/src/containers/Stake/CeFiStake.scss | 155 ++++- web/src/containers/Stake/DesktopStake.js | 16 +- web/src/containers/Stake/MobileStake.js | 4 +- web/src/containers/Stake/_Stake.scss | 3 + .../Stake/components/CeFiUserStake.js | 629 ++++++++++-------- web/src/index.css | 169 ++++- 7 files changed, 678 insertions(+), 322 deletions(-) diff --git a/web/src/config/lang/en.json b/web/src/config/lang/en.json index 508e540ceb..6f0563b874 100644 --- a/web/src/config/lang/en.json +++ b/web/src/config/lang/en.json @@ -801,6 +801,9 @@ "PROMPT": "You must install Metamask into your browser: {0}" }, "INSTALL_METAMASK_TITLE": "MetaMask not detected", + "EARN_REWARD": "Earn rewards for staking your digital assets", + "DEFI_STAKING": "DeFi Staking", + "CEFI_STAKING": "CeFi Staking", "REWARDS": { "0": { "CARD": "Earn rewards (no bonuses)", "TEXT": "regular rewards." }, "1": { @@ -922,7 +925,7 @@ "LOCKUP_DURATION_LABEL": "Lock up duration", "PENALTY_UPON_INITIAL_STAKE_PRINCIPLE": "Penalty upon initial stake principle", "FORFEITURE_OF_EARNINGS_LABEL": "Forfeiture of earnings", - "SLASHING_RULES_ENFORCED_LABEL": "! Slashing rules are enforced in this pool", + "SLASHING_RULES_ENFORCED_LABEL": "Slashing rules are enforced in this pool", "SLASHING_RULES_NOTICE": "Keep in mind that opting to withdraw your funds prior to the designated duration will incur a penalty, as outlined in the slashing rules mentioned above. Prior to committing to a staking period, it's crucial to assess your financial stability, as initiating an early unstaking process could lead to a decrease in the overall value of your initial stake.", "UNSTAKE_ANYTIME_LABEL": "This pool allows you to unstake at anytime without consequence.", "FULL_DURATION_LOCK_LABEL": "This pool locks you in for the full duration. Please consider your financial sustainability before committing to the staking pool as unstaking before the term will not be possible.", @@ -949,7 +952,24 @@ "REQUIRES_24H_TO_SETTLE_NOTICE": "Requires 24 hours to settle", "SUCCESSFUL_UNSTAKE_NOTICE": "You've successfully unstaked", "VISIT_WALLET_BUTTON": "VISIT WALLET", - "CLOSE_BUTTON": "CLOSE" + "CLOSE_BUTTON": "CLOSE", + "STAKING": "Staking 101", + "SLASHING": "Slashing", + "MINIMUM_AMOUNT_ALLOWED": "Staking pool's minimum amount allowed is", + "MAXIMUM_AMOUNT_ALLOWED": "Staking pool's maximum amount allowed is", + "DAYS": "Days", + "CONFIRM_STAKE_DECS": "Here we go!", + "DO_YOU_UNDERSTAND": "Do you understand?", + "SUCCESSFULLY_STAKED_IN": "Successfully staked in", + "SUCCESSFULLY_STAKED": "Successfully staked", + "VIEW_ACTIVE_STAKES": "VIEW ACTIVE STAKES", + "REVIEW_AND_UNSTAKE": "Review and unstake", + "NO_REWARD": "No reward amount to receive", + "SUCCESSFULLY_UNSTAKED": "You've successfully unstaked", + "MIN": "Min", + "UNSTAKING": "UNSTAKING...", + "UNSTAKED": "UNSTAKED", + "TOOLTIP": "The penalty you will incur if you unstake too early. {0}" }, "MOVE_XHT": { "TITLE": "Move XHT", diff --git a/web/src/containers/Stake/CeFiStake.scss b/web/src/containers/Stake/CeFiStake.scss index e736c038a5..330dcfd99e 100644 --- a/web/src/containers/Stake/CeFiStake.scss +++ b/web/src/containers/Stake/CeFiStake.scss @@ -74,6 +74,11 @@ } .stake_table_theme { + .ReactModal__Content { + .action_notification-wrapper { + margin: 0.5rem 0.5rem 0 0 !important; + } + } .stake_detail_text { color: var(--labels_secondary-inactive-label-text-graphics); } @@ -106,7 +111,7 @@ .stake_popup_button { width: 100%; background-color: var(--specials_buttons-links-and-highlights); - color: var(--labels_important-active-labels-text-graphics); + color: var(--calculated_base_footer_text); height: 3rem; border: none; } @@ -160,20 +165,51 @@ } .confirm_stake_content_wrapper { + .confirm_stake_content { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + line-height: 20px; + .rules_notice_text { + text-align: center; + } + } .confirm_stake_field { margin-bottom: 3% !important; } } + + .stakepool_card_icon { + position: absolute; + } } .stake_duration_model_wrapper { + .tooltip_icon_wrapper { + height: 1.2rem; + width: 1.2rem; + position: relative; + top: 0rem; + margin: 0 0.6rem; + } .danger_message_wrapper, .success_message_wrapper, .warning_message_wrapper { - padding: 5%; + padding: 3%; background-color: var(--highcharts-negative-color); margin: 5% 0 8%; font-size: 12px; + display: flex; + align-items: flex-start; + gap: 10px; + .checked-icon, + .danger-icon { + svg { + width: 2rem; + height: 1.5rem; + } + } } .success_message_wrapper { @@ -224,12 +260,40 @@ display: flex; justify-content: center; flex-direction: column; - height: 12rem; .unstake_header { display: flex; align-items: center; gap: 10px; } + .time_remaining_progress_content { + display: flex; + gap: 10px; + .duration-field { + width: 100%; + .ant-progress-inner { + height: 1rem; + border-radius: unset; + } + .ant-progress-bg { + height: 100% !important; + border-radius: 0; + background-color: var( + --specials_pending-waiting-caution + ) !important; + } + .action_notification-svg { + margin-top: 0.2rem; + margin-left: 0.5rem; + svg { + width: 1rem; + height: 1rem; + background-color: var(--specials_pending-waiting-caution); + border-radius: 1rem; + padding: 2px; + } + } + } + } } .review_unstack_wrapper { display: flex; @@ -246,21 +310,22 @@ .terms_condition_dialog_wrapper { .ReactModal__Content { - width: 35%; + width: 50%; + .anticon-close { + font-size: 20px !important; + } } } .stake_amount_dialog, .duartion_model_dialog_wrapper, -.confirm_stake_dialog_wrapper { - .ReactModal__Content { - width: 20%; - } -} - +.confirm_stake_dialog_wrapper, .stake_details_dialog_wrapper { .ReactModal__Content { - width: 32%; + width: 30%; + .anticon-close { + font-size: 20px !important; + } } } @@ -319,6 +384,21 @@ .stake_text { font-size: 13px; } + .tooltip_icon_wrapper { + height: 1.5rem; + width: 1.5rem; + } + .danger_message_wrapper, + .success_message_wrapper, + .warning_message_wrapper { + .checked-icon, + .danger-icon { + svg { + width: 2rem; + height: 2rem; + } + } + } } .stake_detail_popup_wrapper { font-size: 13px; @@ -335,19 +415,8 @@ } .confirm_stake_content_wrapper { font-size: 12px; - .confirm_stake_content { - display: flex; - flex-direction: column; - justify-content: center; - align-items: center; - line-height: 20px; - .rules_notice_text { - text-align: center; - } - } } .stakepool_card_icon { - position: absolute; margin-bottom: 2%; } } @@ -388,6 +457,23 @@ } } } + .time_remaining_progress_content { + display: flex; + gap: 10px; + .duration-field { + width: 100%; + .ant-progress-inner { + height: 2rem; + } + .action_notification-svg { + margin-top: 0.5rem; + svg { + width: 2rem; + height: 2rem; + } + } + } + } } } } @@ -396,12 +482,13 @@ .stake-tabs { width: 100%; padding: 3%; + background-color: var(--base_wallet-sidebar-and-popup); .stake-cefi-content-wrapper { display: flex; justify-content: space-between; margin-bottom: 5%; - gap: 10px; + gap: 2%; .stake-cefi-value { width: 100%; @@ -436,7 +523,7 @@ padding: 12%; border-radius: 20px; width: 12rem; - color: var(--labels_important-active-labels-text-graphics); + color: var(--calculated_base_footer_text); text-align: center; display: flex; justify-content: center; @@ -450,6 +537,7 @@ .mystakes-tab { width: 100%; padding: 3%; + background-color: var(--base_wallet-sidebar-and-popup); .mystakes-content-wrapper { display: flex; @@ -475,9 +563,10 @@ .tabOption { margin-right: 5px; - padding: 10px; + padding: 6px; border-radius: 10px; cursor: pointer; + border: 1px solid var(--calculated_important-border); } .mystakes-table-wrapper { @@ -557,3 +646,19 @@ font-size: 18px; } } + +@media screen and (min-width: 1920px) { + .terms_condition_dialog_wrapper { + .ReactModal__Content { + width: 35%; + } + } + + .stake_amount_dialog, + .duartion_model_dialog_wrapper, + .confirm_stake_dialog_wrapper { + .ReactModal__Content { + width: 20%; + } + } +} diff --git a/web/src/containers/Stake/DesktopStake.js b/web/src/containers/Stake/DesktopStake.js index 2d6abfcd06..8da29546bd 100644 --- a/web/src/containers/Stake/DesktopStake.js +++ b/web/src/containers/Stake/DesktopStake.js @@ -287,8 +287,16 @@ class Stake extends Component {
)} -

Stake

-
Earn rewards for staking your digital assets
+

+ + {STRINGS['STAKE.TITLE']} + +

+
+ + {STRINGS['STAKE.EARN_REWARD']} + +
@@ -307,7 +315,7 @@ class Stake extends Component { }); }} > - DeFi Staking + {STRINGS['STAKE.DEFI_STAKING']} - CeFi Staking + {STRINGS['STAKE.CEFI_STAKING']}
)} diff --git a/web/src/containers/Stake/MobileStake.js b/web/src/containers/Stake/MobileStake.js index 89aabc9d83..b8879afde5 100644 --- a/web/src/containers/Stake/MobileStake.js +++ b/web/src/containers/Stake/MobileStake.js @@ -71,7 +71,7 @@ class Stake extends Component { }); }} > - DeFi Staking + {STRINGS['STAKE.DEFI_STAKING']} - CeFi Staking + {STRINGS['STAKE.CEFI_STAKING']}
)} diff --git a/web/src/containers/Stake/_Stake.scss b/web/src/containers/Stake/_Stake.scss index af26663cfc..205996df1d 100644 --- a/web/src/containers/Stake/_Stake.scss +++ b/web/src/containers/Stake/_Stake.scss @@ -17,6 +17,9 @@ height: 40px; margin-bottom: 10px; } + .stake_header { + color: var(--labels_important-active-labels-text-graphics); + } .stake-button-wrapper { margin: 2% 0; display: flex; diff --git a/web/src/containers/Stake/components/CeFiUserStake.js b/web/src/containers/Stake/components/CeFiUserStake.js index 8a354211ff..7c90f14fb0 100644 --- a/web/src/containers/Stake/components/CeFiUserStake.js +++ b/web/src/containers/Stake/components/CeFiUserStake.js @@ -1,5 +1,6 @@ import React, { useState, useEffect } from 'react'; - +import { Link } from 'react-router'; +import { isMobile } from 'react-device-detect'; import { Button as AntBtn, Tabs, @@ -9,6 +10,7 @@ import { message, Progress, } from 'antd'; +import { CheckCircleFilled, WarningFilled } from '@ant-design/icons'; import { requestUserStakePools, @@ -17,16 +19,14 @@ import { deleteStaker, getSlashEstimate, } from 'containers/Admin/Stakes/actions'; -import moment from 'moment'; -import BigNumber from 'bignumber.js'; -import { Link } from 'react-router'; -import classnames from 'classnames'; -import { isMobile } from 'react-device-detect'; -import STRINGS from 'config/localizedStrings'; import { formatToCurrency } from 'utils/currency'; import '../CeFiStake.scss'; -import { Dialog, Image, NotLoggedIn } from 'components'; +import { Dialog, Help, Image, NotLoggedIn } from 'components'; import { EditWrapper } from 'components'; +import moment from 'moment'; +import BigNumber from 'bignumber.js'; +import STRINGS from 'config/localizedStrings'; +import classnames from 'classnames'; import icons from 'config/icons/dark'; const TabPane = Tabs.TabPane; @@ -115,7 +115,10 @@ const CeFiUserStake = ({ balance, coins, theme }) => { showInfo={false} />
-
{data?.stake?.duration} days
+
+ {data?.stake?.duration}{' '} + {STRINGS['CEFI_STAKE.DAYS'].toLowerCase()} +
) : ( '∞ Perpetual' @@ -180,10 +183,10 @@ const CeFiUserStake = ({ balance, coins, theme }) => {
{data.status === 'unstaking' ? ( - UNSTAKING... + {STRINGS['CEFI_STAKE.UNSTAKING']} ) : data.status === 'closed' ? ( - 'UNSTAKED' + {STRINGS['CEFI_STAKE.UNSTAKED']} ) : ( { className="ant-btn green-btn ant-tooltip-open ant-btn-primary stake_theme stake-table-button" > {data.stake.early_unstake && - calculateRemainingDays(data?.stake?.duration, data.created_at) - ? 'UNSTAKE EARLY' - : 'UNSTAKE'} + calculateRemainingDays( + data?.stake?.duration, + data.created_at + ) ? ( + {STRINGS['UNSTAKE.EARLY_TITLE'].toUpperCase()} + ) : ( + {STRINGS['UNSTAKE.TITLE'].toUpperCase()} + )} )}
@@ -305,13 +313,15 @@ const CeFiUserStake = ({ balance, coins, theme }) => { >
-

Staking 101

+

+ + {STRINGS['CEFI_STAKE.STAKING']} + +

{STRINGS['CEFI_STAKE.READ_BEFORE_AGREE_AND_EARN']}

@@ -320,11 +330,11 @@ const CeFiUserStake = ({ balance, coins, theme }) => { >
{STRINGS['CEFI_STAKE.AGREEMENT_INTRODUCTION_1']}{' '} - + {STRINGS['CEFI_STAKE.AGREEMENT_INTRODUCTION_2']} {' '} {STRINGS['CEFI_STAKE.AGREEMENT_INTRODUCTION_3']} @@ -373,26 +383,32 @@ const CeFiUserStake = ({ balance, coins, theme }) => {

{selectedPool.name}

-
-
APY: {selectedPool.apy}%
+
+ + {STRINGS['CEFI_STAKE.APY_LABEL']}: + {selectedPool.apy}% + +
- - {selectedPool.currency.toUpperCase()} available: + + + {selectedPool.currency.toUpperCase()} + {STRINGS['P2P.AVAILABLE']}: + {' '} {balance[`${selectedPool.currency}_available`]}
- - {STRINGS['CEFI_STAKE.AMOUNT_TO_STAKE_LABEL']}: - + {STRINGS['CEFI_STAKE.AMOUNT_TO_STAKE_LABEL']}:
{ setStakerAmount(e.target.value); }} @@ -437,7 +453,7 @@ const CeFiUserStake = ({ balance, coins, theme }) => { onClick={async () => { if (stakerAmount < selectedPool.min_amount) { message.error( - `Staking pool's minimum amount allowed is ${ + `${STRINGS['CEFI_STAKE.MINIMUM_AMOUNT_ALLOWED']} ${ selectedPool.min_amount } ${selectedPool.currency.toUpperCase()}` ); @@ -446,7 +462,7 @@ const CeFiUserStake = ({ balance, coins, theme }) => { if (stakerAmount > selectedPool.max_amount) { message.error( - `Staking pool's maximum amount allowed is ${ + `${STRINGS['CEFI_STAKE.MAXIMUM_AMOUNT_ALLOWED']} ${ selectedPool.max_amount } ${selectedPool.currency.toUpperCase()} ` ); @@ -492,15 +508,32 @@ const CeFiUserStake = ({ balance, coins, theme }) => { {STRINGS['CEFI_STAKE.LOCKUP_DURATION_LABEL']}:{' '} {selectedPool.duration - ? `${selectedPool.duration} days` + ? `${selectedPool.duration} ${STRINGS[ + 'CEFI_STAKE.DAYS' + ].toLowerCase()}` : 'Perpetual'}
-
- {selectedPool.slashing && ( <> -

Slashing

+

+ + {STRINGS['CEFI_STAKE.SLASHING']} + + + {STRINGS['TRADE_POSTS.LEARN_MORE']} + +

+ )} + > +
+ + +
{ STRINGS[ @@ -521,20 +554,27 @@ const CeFiUserStake = ({ balance, coins, theme }) => {
)} - {selectedPool.slashing && (
-
{STRINGS['CEFI_STAKE.SLASHING_RULES_ENFORCED_LABEL']}
-
{STRINGS['CEFI_STAKE.SLASHING_RULES_NOTICE']}
+
+ +
+
+
+ {STRINGS['CEFI_STAKE.SLASHING_RULES_ENFORCED_LABEL']} +
+
{STRINGS['CEFI_STAKE.SLASHING_RULES_NOTICE']}
+
)} - {!selectedPool.duration && (
+
+ +
{STRINGS['CEFI_STAKE.UNSTAKE_ANYTIME_LABEL']}
)} - {selectedPool.duration && !selectedPool.early_unstake ? (
{STRINGS['CEFI_STAKE.FULL_DURATION_LOCK_LABEL']}
@@ -591,14 +631,18 @@ const CeFiUserStake = ({ balance, coins, theme }) => {
{STRINGS['CEFI_STAKE.ANNUAL_PERCENTAGE_YIELD_LABEL']}: - {' '} - {selectedPool.apy}% APY + + {' '} + {selectedPool.apy}% + {STRINGS['CEFI_STAKE.APY_LABEL']} +
{STRINGS['CEFI_STAKE.DURATION_LABEL']}:{' '} - {selectedPool.duration} days{' '} + {selectedPool.duration}{' '} + {STRINGS['CEFI_STAKE.DAYS'].toLowerCase()}{' '}
@@ -621,8 +665,7 @@ const CeFiUserStake = ({ balance, coins, theme }) => { {stakerAmount} {selectedPool.currency.toUpperCase()}
-
- {isMobile &&
} +
{selectedPool.disclaimer}
@@ -675,31 +718,38 @@ const CeFiUserStake = ({ balance, coins, theme }) => {

- {STRINGS['CEFI_STAKE.CONFIRM_BUTTON']}{' '} - {selectedPool.currency.toUpperCase()} Stake + + {STRINGS['CEFI_STAKE.CONFIRM_BUTTON']}{' '} + {selectedPool.currency.toUpperCase()} + + {' '} + {STRINGS['STAKE_LIST.STAKE'].toLowerCase()} + +

- {isMobile && - stakePools - .filter((pool) => pool.status === 'active' && pool.onboarding) - .map((pool) => { - return ( -
- -
- ); - })} + {stakePools + .filter((pool) => pool.status === 'active' && pool.onboarding) + .map((pool) => { + return ( +
+ +
+ ); + })}
-
+
- - Here we go!{' '} - + + + {STRINGS['CEFI_STAKE.CONFIRM_STAKE_DECS']}{' '} + +
{STRINGS['CEFI_STAKE.STAKE_RULES_NOTICE']} @@ -707,12 +757,12 @@ const CeFiUserStake = ({ balance, coins, theme }) => {
{' '} - Do you understand? + {STRINGS['CEFI_STAKE.DO_YOU_UNDERSTAND']}
setConfirmText(e.target.value)} value={confirmText} /> @@ -743,7 +793,9 @@ const CeFiUserStake = ({ balance, coins, theme }) => { stake_id: selectedPool.id, amount: Number(stakerAmount), }); - message.success(`Successfuly staked in ${selectedPool.name}`); + message.success( + `${STRINGS['CEFI_STAKE.SUCCESSFULLY_STAKED_IN']} ${selectedPool.name}` + ); } catch (error) { message.error(error.response.data.message); return; @@ -766,7 +818,8 @@ const CeFiUserStake = ({ balance, coins, theme }) => { disabled={confirmText !== 'I UNDERSTAND'} type="default" > - I UNDERSTAND, STAKE + {STRINGS['CEFI_STAKE.I_UNDERSTAND_BUTTON']},{' '} + {STRINGS['STAKE.TITLE'].toUpperCase()}
@@ -786,25 +839,26 @@ const CeFiUserStake = ({ balance, coins, theme }) => { >
- {isMobile && - stakePools - .filter((pool) => pool.status === 'active' && pool.onboarding) - .map((pool) => { - return ( -
- -
- ); - })} + {stakePools + .filter((pool) => pool.status === 'active' && pool.onboarding) + .map((pool) => { + return ( +
+ +
+ ); + })}

{stakerAmount} {selectedPool.currency.toUpperCase()}

-
Successfully staked
+
+ {STRINGS['CEFI_STAKE.SUCCESSFULLY_STAKED']} +
{STRINGS['CEFI_STAKE.CONGRATULATIONS_NOTICE']} @@ -854,7 +908,7 @@ const CeFiUserStake = ({ balance, coins, theme }) => { }} type="default" > - VIEW ACTIVE STAKES + {STRINGS['CEFI_STAKE.VIEW_ACTIVE_STAKES']}
@@ -874,85 +928,122 @@ const CeFiUserStake = ({ balance, coins, theme }) => { >
-

Review and unstake

- {isMobile && ( -
- {isMobile && - stakePools - .filter( - (pool) => pool.status === 'active' && pool.onboarding - ) - .map((pool) => { - return ( -
- -
- ); - })} -
-
- - {STRINGS['UNSTAKE.AMOUNT_TO_RECEIVE']}: - {' '} - - {selectedStaker.reward_currency - ? selectedStaker.reward > 0 - ? `${roundToIncrementUnit( - new BigNumber(selectedStaker.reward) - .minus( - new BigNumber( - selectedStaker.slashedValues.slashingEarning - ) - ) - .toNumber(), - selectedStaker.reward_currency - )} ${selectedStaker.reward_currency.toUpperCase()}` - : 'No reward amount to receive' - : `${new BigNumber(selectedStaker.amount) +

+ + {STRINGS['CEFI_STAKE.REVIEW_AND_UNSTAKE']} + +

+
+ {stakePools + .filter((pool) => pool.status === 'active' && pool.onboarding) + .map((pool) => { + return ( +
+ +
+ ); + })} +
+
+ + {STRINGS['UNSTAKE.AMOUNT_TO_RECEIVE']}: + {' '} + + {selectedStaker.reward_currency ? ( + selectedStaker.reward > 0 ? ( + `${roundToIncrementUnit( + new BigNumber(selectedStaker.reward) .minus( new BigNumber( - selectedStaker.slashedValues.slashingPrinciple + selectedStaker.slashedValues.slashingEarning ) ) - .plus( - new BigNumber(selectedStaker.reward).minus( - new BigNumber( - selectedStaker.slashedValues.slashingEarning - ) - ) + .toNumber(), + selectedStaker.reward_currency + )} ${selectedStaker.reward_currency.toUpperCase()}` + ) : ( + {STRINGS['CEFI_STAKE.NO_REWARD']} + ) + ) : ( + `${new BigNumber(selectedStaker.amount) + .minus( + new BigNumber( + selectedStaker.slashedValues.slashingPrinciple + ) + ) + .plus( + new BigNumber(selectedStaker.reward).minus( + new BigNumber( + selectedStaker.slashedValues.slashingEarning ) - .toNumber()} ${selectedStaker.currency.toUpperCase()}`} - -
- - ({STRINGS['CEFI_STAKE.REQUIRES_24H_TO_SETTLE_NOTICE']}) + ) + ) + .toNumber()} ${selectedStaker.currency.toUpperCase()}` + )}
+ + ({STRINGS['CEFI_STAKE.REQUIRES_24H_TO_SETTLE_NOTICE']}) +
- )} -
+
+
{STRINGS['CEFI_STAKE.TIME_REMAINING_LABEL']}:{' '} - - {selectedStaker?.stake?.duration ? ( - <> - {calculateRemainingDays( - selectedStaker?.stake?.duration, - selectedStaker.created_at - )}{' '} - days ( - {selectedStaker?.stake?.duration && - formatDate(selectedStaker?.closing)} - ) - - ) : ( - 'Perpetual' - )} - +
+
+ {selectedStaker?.stake?.duration ? ( + +
+ + {'text'} +
+ + ) : ( + '∞ Perpetual' + )}{' '} +
+ + {selectedStaker?.stake?.duration ? ( + <> + {calculateRemainingDays( + selectedStaker?.stake?.duration, + selectedStaker.created_at + )}{' '} + days ( + {selectedStaker?.stake?.duration && + formatDate(selectedStaker?.closing)} + ) + + ) : ( + 'Perpetual' + )} + +
@@ -989,40 +1080,44 @@ const CeFiUserStake = ({ balance, coins, theme }) => { )
- {isMobile &&
} +
{selectedStaker.reward_currency && 'Reward'}{' '} {STRINGS['CEFI_STAKE.AMOUNT_TO_RECEIVE_LABEL']}: {' '} - {selectedStaker.reward_currency - ? selectedStaker.reward > 0 - ? `${roundToIncrementUnit( - new BigNumber(selectedStaker.reward) - .minus( - new BigNumber( - selectedStaker.slashedValues.slashingEarning - ) - ) - .toNumber(), - selectedStaker.reward_currency - )} ${selectedStaker.reward_currency.toUpperCase()}` - : 'No reward amount to receive' - : `${new BigNumber(selectedStaker.amount) - .minus( - new BigNumber( - selectedStaker.slashedValues.slashingPrinciple - ) - ) - .plus( - new BigNumber(selectedStaker.reward).minus( + {selectedStaker.reward_currency ? ( + selectedStaker.reward > 0 ? ( + `${roundToIncrementUnit( + new BigNumber(selectedStaker.reward) + .minus( new BigNumber( selectedStaker.slashedValues.slashingEarning ) ) + .toNumber(), + selectedStaker.reward_currency + )} ${selectedStaker.reward_currency.toUpperCase()}` + ) : ( + {STRINGS['CEFI_STAKE.NO_REWARD']} + ) + ) : ( + `${new BigNumber(selectedStaker.amount) + .minus( + new BigNumber( + selectedStaker.slashedValues.slashingPrinciple + ) + ) + .plus( + new BigNumber(selectedStaker.reward).minus( + new BigNumber( + selectedStaker.slashedValues.slashingEarning + ) ) - .toNumber()} ${selectedStaker.currency.toUpperCase()}`} + ) + .toNumber()} ${selectedStaker.currency.toUpperCase()}` + )}
@@ -1038,7 +1133,7 @@ const CeFiUserStake = ({ balance, coins, theme }) => { }} type="default" > - Cancel + {STRINGS['STAKE.CANCEL']} { }} type="default" > - UNSTAKE + {STRINGS['UNSTAKE.TITLE'].toUpperCase()}
@@ -1091,101 +1186,104 @@ const CeFiUserStake = ({ balance, coins, theme }) => { wrapperClassName="unstaked-logo" />

- You've successfully unstaked{' '} + {STRINGS['CEFI_STAKE.SUCCESSFULLY_UNSTAKED']}{' '} {selectedStaker.currency.toUpperCase()}

- {isMobile && ( -
- {isMobile && - stakePools - .filter( - (pool) => pool.status === 'active' && pool.onboarding - ) - .map((pool) => { - return ( -
- -
- ); - })} -
-
- - {STRINGS['UNSTAKE.AMOUNT_TO_RECEIVE']}: - {' '} - - {selectedStaker.reward_currency - ? selectedStaker.reward > 0 - ? `${roundToIncrementUnit( - new BigNumber(selectedStaker.reward) - .minus( - new BigNumber( - selectedStaker.slashedValues.slashingEarning - ) - ) - .toNumber(), - selectedStaker.reward_currency - )} ${selectedStaker.reward_currency.toUpperCase()}` - : 'No reward amount to receive' - : `${new BigNumber(selectedStaker.amount) +
+ {stakePools + .filter((pool) => pool.status === 'active' && pool.onboarding) + .map((pool) => { + return ( +
+ +
+ ); + })} +
+
+ + {STRINGS['UNSTAKE.AMOUNT_TO_RECEIVE']}: + {' '} + + {selectedStaker.reward_currency ? ( + selectedStaker.reward > 0 ? ( + `${roundToIncrementUnit( + new BigNumber(selectedStaker.reward) .minus( new BigNumber( - selectedStaker.slashedValues.slashingPrinciple + selectedStaker.slashedValues.slashingEarning ) ) - .plus( - new BigNumber(selectedStaker.reward).minus( - new BigNumber( - selectedStaker.slashedValues.slashingEarning - ) - ) + .toNumber(), + selectedStaker.reward_currency + )} ${selectedStaker.reward_currency.toUpperCase()}` + ) : ( + {STRINGS['CEFI_STAKE.NO_REWARD']} + ) + ) : ( + `${new BigNumber(selectedStaker.amount) + .minus( + new BigNumber( + selectedStaker.slashedValues.slashingPrinciple + ) + ) + .plus( + new BigNumber(selectedStaker.reward).minus( + new BigNumber( + selectedStaker.slashedValues.slashingEarning ) - .toNumber()} ${selectedStaker.currency.toUpperCase()}`} - -
+ ) + ) + .toNumber()} ${selectedStaker.currency.toUpperCase()}` + )} +
- )} - {isMobile &&
} +
+
{selectedStaker.reward_currency && 'Reward'}{' '} {STRINGS['CEFI_STAKE.AMOUNT_TO_RECEIVE_LABEL']}: {' '} - {selectedStaker.reward_currency - ? selectedStaker.reward > 0 - ? `${roundToIncrementUnit( - new BigNumber(selectedStaker.reward) - .minus( - new BigNumber( - selectedStaker.slashedValues.slashingEarning - ) - ) - .toNumber(), - selectedStaker.reward_currency - )} ${selectedStaker.reward_currency.toUpperCase()}` - : 'No reward amount to receive' - : `${new BigNumber(selectedStaker.amount) - .minus( - new BigNumber( - selectedStaker.slashedValues.slashingPrinciple - ) - ) - .plus( - new BigNumber(selectedStaker.reward).minus( + {selectedStaker.reward_currency ? ( + selectedStaker.reward > 0 ? ( + `${roundToIncrementUnit( + new BigNumber(selectedStaker.reward) + .minus( new BigNumber( selectedStaker.slashedValues.slashingEarning ) ) + .toNumber(), + selectedStaker.reward_currency + )} ${selectedStaker.reward_currency.toUpperCase()}` + ) : ( + {STRINGS['CEFI_STAKE.NO_REWARD']} + ) + ) : ( + `${new BigNumber(selectedStaker.amount) + .minus( + new BigNumber( + selectedStaker.slashedValues.slashingPrinciple + ) + ) + .plus( + new BigNumber(selectedStaker.reward).minus( + new BigNumber( + selectedStaker.slashedValues.slashingEarning + ) ) - .toNumber()} ${selectedStaker.currency.toUpperCase()}`} + ) + .toNumber()} ${selectedStaker.currency.toUpperCase()}` + )}
@@ -1286,13 +1384,11 @@ const CeFiUserStake = ({ balance, coins, theme }) => {
- {isMobile && ( - - )} +
@@ -1351,7 +1447,8 @@ const CeFiUserStake = ({ balance, coins, theme }) => { {STRINGS['CEFI_STAKE.DURATION_LABEL']}: {' '} - {pool.duration} days + {pool.duration}{' '} + {STRINGS['CEFI_STAKE.DAYS'].toLowerCase()} ) : ( 'Perpetual Staking' @@ -1359,17 +1456,21 @@ const CeFiUserStake = ({ balance, coins, theme }) => {
- APY: + {STRINGS['CEFI_STAKE.APY_LABEL']}: {' '} {pool.apy}%
-
- Min:{' '} + + {STRINGS['CEFI_STAKE.MIN']}: + {' '} {pool.min_amount} {pool.currency.toUpperCase()}
- Max:{' '} + + {STRINGS['CALCULATE_MAX']}: + {' '} {pool.max_amount} {pool.currency.toUpperCase()}
{pool?.reward_currency && ( diff --git a/web/src/index.css b/web/src/index.css index 6978973adb..0a2718e4b6 100644 --- a/web/src/index.css +++ b/web/src/index.css @@ -6532,6 +6532,9 @@ table th { height: 40px; margin-bottom: 10px; } +.wallet-wrapper .stake_header { + color: var(--labels_important-active-labels-text-graphics); } + .wallet-wrapper .stake-button-wrapper { margin: 2% 0; display: flex; @@ -6673,6 +6676,9 @@ table th { .tabOption-half-opacity { opacity: 0.7; } +.stake_table_theme .ReactModal__Content .action_notification-wrapper { + margin: 0.5rem 0.5rem 0 0 !important; } + .stake_table_theme .stake_detail_text { color: var(--labels_secondary-inactive-label-text-graphics); } @@ -6701,7 +6707,7 @@ table th { .stake_table_theme .stake_popup_button_wrapper .stake_popup_button { width: 100%; background-color: var(--specials_buttons-links-and-highlights); - color: var(--labels_important-active-labels-text-graphics); + color: var(--calculated_base_footer_text); height: 3rem; border: none; } @@ -6752,16 +6758,45 @@ table th { .stake_table_theme .confirm_stake_popup_wrapper .confirm_stake_theme { margin-bottom: 5% !important; } +.stake_table_theme .confirm_stake_popup_wrapper .confirm_stake_content_wrapper .confirm_stake_content { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + line-height: 20px; } + .stake_table_theme .confirm_stake_popup_wrapper .confirm_stake_content_wrapper .confirm_stake_content .rules_notice_text { + text-align: center; } + .stake_table_theme .confirm_stake_popup_wrapper .confirm_stake_content_wrapper .confirm_stake_field { margin-bottom: 3% !important; } +.stake_table_theme .confirm_stake_popup_wrapper .stakepool_card_icon { + position: absolute; } + +.stake_table_theme .stake_duration_model_wrapper .tooltip_icon_wrapper { + height: 1.2rem; + width: 1.2rem; + position: relative; + top: 0rem; + margin: 0 0.6rem; } + .stake_table_theme .stake_duration_model_wrapper .danger_message_wrapper, .stake_table_theme .stake_duration_model_wrapper .success_message_wrapper, .stake_table_theme .stake_duration_model_wrapper .warning_message_wrapper { - padding: 5%; + padding: 3%; background-color: var(--highcharts-negative-color); margin: 5% 0 8%; - font-size: 12px; } + font-size: 12px; + display: flex; + align-items: flex-start; + gap: 10px; } + .stake_table_theme .stake_duration_model_wrapper .danger_message_wrapper .checked-icon svg, .stake_table_theme .stake_duration_model_wrapper .danger_message_wrapper .danger-icon svg, + .stake_table_theme .stake_duration_model_wrapper .success_message_wrapper .checked-icon svg, + .stake_table_theme .stake_duration_model_wrapper .success_message_wrapper .danger-icon svg, + .stake_table_theme .stake_duration_model_wrapper .warning_message_wrapper .checked-icon svg, + .stake_table_theme .stake_duration_model_wrapper .warning_message_wrapper .danger-icon svg { + width: 2rem; + height: 1.5rem; } .stake_table_theme .stake_duration_model_wrapper .success_message_wrapper { background-color: var(--specials_checks-okay-done) !important; } @@ -6801,8 +6836,7 @@ table th { .stake_table_theme .unstake_confirm_popup_wrapper .unstake_confirm_content { display: flex; justify-content: center; - flex-direction: column; - height: 12rem; } + flex-direction: column; } .stake_table_theme .review_unstake_popup_wrapper .review_unstake_content .unstake_header, .stake_table_theme .review_unstake_popup_wrapper .unstake_confirm_content .unstake_header, .stake_table_theme .unstake_confirm_popup_wrapper .review_unstake_content .unstake_header, @@ -6810,6 +6844,45 @@ table th { display: flex; align-items: center; gap: 10px; } + .stake_table_theme .review_unstake_popup_wrapper .review_unstake_content .time_remaining_progress_content, + .stake_table_theme .review_unstake_popup_wrapper .unstake_confirm_content .time_remaining_progress_content, + .stake_table_theme .unstake_confirm_popup_wrapper .review_unstake_content .time_remaining_progress_content, + .stake_table_theme .unstake_confirm_popup_wrapper .unstake_confirm_content .time_remaining_progress_content { + display: flex; + gap: 10px; } + .stake_table_theme .review_unstake_popup_wrapper .review_unstake_content .time_remaining_progress_content .duration-field, + .stake_table_theme .review_unstake_popup_wrapper .unstake_confirm_content .time_remaining_progress_content .duration-field, + .stake_table_theme .unstake_confirm_popup_wrapper .review_unstake_content .time_remaining_progress_content .duration-field, + .stake_table_theme .unstake_confirm_popup_wrapper .unstake_confirm_content .time_remaining_progress_content .duration-field { + width: 100%; } + .stake_table_theme .review_unstake_popup_wrapper .review_unstake_content .time_remaining_progress_content .duration-field .ant-progress-inner, + .stake_table_theme .review_unstake_popup_wrapper .unstake_confirm_content .time_remaining_progress_content .duration-field .ant-progress-inner, + .stake_table_theme .unstake_confirm_popup_wrapper .review_unstake_content .time_remaining_progress_content .duration-field .ant-progress-inner, + .stake_table_theme .unstake_confirm_popup_wrapper .unstake_confirm_content .time_remaining_progress_content .duration-field .ant-progress-inner { + height: 1rem; + border-radius: unset; } + .stake_table_theme .review_unstake_popup_wrapper .review_unstake_content .time_remaining_progress_content .duration-field .ant-progress-bg, + .stake_table_theme .review_unstake_popup_wrapper .unstake_confirm_content .time_remaining_progress_content .duration-field .ant-progress-bg, + .stake_table_theme .unstake_confirm_popup_wrapper .review_unstake_content .time_remaining_progress_content .duration-field .ant-progress-bg, + .stake_table_theme .unstake_confirm_popup_wrapper .unstake_confirm_content .time_remaining_progress_content .duration-field .ant-progress-bg { + height: 100% !important; + border-radius: 0; + background-color: var(--specials_pending-waiting-caution) !important; } + .stake_table_theme .review_unstake_popup_wrapper .review_unstake_content .time_remaining_progress_content .duration-field .action_notification-svg, + .stake_table_theme .review_unstake_popup_wrapper .unstake_confirm_content .time_remaining_progress_content .duration-field .action_notification-svg, + .stake_table_theme .unstake_confirm_popup_wrapper .review_unstake_content .time_remaining_progress_content .duration-field .action_notification-svg, + .stake_table_theme .unstake_confirm_popup_wrapper .unstake_confirm_content .time_remaining_progress_content .duration-field .action_notification-svg { + margin-top: 0.2rem; + margin-left: 0.5rem; } + .stake_table_theme .review_unstake_popup_wrapper .review_unstake_content .time_remaining_progress_content .duration-field .action_notification-svg svg, + .stake_table_theme .review_unstake_popup_wrapper .unstake_confirm_content .time_remaining_progress_content .duration-field .action_notification-svg svg, + .stake_table_theme .unstake_confirm_popup_wrapper .review_unstake_content .time_remaining_progress_content .duration-field .action_notification-svg svg, + .stake_table_theme .unstake_confirm_popup_wrapper .unstake_confirm_content .time_remaining_progress_content .duration-field .action_notification-svg svg { + width: 1rem; + height: 1rem; + background-color: var(--specials_pending-waiting-caution); + border-radius: 1rem; + padding: 2px; } .stake_table_theme .review_unstake_popup_wrapper .review_unstack_wrapper, .stake_table_theme .unstake_confirm_popup_wrapper .review_unstack_wrapper { display: flex; @@ -6822,15 +6895,20 @@ table th { font-size: 12px; } .terms_condition_dialog_wrapper .ReactModal__Content { - width: 35%; } + width: 50%; } + .terms_condition_dialog_wrapper .ReactModal__Content .anticon-close { + font-size: 20px !important; } .stake_amount_dialog .ReactModal__Content, .duartion_model_dialog_wrapper .ReactModal__Content, -.confirm_stake_dialog_wrapper .ReactModal__Content { - width: 20%; } - +.confirm_stake_dialog_wrapper .ReactModal__Content, .stake_details_dialog_wrapper .ReactModal__Content { - width: 32%; } + width: 30%; } + .stake_amount_dialog .ReactModal__Content .anticon-close, + .duartion_model_dialog_wrapper .ReactModal__Content .anticon-close, + .confirm_stake_dialog_wrapper .ReactModal__Content .anticon-close, + .stake_details_dialog_wrapper .ReactModal__Content .anticon-close { + font-size: 20px !important; } .dialog-mobile-content .stake_detail_line { width: 5%; @@ -6873,6 +6951,18 @@ table th { .dialog-mobile-content .stake_duration_model_wrapper .stake_text { font-size: 13px; } +.dialog-mobile-content .stake_duration_model_wrapper .tooltip_icon_wrapper { + height: 1.5rem; + width: 1.5rem; } + +.dialog-mobile-content .stake_duration_model_wrapper .danger_message_wrapper .checked-icon svg, .dialog-mobile-content .stake_duration_model_wrapper .danger_message_wrapper .danger-icon svg, +.dialog-mobile-content .stake_duration_model_wrapper .success_message_wrapper .checked-icon svg, +.dialog-mobile-content .stake_duration_model_wrapper .success_message_wrapper .danger-icon svg, +.dialog-mobile-content .stake_duration_model_wrapper .warning_message_wrapper .checked-icon svg, +.dialog-mobile-content .stake_duration_model_wrapper .warning_message_wrapper .danger-icon svg { + width: 2rem; + height: 2rem; } + .dialog-mobile-content .stake_detail_popup_wrapper { font-size: 13px; } .dialog-mobile-content .stake_detail_popup_wrapper h1 { @@ -6886,17 +6976,8 @@ table th { .dialog-mobile-content .confirm_stake_popup_wrapper .confirm_stake_content_wrapper { font-size: 12px; } - .dialog-mobile-content .confirm_stake_popup_wrapper .confirm_stake_content_wrapper .confirm_stake_content { - display: flex; - flex-direction: column; - justify-content: center; - align-items: center; - line-height: 20px; } - .dialog-mobile-content .confirm_stake_popup_wrapper .confirm_stake_content_wrapper .confirm_stake_content .rules_notice_text { - text-align: center; } .dialog-mobile-content .confirm_stake_popup_wrapper .stakepool_card_icon { - position: absolute; margin-bottom: 2%; } .dialog-mobile-content .confirmation_model_popup_wrapper .confirmation_model_content { @@ -6935,15 +7016,43 @@ table th { .dialog-mobile-content .unstake_confirm_popup_wrapper .unstake_confirm_content .unstake_header .unstaked-logo svg { width: 6rem; height: 6rem; } + .dialog-mobile-content .review_unstake_popup_wrapper .review_unstake_content .time_remaining_progress_content, + .dialog-mobile-content .review_unstake_popup_wrapper .unstake_confirm_content .time_remaining_progress_content, + .dialog-mobile-content .unstake_confirm_popup_wrapper .review_unstake_content .time_remaining_progress_content, + .dialog-mobile-content .unstake_confirm_popup_wrapper .unstake_confirm_content .time_remaining_progress_content { + display: flex; + gap: 10px; } + .dialog-mobile-content .review_unstake_popup_wrapper .review_unstake_content .time_remaining_progress_content .duration-field, + .dialog-mobile-content .review_unstake_popup_wrapper .unstake_confirm_content .time_remaining_progress_content .duration-field, + .dialog-mobile-content .unstake_confirm_popup_wrapper .review_unstake_content .time_remaining_progress_content .duration-field, + .dialog-mobile-content .unstake_confirm_popup_wrapper .unstake_confirm_content .time_remaining_progress_content .duration-field { + width: 100%; } + .dialog-mobile-content .review_unstake_popup_wrapper .review_unstake_content .time_remaining_progress_content .duration-field .ant-progress-inner, + .dialog-mobile-content .review_unstake_popup_wrapper .unstake_confirm_content .time_remaining_progress_content .duration-field .ant-progress-inner, + .dialog-mobile-content .unstake_confirm_popup_wrapper .review_unstake_content .time_remaining_progress_content .duration-field .ant-progress-inner, + .dialog-mobile-content .unstake_confirm_popup_wrapper .unstake_confirm_content .time_remaining_progress_content .duration-field .ant-progress-inner { + height: 2rem; } + .dialog-mobile-content .review_unstake_popup_wrapper .review_unstake_content .time_remaining_progress_content .duration-field .action_notification-svg, + .dialog-mobile-content .review_unstake_popup_wrapper .unstake_confirm_content .time_remaining_progress_content .duration-field .action_notification-svg, + .dialog-mobile-content .unstake_confirm_popup_wrapper .review_unstake_content .time_remaining_progress_content .duration-field .action_notification-svg, + .dialog-mobile-content .unstake_confirm_popup_wrapper .unstake_confirm_content .time_remaining_progress_content .duration-field .action_notification-svg { + margin-top: 0.5rem; } + .dialog-mobile-content .review_unstake_popup_wrapper .review_unstake_content .time_remaining_progress_content .duration-field .action_notification-svg svg, + .dialog-mobile-content .review_unstake_popup_wrapper .unstake_confirm_content .time_remaining_progress_content .duration-field .action_notification-svg svg, + .dialog-mobile-content .unstake_confirm_popup_wrapper .review_unstake_content .time_remaining_progress_content .duration-field .action_notification-svg svg, + .dialog-mobile-content .unstake_confirm_popup_wrapper .unstake_confirm_content .time_remaining_progress_content .duration-field .action_notification-svg svg { + width: 2rem; + height: 2rem; } .stake_table_wrapper .stake-tabs { width: 100%; - padding: 3%; } + padding: 3%; + background-color: var(--base_wallet-sidebar-and-popup); } .stake_table_wrapper .stake-tabs .stake-cefi-content-wrapper { display: flex; justify-content: space-between; margin-bottom: 5%; - gap: 10px; } + gap: 2%; } .stake_table_wrapper .stake-tabs .stake-cefi-content-wrapper .stake-cefi-value { width: 100%; display: 'flex'; @@ -6970,7 +7079,7 @@ table th { padding: 12%; border-radius: 20px; width: 12rem; - color: var(--labels_important-active-labels-text-graphics); + color: var(--calculated_base_footer_text); text-align: center; display: flex; justify-content: center; @@ -6979,7 +7088,8 @@ table th { .stake_table_wrapper .mystakes-tab { width: 100%; - padding: 3%; } + padding: 3%; + background-color: var(--base_wallet-sidebar-and-popup); } .stake_table_wrapper .mystakes-tab .mystakes-content-wrapper { display: flex; justify-content: space-between; @@ -6996,9 +7106,10 @@ table th { font-size: 18px; } .stake_table_wrapper .mystakes-tab .tabOption { margin-right: 5px; - padding: 10px; + padding: 6px; border-radius: 10px; - cursor: pointer; } + cursor: pointer; + border: 1px solid var(--calculated_important-border); } .stake_table_wrapper .mystakes-tab .mystakes-table-wrapper table .duration-field { display: flex; flex-direction: row; @@ -7043,6 +7154,14 @@ table th { padding: 1rem 5rem; font-size: 18px; } +@media screen and (min-width: 1920px) { + .terms_condition_dialog_wrapper .ReactModal__Content { + width: 35%; } + .stake_amount_dialog .ReactModal__Content, + .duartion_model_dialog_wrapper .ReactModal__Content, + .confirm_stake_dialog_wrapper .ReactModal__Content { + width: 20%; } } + .add-app-button { border-radius: 24px; height: 24px !important; From 594bbd96d5d02f746d3274e3ab8c7e63993b0cb2 Mon Sep 17 00:00:00 2001 From: fetok12 Date: Wed, 26 Jun 2024 01:03:26 +0300 Subject: [PATCH 05/14] user-withdrawal-block --- server/api/controllers/admin.js | 38 +++++++++++++++++ server/api/swagger/admin.yaml | 42 +++++++++++++++++++ ...40624132614-add-withdrawal-blocked-user.js | 14 +++++++ server/db/models/user.js | 4 ++ server/messages.js | 3 +- server/utils/hollaex-tools-lib/tools/user.js | 22 ++++++++++ .../utils/hollaex-tools-lib/tools/wallet.js | 5 ++- 7 files changed, 126 insertions(+), 2 deletions(-) create mode 100644 server/db/migrations/20240624132614-add-withdrawal-blocked-user.js diff --git a/server/api/controllers/admin.js b/server/api/controllers/admin.js index 40d2772743..c19e14eb56 100644 --- a/server/api/controllers/admin.js +++ b/server/api/controllers/admin.js @@ -2839,6 +2839,43 @@ const getUserBalanceHistoryByAdmin = (req, res) => { }); }; +const disableUserWithdrawal = (req, res) => { + loggerAdmin.verbose( + req.uuid, + 'controllers/admin/disableUserWithdrawal auth', + req.auth + ); + + const { + user_id, + expiry_date + } = req.swagger.params.data.value; + + loggerAdmin.info( + req.uuid, + 'controllers/admin/disableUserWithdrawal', + user_id, + expiry_date + ); + + toolsLib.user.disableUserWithdrawal(user_id, { expiry_date }) + .then((data) => { + toolsLib.user.createAuditLog({ email: req?.auth?.sub?.email, session_id: req?.session_id }, req?.swagger?.apiPath, req?.swagger?.operationPath?.[2], req?.swagger?.params?.data?.value); + loggerAdmin.info( + req.uuid, + 'controllers/admin/disableUserWithdrawal successful' + ); + return res.status(200).json({ message: 'Success' }); + }) + .catch((err) => { + loggerAdmin.error( + req.uuid, + 'controllers/admin/disableUserWithdrawal err', + err + ); + return res.status(err.statusCode || 400).json({ message: errorMessageConverter(err) }); + }); +}; const createTradeByAdmin = (req, res) => { loggerAdmin.verbose( @@ -3034,6 +3071,7 @@ module.exports = { deleteTransactionLimit, getUserBalanceHistoryByAdmin, createTradeByAdmin, + disableUserWithdrawal, performDirectWithdrawalByAdmin, getUserReferralCodesByAdmin, createUserReferralCodeByAdmin diff --git a/server/api/swagger/admin.yaml b/server/api/swagger/admin.yaml index 97d59d3792..d4352cff84 100644 --- a/server/api/swagger/admin.yaml +++ b/server/api/swagger/admin.yaml @@ -3231,6 +3231,48 @@ paths: - admin x-token-permissions: - can_withdraw + /admin/user/disable-withdrawal: + x-swagger-router-controller: admin + post: + description: Block user withdrawal ability by admin + operationId: disableUserWithdrawal + tags: + - Admin + parameters: + - name: data + in: body + required: true + schema: + type: object + required: + - user_id + properties: + user_id: + type: number + format: int32 + expiry_date: + type: ['string', 'null'] + format: date-time + responses: + 200: + description: Success + schema: + $ref: "#/definitions/ObjectResponse" + 202: + description: CSV + schema: + type: string + default: + description: Error + schema: + $ref: "#/definitions/MessageResponse" + security: + - Token: [] + x-security-types: + - bearer + - hmac + x-security-scopes: + - admin /admin/user/sessions: x-swagger-router-controller: admin get: diff --git a/server/db/migrations/20240624132614-add-withdrawal-blocked-user.js b/server/db/migrations/20240624132614-add-withdrawal-blocked-user.js new file mode 100644 index 0000000000..50423f72a2 --- /dev/null +++ b/server/db/migrations/20240624132614-add-withdrawal-blocked-user.js @@ -0,0 +1,14 @@ +'use strict'; + +const TABLE = 'Users'; +const COLUMN = 'withdrawal_blocked'; + +module.exports = { + up: (queryInterface, Sequelize) => + queryInterface.addColumn(TABLE, COLUMN, { + type: Sequelize.DATE, + allowNull: true + }), + down: (queryInterface, Sequelize) => + queryInterface.removeColumn(TABLE, COLUMN) +}; \ No newline at end of file diff --git a/server/db/models/user.js b/server/db/models/user.js index 4b128eda2b..f245a2d955 100644 --- a/server/db/models/user.js +++ b/server/db/models/user.js @@ -112,6 +112,10 @@ module.exports = function (sequelize, DataTypes) { type: DataTypes.BOOLEAN, defaultValue: true }, + withdrawal_blocked: { + type: DataTypes.DATE, + allowNull: true + }, note: { type: DataTypes.STRING, defaultValue: '' diff --git a/server/messages.js b/server/messages.js index 02ebaebf69..82c511af66 100644 --- a/server/messages.js +++ b/server/messages.js @@ -260,4 +260,5 @@ exports.EMAIL_IS_SAME = 'New email cannot be same as the existing one'; exports.EMAIL_EXISTS = 'This email already exists'; exports.CANNOT_CHANGE_DELETED_EMAIL = 'Cannot change deleted email'; exports.FAILED_GET_QUOTE = 'Failed to get the quote'; -exports.BALANCE_HISTORY_NOT_ACTIVE = 'This feature is not active on the exchange'; \ No newline at end of file +exports.BALANCE_HISTORY_NOT_ACTIVE = 'This feature is not active on the exchange'; +exports.WITHDRAWAL_DISABLED = 'Withdrawal disabled for this user'; \ No newline at end of file diff --git a/server/utils/hollaex-tools-lib/tools/user.js b/server/utils/hollaex-tools-lib/tools/user.js index 4837da36d3..6ddb9b4f90 100644 --- a/server/utils/hollaex-tools-lib/tools/user.js +++ b/server/utils/hollaex-tools-lib/tools/user.js @@ -1628,6 +1628,27 @@ const setUsernameById = (userId, username) => { }); }; +const disableUserWithdrawal = async (user_id, opts = { expiry_date : null }) => { + const user = await getUserByKitId(user_id, false); + let { expiry_date } = opts; + + if (!user) { + throw new Error(USER_NOT_FOUND); + }; + + let withdrawal_blocked = null; + + if (expiry_date) { + withdrawal_blocked = moment(expiry_date).toISOString(); + }; + + return user.update( + { withdrawal_blocked }, + { fields: ['withdrawal_blocked'], returning: true } + ); +}; + + const createUserCryptoAddressByNetworkId = (networkId, crypto, opts = { network: null, additionalHeaders: null @@ -3278,6 +3299,7 @@ module.exports = { createAudit, createAuditLog, getUserStatsByKitId, + disableUserWithdrawal, getExchangeOperators, inviteExchangeOperator, createUserOnNetwork, diff --git a/server/utils/hollaex-tools-lib/tools/wallet.js b/server/utils/hollaex-tools-lib/tools/wallet.js index 27acf5c4fb..0419c59baf 100644 --- a/server/utils/hollaex-tools-lib/tools/wallet.js +++ b/server/utils/hollaex-tools-lib/tools/wallet.js @@ -19,7 +19,8 @@ const { USER_NOT_FOUND, USER_NOT_REGISTERED_ON_NETWORK, INVALID_NETWORK, - NETWORK_REQUIRED + NETWORK_REQUIRED, + WITHDRAWAL_DISABLED } = require(`${SERVER_PATH}/messages`); const { getUserByKitId, mapNetworkIdToKitId, mapKitIdToNetworkId } = require('./user'); const { findTransactionLimitPerTier } = require('./tier'); @@ -408,6 +409,8 @@ const validateWithdrawal = async (user, address, amount, currency, network = nul throw new Error(USER_NOT_REGISTERED_ON_NETWORK); } else if (user.verification_level < 1) { throw new Error(UPGRADE_VERIFICATION_LEVEL(1)); + } else if(user.withdrawal_blocked && moment().isBefore(moment(user.withdrawal_blocked))) { + throw new Error(WITHDRAWAL_DISABLED); } let { fee, fee_coin } = getWithdrawalFee(currency, network, amount, user.verification_level); From 780f4e9bd86abf275ccf080550c5a7031108237a Mon Sep 17 00:00:00 2001 From: fetok12 Date: Wed, 26 Jun 2024 10:57:43 +0300 Subject: [PATCH 06/14] check-balance-fix-condition --- server/plugins/job.js | 2 +- server/utils/hollaex-tools-lib/tools/p2p.js | 2 +- server/utils/hollaex-tools-lib/tools/stake.js | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/server/plugins/job.js b/server/plugins/job.js index 74e24fe74f..26af538b97 100644 --- a/server/plugins/job.js +++ b/server/plugins/job.js @@ -33,7 +33,7 @@ const unstakingCheckRunner = () => { let symbols = {}; for (const key of Object.keys(balance)) { - if (key.includes('available') && balance[key]) { + if (key.includes('available') && balance[key] != null) { let symbol = key?.split('_')?.[0]; symbols[symbol] = balance[key]; } diff --git a/server/utils/hollaex-tools-lib/tools/p2p.js b/server/utils/hollaex-tools-lib/tools/p2p.js index 6115387d50..bb86e0e1ff 100644 --- a/server/utils/hollaex-tools-lib/tools/p2p.js +++ b/server/utils/hollaex-tools-lib/tools/p2p.js @@ -187,7 +187,7 @@ const getP2PAccountBalance = async (account_id, coin) => { let symbols = {}; for (const key of Object.keys(balance)) { - if (key.includes('available') && balance[key]) { + if (key.includes('available') && balance[key] != null) { let symbol = key?.split('_')?.[0]; symbols[symbol] = balance[key]; } diff --git a/server/utils/hollaex-tools-lib/tools/stake.js b/server/utils/hollaex-tools-lib/tools/stake.js index 1bce9695bc..585cd64d93 100644 --- a/server/utils/hollaex-tools-lib/tools/stake.js +++ b/server/utils/hollaex-tools-lib/tools/stake.js @@ -140,7 +140,7 @@ const getSourceAccountBalance = async (account_id, coin) => { let symbols = {}; for (const key of Object.keys(balance)) { - if (key.includes('available') && balance[key]) { + if (key.includes('available') && balance[key] != null) { let symbol = key?.split('_')?.[0]; symbols[symbol] = balance[key]; } From c382810e1e7c4a0d3bf5a70c0db78077c3f02341 Mon Sep 17 00:00:00 2001 From: fetok12 Date: Wed, 26 Jun 2024 12:53:55 +0300 Subject: [PATCH 07/14] p2p-setting-admin-bug-fix --- web/src/containers/Admin/Trades/p2pSettings.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/web/src/containers/Admin/Trades/p2pSettings.js b/web/src/containers/Admin/Trades/p2pSettings.js index 341653c3bf..974c45e318 100644 --- a/web/src/containers/Admin/Trades/p2pSettings.js +++ b/web/src/containers/Admin/Trades/p2pSettings.js @@ -1104,7 +1104,9 @@ const P2PSettings = ({ coins, pairs, p2p_config, features }) => { } }); - setPaymentMethods([...p2p_config?.bank_payment_methods, ...methods]); + if (p2p_config?.bank_payment_methods?.length > 0) { + setPaymentMethods([...p2p_config?.bank_payment_methods, ...methods]); + } }, []); const handleEmailChange = (value) => { From a3ca2ba73992dfe757451da02b9170056b6a2839 Mon Sep 17 00:00:00 2001 From: fetok12 Date: Sat, 29 Jun 2024 18:17:16 +0300 Subject: [PATCH 08/14] fix-turkish-mail-syntax --- server/mail/strings/tr.json | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/server/mail/strings/tr.json b/server/mail/strings/tr.json index b34439845c..afd18392fd 100644 --- a/server/mail/strings/tr.json +++ b/server/mail/strings/tr.json @@ -125,15 +125,15 @@ "title": "OTP Etkin" }, "P2P_MERCHANT_IN_PROGRESS": { - "html": "

Sevgili ${name}

P2P işleminizde bir aktivite tespit ettik, bu da bir müşterinin sizinle işlem yapmak istediğini gösterebilir. İşleminizin durumunu kontrol etmek için lütfen aşağıdaki bağlantıya tıklayın:

Platformumuzu kullandığınız için teşekkür ederiz.

İstek şu IP'den yapıldı: ${ip}

Saygılarımızla
${api_name} ekibi

", + "html": "

Sevgili ${name}

P2P işleminizde bir aktivite tespit ettik, bu da bir müşterinin sizinle işlem yapmak istediğini gösterebilir. İşleminizin durumunu kontrol etmek için lütfen aşağıdaki bağlantıya tıklayın:

Platformumuzu kullandığınız için teşekkür ederiz.

İstek şu IP den yapıldı: ${ip}

Saygılarımızla
${api_name} ekibi

", "title": "P2P İşleminizle İlgili Güncelleme" }, "P2P_BUYER_PAID_ORDER": { - "html": "

Sevgili ${name}

Siparişinizi ödenmiş olarak işaretlediniz. Satıcının kontrol etmesini, onaylamasını ve fonları serbest bırakmasını bekliyoruz

Platformumuzu kullandığınız için teşekkür ederiz.

İstek şu IP'den yapıldı: ${ip}

Saygılarımızla
${api_name} ekibi

", + "html": "

Sevgili ${name}

Siparişinizi ödenmiş olarak işaretlediniz. Satıcının kontrol etmesini, onaylamasını ve fonları serbest bırakmasını bekliyoruz

Platformumuzu kullandığınız için teşekkür ederiz.

İstek şu IP den yapıldı: ${ip}

Saygılarımızla
${api_name} ekibi

", "title": "P2P Siparişinizde Aktivite Tespit Edildi" }, "P2P_ORDER_EXPIRED": { - "html": "

Sevgili ${name}

Belirtilen süre içinde aktivite olmadığı için siparişinizin süresi doldu.

Platformumuzu kullandığınız için teşekkür ederiz.

İstek şu IP'den yapıldı: ${ip}

Saygılarımızla
${api_name} ekibi

", + "html": "

Sevgili ${name}

Belirtilen süre içinde aktivite olmadığı için siparişinizin süresi doldu.

Platformumuzu kullandığınız için teşekkür ederiz.

İstek şu IP den yapıldı: ${ip}

Saygılarımızla
${api_name} ekibi

", "title": "P2P Siparişinizde Aktivite Tespit Edildi" }, "P2P_ORDER_CLOSED": { @@ -141,23 +141,23 @@ "title": "P2P Siparişinizde Aktivite Tespit Edildi" }, "P2P_BUYER_CANCELLED_ORDER": { - "html": "

Sevgili ${name}

Siparişinizi iptal ettiniz. İşlem kapatıldı.

Platformumuzu kullandığınız için teşekkür ederiz.

İstek şu IP'den yapıldı: ${ip}

Saygılarımızla
${api_name} ekibi

", + "html": "

Sevgili ${name}

Siparişinizi iptal ettiniz. İşlem kapatıldı.

Platformumuzu kullandığınız için teşekkür ederiz.

İstek şu IP den yapıldı: ${ip}

Saygılarımızla
${api_name} ekibi

", "title": "P2P Siparişinizde Aktivite Tespit Edildi" }, "P2P_BUYER_APPEALED_ORDER": { - "html": "

Sevgili ${name}

Siparişinize itiraz ettiniz. Sorunu çözmek için lütfen destek ile iletişime geçin.

İstek şu IP'den yapıldı: ${ip}

Saygılarımızla
${api_name} ekibi

", + "html": "

Sevgili ${name}

Siparişinize itiraz ettiniz. Sorunu çözmek için lütfen destek ile iletişime geçin.

İstek şu IP den yapıldı: ${ip}

Saygılarımızla
${api_name} ekibi

", "title": "P2P Siparişinizde Aktivite Tespit Edildi" }, "P2P_VENDOR_CONFIRMED_ORDER": { - "html": "

Sevgili ${name}

İşlemi onayladınız ve fonları serbest bıraktınız.

Platformumuzu kullandığınız için teşekkür ederiz.

İstek şu IP'den yapıldı: ${ip}

Saygılarımızla
${api_name} ekibi

", + "html": "

Sevgili ${name}

İşlemi onayladınız ve fonları serbest bıraktınız.

Platformumuzu kullandığınız için teşekkür ederiz.

İstek şu IP den yapıldı: ${ip}

Saygılarımızla
${api_name} ekibi

", "title": "P2P Siparişinizde Aktivite Tespit Edildi" }, "P2P_VENDOR_CANCELLED_ORDER": { - "html": "

Sevgili ${name}

Siparişinizi iptal ettiniz. İşlem kapatıldı.

Platformumuzu kullandığınız için teşekkür ederiz.

İstek şu IP'den yapıldı: ${ip}

Saygılarımızla
${api_name} ekibi

", + "html": "

Sevgili ${name}

Siparişinizi iptal ettiniz. İşlem kapatıldı.

Platformumuzu kullandığınız için teşekkür ederiz.

İstek şu IP den yapıldı: ${ip}

Saygılarımızla
${api_name} ekibi

", "title": "P2P Siparişinizde Aktivite Tespit Edildi" }, "P2P_VENDOR_APPEALED_ORDER": { - "html": "

Sevgili ${name}

Siparişinize itiraz ettiniz. Sorunu çözmek için lütfen destek ile iletişime geçin.

Platformumuzu kullandığınız için teşekkür ederiz.

İstek şu IP'den yapıldı: ${ip}

Saygılarımızla
${api_name} ekibi

", + "html": "

Sevgili ${name}

Siparişinize itiraz ettiniz. Sorunu çözmek için lütfen destek ile iletişime geçin.

Platformumuzu kullandığınız için teşekkür ederiz.

İstek şu IP den yapıldı: ${ip}

Saygılarımızla
${api_name} ekibi

", "title": "P2P Siparişinizde Aktivite Tespit Edildi" } } From 897a34d509970175b462a453c204c90b6d4d599d Mon Sep 17 00:00:00 2001 From: Ali Beikverdi Date: Mon, 1 Jul 2024 11:40:28 +0900 Subject: [PATCH 09/14] version update --- server/api/swagger/swagger.js | 2 +- server/package.json | 2 +- version | 2 +- web/package.json | 2 +- 4 files changed, 4 insertions(+), 4 deletions(-) diff --git a/server/api/swagger/swagger.js b/server/api/swagger/swagger.js index 312f620411..f3f33ccac2 100644 --- a/server/api/swagger/swagger.js +++ b/server/api/swagger/swagger.js @@ -4,7 +4,7 @@ const definition = { swagger: '2.0', info: { title: 'HollaEx Kit', - version: '2.11.2' + version: '2.11.3' }, host: 'api.hollaex.com', basePath: '/v2', diff --git a/server/package.json b/server/package.json index 2a92c0cbfd..8db8837863 100644 --- a/server/package.json +++ b/server/package.json @@ -1,5 +1,5 @@ { - "version": "2.11.2", + "version": "2.11.3", "private": false, "description": "HollaEx Kit", "keywords": [ diff --git a/version b/version index c51908eafb..ac569006a9 100644 --- a/version +++ b/version @@ -1 +1 @@ -2.11.2 \ No newline at end of file +2.11.3 \ No newline at end of file diff --git a/web/package.json b/web/package.json index d2f3845acb..e6a6df4b78 100644 --- a/web/package.json +++ b/web/package.json @@ -1,6 +1,6 @@ { "name": "hollaex-kit", - "version": "2.11.2", + "version": "2.11.3", "private": true, "dependencies": { "@ant-design/compatible": "1.0.5", From c356e644642b7f8b06812a7fc159146969e7b0b8 Mon Sep 17 00:00:00 2001 From: Ali Beikverdi Date: Tue, 2 Jul 2024 00:47:57 +0900 Subject: [PATCH 10/14] increase time threshold to restart the thread when check status fails --- server/init.js | 6 +++--- server/plugins/dev.js | 2 +- server/plugins/index.js | 4 ++-- server/ws/hub.js | 4 ++-- 4 files changed, 8 insertions(+), 8 deletions(-) diff --git a/server/init.js b/server/init.js index d63d305ef4..29476826b4 100644 --- a/server/init.js +++ b/server/init.js @@ -330,10 +330,10 @@ const checkStatus = () => { return networkNodeLib; }) .catch((err) => { - loggerInit.info('init/checkStatus/catch error', err.message); + loggerInit.error('init/checkStatus/catch error', err.message); setTimeout(() => { - process.exit(0); - }, 5000); + process.exit(1); + }, 60000); }); }; diff --git a/server/plugins/dev.js b/server/plugins/dev.js index 43efa4907a..ec45e42202 100644 --- a/server/plugins/dev.js +++ b/server/plugins/dev.js @@ -173,5 +173,5 @@ checkStatus() message ); - setTimeout(() => { process.exit(1); }, 5000); + setTimeout(() => { process.exit(1); }, 60000); }); \ No newline at end of file diff --git a/server/plugins/index.js b/server/plugins/index.js index b67bf6b1da..2c3857085b 100644 --- a/server/plugins/index.js +++ b/server/plugins/index.js @@ -120,7 +120,7 @@ const startPluginProcess = async () => { pluginWorkerThread = childProcess; - pluginWorkerThread.on("exit", (code) => { + pluginWorkerThread.on('exit', (code) => { if (code === 0) { startPluginProcess(); } @@ -217,7 +217,7 @@ checkStatus() message ); - setTimeout(() => { process.exit(1); }, 5000); + setTimeout(() => { process.exit(1); }, 60000); }); module.exports = { diff --git a/server/ws/hub.js b/server/ws/hub.js index 85ff2b0b9b..5951bd0363 100644 --- a/server/ws/hub.js +++ b/server/ws/hub.js @@ -93,7 +93,7 @@ const connect = () => { loggerWebsocket.error('ws/hub/connect/checkStatus Error ', message); setTimeout(() => { process.exit(1); - }, 5000); + }, 60000); }); // check after 10 seconds to make sure stream is connected @@ -102,7 +102,7 @@ const connect = () => { loggerWebsocket.error('ws/hub/connect hub not connected'); process.exit(1); } - }, 10000); + }, 60000); }; const sendNetworkWsMessage = (op, topic, networkId) => { From 248451f155d00d29597dc03c4fb91b3054102f13 Mon Sep 17 00:00:00 2001 From: fetok12 Date: Mon, 1 Jul 2024 20:21:06 +0300 Subject: [PATCH 11/14] fix-post-deal-p2p-css --- web/src/containers/P2P/P2PPostDeal.js | 13 ++++++------- web/src/containers/P2P/_P2P.scss | 11 +++++++++++ 2 files changed, 17 insertions(+), 7 deletions(-) diff --git a/web/src/containers/P2P/P2PPostDeal.js b/web/src/containers/P2P/P2PPostDeal.js index 02023a7002..9153efd474 100644 --- a/web/src/containers/P2P/P2PPostDeal.js +++ b/web/src/containers/P2P/P2PPostDeal.js @@ -107,13 +107,12 @@ const P2PPostDeal = ({ return (
@@ -647,7 +646,7 @@ const P2PPostDeal = ({ position: 'relative', top: '5%', }} - className="stake_theme" + className={classnames(['stake_theme', 'postDealButton'])} > {step !== 1 && (
{ const isCondition = - selectedMethod === 'Email' ? !isValidEmail : !isValidAddress; + selectedMethod === strings['FORM_FIELDS.EMAIL_LABEL'] + ? !isValidEmail + : !isValidAddress; return ( !getWithdrawAddress || !getWithdrawCurrency || @@ -245,7 +247,7 @@ const RenderWithdraw = ({ try { const res = await getWithdrawalMax( getWithdrawCurrency && getWithdrawCurrency, - selectedMethod === 'Email' + selectedMethod === strings['FORM_FIELDS.EMAIL_LABEL'] ? 'email' : getWithdrawNetworkOptions ? getWithdrawNetworkOptions @@ -512,7 +514,7 @@ const RenderWithdraw = ({ }; const withdrawFeeFormat = - selectedMethod === 'Email' + selectedMethod === strings['FORM_FIELDS.EMAIL_LABEL'] ? 0 : `+ ${fee} ${ (getWithdrawCurrency || currency) && feeCoin?.toUpperCase() @@ -523,18 +525,24 @@ const RenderWithdraw = ({ const isCondition = (['xrp', 'xlm'].includes(selectedAsset) || ['xlm', 'ton'].includes(network)) && - selectedMethod !== 'Email'; + selectedMethod !== strings['FORM_FIELDS.EMAIL_LABEL']; const isEmailAndAddress = - coinLength && coinLength?.length > 1 && selectedMethod !== 'Email' + coinLength && + coinLength?.length > 1 && + selectedMethod !== strings['FORM_FIELDS.EMAIL_LABEL'] ? getWithdrawNetworkOptions !== null : currStep.stepThree || (selectedAsset && selectedMethod); const renderNetwork = - coinLength && coinLength?.length > 1 && selectedMethod !== 'Email' + coinLength && + coinLength?.length > 1 && + selectedMethod !== strings['FORM_FIELDS.EMAIL_LABEL'] ? getWithdrawNetworkOptions : true; const renderAmountField = - (selectedMethod === 'Email' && isValidEmail) || - (selectedMethod === 'Address' && isValidAddress); + (selectedMethod === strings['FORM_FIELDS.EMAIL_LABEL'] && isValidEmail) || + ((selectedMethod === strings['WITHDRAW_PAGE.WITHDRAWAL_CONFIRM_ADDRESS'] || + (selectedMethod && selectedMethod === 'Address')) && + isValidAddress); const isErrorAmountField = getWithdrawAmount > maxAmount && maxAmount > 0; const networkIcon = selectedNetwork ? coins[selectedNetwork]?.icon_id @@ -551,7 +559,8 @@ const RenderWithdraw = ({ 1 } placeholder={strings['WITHDRAW_PAGE.METHOD_FIELD_LABEL']} onChange={onHandleChangeMethod} - value={selectedMethod} + value={ + selectedMethod === 'Address' + ? strings['WITHDRAW_PAGE.WITHDRAWAL_CONFIRM_ADDRESS'] + : selectedMethod + } > {methodOptions.map((val, inx) => (
- {selectedMethod === 'Email' && ( + {selectedMethod === strings['FORM_FIELDS.EMAIL_LABEL'] && (
{renderLabel('WITHDRAWALS_FORM_MAIL_INFO')}
@@ -697,7 +710,7 @@ const RenderWithdraw = ({ ) )} - {selectedMethod === 'Email' ? ( + {selectedMethod === strings['FORM_FIELDS.EMAIL_LABEL'] ? ( isEmailAndAddress && renderNetwork ? ( ) : ( @@ -716,7 +729,7 @@ const RenderWithdraw = ({
- {selectedMethod !== 'Email' && ( + {selectedMethod !== strings['FORM_FIELDS.EMAIL_LABEL'] && (
@@ -804,7 +817,7 @@ const RenderWithdraw = ({ ))} - {selectedMethod !== 'Email' && + {selectedMethod !== strings['FORM_FIELDS.EMAIL_LABEL'] && isEmailAndAddress && renderNetwork ? ( @@ -828,7 +841,7 @@ const RenderWithdraw = ({ className={`${ ['xrp', 'xlm', 'ton', 'pmn'].includes(getWithdrawCurrency) && selectedMethod && - selectedMethod !== 'Email' && + selectedMethod !== strings['FORM_FIELDS.EMAIL_LABEL'] && 'destination-field' } ${isMobile && isMobile && 'destination-field-mobile'}`} > @@ -837,14 +850,14 @@ const RenderWithdraw = ({ className={`custom-field d-flex flex-column align-items-center ${ ['xrp', 'xlm', 'ton', 'pmn'].includes(getWithdrawCurrency) && selectedMethod && - selectedMethod !== 'Email' && + selectedMethod !== strings['FORM_FIELDS.EMAIL_LABEL'] && 'destination-field' } ${isMobile && isMobile && 'destination-field-mobile'}`} > - {selectedMethod === 'Email' ? 3 : 4} + {selectedMethod === strings['FORM_FIELDS.EMAIL_LABEL'] ? 3 : 4} {renderLabel( - selectedMethod === 'Address' + selectedMethod === + strings['WITHDRAW_PAGE.WITHDRAWAL_CONFIRM_ADDRESS'] || + selectedMethod === 'Address' ? 'ACCORDIAN.DESTINATION' : 'FORM_FIELDS.EMAIL_LABEL' )} @@ -878,7 +893,9 @@ const RenderWithdraw = ({ : 'd-flex flex-row select-wrapper' } > - {selectedMethod === 'Address' ? ( + {selectedMethod === + strings['WITHDRAW_PAGE.WITHDRAWAL_CONFIRM_ADDRESS'] || + selectedMethod === 'Address' ? ( onHandleAddress(e.target.value, 'address')} @@ -896,7 +913,7 @@ const RenderWithdraw = ({ } > )} - {selectedMethod === 'Email' ? ( + {selectedMethod === strings['FORM_FIELDS.EMAIL_LABEL'] ? ( isValidEmail ? ( ) : ( @@ -1017,7 +1034,11 @@ const RenderWithdraw = ({ - {isCondition ? 6 : selectedMethod === 'Email' ? 4 : 5} + {isCondition + ? 6 + : selectedMethod === strings['FORM_FIELDS.EMAIL_LABEL'] + ? 4 + : 5} Date: Tue, 2 Jul 2024 21:15:30 +0300 Subject: [PATCH 13/14] withdrawal-block-admin-ui --- web/src/containers/Admin/User/AboutData.js | 214 ++++++++++++++++++++- web/src/containers/Admin/User/actions.js | 9 + 2 files changed, 221 insertions(+), 2 deletions(-) diff --git a/web/src/containers/Admin/User/AboutData.js b/web/src/containers/Admin/User/AboutData.js index 2c5a49782e..40745062a2 100644 --- a/web/src/containers/Admin/User/AboutData.js +++ b/web/src/containers/Admin/User/AboutData.js @@ -2,7 +2,16 @@ import React, { Fragment, useEffect, useState } from 'react'; import { Link } from 'react-router'; import { ReactSVG } from 'react-svg'; import { SubmissionError } from 'redux-form'; -import { Button, Form, Input, message, Modal, Select } from 'antd'; +import { + Button, + Form, + Input, + message, + Modal, + Select, + Radio, + Space, +} from 'antd'; import { ExclamationCircleFilled, CaretUpFilled, @@ -23,6 +32,7 @@ import { updateDiscount, deleteNotes, changeUserEmail, + disableWithdrawal, } from './actions'; import { validateRequired, @@ -33,7 +43,8 @@ import { STATIC_ICONS } from 'config/icons'; import Image from 'components/Image'; import withConfig from 'components/ConfigProvider/withConfig'; import { sendEmailCode } from 'actions/userAction'; - +import moment from 'moment'; +import { CloseOutlined, CloseCircleOutlined } from '@ant-design/icons'; const VerificationForm = AdminHocForm('VERIFICATION_FORM'); const ModalBtn = ({ onClick, btnName, disabled, className }) => { @@ -468,6 +479,9 @@ const AboutData = ({ userCode: '', userOtp: '', }); + const [displayWithdrawalBlock, setDisplayWithdrawalBlock] = useState(false); + const [selectedBanDate, setSelectedBanDate] = useState(null); + const [selectedBanOption, setSelectedBanOption] = useState(null); useEffect(() => { if (userData.discount) { @@ -525,6 +539,16 @@ const AboutData = ({ setModalKey(type); }; + const setWithdrawalBlockOptions = () => { + if (!userData.withdrawal_blocked) setSelectedBanOption(null); + else if (moment(userData.withdrawal_blocked).diff(moment(), 'years') > 1) { + setSelectedBanOption('ban'); + } else { + setSelectedBanOption('48h'); + } + setDisplayWithdrawalBlock(true); + }; + const { email, full_name, @@ -825,6 +849,69 @@ const AboutData = ({ )}
+ +
+ {userData.withdrawal_blocked ? ( + +
+ {moment(userData.withdrawal_blocked).diff(moment(), 'years') > + 1 ? ( +
Withdrawal is banned
+ ) : ( +
+ Withdrawal is blocked until{' '} + {moment(userData.withdrawal_blocked) + .format('DD/MMM/YYYY, hh:mmA ') + .toUpperCase()} +
+ )} +
{ + setWithdrawalBlockOptions(); + }} + style={{ textDecoration: 'underline', cursor: 'pointer' }} + > + EDIT +
+
+
+ +
+ + ) : ( + +
+
Withdrawal Block
+
+ None{' '} + { + setWithdrawalBlockOptions(); + }} + style={{ textDecoration: 'underline', cursor: 'pointer' }} + > + EDIT + +
+
+
+ +
+ + )} +
@@ -1000,6 +1087,129 @@ const AboutData = ({ refreshAllData={refreshAllData} /> + {displayWithdrawalBlock && ( + } + bodyStyle={{ + backgroundColor: '#27339D', + marginTop: 60, + }} + width={610} + visible={displayWithdrawalBlock} + footer={null} + onCancel={() => { + setDisplayWithdrawalBlock(false); + }} + > +

+ Block Withdrawal +

+ +
+ Restrict user's withdrawal ability +
+ + { + if (e.target.value === 'ban') { + setSelectedBanDate(moment().add(100, 'years').toISOString()); + } else if (e.target.value === '48h') { + setSelectedBanDate(moment().add(48, 'hours').toISOString()); + } else { + setSelectedBanDate(e.target.value); + } + setSelectedBanOption(e.target.value); + }} + value={selectedBanOption} + > + + + None (it follows the users tier withdrawal limit) + + + Ban (user will not be able to make any withdrawal) + + + 48h (user will not be able to make a withdrawal within the + next 48 hours) + + + + +
+ + +
+ + )}
); diff --git a/web/src/containers/Admin/User/actions.js b/web/src/containers/Admin/User/actions.js index 73788c270c..0a8dcacea2 100644 --- a/web/src/containers/Admin/User/actions.js +++ b/web/src/containers/Admin/User/actions.js @@ -170,6 +170,15 @@ export const deactivateOtp = (values) => { return requestAuthenticated('/admin/deactivate-otp', options); }; +export const disableWithdrawal = (values) => { + const options = { + method: 'POST', + body: JSON.stringify(values), + }; + + return requestAuthenticated('/admin/user/disable-withdrawal', options); +}; + export const flagUser = (values) => { const options = { method: 'POST', From ba34ace94926edb60e6ef5b49e36ef2cbce01532 Mon Sep 17 00:00:00 2001 From: fetok12 Date: Wed, 3 Jul 2024 13:34:44 +0300 Subject: [PATCH 14/14] p2p-tab --- .../assets/images/p2p-feature-admin.svg | 8 ++++ web/src/config/icons/static.js | 1 + .../containers/Admin/General/InterfaceForm.js | 34 ++++++++++++++++ .../containers/Admin/Trades/p2pSettings.js | 40 ++++++++++++++++++- 4 files changed, 81 insertions(+), 2 deletions(-) create mode 100644 web/public/assets/images/p2p-feature-admin.svg diff --git a/web/public/assets/images/p2p-feature-admin.svg b/web/public/assets/images/p2p-feature-admin.svg new file mode 100644 index 0000000000..3b750c5c74 --- /dev/null +++ b/web/public/assets/images/p2p-feature-admin.svg @@ -0,0 +1,8 @@ + + + + + + + + \ No newline at end of file diff --git a/web/src/config/icons/static.js b/web/src/config/icons/static.js index 5a24d1715f..0e9f217d1b 100644 --- a/web/src/config/icons/static.js +++ b/web/src/config/icons/static.js @@ -16,6 +16,7 @@ const icons = { DEFAULT_PLUGINS: '/assets/plugins/default-plugin.png', HOLLAEX_INIT_LOGO: '/assets/images/hollaex-icon-01.svg', CANDLES_LOGO: '/assets/images/Light-theme-candles.svg', + P2P_FEATURE: '/assets/images/p2p-feature-admin.svg', SET_ADMIN_NETWORK_KEYS: '/assets/images/set-admin-network-keys.svg', SET_ADMIN_EMAIL: '/assets/images/set-admin-email.svg', REFERRAL_ICON: '/assets/images/referrals-icon.svg', diff --git a/web/src/containers/Admin/General/InterfaceForm.js b/web/src/containers/Admin/General/InterfaceForm.js index 0d9c7ebcf4..25bc082a54 100644 --- a/web/src/containers/Admin/General/InterfaceForm.js +++ b/web/src/containers/Admin/General/InterfaceForm.js @@ -7,6 +7,7 @@ import _isEqual from 'lodash/isEqual'; import { STATIC_ICONS } from 'config/icons'; import FormButton from 'components/FormButton/Button'; import { CloseOutlined } from '@ant-design/icons'; +import { Link } from 'react-router'; const { Item } = Form; const InterfaceForm = ({ @@ -521,6 +522,39 @@ const InterfaceForm = ({ )} + {!isFiatUpgrade && ( + + + +
+
+ +
+ +
+ P2P +
+ (P2P Trading for merchants and exchange users) +
+
+
+ + + + )} + {!isFiatUpgrade && ( diff --git a/web/src/containers/Admin/Trades/p2pSettings.js b/web/src/containers/Admin/Trades/p2pSettings.js index 974c45e318..672c456e29 100644 --- a/web/src/containers/Admin/Trades/p2pSettings.js +++ b/web/src/containers/Admin/Trades/p2pSettings.js @@ -20,11 +20,12 @@ import { updateConstants, requestUsers } from './actions'; import { requestAdminData } from 'actions/appActions'; import _debounce from 'lodash/debounce'; import Coins from '../Coins'; +import _toLower from 'lodash/toLower'; import './index.css'; const TabPane = Tabs.TabPane; -const P2PSettings = ({ coins, pairs, p2p_config, features }) => { +const P2PSettings = ({ coins, pairs, p2p_config, features, constants }) => { const [displayP2pModel, setDisplayP2pModel] = useState(false); const [displayFiatAdd, setDisplayFiatAdd] = useState(false); const [displayPaymentAdd, setDisplayPaymentAdd] = useState(false); @@ -1153,8 +1154,42 @@ const P2PSettings = ({ coins, pairs, p2p_config, features }) => { searchRef.current.focus(); } }; + const handleUpgrade = (info = {}) => { + if ( + _toLower(info.plan) !== 'fiat' && + _toLower(info.plan) !== 'boost' && + _toLower(info.type) !== 'enterprise' + ) { + return true; + } else { + return false; + } + }; - return ( + const isUpgrade = handleUpgrade(constants.info); + return isUpgrade ? ( +
+
+
+
Enable P2P Trading
+
+ Enable peer-to-peer trading between merchants and exchange users +
+
+ +
+
+ ) : (
@@ -2640,6 +2675,7 @@ const mapStateToProps = (state) => ({ broker: state.app.broker, features: state.app.constants.features, p2p_config: state.app.constants.p2p_config, + constants: state.app.constants, }); const mapDispatchToProps = (dispatch) => ({