Update account options menu design #8654
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|
This was done now because a separate change I was working on locally relating to the asset page resulted in the position of the account options menu being totally broken. Instead of fixing that issue, I figured we'd might as well replace the whole thing. |
Gudahtt
force-pushed
the
update-account-options-menu-design
branch
from
61e5601 to
c89ffaa
Compare
|
Here are the new designs I was following: https://www.figma.com/file/b8U583mpXW1FsPWfGFNT8C/Wallet-home-(popup-%2B-fullscreen)?node-id=217%3A104 Here are screenshots of the new account options menu:Typical case:
With a custom RPC endpoint and while an imported account is selected:
|
Gudahtt
force-pushed
the
update-account-options-menu-design
branch
from
c89ffaa to
f0a3f52
Compare
Builds ready [f0a3f52]
Page Load Metrics (599 ± 50 ms)
|
Gudahtt
force-pushed
the
update-account-options-menu-design
branch
from
f0a3f52 to
6557f5e
Compare
The `AccountDetailsDropdown` component has been rewritten to use the new `Menu` component, and to follow the latest designs. This should be functionally equivalent. A couple of the icons have changed, but that's about it. Support for a subtitle was added to `MenuItem` to support the `origin` subtitle used for the explorer link for custom RPC endpoints. A few adjustments were required to `test/helper.js` to accommodate the use of `Menu` from a JSDOM context (this is the first time it's been used in a unit test). A `popover-content` element was added to the fake DOM, and another global was added that `react-popper` used internally. An additional driver method (`clickPoint`) was added to the e2e driver to allow clicking the background behind the menu to dismiss it. This wasn't possible using the `clickElement` method, because that method would refuse to click an obscured element. The only non-obscured element to click was the menu backdrop, and that didn't work either because the center was obscured by the menu (Selenium clicks the center of whichever element is targeted).
Gudahtt
force-pushed
the
update-account-options-menu-design
branch
from
6557f5e to
77d6f9e
Compare
Builds ready [77d6f9e]
Page Load Metrics (657 ± 51 ms)
|
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
The
AccountDetailsDropdowncomponent has been rewritten to use the newMenucomponent, and to follow the latest designs.This should be functionally equivalent. A couple of the icons have changed, but that's about it.
Support for a subtitle was added to
MenuItemto support theoriginsubtitle used for the explorer link for custom RPC endpoints.A few adjustments were required to
test/helper.jsto accommodate the use ofMenufrom a JSDOM context (this is the first time it's been used in a unit test). Apopover-contentelement was added to the fake DOM, and another global was added thatreact-popperused internally.An additional driver method (
clickPoint) was added to the e2e driver to allow clicking the background behind the menu to dismiss it. This wasn't possible using theclickElementmethod, because that method would refuse to click an obscured element. The only non-obscuredelement to click was the menu backdrop, and that didn't work either because the center was obscured by the menu (Selenium clicks the center of whichever element is targeted).