The form used for creating a vault on the "Import" page of onboarding
and on the "Restore vault" page is nearly identical, yet the
implementation is totally separate. It has now been extracted to a
separate component, consolidating the two implementations.
There is a "terms of use" checkbox on the import page that isn't on the
restore vault page, so that part has been made optional. The "submit"
button text differs between the two uses as well, so that is
customizable.
There are slight styling differences between the old and new versions
of this form. The fonts and spacing are all using our new standard
design system guidelines, and we're using our standard checkbox now as
well. The spacing and font sizes were chosen somewhat arbitrarily by me
to resemble the old styles, so please feel free to suggest changes if
you think they can be improved upon.
There are some slight copy changes to the "Restore vault" page as well;
the placeholder text and the label for the "Secret Recovery Phrase"
field now matches the "Import" page copy.
* AccountMenu: fix#10168 w/ position: absolute
- use right: 1rem to match .app-header padding
* scss: Use px instead of rem for positioning
Co-authored-by: George Marshall <george.marshall@consensys.net>
Co-authored-by: George Marshall <george.marshall@consensys.net>
This commit fixes a few issues with ConfirmPageContainerSummary (which
holds the contract being used or action being performed and the money
being sent):
* Remove fixed height so that the secondary currency doesn't get cut off
or spill over
* Add missing padding
* Fix font size of primary and secondary currencies
* Add top border when there is a "address not in your address book"
alert at the top
Co-authored-by: Ariella <ariellavu@gmail.com>
This commit fixes a few issues with ConfirmPageContainerSummary (which
holds the contract being used or action being performed and the money
being sent):
* Remove fixed height so that the secondary currency doesn't get cut off
or spill over
* Add missing padding
* Fix font size of primary and secondary currencies
* Add top border when there is a "address not in your address book"
alert at the top
Co-authored-by: Ariella <ariellavu@gmail.com>
* Update the copy for the Flask welcome page (#13223)
* Update the copy for the Flask welcome page
The copy for the Flask Welcome page has been updated to better dissuade
users who are not the target audience, and to better explain the risks
of using Flask.
* Fix typo
* Suggested edits (#13225)
* Suggested edits
* fixup! Suggested edits
Co-authored-by: Erik Marks <25517051+rekmarks@users.noreply.github.com>
* Update app/_locales/en/messages.json
Co-authored-by: David Walsh <davidwalsh83@gmail.com>
Co-authored-by: Erik Marks <25517051+rekmarks@users.noreply.github.com>
Co-authored-by: David Walsh <davidwalsh83@gmail.com>
The first page of the Flask onboarding was causing a propType warning
to appear in the console. It was caused by the array of React Fragments
used to construct the ASCII fox; they were missing the `key` prop.
These fragments are static content, so React doesn't really need to
worry about what to do in the event they are re-ordered. The array
index has been used as the key to silence the warning.
When a lot of transactions are occurring on the network, such as during
an NFT drop, it drives gas fees up. When this happens, we want to not
only inform the user about this, but also dissuade them from using a
higher gas fee (as we have proved in testing that high gas fees can
cause bidding wars and exacerbate the situation).
The method for determining whether the network is "busy" is already
handled by GasFeeController, which exposes a `networkCongestion`
property within the gas fee estimate data. If this number exceeds 0.66 —
meaning that the current base fee is above the 66th percentile among the
base fees over the last several days — then we determine that the
network is "busy".
ESLint rules have been added to enforce our JSDoc conventions. These
rules were introduced by updating `@metamask/eslint-config` to v9.
Some of the rules have been disabled because the effort to fix all lint
errors was too high. It might be easiest to enable these rules one
directory at a time, or one rule at a time.
Most of the changes in this PR were a result of running
`yarn lint:fix`. There were a handful of manual changes that seemed
obvious and simple to make. Anything beyond that and the rule was left
disabled.
The ESLint config for the extension explicitly includes support for
Prettier. However, this is already being provided by our global ESLint
config (`@metamask/eslint-config`). Therefore there is no need to
include it here. In fact, this is causing weird issues where the `curly`
option is getting overridden somehow. After this change, these syntaxes
are invalid:
``` javascript
if (foo) return;
```
``` javascript
if (foo) return 'bar';
```
Niranjana Binoy
dragana8
Mark Stacey
Jyoti Puri
MG
Ariella Vu
Hassan Malik
Alex Donesky
Shane
yanjade
David Walsh
filipsekulic
VSaric
Jon Ator
Elliot Winkler