1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-04 23:14:56 +01:00
metamask-extension/ui/pages/send/send-content/send-gas-row/send-gas-row.stories.js

89 lines
2.2 KiB
JavaScript
Raw Normal View History

2021-09-13 23:05:42 +02:00
/* eslint-disable react/prop-types */
import React, { useEffect, useState } from 'react';
import { Provider } from 'react-redux';
import testData from '../../../../../.storybook/test-data';
import { GAS_INPUT_MODES } from '../../../../ducks/send';
import { updateMetamaskState } from '../../../../store/actions';
2021-09-13 23:05:42 +02:00
import configureStore from '../../../../store/store';
import { calcGasTotal } from '../../send.utils';
import README from './README.mdx';
2021-09-13 23:05:42 +02:00
import SendGasRow from './send-gas-row.component';
const store = configureStore(testData);
export default {
title: 'Pages/Send/SendContent/SendGasRow',
id: __filename,
2021-09-13 23:05:42 +02:00
decorators: [(story) => <Provider store={store}>{story()}</Provider>],
parameters: {
docs: {
page: README,
},
},
argTypes: {
insufficientBalance: {
name: 'Is Insufficient Balance',
control: { type: 'boolean' },
defaultValue: false,
},
},
2021-09-13 23:05:42 +02:00
};
export const DefaultStory = (args) => {
2021-09-13 23:05:42 +02:00
const state = store.getState();
const { metamask } = state;
const { send } = metamask;
const [sendState, setSendState] = useState(send);
useEffect(() => {
const newState = Object.assign(metamask, {
send: sendState,
});
store.dispatch(updateMetamaskState(newState));
}, [sendState, metamask]);
const updateGasPrice = ({ gasPrice, gasLimit }) => {
let newGasTotal = send.gasTotal;
if (send.gasLimit) {
newGasTotal = calcGasTotal(gasLimit, gasPrice);
}
const newState = {
...state.metamask.send,
gasPrice,
gasTotal: newGasTotal,
};
setSendState(newState);
};
const updateGasLimit = (limit) => {
let newGasTotal = send.gasTotal;
if (send.gasPrice) {
newGasTotal = calcGasTotal(limit, send.gasPrice);
}
const newState = {
...state.metamask.send,
gasLimit: limit,
gasTotal: newGasTotal,
};
setSendState(newState);
};
return (
<div style={{ width: 500 }}>
<SendGasRow
{...args}
2021-09-13 23:05:42 +02:00
updateGasPrice={updateGasPrice}
updateGasLimit={updateGasLimit}
gasPrice={send.gasPrice}
gasLimit={send.gasLimit}
gasInputMode={GAS_INPUT_MODES.INLINE}
/>
</div>
);
};
DefaultStory.storyName = 'SendGasRow';