1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-12 04:37:13 +01:00
Commit Graph

2534 Commits

Author SHA1 Message Date
Brad Decker
fbe16e8a5f
various fixes to transaction list (#8673) 2020-05-28 13:00:51 -05:00
Whymarrh Whitby
93c2184bd9
Add metrics events for Wyre and CoinSwitch (#8677) 2020-05-28 13:54:52 -02:30
Whymarrh Whitby
f8137b7a66
Fix height of connect screen (#8675) 2020-05-28 12:22:16 -02:30
Mark Stacey
95a95ee4bc
Refactor transaction list token filtering (#8669)
The transaction list now filters by token in the `TransactionList`
component instead of in the transaction selector. This was done in
preparation for the asset page work.

Technically this approach is slightly less efficient than before, as
we're now filtering the transactions after they've been grouped
together rather than beforehand. The difference is minimal though, and
this method is more correct.

The old filtering was broken because it inappropriately filtered out
cancel transactions. Cancel transactions always have the `to` address
set to the same as the `from` address, and the token filter only
returned transactions where the `to` address was set to the token
address.

Now that we're only filtering by the `to` address of the initial
transaction, token transaction groups will be included in their
entirety, including any cancel transactions.
2020-05-28 00:11:15 -03:00
Whymarrh Whitby
3931427db8
Show hostname in the disconnect confirmation (#8663) 2020-05-27 19:39:14 -02:30
Whymarrh Whitby
34adccec7c
Fix JSDoc for Tabs#_findChildByName (#8664) 2020-05-27 19:10:26 -02:30
Mark Stacey
cc1170f577
Remove unused isWideViewport prop (#8662)
This prop is no longer required, now that the new fullscreen redesign
has been implemented. This was unused before the redesign as well,
seemingly by accident.
2020-05-27 18:36:55 -03:00
Whymarrh Whitby
4802ed1df5
Localize permission descriptions (#8661) 2020-05-27 18:15:10 -02:30
Mark Stacey
a0d64c7932
Implement new fullscreen design (#8657)
The fullscreen UI now shows roughly the same design as the popup UI.
A few additional changes depicted in the new fullscreen designs will
be implemented in subsequent PRs (e.g. the inline buttons on assets)

This was done now to make asset pages easier to implement. Implementing
asset pages solely for the popup UI would have been complicated by the
fact that we use viewport size to switch between the two layouts, so we
would have had to re-route upon resizing the window.
2020-05-27 17:28:33 -03:00
Brad Decker
398f2647c0
resolve remaining issues with transaction list (#8659) 2020-05-27 14:45:20 -05:00
Mark Stacey
a6f2156386
Update account options menu design (#8654)
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).
2020-05-27 12:31:53 -03:00
Brad Decker
706dc02cb4
Implement new transaction list design (#8564)
Co-authored-by: Whymarrh Whitby <whymarrh.whitby@gmail.com>
Co-authored-by: Mark Stacey <markjstacey@gmail.com>
2020-05-26 15:49:11 -05:00
Whymarrh Whitby
ab11e0b623
Rename preferencesSelector selector to getPreferences (#8647) 2020-05-26 03:41:58 -02:30
Whymarrh Whitby
835386bf35
Persist home tab state (#8612) 2020-05-25 16:31:28 -02:30
Mark Stacey
3cedf708e9
Remove duplicate 'Account options' tooltip (#8644)
The `title` HTML attribute already resulted in this having a tooltip.
We didn't need to add an extra one.
2020-05-22 14:42:09 -03:00
Mark Stacey
8379dd6a07
Refactor MenuBar component (#8643)
The `MenuBar` component has been converted to a functional component.
This was done to make upcoming changes related to the home screen
redesign easier to implement.
2020-05-22 14:11:42 -03:00
Brad Decker
684c58b94e
fix prop name for disconnect icon (#8641) 2020-05-21 16:12:38 -05:00
Brad Decker
389df9dd37
warn user when sending from different account (#8601) 2020-05-21 15:21:34 -05:00
Mark Stacey
dd41870f1d
Split TransactionViewBalance component (#8637)
The `TransactionViewBalance` component has been split into three
separate components. This was done primarily to make the asset page
easier to implement. Also the name `TransactionViewBalance` didn't
describe this component very well anymore.

Instead of the Ethereum and token-specific logic being in the same
component, the two cases were split into the `EthOverview` and
`TokenOverview` components respectively. They both use the
`WalletOverview` component, which has the structure shared by both
cases.
2020-05-21 14:33:48 -03:00
Mark Stacey
57531ad100
Fix AssetList metric events (#8639)
The metric events in the `AssetList` component were using the
`useMetricEvent` hook incorrectly.
2020-05-21 13:06:06 -03:00
Brad Decker
f9ea9b541a
add useI18nContext shortcut hook (#8635) 2020-05-21 10:26:49 -05:00
Brad Decker
ec99cc82b8
Design QA fixes for v8 (#8630) 2020-05-20 15:42:18 -05:00
Mark Stacey
f886686db2
Extract Menu component from ConnectedAccountsListOptions (#8632)
A `Menu` component has been extracted from the
`ConnectedAccountsListOptions` component. The menu and the menu items
are now the `Menu` and `MenuItem` components respectively.

A custom body was added to the Storybook preview to ensure that the
`popover-content` element was present in the DOM before the Menu was
constructed.
2020-05-20 14:52:23 -03:00
Mark Stacey
91953f062b
Remove unused network prop (#8633)
The `Identicon` component was being passed a `network` prop, despite
not accepting a `network` prop.

A duplicate set of `token-cell` tests have also been deleted, as they
used this prop. The tests were never run, because the file was misnamed
(it needs to be named `.test.js`).
2020-05-20 13:51:21 -03:00
Erik Marks
f748664638
Cleanup network enums (#8627)
* cleanup & consolidate network enums
2020-05-20 08:57:45 -07:00
Whymarrh Whitby
9e8f922c10
Remove unused index for dropdowns (#8615) 2020-05-18 19:14:40 -02:30
Whymarrh Whitby
3485bfbc5c
Sticky position the tabs at the top (#8609) 2020-05-18 16:22:42 -02:30
Mark Stacey
ce11fad81c
Improve account options menu (#8607)
The account options menu is now much faster, and it correctly closes
when 'Switch account' is selected.

A static width had to be set on the menu so that it could be positioned
reliably. Without this width set, it was rendered as a different size
before positioning than after, which resulted in it being positioned
incorrectly. A `z-index` had to be added (equal to the `z-index` used
by the popover component) to ensure it wasn't rendered beneath the
popover.

The menu is automatically positioned relative to the account options
button, appearing below the button by default but above it instead if
there isn't room below. It is positioned to be inside the bounds of the
popover as well.

The account options button is now a `<button>` rather than a `<i>`.
This required a few additional style rules to overrule the default
button styles. Additionally the size was increased so that it matches
the designs more closely.

The callbacks for connecting, disconnecting, and switching accounts
have been updated to use state and props to determine the correct
address to use, rather than being bound to the correct address
parameter in the render function. This means we aren't creating a new
function upon each render anymore.

The `showAccountOptions` method still needs to be bound once per
account, but this was switched to use more readable syntax (`.bind`,
instead of the double arrow function).

`react-popper` and `@popperjs/core` were both added as dependencies.
These should be used for any UI requiring relative positioning (e.g.
tooltips, menus, etc.). Older versions of these libraries are already
in our codebase as transitive dependencies of the tooltip library we're
using.
2020-05-18 14:51:29 -03:00
Whymarrh Whitby
d488c16df5
Add Connected Accounts modal (#8313) 2020-05-15 15:53:52 -03:00
Whymarrh Whitby
320804bb71
Delete unused DisconnectAll modal (#8599) 2020-05-15 15:32:46 -02:30
Mark Stacey
74007e054b
Update asset list styles (#8591)
The asset list has been updated to more closely match the new designs.
There are still a few major differences (e.g. the selection state, the
token menu) that can't be implemented until the asset screen has been
implemented.

The background color of the selected asset has been lightened, so that
it's less jarring until we remove it.
2020-05-14 09:49:50 -03:00
Mark Stacey
095eeab881
Update Home tab styles to match new designs (#8590)
The tabs on the Home page have been updated to match the new home
screen designs.

A new `activeClassName` prop was added to the `Tab` component to allow
applying different styles to the active tab state.

I ran into specificity problems when overriding the default `Tab` styles
because the import order of our CSS is bizarre and wrong. For now I've
used a crude workaround, but we can fix this properly later by changing
the import order to place styles likely to be overridden first.
2020-05-14 00:16:47 -03:00
Mark Stacey
204d197996
Convert AssetList to functional component (#8588)
The `AssetList` component is now a function rather than a class, and it
makes use of the new `useMetricsEvent` and `useUserPreferencedCurrency`
hooks.
2020-05-14 00:16:30 -03:00
Brad Decker
73272124b3
broaden usage options for list-item (#8587) 2020-05-13 16:19:14 -05:00
Mark Stacey
0ca5d1dc8a
Refactor asset list items (#8586)
All asset list items now use the same component (`AssetListItem`).
Previously the tokens and the Ethereum balance were totally separate
components, despite being styled similarly.

Various unnecessary DOM elements and style rules were removed, but the
overall list looks identical to how it looked before.
2020-05-13 17:41:15 -03:00
Mark Stacey
797ee2f4de
Remove redundant .scss file extension from SCSS imports (#8581)
The `.scss` file extension is not required when importing SCSS files.
It has been removed from all imports, for consistency. I chose to
remove it rather than add it everywhere because imports without the
extension seem to be more common.
2020-05-13 09:28:06 -03:00
Mark Stacey
a6d8d3d76e
Refactor identicon styles (#8580)
The CSS class for the fallback Ethereum logo used in the identicon
component was with the `AssetList` styles, and was confusingly named
`balance-icon`. It has been migrated to the identicon styles, and
renamed `identicon__eth-logo`.

A few redundant rules have been removed as well (they were always
overridden by inline styles).
2020-05-13 09:27:34 -03:00
Mark Stacey
fab049b1b0
Fix PropType of network prop of TokenMenuDropdown. (#8582)
The `network` prop of the `TokenMenuDropdown` component was mistakenly
set to "number" in #7779.
2020-05-13 09:26:57 -03:00
Brad Decker
0aa41e397e
factor out containers for currency components (#8543) 2020-05-12 14:07:35 -05:00
Mark Stacey
53ec42d95f
Add switch to connected account alert (#8532)
Add alert suggesting that the user switch to a connected account. This
alert is displayed when the popup is opened over an active tab that is
connected to some account, but not the current selected account. The
user can choose to switch to a connected account, or dismiss the alert.

This alert is only shown once per account switch. So if the user
repeatedly opens the popup on a dapp without switching accounts, it'll
only be shown the first time. The alert also won't be shown if the user
has just dismissed an "Unconnected account" alert on this same dapp
and account, as that would be redundant.

The alert has a "Don't show me this again" checkbox that allows the
user to disable the alert. It can be re-enabled again on the Alerts
settings page.
2020-05-12 10:01:52 -03:00
Mark Stacey
6868688a03
Remove unused Balance component props (#8570)
This component was indended to show both ETH/fiat and token balance,
but today is not used for token balance. As a result, large pieces of
this component and many props were unused in practice. The condition
about `formattedBalance` returning a falsy or `None` or `...` result
was also removed, as that doesn't seem to be possible.

The `balanceValue` passed into the `Balance` component in the asset
list has also been removed, as it isn't used.
2020-05-11 19:20:32 -03:00
Mark Stacey
c4fb514f3d
Allow disabling alerts (#8550)
The unconnected account alert can now be disabled. A "don't show this
again" checkbox has been added to the alert, which prevents that alert
from being shown in the future.

An alert settings page has been added to the settings as well. This
page allows the user to disable or enable any alert.
2020-05-08 16:45:52 -03:00
Mark Stacey
abf2294bf3
Update menu bar account hover background color (#8555)
The hover state background color of the "Account" in the popup home
screen menu bar has been updated to match the hover state background
color of the connected status indicator. Both hover state backgrounds
now match.
2020-05-07 23:36:48 -03:00
Mark Stacey
0688426b7c
Fix checkbox color when checked or indeterminate (#8552)
The checkbox color was sometimes incorrect after it was checked. I'm
not sure how to consistently reproduce this issue, but I was able to
make this happen most of the time if I clicked the checkbox while some
text was highlighted.

It seems that the `:checked` and `:indeterminate` pseudo-selectors were
not being applied right away for some reason. Either that or React
wasn't setting the `checked` state of the `input` element right away.

This problem has been worked around by using CSS classes instead of
pseudo-selectors. I am no longer able to reproduce the issue now.
2020-05-07 23:25:19 -03:00
Mark Stacey
5e5215f907
Add Checkbox id prop (#8553)
This prop allows associating the checkbox with a label.
2020-05-07 23:25:06 -03:00
Thomas Huang
39dad370c8
Fixes #8492 (#8533)
Adds min value for input in the advanced-gas-inputs component to prevent users from entering negative values on keypress, change, etc.
2020-05-06 09:59:34 -07:00
Mark Stacey
8a12257f8e
Add dropdown component (#8524)
This new dropdown component uses a native `select` element, thus
avoiding various issues encountered in attempting to reuse our existing
dropdown components for the new permission system alert modal.

The prefixed forms of `appearance` have been added temporarily so that
the component can be used in Storybook, as our Storybook config isn't
setup to do autoprefixing yet. Our real build system does handle
autoprefixing for this rule correctly already.
2020-05-06 11:48:38 -03:00
Mark Stacey
48d29e679b
Add Popover contentClassName prop (#8514)
This class is set on the Popover content. This was required for an
upcoming PR (the last permissions system alert).
2020-05-05 15:02:53 -03:00
Dan J Miller
fda4c94670
Design improvements for the Connect flow (#8494)
* Design improvements for the Connect flow

* Make new-account-modal close a button

* Update e2e tests for auto select account on connect flow
2020-05-04 18:10:09 -02:30
Erik Marks
e8fa0b7b5d
Consolidate and dedupe send selectors (#8506)
* consolidate & dedupe send selectors
2020-05-04 12:06:28 -07:00
Erik Marks
eacdb5d920
Move send selectors to selectors dir (#8505) 2020-05-04 11:27:14 -07:00
Erik Marks
5b06bf795b
Delete amountConversionRate and selectors (#8503) 2020-05-04 10:54:54 -07:00
Erik Marks
898f8458a2
Consolidate send, onboarding selectors (#8501)
* reorganize & dedupe send selectors
2020-05-04 08:22:34 -07:00
Brad Decker
eaa9f759f9
Fix connection modal style issues (#8433)
Resolves three different style issues due to overflow of content
and addresses an issue where UI was being squished due to available
screen real estate.

- On the choose account modal, when a user has enough accounts to need
to scroll within the account chooser, the last-connected data column
was squished. This is resolved by using a tooltip and icon for this data
rather than text printed in column.
- On the connection permission result screen where it shows the Dapp icon ->
Metamask icon, the bottom of the logos and dropshadows were being cut off
this was resolved by removing the height set on this element and allowing
it to fill the available space.
- On the confirmation screen the content appeared off center due to the scrollbar being overlayed instead of auto. This was resolved by removing some of the setting of manual overflow controls on the body element.
2020-05-04 12:04:41 -03:00
Erik Marks
786e82791e
Reorganize selectors directory (#8497) 2020-05-02 12:41:17 -07:00
Erik Marks
b397aa5725 review fixup 2020-05-01 18:52:23 -07:00
Erik Marks
15958683e5 enable disconnecting single or all accounts 2020-05-01 16:50:26 -07:00
Mark Stacey
165666b315
Remove unnecessary tx meta properties (#8489)
* Remove `estimatedGas` property from `txMeta`

The `estimatedGas` property was a cache of the gas value estimated for
a transaction when the default gas limit was set. This property wasn't
used anywhere. It may have been useful for debugging purposes, but the
same gas estimate is already stored on the `history` property so it
should be present in state logs regardless.

* Remove `gasLimitSpecified` txMeta property

The `gasLimitSpecified` property of `txMeta` wasn't used for anything.
It might have been useful for debugging purposes, but whether or not
the gas limit was specified can also be determined from looking at the
transaction history, so it's not a huge loss.

* Remove `gasPriceSpecified` txMeta property

The `gasPriceSpecified` property of `txMeta` wasn't used for anything.
It might have been useful for debugging purposes, but whether or not
the gas price was specified can also be determined from looking at the
transaction history, so it's not a huge loss.

* Remove `simpleSend` txMeta property

The `simpleSend` property of `txMeta` was used to ensure a buffer was
not added to the gas limit during gas estimation for simple send
transactions. It was made redundant by #8484, which accomplishes this
without the use of this property.
2020-05-01 08:44:05 -03:00
Brad Decker
ee5e84af61
Convert connected-status-indicator to button (#8428) 2020-04-29 16:25:15 -05:00
Mark Stacey
53feb20803
Alert user upon switching to unconnected account (#8312)
An alert is now shown when the user switches from an account that is
connected to the active tab to an account that is not connected. The
alert prompts the user to dismiss the alert or connect the account
they're switching to.

The "loading" state is handled by disabling the buttons, and the error
state is handled by displaying a generic error message and disabling
the connect button.

The new reducer for this alert has been created with `createSlice` from
the Redux Toolkit. This utility is recommended by the Redux team, and
represents a new style of writing reducers that I hope we will use more
in the future (or at least something similar). `createSlice` constructs
a reducer, actions, and action creators automatically. The reducer is
constructed using their `createReducer` helper, which uses Immer to
allow directly mutating the state in the reducer but exposing these
changes as immutable.
2020-04-29 14:10:51 -03:00
Mark Stacey
e20ca4668e
Return Promise from addToAddressBook thunk (#8450)
`addToAddressBook` returned a thunk that didn't return a Promise,
despite doing async work. It now returns a Promise.

The callers of this action creator were updated to `await` the
completion of the operation. It was called just before redirecting the
user to a different page or closing a modal, and it seemed appropriate
to wait before doing those things.
2020-04-29 01:59:49 -03:00
Whymarrh Whitby
eb06394dd9
Delete Dai/Sai migration notification (#8418) 2020-04-27 16:23:43 -02:30
Erik Marks
40cd976e8c
Fix connected sites modal styling; add shortenUrl function (#8409)
* fix content row styling

* fix border styling

* handle long domain names
2020-04-27 08:36:08 -07:00
Erik Marks
266d6e67fe
Rename addressSlicer function to shortenAddress (#8408) 2020-04-24 09:52:09 -07:00
Mark Stacey
bace02ad02
Remove unused ShapeShift components (#8402)
The `shift-list-item` component for displaying ShapeShift transactions
has been removed, along with three other components that were used
solely by that component (`copyButton`, `eth-balance`, and
`fiat-value`).

This component hasn't been used in some time, as ShapeShift
transactions no longer exist to display. The controller that ShapeShift
transactions originated from was removed in #8118, and it became
impossible to create new ShapeShift transactions from within MetaMask
in #6746
2020-04-24 12:33:24 -03:00
Mark Stacey
cc41dee92c
Remove leftover references to Coinbase (#8403)
Coinbase was removed as a deposit option some time ago.
2020-04-23 20:32:15 -03:00
Mark Stacey
5fe25e41b7
Remove unused network nonce state (#8395)
This state hasn't been used since #5886. The nonce we display in our UI
is now from the background, rather than queried directly from the
front-end.

This also means we save making this network call each time a pending
transaction is added, and each time the transaction list is mounted.
2020-04-23 13:23:22 -03:00
Dan J Miller
01985b2cff
Connected indicator info popup (#8293)
* Add popover for informing user about the connected status indicator

* Ensure user only sees connected status info popover once

* Default connectedStatusPopoverHasBeenShown to true and set it to false in a migration

* Add unit test for migration 42

* Initialize AppStateController if it does not exist in migration 42

* Update connect indicator popup locale text

* Code cleanup for connected-indicator-info-popup

* Code cleanup for connected-indicator-info-popup
2020-04-22 14:41:36 -02:30
Erik Marks
1f49772ca3
Create new tabs instead of windows in most cases (#8347)
* openExtensionInBrowser: create tab, not window

* open tabs instead of windows in most cases
2020-04-16 14:34:40 -07:00
Mark Stacey
8e03a96470
Rename non-existent selectedAccount prop to fromAccount (#8337)
The prop passed into the SignatureRequestHeader was changed from
`selectedAccount` to `fromAccount` in #8079, but the header component
itself was never updated to use the new prop name.
2020-04-15 11:41:34 -03:00
Mark Stacey
ec40c1fdeb
Remove undeclared name variable from render (#8336)
The header component for the new Signature Request screen has an
undeclared variable called `name` in it. This was present in the
original implementation of this component in #6891. It's unclear what
this was supposed to be, and it doesn't seem to reference anything that
exists.
2020-04-15 11:41:11 -03:00
Mark Stacey
b628ff05d1
Rewrite checkbox component (#8305)
This new checkbox component uses a plain `input` component internally,
so the browser treats it like a native checkbox. It is styled by hiding
the native checkbox and replacing it with Font Awesome icons (the same
that we are using in Figma).

Support for a 'disabled' state and an indeterminate state has been
added as well. The `onClick` prop has been made optional, as it may not
be required if the parent component is intercepting the click instead.

The `regular` Font Awesome font style needed to be added so that we
could use the `far fa-square` icon for the unchecked checkbox.
2020-04-09 18:51:12 -03:00
Whymarrh Whitby
55228ef08c
Show correct description for empty Connected Sites modal (#8298) 2020-04-08 10:14:54 -02:30
Thomas Huang
a67ac8dd61
Change fa-refresh to fa-sync (#8301)
fa-sync has replaces fa-refresh in version 5 of font-awsome
https://fontawesome.com/icons/sync?style=solid
2020-04-07 14:51:22 -07:00
Whymarrh Whitby
6aa8e78006
Make ConnectedStatusIndicator clickable (#8297) 2020-04-07 18:53:18 -02:30
Whymarrh Whitby
049b98e965
Close Account Details dropdown after opening Connected Sites (#8299) 2020-04-07 18:21:35 -02:30
Dan J Miller
d1e078b8de
Connect flow via popup (#8269)
* Connect screen popup redesign

* Open permission request in notification instead of tab

* Remove no longer user locales

* Update permissions unit test mock to accout for change of opts passed to permissions controller

* Lint fix

* Inline broken line svg in permission-page-container-content.component.js for faster loading

* Add back button to second screen on connect flow

* Add xOfY locale and use for the page count in the connect flow

* Lint fix for svgs permission-page-container-content.component.js

* Fix rebase error

* Lint fix

* Clean up styles on the connect-screen-into-popup branch

* Use closeCurrentWindow to close window on cancel when in full screen connect flow

* Handle errors in rejectPermissionsRequest

* Full screen styles for connect flow

* Lint fixed in permissions-connect and actions.js

* Redirect screen now shows metamask icon instead of users identicon

* Fix subtitle spacing in permissions-connect-header'

* Use window.close instead of closeCurrentWindow() in cancelPermissionsRequest

* Use permissions-connect-header__subtitle in permissions-connect-header.component
2020-04-07 16:08:15 -02:30
Whymarrh Whitby
d8e0c9edd9
Use @metamask/etherscan-link@1.1.0 (#8294) 2020-04-06 13:38:44 -02:30
Mark Stacey
addbf4c62a
Add footer to Popover (#8291)
There were two existing cases where a footer was added to a popover by
putting it in the popover contents. This has been refactored to place
the footer in the popover instead, so that styles common to all
popover footers could be shared.

The popover now has a `section` element instead, giving the `header`
and `footer` elements a correct section context.
2020-04-02 14:43:50 -03:00
Mark Stacey
b09895b8b4
Replace static popover height with responsive max-height (#8290)
The height of the popover is now set to a maximum of 94% of the
viewport height, rather than a static height of 564px. This setting
ensures that the popover has a maximum height of exactly 564px in the
popup, which matches the designs. However it is now able to shrink or
grow to accommodate larger viewports or smaller popovers.
2020-04-02 13:37:46 -03:00
Whymarrh Whitby
f9e8a01dca
Remove z-index from IconWithFallBack (#8289) 2020-04-02 12:48:40 -02:30
Dan J Miller
af24309dc0
Connect screen multi accounts tooltip (#8181)
* Implement tooltip and styled sentence parts on header text of second screen of multi-account-select flow

* Clean up code related to the multi-accounts tooltip implementation
2020-04-02 12:47:10 -02:30
Whymarrh Whitby
09450fe765
Remove selectedAddress from SelectedAccount component (#8285) 2020-04-02 11:49:19 -02:30
Whymarrh Whitby
1b38b4867a
Delete Close icon component (#8286) 2020-04-02 11:49:07 -02:30
Dan J Miller
d8179ff030
Connect Screen Multi Select (#8078)
* Add UI for selecting multiple accounts on the first permissions connect screen

* Make accounts list scrollable on connect screen

* Change title wording on connect screen to 'select your accounts'

* Add select all tooltip to info circle on top of connect screen account list

* Add security info footer to the first screen of the connect flow

* Apply redesigns to page 2 of connect flow

* Display number of accounts on connect flow second screen if there are multiple to connect

* Update e2e tests for connect screen multi-select changes

* Remove unused chooseAnAcount message

* Fix styling/display of redirect elements on second page of connect flow

* Assorted small fixes in permissions connect

* Remove unnecessary tiny delays in spec files

* Remove incorrect use of bem modified in choose-account

* Remove unused locale

* Use Set for managing selected accounts in choose-acount and permissions-connect componets

* Compone!

* Move connect flow header into a reusable component, and implement new header designs

* Update locales and add missing locales

* Improve permission list item design (second screen of connect flow)

* Check box component improvements

* Fixes in variables.scss

* Simplfy code in selectAll of choose-account.component

* Hide checkboxes on first pages on connect flow when there is only one account

* Allow autofill of default new account modal text with right arrow

* Disable next button on first screen of connect flow when no accounts selected

* Improve choose-account/index.scss

* Remove metamask secure graphic

* Fix connect flow redirect screen

* Fix connectToMultiple locale

* Remove locales no longer used after connect flow multiple connect updates

* Fix size of dapp icon on redirect screen of connect flow

* Clean up choose-account code

* Stop using placeholder in new-account-modal

* Remove unused styles in permission-page-container/index.scss

* Pass origin instead of site name to PermissionsConnectHeader in connect flow

* Make iconName a required prop in permissions-connect-header

* Show checkbox in cases where there is one account in the choose-account list

* Do not render select all checkbox when only 1 list item, instead of just hiding it

* Small cleanup in choose-account/index.scss
2020-04-02 06:39:53 -02:30
Whymarrh Whitby
4229892fca
Refactor Menubar and AccountDetailsDropdown styles (#8278) 2020-04-02 00:08:45 -02:30
Whymarrh Whitby
ccf5d5d36c
Undefine Tooltip default wrapperClassName (#8283) 2020-04-01 23:12:19 -02:30
Whymarrh Whitby
e32417d51f
Remove unused 2nd argument to checksumAddress (#8282) 2020-04-01 23:12:03 -02:30
Mark Stacey
44effa0d91
Replace METAMASK_UI_TYPE global with helper function (#8279)
We don't need to store the current UI type as a global. We're already
using the `getEnvironmentType` helper function throughout the UI, so
we'd might as well use that instead of this global state.
2020-04-01 19:28:10 -03:00
Mark Stacey
043ed6cbdb
Restore History title on wide viewport (#8277)
The `History` title above the transaction history was changed in #8264
to only show when there are pending transactions, because it was
redundant to show an additional `History` title below a tab called
`History`. It was preserved when there were pending transactions
because the pending transactions are shown first in the list, followed
by the history, so the title served to divide the two lists.

This ended up breaking the fullscreen view though, which doesn't use
tabs yet. It has been updated to always show on fullscreen.
2020-04-01 18:11:50 -03:00
Whymarrh Whitby
6b6615be27
Enable react/jsx-first-prop-new-line for multiline, single prop JSX (#8276)
* Enable react/jsx-first-prop-new-line for multiline, single prop JSX
* yarn lint --fix
2020-04-01 18:08:19 -02:30
Whymarrh Whitby
8459e8dda1
Don't render the ConnectedStatusIndicator outside of the popup (#8275) 2020-04-01 17:11:42 -02:30
Dan J Miller
d1cd2bb618
Fix centering of account info in menu bar (#8274) 2020-04-01 17:11:26 -02:30
Whymarrh Whitby
7b9e209174
Split AccountDetailsDropdown into container and component files (#8273) 2020-04-01 16:45:35 -02:30
Dan J Miller
3f38451f3e
Connected status indicator (#8270)
Co-authored-by: Whymarrh Whitby <whymarrh.whitby@gmail.com>
2020-04-01 16:14:59 -02:30
Mark Stacey
cb0ab90c84
Move asset list to home tab on small screens (#8264)
Two tabs have been created on the home screen: 'Assets' and 'History'.
This tabbed view is shown only on small screens (e.g. in the popup).
The fullscreen view is unchanged.

The toggle-able left sidebar no longer exists, so some 'sidebar-left'
specific code and styles have been removed. The button in the menu bar
has been removed as well.

The 'History' title of the transaction history is now redundant when
where are no pending transactions, so it as been conditionally hidden.

A passthrough for `data-testid` has been added to the Tab component for
convenience in e2e tests.
2020-04-01 13:35:07 -03:00
Mark Stacey
3f2bf36f6a
Add additional prop validation to Tabs component (#8267)
The Tabs component expects the `children` prop to be either a single
Tab component or an array of Tab components, and the internal tab index
should always map onto one of these components. However, if an invalid
tab index was set, it was just returning the first tab contents.

Instead it will now validate that the tab being asked for does exist,
and throw an error otherwise.
2020-04-01 11:29:33 -03:00
Whymarrh Whitby
cb7f81bb42
Update Connected Sites modal design (#8262) 2020-03-31 19:40:02 -02:30
Mark Stacey
2d66e90d07
Refactor asset list into separate component (#8263)
The pieces that we'll be referring to as the "Asset List" in the near
future have been extracted from WalletView into a separate AssetList
component. This list includes ETH, the tokens, and the 'Add Token'
button.

The styles were moved alongside this new component as well.
2020-03-31 16:48:11 -03:00
Mark Stacey
a554353ef3
Update token cell to show inline stale balance warning (#8259)
The token cell how shows a warning inline for the case where the token
balance failed to update. It displays a warning icon next to the
balance, with a tooltip that contains the same contents as was shown on
the token list previously.
2020-03-31 10:50:32 -03:00
Mark Stacey
4f80ff5b01
Redesign 'Add Token' component (#8260)
The 'Add Token' component has been redesigned to be more in-line with
the new home screen design. The description instructing the user to
click the 'Add Token' button has been removed, and the section itself
has been made roughly the same size as one of the list item. The text
now appears on just one line, overflowing to two if necessary.
2020-03-31 10:31:32 -03:00
Mark Stacey
f9767ed191
Add 'interactive' tooltip prop (#8258)
The 'interactive' prop for React Tippy will keep the tooltip open when
the user moves the mouse over the tooltip. This enables interactive
tooltips, where the user is expected to click on something in the
tooltip (e.g. a message with a link).
2020-03-30 23:44:20 -03:00
Mark Stacey
f7504d153e
Move TokenCell styles alongside component (#8257)
The styles for the TokenCell component have been moved to be alongside
the component. They have also been renamed from `token-list-item` to
match the component name.
2020-03-30 23:44:10 -03:00
Whymarrh Whitby
d1f761956a
Add optional portal to Popover component (#8253) 2020-03-30 18:25:17 -02:30
Mark Stacey
079db2fdb4
Remove use of webpack loaders in components (#8249)
Various SVGs were being imported directly in components using Webpack
loaders. This was done to get these components to work correctly in
storybook, which uses Webpack. However we don't use Webpack for our
actual build system, so these components would fail when you attempted
to use them.

Instead the storybook script has been updated to use the `--static-dir`
flag, which allows specifying a directory of files to serve statically.
The `app` directory is served statically, so all of the relative URLs
we use in practice to reference fonts and images should just work.

The storybook build command has been updated to use the same flag.
Unfortunately this also means that the uncompiled background code is
now included in the build as well, because it's alongside our static
files. This shouldn't have any impact upon the build though.

The use of this `static-dir` option as made much of the existing
storybook Webpack configuration unnecessary, so it has been reduced to
just the essential steps.
2020-03-30 15:38:02 -03:00
Mark Stacey
4b59d6099a
Fix token list when balance is zero (#8250)
The token list would be stuck on "Loading" when there was at least one
token, but the balance of all tokens was zero. This bug was only
present on `develop`, and has not affected any published version of the
extension.

This was introduced in #8223, which removed what at the time seemed to
be an unnecessary update step. It turns out that the step was required
as a workaround to this bug with the token tracker.

The bug was fixed in https://github.com/MetaMask/eth-token-tracker/pull/33
and published in v2.0.0 of `@metamask/eth-token-tracker`.
2020-03-30 15:37:51 -03:00
Mark Stacey
966c38cd99
Refactor token list (#8233)
* Refactor token list into standard container/component modules

The token list has been moved into its own directory and split into
separate container and component modules. Additional updates have been
made to simplify the component logic as well.

* Update token-list to use new React Context API
2020-03-25 21:43:25 -03:00
Mark Stacey
ade737e2a8
Refactor token list click handler (#8234)
The token list click handler has been moved up from the token cell to
the wallet view component where the token list is used. This keeps the
responsibilities of the token list and token cell components a bit more
focused - they're now only responsible for display, not what the
effects of clicking should be.
2020-03-25 18:24:14 -03:00
Mark Stacey
19c58b2f32
Move token cell unit test into component directory (#8237)
This is the conventional location for UI unit tests.
2020-03-25 15:56:48 -03:00
Mark Stacey
4328db78d7
Remove unused token cell methods and props (#8238)
The `network` prop was being passed to the Identicon despite that not
being an Identicon prop, and the `userAddress` prop was being passed
down by the container but was unused. The methods removed were not
called anywhere.
2020-03-25 14:59:16 -03:00
Mark Stacey
1e93340c16
Fix unit tests using shared test doubles (#8235)
These tests broke when `sinon.restore()` was called in a separate test
because they setup stubs/spies using `sinon` in the module context.
These were constructed then restored before the tests even ran.

Instead the test doubles are now setup in the `beforeEach` hook, which
in addition to fixing this problem also ensures each unit test is
isolated from the others.
2020-03-25 14:45:23 -03:00
Mark Stacey
1105da7800
Refactor tab styles to minimize tab component styles (#8209)
* Refactor tab styles to minimize tab component styles

The tab component styles were not applicable to all tab instances, so
they were being overridden in a few places. Instead the tab styles have
been reduced to a minimal set that should be applicable in most cases.

There are a few functional changes here as well, meant to undo
changes made accidentally in #8132. Before that PR the page container
was overriding the tab styles altogether, but after that PR they were
combined with the base tab styles instead.

* Remove background color

This was previously being overridden by the page container styles, and
it matches the inherited background color already in the one other case
(the confirm page for token interactions)
2020-03-23 21:18:45 -03:00
Mark Stacey
c167fbf903
Remove unnecessary token list update (#8223)
When the token tracker is first constructed and the first balance
update is triggered, we manually serialize the tracker state and call
our update function. This is _in addition_ to the update event handler
though, so the balances get updated twice. Similarly, we also catch any
errors during this first update to handle them, but this is done via an
event as well, so is redundant.

These steps have been removed; updates and errors are now handled
solely through events. We were able to drop a check from
`updateBalances` as well to ensure the tracker is still running, as the
event cannot be emitted unless it's running.
2020-03-21 17:35:08 -03:00
ricky
84806bed9b
Add border none for moz-focus-inner (#8217) 2020-03-19 12:44:20 -04:00
ricky
ba18f600fb
Tx popover (#8210)
* Add minimal working popover

* Fix styling of popover component

* Use lorem ipsum

* Update classnames and remove unrelated styles

* Remove unused components

* Add SVG close icon

* Add Close icon to icon stories

* Use div

* Use `addon-actions`

* Use `<button>` for close

* Fix button wobble in Firefox

* Remove border
2020-03-19 12:07:12 -04:00
ricky
8ba35f673e
Add tx list-item component (#8195)
* Add tx list-item component

New list item compoent for transaction history

* Simplify component logic and remove type checks

* Address remaining feedback

* Remove extra line

* Place className prop on its own line

* Rename to primaryCurrency and secondaryCurrency

* Make the title `isRequired`

* Fix no-undef

* Remove more + buttons to be implemented in seperate PR

* Add minimal store and I18nProvider to storybook

* Use Component to support translations

* Add `metamask` to store

* Rename decorator
2020-03-17 15:15:53 -04:00
Mark Stacey
e1d0f3659e
Fix highlighting of selected asset (#8205)
The current selected asset in the asset list should be highlighted, but
this highlighting was broken for `ETH`. `ETH` was not highlighted when
it was selected, but it would be highlighted when anything else was.

This was broken accidentally in #7546
2020-03-17 14:45:46 -03:00
Brad Decker
23bfa59bfd
fix #6958: fix destructuring of lastSelectedProvider (#8197) 2020-03-16 15:48:12 -03:00
ricky
45efbbecb7
Use new Copy icon (#8190)
* Use new Copy icon

* split props to two lines

* Add padding
2020-03-16 09:44:02 -04:00
Mark Stacey
74b519959b
Fix Tab prop type warning (#8185)
The props `isActive` and `tabIndex of the Tab component are required
and are always passed in, but the prop type warning is triggered
because the tabs are rendered without these props first, then cloned by
the `Tabs` component, where these props are added.

To silence the warning, the props have been made optional.
2020-03-13 10:49:17 -03:00
Mark Stacey
61fdb56864
Use specified gas limit when speeding up a transaction (#8178)
The sidebar used to speed up a transaction while it's pending or after
it has failed currently allows editing the gas limit, but that new
limit is ignored. This is especially problematic for transactions that
failed due to a low gas limit, as the problem becomes impossible to fix
by retrying.

The gas limit specified by the user is now used in the speed up
transaction.

Fixes #8156
Fixes #7977
2020-03-12 11:33:11 -03:00
Thomas Huang
e791882959
Handle and set gas estimation when max mode is clicked (#8176)
* Handle and set gas estimation when max mode is clicked
Add componentDidMount to SendAmountRow to check for maxMode boolean to update amount and gas.
2020-03-11 13:13:48 -07:00
ricky
3cd35fe0ae
Add tx history icons (#8180)
* Add tx history icons

* Make size `isRequired`

* Use classnames

* Include keyframes
2020-03-11 14:05:47 -04:00
Mark Stacey
ad5174a588
Fix retry transaction (#8177)
The `createRetryTransaction` was accidentally removed from the
`gas-modal-page-container` component during a refactor in #7730.
Attempting to retry a transaction since that change has resulted in a
UI crash.
2020-03-11 12:07:48 -03:00
Dan J Miller
5c4831bdee
Notifications Icon Circles (#7830)
* Adds notification icon circles and associated storybook stories

* Fix image paths in circle-icon.stories and message-circle-icon.component

* Code improvements for icon circles PR: remove additional z-index, make iconSource required

* Use component story format in circle-icon.stories and message-circle-icon.stories

* Remove success and info circle icons, as not presently needed

* Rename message-circle-icon to alert-circle-icon

* Small code fix ups for alert-circle-icons
2020-03-11 12:30:39 -02:30
Erik Marks
2df8b85c5f
LoginPerSite: Support multiple accounts without automatic switching (#8079)
* transaction editing: use txParams 'from' account

* signature-request: use txParams 'from' account

* signature-request-original: use txParams 'from' account

* encryption/decryption: use txParams 'from' account

* update tests

* set 'send' state 'from' address in confirm containers
2020-03-06 13:34:56 -08:00
Mark Stacey
47a7176e71
Use consistent variable name for classnames import (#8143)
The variable name `classnames` is generally what we use for this
module, and single-letter variable names are generally frowned upon.
2020-03-01 06:14:16 -04:00
Mark Stacey
f1750d2807
Remove unnecessary variables for state and props (#8144)
The use of these variables confuses the ESLint plugin I use for VSCode.
It's also not useful.
2020-03-01 06:14:07 -04:00
Mark Stacey
ae1ed7079f
Fix token cell props (#8142)
The `hideSidebar` proptype of `TokenCell` was set as an optional bool,
when it should have been a required function.
2020-03-01 06:13:59 -04:00
Mark Stacey
887bc078d7
Fix bug preventing dropdown close upon outside click (#8145)
The base component we use for dropdowns handles ensuring the dropdown
is closed when the user clicks outside the dropdown. This functionality
was accidentally broken in #7781 when converting it to an ES6 class.
2020-03-01 06:13:49 -04:00
Mark Stacey
2b1a22b8b1
Consolidate Home UI (#8141)
The "Transaction View" component has been merged with the Home
component. The division between these two components seemed wrong
because the "Transaction View" contained the menu bar (distinctly a
"home" thing, not a "transaction" thing), and we will be adding more
non-transaction-related components shortly.

This also let us use a single `Media` component instead of two.
2020-02-28 17:46:01 -04:00
Mark Stacey
fa3497e39b
Move home notifications upwards in DOM (#8138)
The notifications displayed on the home screen were being passed
through the `TransactionView` and `TransactionList` components before
being rendered. This was unnecessary because the notifications are
absolutely positioned.

They are now rendered directly in the home component where they're
defined. A helper function has been written to improve readability.
2020-02-28 16:27:58 -04:00
Mark Stacey
b534ecb2e1
Add stories for Tabs component (#8134)
This effectively covers the `Tab` component as well, which doesn't
really make sense to showcase on its own.

One minor change was made to the actual `Tabs` component; `children`
was marked as a required prop. It doesn't render anything sensible if
they are omitted, and it always has at least one child in our codebase.
2020-02-28 09:49:31 -04:00
Mark Stacey
7e4916e59e
Simplify tab component (#8132)
The tab component now sets the `tab` and `tab--active` classes
internally regardless what class is passed in. The convention in React
is to allow adding _additional_ classes via the `className` prop, not
to allow removing internal classes entirely.

the `activeClassName` prop was removed entirely. A few other props that
are always passed in have been marked as required.
2020-02-27 18:00:42 -04:00
Mark Stacey
ac4e1d4e26
Remove faux <header> elements (#8131)
We have been using the HTML `header` tag in various footers. The
`footer` tag is generally more appropriate for use in a footer.
2020-02-27 18:00:20 -04:00
Mark Stacey
46157cb476
Remove redundant PropTypes (#8126)
Specifying a PropType of either type `node` or type
`arrayOf(PropTypes.node)` is redundant, because an array of nodes is
itself a node.
2020-02-27 10:31:59 -04:00
Mark Stacey
53d25d01a6
Add stories for Identicon component (#8113)
One main configurable story has been added, plus a few distinct other
examples. All props are covered except `className`, which seems safe to
ignore.

Default props have been added to `Identicon` to make more explicit what
defaults were expected; there is no functional change.
2020-02-26 22:08:58 -04:00
Erik Marks
5d1f3c1436
Delete shapeshift functionality; retain state and display (#8118)
* delete shapeshift functionality; retain state and display
2020-02-26 09:34:46 -08:00
Mark Stacey
7a9f53c99d
Use Component Story Format for stories (#8108)
The recommended way of writing stories changed in Storybook v5.2 to
the Component Story Format (CSF). Instead of using `storiesOf` and
running everything upon module import, the new story format is a
declarative description of each component that uses ES6 import
semantics.
2020-02-26 10:13:56 -04:00
Mark Stacey
cb995d66da
Re-render jazzicon component when diameter changes (#8114)
Previously when the `diameter` prop of the `jazzicon` component was
changed, the new diameter would be ignored. The jazzicon is now
redrawn upon each change, as you would expect.

I don't think it's possible for this bug to manifest itself in the
extension. This was discovered through tinkering with the Storybook
for this component.
2020-02-26 09:42:33 -04:00
Mark Stacey
0a0040842c
Fix display of identicon on Connect page (#8107)
The identicon was showing as a white circle on the connect page. This
was a CSS error introduced when `jazzicon` was updated in #7898.

The white circle shown was the white border around the identicon. This
circle is an adjacent `div` in the DOM, and was rendered _underneath_
the identicon itself because it was placed first in the DOM.
Unfortunately the new version of `jazzicon` is no longer explicitly
positioned (it used to have `position: relative` set internally), so
now it's lower in the stack order regardless of DOM position.

Rather than placing the border adjacent and relying upon both elements
being positioned, the border has been changed into a wrapping `div`
instead. Now the stack order is more explicit.
2020-02-26 09:34:39 -04:00
Erik Marks
83da3db37b
Remove selected address history (#8104)
* remove selected address history, account switching; fix perm selectors, bugs

Co-Authored-By: Mark Stacey <markjstacey@gmail.com>
2020-02-25 14:39:38 -08:00
Whymarrh Whitby
169ab8adc9
Remove recompose (#8097) 2020-02-24 19:28:26 -03:30
ricky
54f0830324
Use destructuring assignment (#8093)
* Use destructuring assignment

* remove `state` const

* Use defaultProps
2020-02-24 14:38:41 -05:00
Whymarrh Whitby
81d8237654
Use eslint-plugin-react@7.18.3 (#8085) 2020-02-24 15:24:35 -03:30
Whymarrh Whitby
8f26f5a021
Remove redux-test-utils dependency (#8070)
* Remove usages of redux-test-utils
* Remove redux-test-utils dependency
2020-02-18 14:54:03 -03:30
Whymarrh Whitby
da0300d3b1 Enable core ESLint no-mixed-operators rule 2020-02-17 21:06:36 -03:30
Whymarrh Whitby
a78cf0ef3a Enable arrow-parens ESLint rule 2020-02-15 17:04:21 -03:30
Vodopyanov Egor
b63b848ed4
add title to transaction action component (#8050) 2020-02-14 12:31:44 -04:00
Mark Stacey
dcc7d29511
Refactor QR scanner to move all error handling within component (#7885)
The QR scanner component error handling would sometimes redirect the
user to the wrong page. It was also confusingly handled in two places;
the action used to open the QR scanner, and the scanner component.
The error handling has now been corrected, simplified, and integrated
into the QR scanner component itself.

The old way of handling an error within the component was to close the
modal, then call the action to open it all over again. This action took
a route parameter, which instructed the action on which route to open
if the fullscreen UI needed to be opened (as the fullscreen UI is the
only one where the browser will show the camera permission prompt).

This redirection worked just fine for handling the initial opening
of the QR scanner modal. But for any subsequent errors the same action
was used with a _default route_, meaning the user could click "try
again" and find themselves on a completely different screen.

Instead, errors now trigger a state change instead of closing and re-
opening the modal. The permission checks in the action have been
integrated into the component as well.

One functional change is that the scenario where you have an invalid
QR code has been made an error. Previously this just showed the error
message below the video preview, but left the user with no way to try
again. There error page has a "Try again" button, so it seemed better
suited as an error. Also the message literally started with "Error:".

Another functional change is that _all_ errors during initialization
will result in the error UI being shown. Previously there was one error
case that would instead log to the console and leave the user stuck.
2020-02-13 16:07:50 -04:00
Whymarrh Whitby
7f3cf07f94
Update sinon and proxyquire (#8027)
* Use sinon@8.1.1
* Use proxyquire@2.1.3
* Move sinon mocking out of global scope into hooks
2020-02-11 17:03:32 -03:30
Whymarrh Whitby
4f3fc95d50
Update ESLint rules for test suite (#8023)
* Use @metamask/eslint-config@1.1.0
* Use eslint-plugin-mocha@6.2.2
* Mark root ESLint config as root
* Update Mocha ESLint rules with shared ESLint config
2020-02-11 13:21:13 -03:30
ryanml
3bbbe13311
Use contact name instead of address during send flow (#7971) 2020-02-11 12:10:15 -03:30
Thomas Huang
5d1c9313db
Various component tests and some conditional statements (#7765)
* Various component tests and some conditional statements

Conditional in account-menu in removeAccount when keyring sometimes is not initially provideed
Conditional on unlock-page when there is no target.getBoundingClientRect on the element.

* Update helpers

* Remove component debugging

* Add default params for render helpers

* Remove stubComponent for old Mascot
Changes in https://github.com/MetaMask/metamask-extension/pull/7893 has prevented the need to stub it out.

Change logout to lock in account-menu test
2020-01-30 11:34:45 -08:00
Whymarrh Whitby
d75e587533
Replace fast-deep-equal with isEqual from lodash (#7935) 2020-01-29 16:31:53 -03:30
Mark Stacey
59a1746afc
Validate custom spend limit (#7920)
The custom spend limit was previously not validated. It did have a
minimum of zero set, but this didn't have any affect (that minimum is
used for form constraint validation, and this field wasn't in a form).
The field was never checked to ensure the contents didn't exceed the
maximum.

The field is now checked for values that exceed the maximum, and
invalid values in general (including negative values).

The parameters to the `showEditApprovalPermissionModal` were also
alphabetized to make them easier to read. In the course of doing this,
I noticed that the origin was missing from one of the calls. This was
responsible for the modal saying "Spend limit requested by undefined"
when clicking "Edit" under the transaction details. This has been
fixed.
2020-01-29 14:16:38 -04:00
Mark Stacey
00a73ee25e
Replace debounce package with debounce function from lodash (#7931)
These two functions differ slightly in options, but none of those
options are being used by us, so in these cases they're functionally
equivalent. They're even both descendants of the original `debounce`
function from `underscore`.

This was done to reduce the number of direct dependencies we have. It
should not affect bundle size, as we still depend upon the `debounce`
package transitively.
2020-01-29 13:36:03 -04:00
Mark Stacey
cc78378b8e
Allow editing max spend limit (#7919)
In the case where the initial spend limit for the `approve` function
was set to the maximum amount, editing this value would result in the
new limit being silently ignored. The transaction would be submitted
with the original max spend limit.

This occurred because function to generate the new custom data would
look for the expected spend limit in the existing data, then bail if
it was not found (and in these cases, it was never found).

The reason the value was not found is that it was erroneously being
converted to a `Number`. A JavaScript `Number` is not precise enough to
represent larger spend limits, so it would give the wrong hex value
(after rounding had taken place in the conversion to a floating-point
number).

The data string is now updated without relying upon the original token
value; the new value is inserted after the `spender` argument instead,
as the remainder of the `data` string is guaranteed to be the original
limit. Additionally, the conversion to a `Number` is now omitted so
that the custom spend limit is encoded correctly.

Fixes #7915
2020-01-28 22:49:32 -04:00
Mark Stacey
99ceca3d25
Update jazzicon component (#7898)
* Use ref instead of findDOMNode in jazzicon component

The jazzicon component was using `findDOMNode` to get the DOM node for
the main div returned by the component, which is generally not
recommended. Instead a ref is now used.

* Update Jazzicon to v2

This version drops the dependency upon `raphael`, and no longer uses
the function `createSVGMatrix` which was causing unit tests to fail
(because it's not supported by jsdom).
2020-01-28 16:08:55 -08:00
Erik Marks
b75f812953
Improve LoginPerSite UX/devX and permissions logging (#7649)
Update accounts permission history on accountsChanged
Create PermissionsLogController
Fix permissions activity log pruning
Add selectors, background hooks for better UX
Make selected account the first account returned
Use enums for store keys in log controller
Add last selected address history to PreferencesController
2020-01-27 14:42:03 -08:00
Mark Stacey
583b404e02
Switch to full lodash package, and update lodash (#7907)
* Update lodash

All versions of the full `lodash` package have been updated to 4.17.15.
The only exception is v4.17.14 which is pinned by `ganache-core`.

* Switch to using `lodash` instead of per-method packages

We have the full lodash package _ten times_ as a production transitive
dependency, so including per-method packages is not saving space (it
might instead result in slightly more space being used).
2020-01-27 12:45:48 -04:00
Mark Stacey
86c6280bc3
Remove unnecessary get environment type parameter (#7891)
* Remove unnecessary `getEnvironmentType` parameter

The default value of the first parameter is `window.location.href`, so
there is no need to pass it in explicitly.

* Remove junk parameter from `getEnvironmentType` invocation

`getEnvironmentType` doesn't need to be passed any parameter, as the
default value is `window.location.href` which is generally what is
wanted. In this case, the variable `location.href` was always
`undefined` anyway. This particular `location` variable is from React
Router, and does not have an `href` property.

* Fix comment for `getEnvironmentType`

One of the possible return values was referred to by the wrong name.
2020-01-24 15:12:58 -04:00
Mark Stacey
b90b30f706
Remove unnecessary withRouter and compose calls (#7890)
`withRouter` has been removed from any components that were not using
any of the three props injected by `withRouter`: `history`, `location`,
and `match`.

`compose` is a no-op when called upon a single component, so it has
been removed in all such cases.
2020-01-24 15:12:49 -04:00
Mark Stacey
70a689410a
Use ref in Mascot component rather than reaching into DOM directly (#7893)
Accessing the dom via `document` is strongly discouraged in React.
Instead the DOM element is now referenced by ref instead.
2020-01-24 14:15:34 -04:00
Mark Stacey
7471e2df02
Remove unnecessary WebRTC shim (#7886)
The WebRTC spec is fairly stable these days, particularly among the
browsers we support. We don't need this shim for anything. I'm guessing
it may have been added primarily with IE in mind.
2020-01-23 14:04:05 -04:00
ryanml
d8c685ba2e Add mechanism to randomize seed phrase filename (#7863)
The filename is seeded by a simple use of Math.random() pulling from an alphanumeric character bank, as opposed to a more cryptographically random solution. This provides a simple layer of difficulty for bad actors to seek out the recovery phrase file.
2020-01-21 21:22:55 -04:00
Erik Marks
b095dc0347
Change "Log In/Out" terminology to "Unlock/Lock" (#7853)
* log out/in -> lock/unlock
2020-01-21 14:09:53 -08:00
Mark Stacey
cc928aaed9
Add withFixtures helper and simple-send test (#7862)
The `withFixtures` helper will instantiate ganache, a web driver, and
a fixture server initialized with the given set of fixtures. It is
meant to facilitating writing small, isolated e2e tests.

The first example test has been added: simple-send. It ensures that the
user can send 1 ETH to another account.

These new e2e tests will run during the normal e2e test run.

Closes #6548
2020-01-20 14:50:25 -04:00
Whymarrh Whitby
000fcfdfcc
Fix propTypes for TransactionBreakdown component (#7848) 2020-01-16 18:19:38 -03:30
Whymarrh Whitby
7c7f121fe3
Fix props for BasicTabContent component tests (#7850) 2020-01-16 18:19:01 -03:30
Whymarrh Whitby
b4ca671b6b
Fix propTypes and test props for Dropdown components (#7851) 2020-01-16 18:18:09 -03:30
Whymarrh Whitby
78044a5cdc
Fix propTypes and test props for SignatureRequest component (#7849) 2020-01-16 15:53:14 -03:30
Whymarrh Whitby
70e083820b
Refactor Network dropdown component (#7817) 2020-01-16 15:02:03 -03:30
Mark Stacey
8225bbe126
Remove unused current view related things (#7843)
* Remove unused functions from `mapDispatchToProps`

The actions import was also updated to import only the two actions
used, rather than all actions.

* Remove unused container component

Well, technically it was the props injected by this container that were
unused. The container served no purpose, so the component it surrounded
is now used directly instead.

* Remove both unused `getCurrentViewContext` selectors

* Remove unused SHOW_CONFIG_PAGE action

* Remove checks for `currentView` with name `config`

Now that the SHOW_CONFIG_PAGE action has been removed, it's no longer
possible for `currentView.name` to be set to that value.

* Remove unused `wallet-view` container props

* Delete unused SHOW_SEND_PAGE and SHOW_ADD_TOKEN_PAGE actions

* Remove unused `account-menu.container` props

* Remove unused SHOW_INFO_PAGE action

* Remove unused SET_NEW_ACCOUNT_FORM action
2020-01-16 13:02:44 -04:00
Whymarrh Whitby
48c9b0174f
Add required props for TransactionListItemDetails tests (#7834) 2020-01-16 00:04:32 -03:30
Whymarrh Whitby
dcf8eb2187
Fix prop types for GasPriceChart tests (#7836) 2020-01-16 00:03:50 -03:30
Whymarrh Whitby
e642314ae4
Fix prop types for NetworkDropdown tests (#7837) 2020-01-16 00:03:37 -03:30
Mark Stacey
74557bd68a
Delete onBlur handlers from currency and token input components (#7824)
As of #7753, the `onBlur` prop is no longer used for the `token-input`
and `currency-input` components, and the associated wrapper components
and the shared underlying component. It as been removed from all of
them.
2020-01-15 11:18:59 -04:00
Mark Stacey
19f10e197e
Simplify e2e test transaction navigation (#7816)
The transaction navigation in the e2e tests has been made simpler with
the addition of data attributes to help with finding the navigation
buttons. Each button is now labelled according to its purpose.
2020-01-14 14:53:02 -04:00
Mark Stacey
ac01c5c89a
Consistent jsdoc syntax (#7755)
* Specify type before parameter name

Various JSDoc `@param` entries were specified as `name {type}` rather
than `{type} name`.

A couple of `@return` entries have been given types as well.

* Use JSDoc optional syntax rather than Closure syntax

* Use @returns rather than @return

* Use consistent built-in type capitalization

Primitive types are lower-case, and Object is upper-case.

* Separate param/return description with a dash
2020-01-13 14:36:36 -04:00
Whymarrh Whitby
61d1809750
Purge xtend from the UI (#7795) 2020-01-13 12:59:21 -03:30
Whymarrh Whitby
f850a17f63
Convert FiatValue component to ES6 class (#7786)
Co-authored-by: Mark Stacey <markjstacey@gmail.com>
2020-01-13 11:42:26 -03:30
Whymarrh Whitby
789dd19677
Convert Network component to an ES6 class (#7784)
Co-authored-by: Mark Stacey <markjstacey@gmail.com>
2020-01-13 11:42:11 -03:30
Whymarrh Whitby
3b3325d191
Convert ReadOnlyInput to functional component (#7788)
Co-authored-by: Mark Stacey <markjstacey@gmail.com>
2020-01-13 11:41:51 -03:30
Whymarrh Whitby
e20163bfda
Convert TokenList component to an ES6 class (#7785)
Co-authored-by: Mark Stacey <markjstacey@gmail.com>
2020-01-13 11:39:38 -03:30
Thomas Huang
428fdee7e3
Remove padding of info circle of advanced gas (#7810) 2020-01-13 07:08:39 -08:00
Whymarrh Whitby
d802e09a8b
Convert Mascot component to an ES6 class (#7787) 2020-01-13 10:42:58 -03:30
Thomas Huang
f6de94a6e5
Remove redundant gas selector file (#7805)
One of these two selectors are in use, which is is another file
92971d3c87/ui/app/selectors/custom-gas.js (L44)
2020-01-10 11:11:49 -08:00
Whymarrh Whitby
89e7dc2312
Convert Modal component to ES6 class (#7783) 2020-01-10 15:35:46 -03:30
Whymarrh Whitby
52a38de567
Remove unused components (#7802) 2020-01-10 15:27:48 -03:30
Whymarrh Whitby
fa1482ef76
Convert HideTokenConfirmationModal to an ES6 class (#7782) 2020-01-10 11:51:47 -03:30
Whymarrh Whitby
dadb112df9
Convert MenuDroppoComponent component to an ES6 class (#7781)
Co-authored-by: Mark Stacey <markjstacey@gmail.com>
2020-01-10 11:43:21 -03:30
Mark Stacey
dac83f6188
Make account details modal close button easier to click (#7797)
The account details close button is difficult to click from the e2e
tests because it has a size of zero. The actual icon is added via CSS
as an `::after` pseudo-element.

The CSS has been adjusted to give the icon a size, and it the markup
is now a `button` rather than a `div`.
2020-01-10 10:43:53 -04:00
Mark Stacey
61ab053bb1
Remove unused className prop (#7800)
This prop is not checked by the component it's passed into, and that
class doesn't correspond to any style rules.
2020-01-10 10:43:44 -04:00
Erik Marks
728026d1f7
Fix batch transaction UX (#7473)
* order transactions from oldest to newest in UI

* update json-rpc-engine, eth-json-rpc-middleware

* update e2e and integration tests
2020-01-10 06:34:02 -08:00
Dan J Miller
d349bd61d2
Fix gas estimate for tokens (#7753)
* Make gas estimate update on debounced token amount change, not just on blur after change

* Updated tests

* Ensure `updateGas` is bound early

Co-authored-by: Mark Stacey <markjstacey@gmail.com>
2020-01-10 10:53:54 -03:30
Whymarrh Whitby
3b1cd1286f
Convert TokenMenuDropdown to an ES6 class (#7779) 2020-01-10 10:34:03 -03:30
Whymarrh Whitby
be3ba68e4c
Convert NetworkDropdown to ES6 class (#7778) 2020-01-10 10:33:47 -03:30
Whymarrh Whitby
7f47a42f55
Convert AccountDetailsDropdown to ES6 class (#7777) 2020-01-10 10:33:32 -03:30
Whymarrh Whitby
6947ff49e0
Convert AccountPanel component to ES6 class (#7775) 2020-01-10 10:32:24 -03:30
Whymarrh Whitby
92971d3c87
Migrate codebase to use ESM (#7730)
* Update eslint-plugin-import version

* Convert JS files to use ESM

* Update ESLint rules to check imports

* Fix test:unit:global command env

* Cleanup mock-dev script
2020-01-09 00:04:58 -03:30
Mark Stacey
7bddbf611a
Replace inlined blockies identicon with npm package (#7757)
The "blockies" style identicon is handled by a module that was copied
from MyEtherWallet and inlined. This has been removed, and replaced
with the upstream package it was originally derived from.
2020-01-07 23:55:32 -04:00
ricky
984e5a1e26
Properly handle <enter> keystroke (#7747)
* Properly handle <enter> keystroke, closes #7737

* no-unused-vars
2020-01-07 17:20:29 -05:00
Whymarrh Whitby
c66449f823
Disable semicolons for class props (#7754) 2020-01-07 16:40:44 -03:30
Whymarrh Whitby
8701ac38a1
Remove useless component constructors (#7718) 2019-12-19 18:30:22 -03:30
Whymarrh Whitby
4b471a4d8a
Adjust colour of Reset Account btn to reflect danger (#7696) 2019-12-12 17:03:05 -03:30
Mark Stacey
49a525b9f8
Add react/no-unused-prop-types ESLint rule (#7655)
* Add `react/no-unused-prop-types` rule

All detected unused prop types have been removed. I have attempted to
ensure these props are no longer passed in either.

* Update handling of props to avoid false positive lint errors

These cases were detected by `react/no-unused-prop-types` as being
unused props, even though they were used. These minor adjustments
prevent them from being flagged as errors.

* Update unit tests

Many of these tests were just checking that specific props were passed
from containers or to a child component. These were deleted, as I can't
imagine how they'd be useful.

* Disable `react/no-unused-prop-types` in `componentWillReceiveProps

The rule `react/no-unused-prop-types` doesn't seem to be detecting
props used within `UNSAFE_componentWillReceiveProps`. The two cases
have been disabled temporarily until we can replace these unsafe
lifecycle functions.
2019-12-07 23:10:47 -04:00
ricky
1c4f2aab8f React 16 upgrade (#7476)
* Use arrow property initializer functions

* Use pure components where applicable

* Add UNSAFE_ prefix for deprecated lifecycle hooks

* Add allow UNSAFE_

* Removed unused "Component"

* Replace boron with 'fade-modal'

* Upgrade react/no-deprecated to an error

* Paste react-tooltip-component source directly

* Use arrow functions to bind `this`

* Add UNSAFE_ prefix

* Update react-redux, react-router-dom

* Remove things from inlined 'fade-modal'

* Adjust mountWithRouter to get unit tests passing again

* Remove domkit

* Add Wrapper to render-helpers

* Upgrade @storybook/addon-knobs
2019-12-06 11:40:06 -04:00
Mark Stacey
e87e79870a
Add missing PropTypes (#7658)
The props for `send` were also sorted, to make them easier to compare.
I only bothered because they were _almost_ sorted already.
2019-12-06 11:32:03 -04:00
Mark Stacey
eeb329adf7
Fix the permissions connect screen MetaMask logo (#7641)
The MetaMask logo was throwing an exception because the `history` prop
from React Router wasn't being passed in. However, even if it was
passed in, clicking on the logo wouldn't have done anything because the
home route redirects back to the permission connect page.

Instead the logo now isn't given an `onClick` handler. The
`MetaFoxLogo` component has been updated to only set `cursor: pointer`
if given an `onClick` handler.
2019-12-04 19:57:30 -04:00
Dan Finlay
30304913eb
Merge pull request #7591 from whymarrh/eslint-object-curly-spacing
Enable object-curly-spacing rule for ESLint
2019-12-04 10:25:32 -08:00
Dan Finlay
6aa0bec751
Merge pull request #7573 from whymarrh/eslint-no-confusing-arrow
Enable no-confusing-arrow rule for ESLint
2019-12-04 10:23:57 -08:00
Thomas Huang
0b8f74ede5
Remove random comma (#7639) 2019-12-03 21:35:44 -08:00
Whymarrh Whitby
03f53df3f3
Updates to account search functionality (#7637) 2019-12-03 23:25:00 -03:30
Paweł Lula
638e242ce6 Search accounts by name (#7261)
Co-Authored-By: Paweł Lula <pavloblack@hotmail.com>
Co-Authored-By: Mark Stacey <markjstacey@gmail.com>
2019-12-03 22:51:55 -03:30
Whymarrh Whitby
4ec92ceed3
Fix SimpleDropdown event bubbling (#7627) 2019-12-03 17:44:19 -03:30
Whymarrh Whitby
b8e3957542
Remove unneeded store connections (#7625) 2019-12-03 17:34:16 -03:30
Whymarrh Whitby
274a9ecf53 yarn lint --fix 2019-12-03 17:20:55 -03:30
Whymarrh Whitby
7e22244c03
Replace wild random number key with index (#7629) 2019-12-03 16:53:25 -03:30
Mark Stacey
d9bdba5948
Use ES6 exports for selectors (#7626)
This lets us get rid of the big `selectors` object that was unpleasant
to maintain.
2019-12-03 16:04:28 -04:00
Mark Stacey
b4fd7aea32
Fix a typo made comparing previous prop (#7628)
The prop `prevIsAccountMenuOpen` was referenced in `prevProps`, despite
it not existing. It seems clear from the context that the intention
was to check the `isAccountMenuOpen` prop from `prevProps`, and name
the local variable `prevIsAccountMenuOpen`.
2019-12-03 15:16:59 -04:00
Dan Finlay
f519fa1ed3
Connect distinct accounts per site (#7004)
* add PermissionsController

remove provider approval controller
integrate rpc-cap
create PermissionsController
move provider approval functionality to permissions controller
add permissions approval ui, settings page
add permissions activity and history
move some functionality to metamask-inpage-provider
rename siteMetadata -> domainMetadata

add accountsChange notification to inpage provider
move functionality to inpage provider
update inpage provider
Remove 'Connections' settings page (#7369)
add hooks for exposing accounts in settings
rename unused messages in non-English locales

Add external extension id to metadata (#7396)

update inpage provider, rpc-cap
add eth_requestAccounts handling to background
prevent notifying connections if extension is locked
update inpage provider
Fix lint errors
add migration
review fixes
transaction controller review updates
removed unused messages

* Login Per Site UI (#7368)

* LoginPerSite original UI changes to keep

* First commit

* Get necessary connected tab info for redirect and icon display for permissioned sites

* Fix up designs and add missing features

* Some lint fixes

* More lint fixes

* Ensures the tx controller + tx-state-manager orders transactions in the order they are received

* Code cleanup for LoginPerSite-ui

* Update e2e tests to use new connection flow

* Fix display of connect screen and app header after login when connect request present

* Update metamask-responsive-ui.spec for new item in accounts dropdown

* Fix approve container by replacing approvedOrigins with domainMetaData

* Adds test/e2e/permissions.spec.js

* Correctly handle cancellation of a permissions request

* Redirect to home after disconnecting all sites / cancelling all permissions

* Fix display of site icons in menu

* Fix height of permissions page container

* Remove unused locale messages

* Set default values for openExternalTabs and tabIdOrigins in account-menu.container

* More code cleanup for LoginPerSite-ui

* Use extensions api to close tab in permissions-connect

* Remove unnecessary change in domIsReady() in contentscript

* Remove unnecessary private function markers and class methods (for background tab info) in metamask-controller.

* Adds getOriginOfCurrentTab selector

* Adds IconWithFallback component and substitutes for appropriate cases

* Add and utilize font mixins

* Remove unused  method in disconnect-all.container.js

* Simplify buttonSizeLarge code in page-container-footer.component.js

* Add and utilize getAccountsWithLabels selector

* Remove console.log in ui/app/store/actions.js

* Change last connected time format to yyyy-M-d

* Fix css associated with IconWithFallback change

* Ensure tracked openNonMetamaskTabsIDs are correctly set to inactive on tab changes

* Code cleanup for LoginPerSite-ui

* Use reusable function for modifying openNonMetamaskTabsIDs in background.js

* Enables automatic switching to connected account when connected domain is open

* Prevent exploit of tabIdOriginMap in background.js

* Remove unneeded code from contentscript.js

* Simplify current tab origin and window opener logic using remotePort listener tabs.queryTabs

* Design and styling fixes for LoginPerSite-ui

* Fix permissionHistory and permission logging for eth_requestAccounts and eth_accounts

* Front end changes to support display of lastConnected time in connected and permissions screens

* Fix lint errors

* Refactor structure of permissionsHistory

* Fix default values and object modifications for domain and permissionsHistory related data

* Fix connecting to new accounts from modal

* Replace retweet.svg with connect-white.svg

* Fix signature-request.spec

* Update metamask-inpage-provider version

* Fix permissions e2e tests

* Remove unneeded delay from test/e2e/signature-request.spec.js

* Add delay before attempting to retrieve network id in dapp in ethereum-on=.spec

* Use requestAccountTabIds strategy for determining tab id that opened a given window

* Improve default values for permissions requests

* Add some message descriptions to app/_locales/en/messages.json

* Code clean up in permission controller

* Stopped deep cloning object in mapObjectValues

* Bump metamask-inpage-provider version

* Add missing description in app/_locales/en/messages.json

* Return promises from queryTabs and switchToTab of extension.js

* Remove unused getAllPermissions function

* Use default props in icon-with-fallback.component.js

* Stop passing  to permissions controller

* Delete no longer used clear-approved-origins modal code

* Remove duplicate imports in ui/app/components/app/index.scss

* Use URL instead of regex in getOriginFromUrl()

* Add runtime error checking to platform, promise based extension.tab methods

* Support permission requests from external extensions

* Improve font size and colour of the domain origin on the permission confirmation screen

* Add support for toggling permissions

* Ensure getRenderablePermissionsDomains only returns domains with exposedAccount caveat permissions

* Remove unused code from LoginPerSite-ui branch

* Ensure modal closes on Enter press for new-account-modal.component.js

* Lint fix

* fixup! Login Per Site UI (#7368)

* Some code cleanup for LoginPerSite

* Adds UX for connecting to dapps via the connected sites screen (#7593)

* Adds UX for connecting to dapps via the connected sites screen

* Use openMetaMaskTabIds from background.js to determine if current active tab is MetaMask

* Delete unused permissions controller methods

* Fixes two small bugs in the LoginPerSite ui (#7595)

* Restore `providerRequest` message translations (#7600)

This message was removed, but it was replaced with a very similar
message called `likeToConnect`. The only difference is that the new
message has "MetaMask" in it. Preserving these messages without
"MetaMask" is probably better than deleting them, so these messages
have all been restored and renamed to `likeToConnect`.

* Login per site no sitemetadata fix (#7610)

* Support connected sites for which we have no site metadata.

* Change property containing subtitle info often populated by origin to a more accurate of purpose name

* Lint fix

* Improve disconnection modal messages (#7612)

* Improve disconnectAccountModalDescription and disconnectAllModalDescription messages

* Update disconnectAccountModalDescription app/_locales/en/messages.json

Co-Authored-By: Mark Stacey <markjstacey@gmail.com>

* Improve disconnectAccount modal message clarity

* Adds cancel button to the account selection screen of the permissions request flow (#7613)

* Fix eth_accounts permission language & selectability (#7614)

* fix eth_accounts language & selectability

* fix MetaMask capitalization in all messages

* Close sidebar when opening connected sites (#7611)

The 'Connected Sites' button in the accounts details now closes the
sidebar, if it is open. This was accomplished by pulling the click
handler for that button up to the wallet view component, where another
button already followed a similar pattern of closing the sidebar.

It seemed confusing to me that one handler was in the `AccountsDetails`
container component, and one was handed down from above, so I added
PropTypes to the container component.

I'm not sure that the WalletView component is the best place for this
logic, but I've put it there for now to be consistent with the add
token button.

* Reject permissions request upon tab close (#7618)

Permissions requests are now rejected when the page is closed. This
only applies to the full-screen view, as that is the view permission
requests should be handled in. The case where the user deals with the
request through a different view is handled in #7617

* Handle tab update failure (#7619)

`extension.tabs.update` can sometimes fail if the user interacts with
the tabs directly around the same time. The redirect flow has been
updated to ensure that the permissions tab is still closed in that
case. The user is on their own to find the dapp tab again in that case.

* Login per site tab popup fixes (#7617)

* Handle redirect in response to state update in permissions-connect

* Ensure origin is available to permissions-connect subcomponents during redirect

* Hide app bar whenever on redirect route

* Improvements to handling of redirects in permissions-connect

* Ensure permission request id change handling only happens when page is not null

* Lint fix

* Decouple confirm transaction screen from the selected address (#7622)

* Avoid race condtion that could prevent contextual account switching (#7623)

There was a race condition in the logic responsible for switching the
selected account based upon the active tab. It was asynchronously
querying the active tab, then assuming it had been retrieved later.

The active tab info itself was already in the redux store in another
spot, one that is guaranteed to be set before the UI renders. The
race condition was avoided by deleting the duplicate state, and using
the other active tab state.

* Only redirect back to dapp if current tab is active (#7621)

The "redirect back to dapp" behaviour can be disruptive when the
permissions connect tab is not active. The purpose of the redirect was
to maintain context between the dapp and the permissions request, but
if the user has already moved to another tab, that no longer applies.

* Fix JSX style lint errors

* Remove unused state
2019-12-03 09:35:56 -08:00
Whymarrh Whitby
16e6103a68 yarn lint --fix 2019-12-03 13:23:13 -03:30
Whymarrh Whitby
2e69f3233e
eslint: Enable more react/jsx-* rules (#7592) 2019-12-03 13:05:44 -03:30
Whymarrh Whitby
2c33ad3eb4
Enable react/no-unused-state rule for ESLint (#7609)
* eslint: Enable react/no-unused-state rule
* Fix unused state issues
* Remove now unused validFileImport localized message
2019-12-03 12:00:03 -03:30
Whymarrh Whitby
e61745a821
Enable no-var rule for ESLint (#7590)
* eslint: Enable no-var rule
* yarn lint --fix
2019-12-03 11:22:01 -03:30
Whymarrh Whitby
f61b068bd2
Drop eslint-disable and TODO comments from Modal component (#7589) 2019-11-28 13:38:31 -03:30
Whymarrh Whitby
cfd041b364
Convert modals to use JSX (#7566) 2019-11-27 18:49:48 -03:30
Whymarrh Whitby
867dcc48ee
Clean up Item JSX (#7584) 2019-11-27 15:49:38 -03:30
Whymarrh Whitby
359be03db8
Split DepositEtherModal into container and component files (#7565) 2019-11-27 12:44:02 -03:30
Whymarrh Whitby
926c8848f1
Enable default-case rule for ESLint (#7572)
* eslint: Enable default-case rule

* Fix missing default cases

* Fix tests failing due to incorrect assumptions
2019-11-27 12:38:35 -03:30
Whymarrh Whitby
9a1c7e3864
Convert Network component to use JSX (#7564) 2019-11-27 11:37:06 -03:30
Whymarrh Whitby
baa5313d21
Convert NetworkDropdown component to use JSX (#7562) 2019-11-27 11:36:46 -03:30
Whymarrh Whitby
f0e5ab6c12
Split ExportPrivateKeyModal into container and component files (#7561) 2019-11-27 11:36:31 -03:30
Whymarrh Whitby
00060d787a
Split TokenCell into container and component files (#7560) 2019-11-27 11:36:12 -03:30
ricky
4a59fb432f
Fix backButtonAction proptype (#7578)
* Fix backButtonAction proptype

* Fix missing trailing comma

* Remove no-op
2019-11-26 17:44:33 -05:00
ricky
e39485cb1c
Fix loading prop type (#7563) 2019-11-25 13:15:12 -05:00
Whymarrh Whitby
e2d6798673
Split EthBalance into container and component files (#7557)
Co-Authored-By: Mark Stacey <markjstacey@gmail.com>
2019-11-25 11:58:21 -03:30
Whymarrh Whitby
caefda5f47
Use localized messages for NotificationModal buttons (#7558) 2019-11-25 10:02:51 -03:30
Whymarrh Whitby
5f89988671
Delete unused BnAsDecimalInput (#7556) 2019-11-25 10:02:28 -03:30
Whymarrh Whitby
f5c496ffcd
Convert Menu, Item, Divider, and CloseArea components to use JSX (#7547) 2019-11-25 10:01:44 -03:30
Whymarrh Whitby
2b4c99e031
Split WalletView into component and container files (#7546) 2019-11-25 10:00:46 -03:30
Whymarrh Whitby
1ffaa330ad
Split AccountModalContainer into container and component files (#7549)
Co-Authored-By: Mark Stacey <markjstacey@gmail.com>
2019-11-24 19:11:08 -03:30
Whymarrh Whitby
22a2d21796
Convert Alert component to use JSX (#7542) 2019-11-24 19:10:16 -03:30
Whymarrh Whitby
666277b4fa
Convert TokenMenuDropdown component to use JSX (#7552) 2019-11-24 19:09:10 -03:30
Whymarrh Whitby
d948a3b195
Convert NotificationModal component to use JSX (#7550) 2019-11-24 18:32:53 -03:30
Whymarrh Whitby
6e73d2be69
Convert HideTokenConfirmationModal component to use JSX (#7551) 2019-11-24 18:31:56 -03:30
Whymarrh Whitby
8311617b95
Convert LoadingScreen component to use JSX (#7545) 2019-11-24 17:51:50 -03:30
Whymarrh Whitby
04442318d3
Convert EditableLabel component to use JSX (#7543) 2019-11-24 17:51:21 -03:30
Whymarrh Whitby
1cac6f2768
Convert SimpleDropdown component to use JSX (#7540) 2019-11-24 17:48:58 -03:30
Whymarrh Whitby
a849218f81
Adjust QrCodeView propTypes for its Qr.messages prop (#7529) 2019-11-24 13:45:35 -03:30
Whymarrh Whitby
3377228b74
Split ShiftListItem into container and component files with JSX (#7539) 2019-11-24 01:41:30 -03:30
Whymarrh Whitby
c3e834d17b
Convert CustomizeGasModal component to use JSX (#7537) 2019-11-24 01:32:14 -03:30
Whymarrh Whitby
439fce8901
Convert Mascot component to use JSX (#7535) 2019-11-24 01:29:18 -03:30
Whymarrh Whitby
f15237b1a5
Convert ExportTextContainer component to use JSX (#7538) 2019-11-24 01:24:22 -03:30
Whymarrh Whitby
340559b805
Convert TokenList component to use JSX (#7541) 2019-11-24 01:19:51 -03:30
Whymarrh Whitby
99e94dadbd
Convert Tooltip component to JSX (#7516) 2019-11-23 12:51:59 -03:30
Whymarrh Whitby
9f7438e756
Convert FiatValue component to JSX (#7515) 2019-11-23 12:51:37 -03:30
Whymarrh Whitby
f5824ffad7
Convert CopyButton component to JSX (#7513)
Co-Authored-By: Mark Stacey <markjstacey@gmail.com>
2019-11-23 12:51:21 -03:30
Whymarrh Whitby
c555ea659c
Convert NetworkDropdownIcon component to JSX (#7511)
Co-Authored-By: Mark Stacey <markjstacey@gmail.com>
2019-11-23 12:50:47 -03:30
Whymarrh Whitby
4fe147f82f
Convert MenuDroppoComponent component to JSX (#7531) 2019-11-23 12:49:36 -03:30
Whymarrh Whitby
0d6b5b627d
Delete unused Copyable component (#7526)
* Delete unused Copyable component

* Delete unused copy localized message
2019-11-23 01:47:08 -03:30
Whymarrh Whitby
a3d0b71320
Convert ReadOnlyInput component to use JSX (#7512) 2019-11-23 00:44:44 -03:30
Whymarrh Whitby
c775a842d1
Convert QrCodeView to use JSX (#7504) 2019-11-23 00:10:35 -03:30
Whymarrh Whitby
7d097dedaf
Convert Dropdown and DropdownMenuItem components to JSX (#7510) 2019-11-22 23:53:16 -03:30
Whymarrh Whitby
7a0e40829a
Convert AccountDetailsDropdown component to use JSX (#7509) 2019-11-22 23:52:41 -03:30
Whymarrh Whitby
1d9787c0d8
Convert GasModalCard component to use JSX (#7507) 2019-11-22 23:28:33 -03:30
Whymarrh Whitby
df88e7656d
Delete unused GasSlider component (#7508) 2019-11-22 23:26:02 -03:30
Whymarrh Whitby
3d598473a0
Convert AccountPanel component to use JSX (#7505) 2019-11-22 22:48:46 -03:30
Whymarrh Whitby
6820a245b5
Convert InputNumber component to use JSX (#7503) 2019-11-22 20:13:58 -03:30
Whymarrh Whitby
5235d8db96
Remove unused onClick prop from Dropdown component (#7500) 2019-11-22 17:23:27 -03:30
Mark Stacey
f763979bed
Add support for one-click onboarding (#7017)
* Add support for one-click onboarding

MetaMask now allows sites to register as onboarding the user, so that
the user is redirected back to the initiating site after onboarding.
This is accomplished through the use of the `metamask-onboarding`
library and the MetaMask forwarder.

At the end of onboarding, a 'snackbar'-stype component will explain to the
user they are about to be moved back to the originating dapp, and it will
show the origin of that dapp. This is intended to help prevent phishing
attempts, as it highlights that a redirect is taking place to an untrusted
third party.

If the onboarding initiator tab is closed when onboarding is finished,
the user is redirected to the onboarding originator as a fallback.

Closes #6161

* Add onboarding button to contract test dapp

The `contract-test` dapp (run with `yarn dapp`, used in e2e tests) now
uses a `Connect` button instead of connecting automatically. This
button also serves as an onboarding button when a MetaMask installation
is not detected.

* Add new static server for test dapp

The `static-server` library we were using for the `contract-test` dapp
didn't allow referencing files outside the server root. This should
have been possible to work around using symlinks, but there was a bug
that resulted in symlinks crashing the server.

Instead it has been replaced with a simple static file server that
will serve paths starting with `node_modules` from the project root.
This will be useful in testing the onboarding library without vendoring
it.

* Add `@metamask/onboarding` and `@metamask/forwarder`

Both libraries used to test onboarding are now included as dev
dependencies, to help with testing. A few convenience scripts
were added to help with this (`yarn forwarder` and `yarn dapp-forwarder`)
2019-11-22 13:03:51 -04:00
ricky
bf57dd5ad9
Add overflow hidden (#7488) 2019-11-21 16:59:50 -05:00
Mark Stacey
71a0bc8b3f
Refactor signature-request-original (#7415)
The component has been updated to split the container from the base
component, and all hyperscript has been replaced with JSX. ES6 imports
are used throughout as well.
2019-11-20 18:03:49 -04:00
Mark Stacey
056e8cdf7e
Merge pull request #7479 from MetaMask/master
Master sync
2019-11-19 21:10:55 -04:00
Whymarrh Whitby
aa41057628
Update ESLint rules for curly braces style (#7477)
* eslint: Enable curly and brace-style

* yarn lint --fix
2019-11-19 20:33:20 -03:30
Whymarrh Whitby
ab0600ef0b Add Remind Me Later to SAI migration notification 2019-11-19 16:40:00 -03:30
Whymarrh Whitby
5f9e8867b4 Allow any renderable type in HomeNotification texts 2019-11-19 16:22:34 -03:30
Thomas Huang
4ac247462b
Merge pull request #7469 from MetaMask/master
Master sync
2019-11-18 17:50:03 -08:00
Whymarrh Whitby
b0890b6b32
Enforce a single boolean attr notation in JSX (#7465)
This changeset enables the ESLint rule enforcing a single notation for boolean
attributes in JSX—explictly setting the value to `true` is no longer allowed
(as it was never needed).[1]

From the docs for JSX:[2]

> If you pass no value for a prop, it defaults to `true`.

  [1]:https://github.com/yannickcr/eslint-plugin-react/blob/80935658/docs/rules/jsx-boolean-value.md
  [2]:https://reactjs.org/docs/jsx-in-depth.html#props-default-to-true

I have chosen to use this default as it the most consistent with HTML (a la
`checked` and `disabled`).
2019-11-18 19:53:41 -03:30
Thomas
7f5d829880 Set default height and alignment of notification icon 2019-11-18 14:45:10 -08:00
Whymarrh Whitby
86b165ea83
Add migration notification for users with Sai (#7450)
Maker has upgraded its Dai token to "Multi-Collateral Dai" (MCD) and requires
all users interacting with Dai migrate their tokens to the new version. Dai
now exclusively refers to Multi-Collateral Dai and what was previouly called
Dai is now Sai (Single Collateral Dai).

In this description, Sai refers to what was (prior to the 2019-11-18) known as Dai.
Dai is the _new_ token.

This changeset:

1. Only affects users who had non-zero Sai at the old contract address
2. Displays a persistent notification for users with Sai
3. Updates the token symbol for users already tracking the Sai token
4. Bumps our direct and indirect eth-contract-metadata dependencies

The notification copy:

> A message from Maker: The new Multi-Collateral Dai token has been released. Your old tokens are now called Sai. Please upgrade your Sai tokens to the new Dai.

The copy is from the Maker team.
2019-11-18 18:16:28 -03:30
Thomas Huang
b3395502f2
Merge pull request #7463 from MetaMask/expand-home-notification-height
Expand home notification height
2019-11-18 12:32:38 -08:00
Mark Stacey
3003104a5d Expand home notification height
The home notification static height of 116px is too cramped for longer
messages, such as the one used for the Sai migration. The old height is
now used for the minimum height instead, with a margin to ensure the
text doesn't get too close to the buttons.
2019-11-18 16:04:43 -04:00
Mark Stacey
273ec7beef Import styles for showing multiple notifications
The styles for the multi-notification component on the home screen were
accidentally removed while resolving a merge conflict in #6891.

Fixes #7460
2019-11-18 15:56:47 -04:00
Whymarrh Whitby
51bfe56510
Disallow spaces around the equal sign in JSX (#7459) 2019-11-18 14:19:03 -03:30
Whymarrh Whitby
f1384e7522
Disable unnecessary curly braces in JSX (#7454) 2019-11-18 11:38:47 -03:30
Whymarrh Whitby
659b4360bc
Add ESLint rule forbidding extraneous defaultProps (#7453) 2019-11-18 11:38:10 -03:30
Sunghee Lee
a6e387fddc Add button disabled when password is empty (#7451) 2019-11-17 14:04:17 -03:30
Whymarrh Whitby
7a6f2693fe
Add defaultProps to MultipleNotifications (#7449) 2019-11-16 19:43:46 -03:30
Mark Stacey
23ab6e2d54
Add metricsEvent to contextTypes (#7439)
The metricsEvent context type was missing, resulting in an error when
it was called.
2019-11-15 14:04:36 -04:00
Mark Stacey
f5cec3e6b7
Ensure SignatureRequestOriginal 'beforeunload' handler is bound (#7414)
The 'beforeunload' handler was being bound to the module scope instead
of the instance scope, because the class was defined using prototypes
rather than the ES6 class syntax. The arrow functions were removed, and
the handler is now bound explicitly in the constructor.
2019-11-14 14:28:40 -04:00
Mark Stacey
5a8e8c61ea
Reject connection request on window close (#7401)
This was first implemented in #7335, but the final version didn't work
because the `_beforeUnload` handler was not bound early, so `this` was
not defined when it was triggered.
2019-11-13 11:03:11 -04:00
Dan J Miller
6acd5cec37
Get prop for signed typed data from domain instead of message (#7402) 2019-11-13 09:11:21 -05:00
Thomas Huang
069a24c1b9 Revert "Adds Wyre Widget (#6434)" (#7385)
This reverts commit 6a4df0dc3f.
2019-11-11 16:18:57 -05:00
ricky
78224601b9 Fix grid-template-columns (#7366)
* Fix grid-template-columns

* Add fullscreen check
2019-11-10 21:17:00 -05:00
Mark Stacey
42279c474b
Set default advanced tab gas limit (#7379)
* Set default advanced tab gas limit

The advanced tab of the transaction confirmation screen would enter
into an infinite loop and crash if the given gas price was falsy and
some interaction was made with the gas limit field.

To prevent this infinite loop, a default value of 0 has been set. The
user will still need to update the gas limit in order to confirm the
transaction, as zero is too low a gas limit (the lowest is 21000).
21000 cannot be the default gas limit at this layer, because the limit
used is from a layer above this, which wouldn't have that same 21000
set.

* Set default gas limit to minimum allowed

A transaction initiated from a dapp might not set a gas limit, which
would result in a default of zero being used in the advanced tab. The
default gas limit in that case has been changed to 21,000, the minimum
allowed gas limit, so that users aren't forced to manually update it.
2019-11-10 21:15:38 -05:00
Mark Stacey
a8175eb799
Fix advanced tab gas chart (#7380)
The gas chart on the advanced tab was not converting the gas price
selected into hex before setting it in state, resulting in the UI
throwing errors and the price being set incorrectly. It now converts
in the same manner as the input fields.
2019-11-10 21:14:53 -05:00
matteopey
efe240195b Hide accounts dropdown scrollbars on Firefox (#7374) 2019-11-10 02:43:36 -05:00
Mark Stacey
ec1f3fa19a
Fix threebox last updated proptype (#7375)
* Use child components for multiple notifications component

The multiple notifications component has been updated to take its child
components as children rather than as a props array, so that the child
components are never executed in the case where they aren't needed.

* Fix threebox last updated proptype
2019-11-10 01:30:07 -05:00
ricky
02aebc2e03
Add onbeforeunload and have it call onCancel (#7335)
* Add onbeforeunload and have it call onCancel

* Address PR feedback

* Get integration tests passing again

* Add underscores

* Add ENVIRONMENT_TYPE_NOTIFICATION check

* Add _beforeUnload + metricsEvent
2019-11-06 12:04:44 -05:00
hjlee9182
9ed01dff7a fix account menu width (#7354) 2019-11-05 11:31:28 -04:00
Dan J Miller
2673eef3c4
Redesign approve screen (#7271)
* Redesign approve screen

* Add translations to approve screen components

* Show account in header of approve screen

* Use state prop bool for unlimited vs custom check in edit-approval-permission

* Set option to custom on input change in edit-approval-permission

* Allow setting of approval amount to unlimited in edit-approval-permission

* Fix height of confirm-approval popup

* Ensure decimals prop passted to confirm-approve.component is correct type

* Ensure first param passed to calcTokenValue in confirm-approve.util is the correct type

* Fix e2e test of permission editing

* Remove unused code from edit-approval-permission.container
2019-11-05 11:43:48 -03:30
Mark Stacey
dbd14d796c
Clear beforeunload handler after button is pressed (#7346)
On the signature request and transaction confirmation notification
pages, the closure of the notification UI implies that the request has
been rejected. However, this rejection is being submitted even when the
window is closed as a result of the user explicitly confirming or
rejecting. In practice, I suspect this has no effect because the
transaction, after being explicitly confirmed or rejected, has already
been moved out of a pending state. But just in case there is some
present or future edge case that might be affected, the `beforeunload`
handler is now removed once the user has explicitly made a choice.

This mistake was introduced recently in #7333
2019-11-04 14:03:57 -04:00
Dan J Miller
6a4df0dc3f
Adds Wyre Widget (#6434)
* Adds Wyre widget to the deposit modal.

* Move wyre widget code to vendor directory

* Get Wyre widget working without metamask connect/sign steps

* Code cleanup for wyre changes

* Change wyre widget to using prod environment

* Remove code allowing signing of wyre messages without confirmations

* Update wyre vendor code for wyre 2.0

* Remove unnecessary changes to provider approval constructor, triggerUI and openPopup

* Fix Wyre translation message

* Delete no longer used signature-request-modal

* Fix documentation of matches function in utils/util.js

* Code cleanup on wyre branch

* Remove front end code changes not needed to support wyre v2
2019-11-04 11:13:24 -03:30
Terry Smith
57a29668f3 New signature request v3 UI (#6891)
* Refactoring signature-request out to a new component. Wip

* Styling polish and a better message display.

* Update signature request header to no longer use account dropdown mini

* Clean up code and styles

* Code cleanup for signature request redesign branch

* Fix signature request design for full screen

* Replace makenode with object.entries in signature-request-message.component.js

* Remove unused accounts prop from signature-request.component.js

* Use beforeunload  instead of window.onbeforeunload in signature-request
2019-11-04 09:10:46 -03:30
Whymarrh Whitby
eed4a9ed65
ENS Reverse Resolution support (#7177)
* ENS Reverse Resolution support
* Save punycode for ENS domains with Unicode characters
* Update SenderToRecipient recipientEns tooltip
* Use cached results when reverse-resolving ENS names
* Display ENS names in tx activity log
2019-11-01 15:24:00 -02:30
Kristian Tapia
f9cd775eae Add Estimated time to pending tx (#6924)
* Add estimated time to pending transactions

* add sytles for pending transactions component

* add media queries styling for pending transactions component

* fix lint errors, remove extra spaces

* refactor code to call `fetchBasicGasAndTimeEstimates` method once

* refactor code to call `getgetRenderableTimeEstimate` method once

* fix, correct export to use `transaction-time-remaining-component`

* fix indentation issues after running `yarn lint`

* newBigSigDig in gas-price-chart.utils supports strings

* Code cleanup

* Ensure fetchBasicGasAndTimeEstimates is only called from tx-list if there are pending-txs

* Move gas time estimate utilities into utility file

* Move getTxParams to transaction selector file

* Add feature flag for display of remaining transaction time in tx history list

* Fix circular dependency by removing unused import of transactionSelector in selectors.js

* Use correct feature flag property name transactionTime

* Ensure that tx list component correctly responds to turning tx time feature on

* Prevent precision errors in newBigSigDig

* Code clean up for pending transaction times

* Update transaction-time-remaining feature to count down seconds, countdown seconds and show '< 30'

* Code clean up for transaction-time-remaining feature
2019-10-31 23:21:28 -02:30
Mark Stacey
fe28e0d134
Cleanup beforeunload handler after transaction is resolved (#7333)
* Cleanup beforeunload handler after transaction is resolved

The notification window was updated to reject transactions upon close
in #6340. A handler that rejects the transaction was added to
`window.onbeforeunload`, and it was cleared in `actions.js` if it was
confirmed or rejected.

However, the `onbeforeunload` handler remained uncleared if the
transaction was resolved in another window. This results in the
transaction being rejected when the notification window closes, even
long after the transaction is submitted and confirmed. This has been
the cause of many problems with the Firefox e2e tests.

Instead the `onbeforeunload` handler is cleared in the
`componentWillUnmount` lifecycle function, alongside where it's set in
the first place. This ensures that it's correctly unset regardless
of how the transaction was resolved, and it better matches user
expectations.

* Fix indentation and remove redundant export

The `run-all.sh` Bash script now uses consistent indentation, and is
consistent about only re-exporting the Ganache arguments when they
change.

* Ensure transactions are completed before checking balance

Various intermittent e2e test failures appear to be caused by React
re-rendering the transaction list during the test, as the transaction
goes from pending to confirmed. To avoid this race condition, the
transaction is now explicitly looked for in the confirmed transaction
list in each of the tests using this pattern.

* Enable all e2e tests on Firefox

The remaining tests that were disabled on Firefox now work correctly.
Only a few timing adjustments were needed.

* Update Firefox used in CI

Firefox v70 is now used on CI instead of v68. This necessitated
rewriting the function where the extension ID was obtained because the
Firefox extensions page was redesigned.
2019-10-31 13:27:22 -03:00
Mark Stacey
ab0eae1ed3
Rename ConfirmPageContainerHeader class (#7322)
The class has been renamed to reflect that it is a header, to avoid
having the same name as the `ConfirmPageContainer` component. Multiple
components with the same name can lead to confusing error messages.
2019-10-30 16:18:57 -03:00
Mark Stacey
8dfb0e8154
Add hostname and extensionId to site metadata (#7218)
If the extension ID is set, an alternate title and subtitle are used
for the Connect Request screen. The title is always `External
Extension`, and the subtitle is `Extension ID: [id]` instead of the
origin (which would just be `[extension-scheme]://[id]` anyway).

The hostname for the site is used as a fallback in case it has no
title.

The artificial hostname set for internal connections has been renamed
from 'MetaMask' to 'metamask' because URL objects automatically
normalize hostnames to be all lower-case, and it was more convenient to
use a URL object so that the parameter would be the same type as used
for an untrusted connection.
2019-10-29 13:14:41 -03:00
Dan J Miller
b89d96e61a
Specify row height in grid template of transaction list items to fix status spacing issue (#7319) 2019-10-28 20:48:33 -02:30
ricky
af888d0ab2 Add "Retry" option for failed transactions (#7296)
* Begin mocking out retry ui

* Remove "Failed"

* I guess this works?

* Update corresponding test

* wip

* Ok, this appears to be working now

* cleanup

* Move this back to 3

* I don't think I need this

* Rename showRetry to showSpeedUp

* Address PR feedback

* Remove notes

* Rename shouldShowRetry -> shouldShowSpeedUp

* oops
2019-10-28 10:58:46 -02:30
Mark Stacey
ba25d52670
Use AdvancedGasInputs in AdvancedTabContent (#7186)
* Use `AdvancedGasInputs` in `AdvancedTabContent`

The `AdvancedGasInputs` component was originally extracted from the
`AdvancedTabContent` component, duplicating much of the rendering
logic. They have since evolved separately, with bugs being fixed in one
place but not the other.

The inputs and outputs expected weren't exactly the same, as the
`AdvancedGasInputs` component converts the input custom gas price and
limit, and it converts them both in the setter methods as well.
The `GasModalPageContainer` had to be adjusted to avoid converting
these values multiple times.

Both components dealt with input debouncing separately, both in less
than ideal ways. `AdvancedTabContent` didn't debounce either field, but
it did debounce the check for whether the gas limit field was below the
minimum value. So if a less-than-minimum value was set, it would be
propogated upwards and could be saved if the user clicked 'Save'
quickly enough. After a second delay it would snap back to the minimum
value. The `AdvancedGasInputs` component debounced both fields, but
it would replace any gas limit below the minimum with the minimum
value. This led to a problem where a brief pause during typing would
reset the field to 21000.

The `AdvancedGasInputs` approach was chosen, except that it was
updated to no longer change the gas limit if it was below the minimum.
Instead it displays an error. Parent components were checked to ensure
they would detect the error case of the gas limit being set too low,
and prevent the form submission in those cases. Of the three parents,
one had already dealt with it correctly, one needed to convert the
gas limit from hex first, and another needed the gas limit check added.

Closes #6872

* Cleanup send components

Empty README files have been removed, and a mistake in the index file
for the send page has been corrected. The Gas Slider component class
name was updated as well; it looks like it was originally created from
`AdvancedTabContent`, so it still had that class name.
2019-10-23 09:23:15 -03:00
Dan J Miller
994a8a3167
Add metrics events for clicking and saving tx speed ups (#7275) 2019-10-21 14:23:26 -02:30
Thomas
aa95e5a4c8 Do not transate on seed phrases 2019-10-07 10:45:12 -07:00
Thomas Huang
45a8fdebf7 Update ETH logo, update deposit Ether logo height and width (#7239) 2019-10-02 10:15:44 -06:00
ricky
5f254f7325 Add advanced setting to enable editing nonce on confirmation screens (#7089)
* Add UseNonce toggle

* Get the toggle actually working and dispatching

* Display nonce field on confirmation page

* Remove console.log

* Add placeholder

* Set customNonceValue

* Add nonce key/value to txParams

* remove customNonceValue from component state

* Use translation file and existing CSS class

* Use existing TextField component

* Remove console.log

* Fix lint nits

* Okay this sorta works?

* Move nonce toggle to advanced tab

* Set min to 0

* Wrap value in Number()

* Add customNonceMap

* Update custom nonce translation

* Update styles

* Reset CustomNonce

* Fix lint

* Get tests passing

* Add customNonceValue to defaults

* Fix test

* Fix comments

* Update tests

* Use camel case

* Ensure custom nonce can only be whole number

* Correct font size for custom nonce input

* UX improvements for custom nonce feature

* Fix advanced-tab-component tests for custom nonce changes

* Update title of nonce toggle in settings

* Remove unused locale message

* Cast custom nonce to string in confirm-transaction-base.component

* Handle string conversion and invalid values for custom nonces in handler

* Don't call getNonceLock in tx controller if there is a custom nonce

* Set nonce details for cases where nonce is customized

* Fix incorrectly use value for deciding whether to getnoncelock in approveTransaction

* Default nonceLock to empty object in approveTransaction

* Reapply use on nonceLock in cases where customNonceValue in approveTransaction.

* Show warning message if custom nonce is higher than MetaMask's next nonce

* Fix e2e test failure caused by custom nonce and 3box toggle conflict

* Update nonce warning message to include the suggested nonce

* Handle nextNonce comparison and update logic in lifecycle

* Default nonce field to suggested nonce

* Clear custom nonce on reject or confirm

* Fix bug where nonces are not shown in tx list on self sent transactions

* Ensure custom nonce is reset after tx is created in background

* Convert customNonceValue to number in approve tranasction controller

* Lint fix

* Call getNextNonce after updating custom nonce
2019-09-27 00:30:36 -04:00
Mark Stacey
638149d861
Remove unused modals (#7184)
These modals were no longer referenced anywhere.
2019-09-18 10:09:41 -03:00
Mark Stacey
8a08b320e5
Remove unused customize-gas modal (#7185)
This modal hasn't been used since #5704, where it was replaced.
2019-09-18 10:09:32 -03:00
Erik Marks
38f6550951 fix rinkeby spelling (#7148) 2019-09-10 12:51:34 -10:00
Mark Stacey
0ffee10f19
Prevent invalid inline speed-ups (#7085)
Speeding up anything but the pending transaction with the lowest nonce
is ineffectual, as the transaction with the lowest nonce blocks the
others from completing first. The inline speed-up button in the
transaction activity log has been removed for these invalid cases.

The button will show up in the activity log for the pending transaction
with the lowest nonce, but not for the others.

Closes #6844
2019-09-09 16:59:00 -03:00
Nick Doiron
d589d2dec0 Right-to-left CSS (using module for conversion) (#7072)
* Create RTL stylesheets using `gulp-rtl`

* Handle RTL stylesheet special cases

Certain blocks of Sass  were set to bypass "rtlcss" using ignore
comments. Certain icons had to be flipped 180 degrees.

* Switch stylesheets when locale changes

A second stylesheet has been added to each HTML page for use with
right-to-left locales. It is disabled by default. It is enabled on
startup if a RTL locale is set, and when switching to a RTL locale.
Similarly the LTR stylesheet is disabled when a RTL locale is used.

Unfortunately there is an unpleasant flash of unstyled content when
switching between a LTR and a RTL locale. There is also a slightly
longer page load time when using a RTL locale (<1s difference). We
couldn't think of an easy way to avoid these problems.

* Set `dir="auto"` as default on `TextFields`
2019-09-03 14:47:54 -03:00
Mark Stacey
daa20b4b63
Return after rejecting promise in action (#7079)
* Add missing test descriptions

* Fix async tests that expect a rejection

These tests expected the function under test to return a rejected
promise, and had assertions to be run in the `catch` clause. However,
the tests would still pass if the function didn't reject, with
the assertions never being run.

The tests have been updated to fail if the function doesn't throw.

* Handle ignored promise rejection

In the case where `forceUpdateMetamaskState` rejects, the function
`setSeedPhraseBackedUp` would never resolve. It has been updated to
pass along the rejection instead.

* Return after rejecting promise in action

A few actions would continue after encountering an error, resulting in
errors being compounded. Instead all actions will now return after
encountering an error (which it looks like was the intention in these
cases anyway).
2019-08-31 13:34:27 -03:00
Whymarrh Whitby
35c29c732d
Right align "Total" line items in tx detail view (#7050) 2019-08-21 17:46:18 -02:30
Whymarrh Whitby
e0e06709d3
Fix indentation of div.request-signature__rows code (#7045) 2019-08-21 09:12:08 -02:30
Brendan Chou
cc71b4f52b Add support for eth_signTypedData_v4 (#6930) 2019-08-20 17:22:59 -02:30
Whymarrh Whitby
e47448362d
Bug fixes for incoming transactions (#7043)
* Fix styling of `.transaction-list`
* Filter `incomingTxListSelector` by network as well
* Start and stop block tracker polling in incoming tx controller
* Add fetch with abort in bg for `IncomingTxController`
2019-08-20 16:22:00 -02:30
Dan J Miller
821529622e Fetch & display received transactions (#6996) 2019-08-16 16:24:10 -02:30
Kristian Tapia
d4db2c3de3 Show recipient alias in confirm header if exists (#6944) 2019-08-08 16:15:30 -02:30
Mark Stacey
b3833b1074 Prevent hidden popup overlay
A hidden overlay was preventing interactions with the lower 356 pixels
in the popup view when there are zero notifications. It was also
preventing interactions with the 100 pixels above the notifications in
the case where there were two notifications, which obscured the `Send`
button.

The first problem was solved by ensuring the notification wrapper isn't
rendered when there are no notifications. The second problem was solved
by updating the notification wrapper style to avoid setting a height.
2019-08-06 16:22:49 -03:00
Dan J Miller
3136dd39ea
Only show notification expand icon when there are > 1 notifications that 'shouldBeRendered' (#6965) 2019-08-06 00:54:36 -02:30
Dan J Miller
9d5be5d29f
New notification fixes (#6955)
* Replace use of backup-notification with use of home notification

* Pin notifications relative to window

* Remove unneeded isRequired condition on some home.component properties

* Refactor rendering of home notifications

* UX for multiple notifications

* Adds dismissal to provider request notification.

* Fix test failures

The e2e tests have been updated to reference `home-notification`
classnames instead of the removed `background-notification`. The
active tab proptypes and default values were updated as well.
2019-08-02 18:01:26 -02:30
Dan J Miller
1b33d7fd4c Fixes use of 'Enter' key to save contact in address book modal (#6946) 2019-08-02 10:24:45 -02:30
Christopher Cooper
b7eae4ba80 split AccountDetails into a separate component (#6943) 2019-08-02 10:06:31 -02:30
Dan J Miller
3eff478775
I5849 incremental account security (#6874)
* Implements ability to defer seed phrase backup to later

* Adds incremental-security.spec.js, including test dapp that sends signed tx with stand alone localhost provider

* Update metamask-responsive-ui for incremental account security changes

* Update backup-notification style and fix responsiveness of seed phrase screen

* Remove uneeded files from send-eth-with-private-key-test/

* Apply linguist flags in .gitattributes for send-eth-with-private-key-test/ethereumjs-tx.js

* Improve docs in controllers/onboarding.js

* Clean up metamask-extension/test/e2e/send-eth-with-private-key-test/index.html

* Remove unnecessary newlines in a couple first-time-flow/ files

* Fix import of backup-notification in home.component

* Fix git attrs file
2019-08-02 01:27:26 -02:30
Whymarrh Whitby
e9a63d5d5b
Default Privacy Mode to ON, allow force sharing address (#6904) 2019-08-01 10:54:33 -02:30
Whymarrh Whitby
4d88e1cf86 Enable indent linting via ESLint (#6936)
* Enable indent linting via ESLint

* yarn run lint:fix
2019-07-31 10:17:11 -10:00
Dan J Miller
e9c7df28ed
Address book send plus contact list (#6914)
* Style Send Header

* Move Send to-row to send view and restyle

* Add "Recents" group to select recipient view

* Rename SendToRow to AddRecipient

* Basic UI and Layout

* New ENSInput component

* wip - fuzzy search for input

* small refactor

* Add Dialog

* contact list initial

* initial error on invalid address

* clean up edit

* Click to open modal

* Create AddToAddressBookModal component

* Modal styling and layout

* modal i18n

* Add to Addressbook

* ens wip

* ens wip

* ENS Resolution

* Reset input

* Send to explicit address

* Happy Path Complete

* Add back error checking

* Reset send-to when emptying input

* Add back warning object

* Fix linter

* Fix unit test #1 - fix import paths

* Remove dead tests

* One more to go

* Fix all unit tests

* add unit test for reducers and actions

* test rendering AddRecipient

* Add tests for dialog boxes in AddRecipient

* Add test for validating

* Fix linter

* Fix e2e tests

* Token send e2e fix

* Style View Contact

* Style edit-contact

* Fix e2e

* Fix from-import-beta-ui e2e spec

* Make section header say "add recipient” by default

* Auto-focus add recipient input

* Update placeholder text

* Update input title font size

* Auto advance to next step if user paste a valid address

* Ellipsify address when recipient is selected

* Fix app header background color on desktop

* Give each form row a margin of 16px

* Use .container/.component naming pattern for ens-input

* Auto-focus on input when add to addressbook modal is opened; Save on Enter

* Fix and add unit test

* Fix selectors name in e2e tests

* Correct e2e test token amount for address-book-send changes

* Adds e2e test for editing a transaction

* Delete test/integration/lib/send-new-ui.js

* Add tests for amount max button and high value error on send screen to test/e2e/metamask-ui.spec.js

* lint and revert to address as object keys

* add chainId based on current network to address book entry

* fix test

* only display contacts for the current network

* Improve ENS message when not found on current network

* Add error to indicate when network does not support ENS

* bump gaba

* address book, resolve comments

* Move contact-list to its own component

* De-duplicate getaddressbook selector and refactor name selection logic in contact-list-tab/

* Use contact-list component in contact-list-tab.component (i.e. in settings)

* Improve/fix settings headers for popup and browser views

* Lint fixes related to address book updates

* Add 'My accounts' page to settings address book

* Update add new contact button in settings to match floating circular design

* Improve styles of view contact page

* Improve styles and labels of the add-contact.component

* Further lint fixes related to address book updates

* Update unit tests as per address book updates

* Ensure that contact list groups are sorted alphabetically

* Refactor settings component to use a container for connection to redux; allow display of addressbook name in settings header

* Decouple ens-input.component from send context

* Add ens resolution to add contact screen in settings

* Switching networks when an ens address is shown on send form removes the ens address.

* Resolve send screen search for ensAddress to matching address book entry if it exists

* Show resolved ens icon and address if exists (settings: add-contact.component)

* Make the displayed and copied address in view-contact.component the checksummed address

* Default alias state prop in AddToAddressBookModal to empty string

* Use keyCode to detect enter key in AddToAddressBookModal

* Ensure add-contact component properly updates after QR code detection

* Fix display of all recents after clicking 'Load More' in contact list

* Fix send screen contact searching after network switching

* Code cleanup related to address book changes

* Update unit tests for address book changes

* Update ENS name not found on network message

* Add ens registration error message

* Cancel on edit mode takes user back to view screen

* Adds support for memo to settings contact list view and edit screens

* Modify designs of edit and view contact in popup environment

* Update settings content list UX to show split columns in fullscreen and proper internal navigation

* Correct background address book API usages in UI
2019-07-31 17:26:44 -02:30
Whymarrh Whitby
2761cc5a2d
Hide Copy Tx ID and block explorer link for txns w/o hash (#6928) 2019-07-29 22:12:29 -02:30
Mark Stacey
329c376449
Remove unused props from routes and network dropdown (#6919)
These props were discovered to be unused while I was working on #6680
2019-07-29 08:44:18 -03:00
Mark Stacey
1f45798707
Override ownProps with state props in SignatureRequest (#6911)
The `accounts` prop of `SignatureRequest` was throwing a PropType
warning because `accounts` was an object instead of an array. It looks
like when the `mergeProps` function was added in #6340, the ownProps
were accidentally set to override the state props.

The now ignored props have been removed from the parent `ConfirmTxScreen`
component as well. `conversionRate` was identical to the one retrieved
in `SignatureRequest`, and `selectedAddress` differed only in the
fallback behaviour when `state.metamask.selectedAddress` does not exist;
it will now default to the first account instead (as was the original
behavior, prior to #6340).
2019-07-26 10:39:13 -03:00
Mark Stacey
adac1de822
Remove AccountDropdownMini component (#6906)
The `AccountDropdownMini` component featured the ability to switch
accounts using a dropdown, but this functionality was disabled in #6024.
It has been acting as a restyled `AccountListItem` since then.

The component has been removed, and the style changes moved to the sole
parent component (`RequestSignature`).
2019-07-25 08:55:43 -03:00
Mark Stacey
74639ab3ae
Remove unused time-remaining component (#6912)
The `time-remaining` component hasn't been used since #5704, aside from
a few styles. Those styles have been integrated into the
`advanced-tab-content` styles, and the unused component has been
deleted.
2019-07-25 08:55:18 -03:00
Terry Smith
33071e3014 Targets base inputs and only prevents outline if user uses a mouse (#6871) 2019-07-16 22:58:00 -02:30
Terry Smith
721215973a Re enable the setMouseUserState styles. (#6860)
Typo
2019-07-16 00:06:57 -02:30
Thomas Huang
96a12a627e
Merge pull request #6832 from MetaMask/master-rebased
Master rebased
2019-07-12 10:58:19 -07:00
Mark Stacey
2eea388680
Remove unused expressions (#6839)
Unused expressions are generally a mistake, as they don't do anything.
The exceptions to this rule (short-circuit expressions and ternary
expressions) have been allowed.

The `webrtc-adapter` was previously ignored by eslint because it has a
side-effect upon being imported. I removed the local variable instead,
which should preserve the same side-effect without making eslint
complain.
2019-07-12 12:41:39 -03:00
ryanml
daccb06a60 Create MetaFoxLogo component (#6819) 2019-07-09 14:47:58 -02:30
Dan J Miller
32a3f5ad7b
Address various UI styling issues (#6744)
* Add loading spinner to pending tx status label.

* Add border around account icon in top right

* Change style of settings toggle buttons; wrap with local components

* Eliminate large space after settings labels when no description

* Remove network form from advanced tab of settings

* Keep new account container height to contents when in full screen
2019-07-08 15:28:35 -02:30