staking-BOOST vault deposit/withdrawal component issues

[rossgalloway]

What type of issue is this?

Bug Upgrade

What needs to be shipped?

Issue

Under the button on the Deposit/Withdrawal component when there is a "staking-BOOST" option, there is a button to toggle between "deposit only" and "deposit and stake". There are 2 main issues:

1. The "deposit" language remains when the components switches to withdraw functionality, making it seem like the vault may be in "deposit only" mode.
2. The styling of the button is unclear. Everywhere else, text in that location is informational (not a button) so it is easy to assume it isn't a button.

Fix

• Update logic so that when the component is changed to the withdraw, the button text and function reflect the withdrawal action.
• Make the button look more like a button (or move it).
• Make sure the language and styling doesn't imply that the vault is in "deposit only" mode.

Other Notes

• This is a useful test case to extend to the veYFI boost functionality and Make toggle to "deposit and stake" vs just "deposit" easier to find #22
• This fix should be coordinated so that we can use the same logic / component for both boost types.

Images:

[Majorfi]

Fixed 1 with commit 0f74083

[rossgalloway]

Here is the direction I think we want to go based on discussions with other team members:

• toggle button above button with text that says "deposit only" when off and "deposit and stake" when on, with an adjacent tooltip.
• button text changes when toggle is switched.
• It would also be good if the "To Vault" asset changed to the gauge asset when the button is toggled to "deposit and stake"
• (optional) Adding an animation to the button text change was suggested as another queue to let the user know something changed. Fly in from the bottom was suggested.

[Majorfi]

@rossgalloway let's use only one issue (duplicate with #22) 🙏

[rossgalloway]

will close #22

[Majorfi]

This PR added the switch. One thing to keep in mind is that if you have no veYFI, the button to switch to deposit & stake will be disabled for veYFI (to avoid false advert)
Let us know!

[rossgalloway]

I like the styling. But I don't think the disabled button makes sense if the user doesn't have veYFI. They should still be able to deposit and stake because they do get the min boost, but I think we need to let them know what their boost is.

Ideally, we show them their added veYFI APR and boost # under the button. WDYT?

[rossgalloway]

When deposit and stake is selected, can the to vault box show the staked token (yg-yv-USDS-1 for example)?

[Majorfi]

I like the styling. But I don't think the disabled button makes sense if the user doesn't have veYFI. They should still be able to deposit and stake because they do get the min boost, but I think we need to let them know what their boost is.

Ok, let's change this
Let's do:

• If no veYFI, display the min 6.40% instead of the range
• Otherwise the range

[rossgalloway]

Ok, let's change this Let's do:

* If no veYFI, display the min 6.40% instead of the range

* Otherwise the range

Ok, yes that is better than the toggle being disabled.

What can we do about showing a user with veYFI what their actual rate is though? Shouldn't be too hard. I have code that calculates boost here: https://github.com/yearn/yearn-devdocs/blob/master/src/components/veYFI-calculator/calculations.ts . APR is just boost x min rewards right?

[Majorfi]

@rossgalloway We are working on this, but could you move that to a sep issue for clarity? Thank you very much!

[rossgalloway]

New Issue is here: #60

[rossgalloway]

One minor change needed here. When depositing and staking, the "To Vault" box should show the staked gauge asset (ie yG-yvUSDS-1). When only depositing it should show the vault.

[rossgalloway]

completed