1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-22 17:33:23 +01:00

knob to control (#18635)

* knob to control

* Update confirm-add-suggested-token.stories.js

* fix eslint

* Update ui/pages/confirm-add-suggested-token/confirm-add-suggested-token.stories.js

Co-authored-by: George Marshall <georgewrmarshall@gmail.com>

* Update ui/pages/confirm-add-suggested-token/confirm-add-suggested-token.stories.js

Co-authored-by: George Marshall <georgewrmarshall@gmail.com>

* Update ui/pages/confirm-add-suggested-token/confirm-add-suggested-token.stories.js

Co-authored-by: George Marshall <georgewrmarshall@gmail.com>

* Update ui/pages/confirm-add-suggested-token/confirm-add-suggested-token.stories.js

Co-authored-by: George Marshall <georgewrmarshall@gmail.com>

* Update confirm-add-suggested-token.stories.js

* updaes

* Updating to use redux provider

* lint fix

---------

Co-authored-by: George Marshall <georgewrmarshall@gmail.com>
Co-authored-by: georgewrmarshall <george.marshall@consensys.net>
This commit is contained in:
sumit shinde ( Roni ) 2023-04-19 14:33:29 +05:30 committed by GitHub
parent 5892acab81
commit 52e91058a0
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 100 additions and 142 deletions

View File

@ -2,82 +2,82 @@ export const suggestedAssets = [
{
asset: {
address: '0x6b175474e89094c44da98b954eedeac495271d0f',
symbol: 'META',
symbol: 'ETH',
decimals: 18,
image: 'metamark.svg',
unlisted: false
image: './images/eth_logo.svg',
unlisted: false,
},
},
{
asset: {
'address': '0xB8c77482e45F1F44dE1745F52C74426C631bDD52',
'symbol': '0X',
'decimals': 18,
'image': '0x.svg',
'unlisted': false
address: '0xB8c77482e45F1F44dE1745F52C74426C631bDD52',
symbol: '0X',
decimals: 18,
image: '0x.svg',
unlisted: false,
},
},
{
asset: {
'address': '0x1f9840a85d5af5bf1d1762f925bdaddc4201f984',
'symbol': 'AST',
'decimals': 18,
'image': 'ast.png',
'unlisted': false
address: '0x1f9840a85d5af5bf1d1762f925bdaddc4201f984',
symbol: 'AST',
decimals: 18,
image: 'ast.png',
unlisted: false,
},
},
{
asset: {
'address': '0x9f8f72aa9304c8b593d555f12ef6589cc3a579a2',
'symbol': 'BAT',
'decimals': 18,
'image': 'BAT_icon.svg',
'unlisted': false
address: '0x9f8f72aa9304c8b593d555f12ef6589cc3a579a2',
symbol: 'BAT',
decimals: 18,
image: 'BAT_icon.svg',
unlisted: false,
},
},
{
asset: {
'address': '0xe83cccfabd4ed148903bf36d4283ee7c8b3494d1',
'symbol': 'CVL',
'decimals': 18,
'image': 'CVL_token.svg',
'unlisted': false
address: '0xe83cccfabd4ed148903bf36d4283ee7c8b3494d1',
symbol: 'CVL',
decimals: 18,
image: 'CVL_token.svg',
unlisted: false,
},
},
{
asset: {
'address': '0x0bc529c00C6401aEF6D220BE8C6Ea1667F6Ad93e',
'symbol': 'GLA',
'decimals': 18,
'image': 'gladius.svg',
'unlisted': false
address: '0x0bc529c00C6401aEF6D220BE8C6Ea1667F6Ad93e',
symbol: 'GLA',
decimals: 18,
image: 'gladius.svg',
unlisted: false,
},
},
{
asset: {
'address': '0x467Bccd9d29f223BcE8043b84E8C8B282827790F',
'symbol': 'GNO',
'decimals': 18,
'image': 'gnosis.svg',
'unlisted': false
address: '0x467Bccd9d29f223BcE8043b84E8C8B282827790F',
symbol: 'GNO',
decimals: 18,
image: 'gnosis.svg',
unlisted: false,
},
},
{
asset: {
'address': '0xff20817765cb7f73d4bde2e66e067e58d11095c2',
'symbol': 'OMG',
'decimals': 18,
'image': 'omg.jpg',
'unlisted': false
address: '0xff20817765cb7f73d4bde2e66e067e58d11095c2',
symbol: 'OMG',
decimals: 18,
image: 'omg.jpg',
unlisted: false,
},
},
{
asset: {
'address': '0x8e870d67f660d95d5be530380d0ec0bd388289e1',
'symbol': 'WED',
'decimals': 18,
'image': 'wed.png',
'unlisted': false
address: '0x8e870d67f660d95d5be530380d0ec0bd388289e1',
symbol: 'WED',
decimals: 18,
image: 'wed.png',
unlisted: false,
},
},
]
];

View File

@ -172,9 +172,9 @@ const state = {
},
'0x6b175474e89094c44da98b954eedeac495271d0f': {
address: '0x6b175474e89094c44da98b954eedeac495271d0f',
symbol: 'META',
symbol: 'ETH',
decimals: 18,
image: 'metamark.svg',
image: './images/eth_logo.svg',
unlisted: false,
},
'0xB8c77482e45F1F44dE1745F52C74426C631bDD52': {

View File

@ -1,107 +1,65 @@
/* eslint-disable react/prop-types */
import React, { useEffect } from 'react';
import { text } from '@storybook/addon-knobs';
import { store, getNewState } from '../../../.storybook/preview';
import React from 'react';
import { Provider } from 'react-redux';
import { suggestedAssets as mockSuggestedAssets } from '../../../.storybook/initial-states/approval-screens/add-suggested-token';
import { updateMetamaskState } from '../../store/actions';
import configureStore from '../../store/store';
import mockState from '../../../.storybook/test-data';
import ConfirmAddSuggestedToken from '.';
const store = configureStore({
metamask: {
...mockState.metamask,
suggestedAssets: [...mockSuggestedAssets],
tokens: [],
},
});
export default {
title: 'Pages/ConfirmAddSuggestedToken',
argTypes: {
tokens: {
control: 'array',
table: { category: 'Data' },
},
suggestedAssets: {
control: 'array',
table: { category: 'Data' },
},
},
decorators: [(story) => <Provider store={store}>{story()}</Provider>],
};
const { metamask: state } = store.getState();
const PageSet = ({ children, suggestedAssets, tokens }) => {
const symbol = text('symbol', 'META');
const image = text('Icon URL', 'metamark.svg');
useEffect(() => {
if (!suggestedAssets?.length) {
return;
}
suggestedAssets[0].asset.image = image;
suggestedAssets[0].asset.symbol = symbol;
store.dispatch(
updateMetamaskState(
getNewState(state, {
suggestedAssets,
}),
),
);
}, [image, suggestedAssets, symbol]);
useEffect(() => {
store.dispatch(
updateMetamaskState(
getNewState(state, {
tokens,
}),
),
);
}, [tokens]);
return children;
};
export const DefaultStory = ({ suggestedAssets, tokens }) => {
return (
<PageSet suggestedAssets={suggestedAssets} tokens={tokens}>
<ConfirmAddSuggestedToken />
</PageSet>
);
};
export const DefaultStory = () => <ConfirmAddSuggestedToken />;
DefaultStory.storyName = 'Default';
DefaultStory.args = {
suggestedAssets: [...mockSuggestedAssets],
tokens: [],
};
export const WithDuplicateAddress = ({ suggestedAssets, tokens }) => {
return (
<PageSet suggestedAssets={suggestedAssets} tokens={tokens}>
<ConfirmAddSuggestedToken />
</PageSet>
);
};
WithDuplicateAddress.args = {
suggestedAssets: [...mockSuggestedAssets],
tokens: [
{
...mockSuggestedAssets[0].asset,
},
],
};
export const WithDuplicateAddress = () => <ConfirmAddSuggestedToken />;
const WithDuplicateAddressStore = configureStore({
metamask: {
...mockState.metamask,
suggestedAssets: [...mockSuggestedAssets],
tokens: [
{
...mockSuggestedAssets[0].asset,
},
],
},
});
WithDuplicateAddress.decorators = [
(story) => <Provider store={WithDuplicateAddressStore}>{story()}</Provider>,
];
export const WithDuplicateSymbolAndDifferentAddress = ({
suggestedAssets,
tokens,
}) => {
return (
<PageSet suggestedAssets={suggestedAssets} tokens={tokens}>
<ConfirmAddSuggestedToken />
</PageSet>
);
};
WithDuplicateSymbolAndDifferentAddress.args = {
suggestedAssets: [...mockSuggestedAssets],
tokens: [
{
...mockSuggestedAssets[0].asset,
address: '0xNonSuggestedAddress',
},
],
};
export const WithDuplicateSymbolAndDifferentAddress = () => (
<ConfirmAddSuggestedToken />
);
const WithDuplicateSymbolAndDifferentAddressStore = configureStore({
metamask: {
...mockState.metamask,
suggestedAssets: [...mockSuggestedAssets],
tokens: [
{
...mockSuggestedAssets[0].asset,
address: '0xNonSuggestedAddress',
},
],
},
});
WithDuplicateSymbolAndDifferentAddress.decorators = [
(story) => (
<Provider store={WithDuplicateSymbolAndDifferentAddressStore}>
{story()}
</Provider>
),
];