1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-04 23:14:56 +01:00
metamask-extension/ui/pages/import-token
daniba 085126d275
Move search icon and add to storybook (#14940)
* move search icon || update imports || add to story

* Optimized svg path, updated icon api and updating colors

* update other icons

* update snapshot

Co-authored-by: georgewrmarshall <george.marshall@consensys.net>
2022-06-21 10:18:35 -05:00
..
token-list
token-search Move search icon and add to storybook (#14940) 2022-06-21 10:18:35 -05:00
import-token.component.js Add token standard to custom token details (#14506) 2022-04-26 12:08:14 -07:00
import-token.container.js
import-token.stories.js
import-token.test.js Add token standard to custom token details (#14506) 2022-04-26 12:08:14 -07:00
index.js
index.scss
README.mdx

import { Story, Canvas, ArgsTable } from '@storybook/addon-docs';

import ImportToken from './import-token.component';

import testData from '../../../.storybook/test-data';
import configureStore from '../../store/store';
const store = configureStore(testData);
const { metamask } = store.getState();

export const PersonalAddress = () => <code>{metamask.selectedAddress}</code>

# ImportToken

The `ImportToken` component allows a user to import custom tokens in one of two ways:
1. By searching for one
2. By importing one by `Token Contract Address`

<Canvas>
  <Story id="ui-pages-import-token-import-token-stories-js--default-story" />
</Canvas>

## Example inputs

An example input that works, to enable the `Add Custom Token` button is `0xAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA`.

### Personal address error
To show the personal address detected error, input the address <PersonalAddress/> in the `Token Contract Address` field.

## Component API

<ArgsTable of={ImportToken} />