From 132c1818df22ce86dbbf286fd7f7c40440688af6 Mon Sep 17 00:00:00 2001
From: Nidhi Kumari <menidhikjha@gmail.com>
Date: Fri, 22 Jul 2022 23:28:37 +0530
Subject: [PATCH] added storybook controls for confirm send ether component
 (#15235)

* added storybook controls for confirm send ether component

* fixed lint errors

* corrected the argTypes for send-ether-storybook component
---
 .../confirm-send-ether.stories.js             | 64 +++++--------------
 1 file changed, 15 insertions(+), 49 deletions(-)

diff --git a/ui/pages/confirm-send-ether/confirm-send-ether.stories.js b/ui/pages/confirm-send-ether/confirm-send-ether.stories.js
index db92dc537..b4029f6e3 100644
--- a/ui/pages/confirm-send-ether/confirm-send-ether.stories.js
+++ b/ui/pages/confirm-send-ether/confirm-send-ether.stories.js
@@ -1,59 +1,25 @@
-import React, { useEffect } from 'react';
-
-import { select } from '@storybook/addon-knobs';
-import { store } from '../../../.storybook/preview';
-import { updateTransactionParams } from '../../store/actions';
+import React from 'react';
 import ConfirmSendEther from '.';
 
 export default {
   title: 'Pages/ConfirmSendEther',
   id: __filename,
+  component: ConfirmSendEther,
+  argTypes: {
+    editTransaction: {
+      action: 'editTransaction',
+    },
+    history: {
+      control: 'object',
+    },
+    txParams: {
+      control: 'object',
+    },
+  },
 };
 
-// transaction id for redux dispatcher
-const id = 3111025347726181;
-
-const PageSet = ({ children }) => {
-  const options = [];
-  const receiverOptions = {
-    'Address 1': '0xaD6D458402F60fD3Bd25163575031ACDce07538D',
-    'Address 2': '0x55e0bfb2d400e9be8cf9b114e38a40969a02f69a',
-  };
-  const state = store.getState();
-  const { identities } = state.metamask;
-  Object.keys(identities).forEach(function (key) {
-    options.push({
-      label: identities[key].name,
-      address: key,
-    });
-  });
-  const sender = select('Sender', options, options[0]);
-  const receiver = select(
-    'Receiver',
-    receiverOptions,
-    '0xaD6D458402F60fD3Bd25163575031ACDce07538D',
-  );
-
-  const confirmTransactionState = state.confirmTransaction.txData.txParams;
-
-  useEffect(() => {
-    confirmTransactionState.from = sender.address;
-    store.dispatch(updateTransactionParams(id, confirmTransactionState));
-  }, [sender, confirmTransactionState]);
-
-  useEffect(() => {
-    confirmTransactionState.to = receiver;
-    store.dispatch(updateTransactionParams(id, confirmTransactionState));
-  }, [receiver, confirmTransactionState]);
-  return children;
-};
-
-export const DefaultStory = () => {
-  return (
-    <PageSet>
-      <ConfirmSendEther />
-    </PageSet>
-  );
+export const DefaultStory = (args) => {
+  return <ConfirmSendEther {...args} />;
 };
 
 DefaultStory.storyName = 'Default';