1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-11-25 11:28:51 +01:00
metamask-extension/ui/pages/swaps/select-quote-popover
sumit shinde ( Roni ) db4c4317dd
Update knobs to controls in storybook: SelectQuotePopover (#18671)
* Update knobs to controls in storybook: SelectQuotePopover

* Update select-quote-popover.stories.js

* Update select-quote-popover.stories.js

* fix eslint

* Update ui/pages/swaps/select-quote-popover/select-quote-popover.stories.js

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

---------

Co-authored-by: George Marshall <georgewrmarshall@gmail.com>
Co-authored-by: George Marshall <george.marshall@consensys.net>
2023-04-24 14:48:14 +05:30
..
__snapshots__
quote-details
sort-list
index.js
index.scss
mock-quote-data.js
mock-quote-data.test.js
README.mdx
select-quote-popover-constants.js
select-quote-popover.js
select-quote-popover.stories.js
select-quote-popover.test.js

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

import Button from '.';
import SelectQuotePopover from '.';

# SelectQuotePopover

`SelectQuotePopover` is a modal that displays information gathered from multiple liquidity sources.

<Canvas>
  <Story id="pages-swaps-selectquotepopover--default-story" />
</Canvas>

## Component API

<ArgsTable of={SelectQuotePopover} />

## Usage

The following describes the props and example usage for this component.

### onClose

Action called when close button is clicked. It's also called on submit action.

### onSubmit

Action called when Select button is clicked

### swapToSymbol

Name of the receiving symbol

### quoteDataRows

data provided with the following properties:

| type                       | Types     |
| -------------------------- | --------- |
| `aggId`                    | `string`  |
| `amountReceiving`          | `string`  |
| `destinationTokenDecimals` | `number`  |
| `destinationTokenSymbol`   | `string`  |
| `destinationTokenValue`    | `string`  |
| `isBestQuote--primary`     | `boolean` |
| `networkFees`              | `string`  |
| `quoteSource`              | `string`  |
| `rawNetworkFees`           | `string`  |
| `slippage`                 | `string`  |
| `sourceTokenDecimals`      | `number`  |
| `sourceTokenSymbol`        | `string`  |
| `sourceTokenValue`         | `string`  |

### initialAggId

When `initialAggId` is defined, the corresponding quote is pre-selected in sort-list

### onQuoteDetailsIsOpened

Detail opened when click on caret of a specific quote.

### hideEstimatedGasFee

When the `hideEstimatedGasFee` is set to `true` it hides the Estimated network fees column