{this.renderApproveContentCard({
- symbol:
,
+ symbol:
,
title: t('permissionRequest'),
content: this.renderERC721OrERC1155PermissionContent(),
showEdit: false,
@@ -541,7 +541,7 @@ export default class ConfirmApproveContent extends Component {
: t('copyToClipboard')
}
>
-
+
diff --git a/ui/pages/confirm-approve/confirm-approve-content/confirm-approve-content.stories.js b/ui/pages/confirm-approve/confirm-approve-content/confirm-approve-content.stories.js
new file mode 100644
index 000000000..de304a1c9
--- /dev/null
+++ b/ui/pages/confirm-approve/confirm-approve-content/confirm-approve-content.stories.js
@@ -0,0 +1,141 @@
+import React from 'react';
+import { ERC20 } from '../../../helpers/constants/common';
+import ConfirmApproveContent from '.';
+
+export default {
+ title: 'Pages/ConfirmApprove/ConfirmApproveContent',
+ id: __filename,
+ component: ConfirmApproveContent,
+ argTypes: {
+ decimals: {
+ control: 'number',
+ },
+ tokenAmount: {
+ control: 'text',
+ },
+ customTokenAmount: {
+ control: 'text',
+ },
+ tokenSymbol: {
+ control: 'text',
+ },
+ siteImage: {
+ control: 'text',
+ },
+ showCustomizeGasModal: {
+ action: 'showCustomizeGasModal',
+ },
+ showEditApprovalPermissionModal: {
+ action: 'showEditApprovalPermissionModal',
+ },
+ origin: {
+ control: 'text',
+ },
+ setCustomAmount: {
+ action: 'setCustomAmount',
+ },
+ tokenBalance: {
+ control: 'text',
+ },
+ data: {
+ control: 'text',
+ },
+ toAddress: {
+ control: 'text',
+ },
+ currentCurrency: {
+ control: 'text',
+ },
+ nativeCurrency: {
+ control: 'text',
+ },
+ fiatTransactionTotal: {
+ control: 'text',
+ },
+ ethTransactionTotal: {
+ control: 'text',
+ },
+ useNonceField: {
+ control: 'boolean',
+ },
+ customNonceValue: {
+ control: 'text',
+ },
+ updateCustomNonce: {
+ action: 'updateCustomNonce',
+ },
+ getNextNonce: {
+ action: 'getNextNonce',
+ },
+ nextNonce: {
+ control: 'number',
+ },
+ showCustomizeNonceModal: {
+ action: 'showCustomizeNonceModal',
+ },
+ warning: {
+ control: 'text',
+ },
+ txData: {
+ control: 'object',
+ },
+ fromAddressIsLedger: {
+ control: 'boolean',
+ },
+ chainId: {
+ control: 'text',
+ },
+ rpcPrefs: {
+ control: 'object',
+ },
+ isContract: {
+ control: 'boolean',
+ },
+ hexTransactionTotal: {
+ control: 'text',
+ },
+ isMultiLayerFeeNetwork: {
+ control: 'boolean',
+ },
+ supportsEIP1559V2: {
+ control: 'boolean',
+ },
+ assetName: {
+ control: 'text',
+ },
+ tokenId: {
+ control: 'text',
+ },
+ assetStandard: {
+ control: 'text',
+ },
+ },
+ args: {
+ decimals: 16,
+ siteImage: 'https://metamask.github.io/test-dapp/metamask-fox.svg',
+ customTokenAmount: '10',
+ tokenAmount: '10',
+ origin: 'https://metamask.github.io/test-dapp/',
+ tokenSymbol: 'TST',
+ assetStandard: ERC20,
+ tokenImage: 'https://metamask.github.io/test-dapp/metamask-fox.svg',
+ tokenBalance: '15',
+ data:
+ '0x095ea7b30000000000000000000000009bc5baf874d2da8d216ae9f137804184ee5afef40000000000000000000000000000000000000000000000000000000000011170',
+ toAddress: '0x9bc5baf874d2da8d216ae9f137804184ee5afef4',
+ currentCurrency: 'TST',
+ nativeCurrency: 'ETH',
+ ethTransactionTotal: '20',
+ fiatTransactionTotal: '10',
+ useNonceField: true,
+ nextNonce: 1,
+ customNonceValue: '2',
+ chainId: '1337',
+ rpcPrefs: {},
+ isContract: true,
+ },
+};
+
+export const DefaultStory = (args) =>
;
+
+DefaultStory.storyName = 'Default';
diff --git a/ui/pages/create-account/connect-hardware/account-list.js b/ui/pages/create-account/connect-hardware/account-list.js
index dcfda41fe..183c723c9 100644
--- a/ui/pages/create-account/connect-hardware/account-list.js
+++ b/ui/pages/create-account/connect-hardware/account-list.js
@@ -152,7 +152,10 @@ class AccountList extends Component {
rel="noopener noreferrer"
title={this.context.t('etherscanView')}
>
-
+
);
diff --git a/ui/pages/create-account/connect-hardware/account-list.stories.js b/ui/pages/create-account/connect-hardware/account-list.stories.js
index 28b2639de..49a9695b0 100644
--- a/ui/pages/create-account/connect-hardware/account-list.stories.js
+++ b/ui/pages/create-account/connect-hardware/account-list.stories.js
@@ -1,71 +1,92 @@
-import React, { useState } from 'react';
-import { Provider } from 'react-redux';
-import { action } from '@storybook/addon-actions';
-import configureStore from '../../../store/store';
-import testData from '../../../../.storybook/test-data';
-
+import React from 'react';
import AccountList from './account-list';
-const store = configureStore(testData);
-
export default {
title: 'Pages/CreateAccount/ConnectHardware/AccountList',
id: __filename,
- decorators: [(story) =>
],
-};
-
-global.platform = {
- openTab: () => action('Open Tab')(),
-};
-
-export const DefaultStory = () => {
- const [selectedAccounts, setSelectedAccounts] = useState([
- {
- name: 'This is a Really Long Account Name',
- address: '0x64a845a5b02460acf8a3d84503b0d68d028b4bb4',
- index: 0,
- balance: '0x176e5b6f173ebe66',
+ argTypes: {
+ onPathChange: {
+ action: 'onPathChange',
},
- ]);
- const { metamask } = store.getState();
- const { accountArray, connectedAccounts } = metamask;
- const LEDGER_LIVE_PATH = `m/44'/60'/0'/0/0`;
- const MEW_PATH = `m/44'/60'/0'`;
- const BIP44_PATH = `m/44'/60'/0'/0`;
-
- const HD_PATHS = [
- { name: 'Ledger Live', value: LEDGER_LIVE_PATH },
- { name: 'Legacy (MEW / MyCrypto)', value: MEW_PATH },
- { name: `BIP44 Standard (e.g. MetaMask, Trezor)`, value: BIP44_PATH },
- ];
-
- const onAccountChange = (account) => {
- let accounts = [];
- if (selectedAccounts.includes(account)) {
- accounts = selectedAccounts.filter((acc) => account !== acc);
- } else {
- accounts.push(account);
- }
- setSelectedAccounts(accounts);
- };
-
- return (
-