From 7774808100e0db3df5429e9c80b9c93e5e5da70e Mon Sep 17 00:00:00 2001 From: Vadim Date: Wed, 27 May 2020 12:01:16 +0300 Subject: [PATCH] Improve 'Withdraw' popup --- apps/block_scout_web/assets/css/_mixins.scss | 4 ++ .../assets/js/pages/stakes/withdraw_stake.js | 4 +- .../channels/stakes_channel.ex | 13 ++-- .../stakes/_stakes_modal_withdraw.html.eex | 62 +++++++++++++------ 4 files changed, 55 insertions(+), 28 deletions(-) diff --git a/apps/block_scout_web/assets/css/_mixins.scss b/apps/block_scout_web/assets/css/_mixins.scss index 878b5b3f32..14b633bddf 100644 --- a/apps/block_scout_web/assets/css/_mixins.scss +++ b/apps/block_scout_web/assets/css/_mixins.scss @@ -119,6 +119,10 @@ opacity: 0.5; } } + + &.m-b-0-7 { + margin-bottom: 0.7rem; + } } @mixin btn-line($bg-color: #fff, $text-color: $secondary) { diff --git a/apps/block_scout_web/assets/js/pages/stakes/withdraw_stake.js b/apps/block_scout_web/assets/js/pages/stakes/withdraw_stake.js index 1ff825df92..ff6d461958 100644 --- a/apps/block_scout_web/assets/js/pages/stakes/withdraw_stake.js +++ b/apps/block_scout_web/assets/js/pages/stakes/withdraw_stake.js @@ -94,7 +94,7 @@ function isAmountValid (value, store, msg) { const currentStake = new BigNumber(msg.delegator_staked) const amount = new BigNumber(value.replace(',', '.').trim()).shiftedBy(decimals).integerValue() - if (!amount.isPositive() && !amount.isNegative()) { + if ((!amount.isPositive() && !amount.isNegative()) || amount.isZero()) { return 'Invalid amount' } else if (amount.isLessThan(currentStake) && currentStake.minus(amount).isLessThan(minStake)) { return `A minimum of ${minStake.shiftedBy(-decimals)} ${store.getState().tokenSymbol} is required to remain in the pool, or withdraw the entire amount to leave this pool` @@ -114,7 +114,7 @@ function isWithdrawAmountValid (value, store, msg) { return null } else if (amount.isLessThan(currentStake) && currentStake.minus(amount).isLessThan(minStake)) { return null - } else if (!amount.isPositive() || amount.isGreaterThan(maxAllowed)) { + } else if (amount.isGreaterThan(maxAllowed)) { return null } diff --git a/apps/block_scout_web/lib/block_scout_web/channels/stakes_channel.ex b/apps/block_scout_web/lib/block_scout_web/channels/stakes_channel.ex index 8be45d5d55..fc12877589 100644 --- a/apps/block_scout_web/lib/block_scout_web/channels/stakes_channel.ex +++ b/apps/block_scout_web/lib/block_scout_web/channels/stakes_channel.ex @@ -134,13 +134,14 @@ defmodule BlockScoutWeb.StakesChannel do balance = Chain.fetch_last_token_balance(socket.assigns.account, token.contract_address_hash) min_stake = - if staking_address == socket.assigns.account do - ContractState.get(:min_candidate_stake) - else - ContractState.get(:min_delegator_stake) - end + Decimal.new( + if staking_address == socket.assigns.account do + ContractState.get(:min_candidate_stake) + else + ContractState.get(:min_delegator_stake) + end + ) - min_stake = Decimal.new(min_stake) delegator_staked = Decimal.new((delegator && delegator.stake_amount) || 0) html = diff --git a/apps/block_scout_web/lib/block_scout_web/templates/stakes/_stakes_modal_withdraw.html.eex b/apps/block_scout_web/lib/block_scout_web/templates/stakes/_stakes_modal_withdraw.html.eex index 1d0914c35d..ad2732beef 100644 --- a/apps/block_scout_web/lib/block_scout_web/templates/stakes/_stakes_modal_withdraw.html.eex +++ b/apps/block_scout_web/lib/block_scout_web/templates/stakes/_stakes_modal_withdraw.html.eex @@ -14,41 +14,63 @@ <%= format_token_amount(@delegator.stake_amount, @token) %>

- <%= if Decimal.positive?(@delegator.ordered_withdraw) do %> + + <% + withdraw_now_allowed = Decimal.positive?(@delegator.max_withdraw_allowed) + order_allowed = Decimal.positive?(@delegator.max_ordered_withdraw_allowed) + has_already_ordered = Decimal.positive?(@delegator.ordered_withdraw) + show_order_withdrawal = order_allowed or has_already_ordered + %> + + <% # display available amounts %> + <%= if has_already_ordered do %>

<%= gettext("Already Ordered:") %> <%= format_token_amount(@delegator.ordered_withdraw, @token) %>

<% end %> - <%= if Decimal.positive?(@delegator.max_ordered_withdraw_allowed) or Decimal.positive?(@delegator.ordered_withdraw) do %> -
<%= gettext("You Can Order:") %> - - <%= format_token_amount(@delegator.max_ordered_withdraw_allowed, @token) %> - - <%= render BlockScoutWeb.CommonComponentsView, "_i_tooltip.html", text: gettext("The amount can be claimed after the current epoch finishes.") %> + <%= if show_order_withdrawal do %> +
"><%= gettext("You Can Order:") %> + <%= if order_allowed do %> + + <%= format_token_amount(@delegator.max_ordered_withdraw_allowed, @token) %> + + <%= render BlockScoutWeb.CommonComponentsView, "_i_tooltip.html", text: gettext("The amount can be claimed after the current epoch finishes.") %> + <% else %> + + <%= format_token_amount(@delegator.max_ordered_withdraw_allowed, @token) %> + + <% end %>
- <%= - render BlockScoutWeb.StakesView, - "_stakes_btn_withdraw.html", - text: gettext("Order Withdrawal"), - extra_class: "full-width btn-add-full order-withdraw" - %> <% end %> - <%= if Decimal.positive?(@delegator.max_withdraw_allowed) do %> + <%= if withdraw_now_allowed do %>
<%= gettext("Available Now:") %> <%= format_token_amount(@delegator.max_withdraw_allowed, @token) %> <%= render BlockScoutWeb.CommonComponentsView, "_i_tooltip.html", text: gettext("You can withdraw this amount right now.") %>
- <%= - render BlockScoutWeb.StakesView, - "_stakes_btn_withdraw.html", - text: gettext("Withdraw Now"), - extra_class: "full-width btn-add-full withdraw" - %> <% end %> + + <% # display buttons %> + <%= + if show_order_withdrawal do + bottom_margin = if withdraw_now_allowed, do: " m-b-0-7", else: "" + render BlockScoutWeb.StakesView, + "_stakes_btn_withdraw.html", + text: gettext("Order Withdrawal"), + extra_class: "full-width btn-add-full order-withdraw" <> bottom_margin + end + %> + <%= + if withdraw_now_allowed do + render BlockScoutWeb.StakesView, + "_stakes_btn_withdraw.html", + text: gettext("Withdraw Now"), + extra_class: "full-width btn-add-full withdraw" + end + %>
<%= render BlockScoutWeb.CommonComponentsView, "_modal_bottom_disclaimer.html", text: gettext("

Pending stake (stake placed on a candidate pool or placed during the current staking epoch) may be withdrawn now.