added storybook component for send-content-stories (#15210)

* added storybook component for send-content-stories

* added draftTransactions to storybook

.storybook/test-data.js

@@ -1,3 +1,4 @@
+import { draftTransactionInitialState } from '../ui/ducks/send';
 const state = {
   invalidCustomNetwork: {
     state: 'CLOSED',
@@ -1507,6 +1508,12 @@ const state = {
     amount: {
       error: 'amount',
     },
+    currentTransactionUUID: 'test-uuid',
+    draftTransactions: {
+      'test-uuid': {
+        ...draftTransactionInitialState,
+      },
+    },
   },
   confirmTransaction: {
     txData: {

ui/pages/send/send-content/send-content.stories.js

@@ -1,26 +1,84 @@
 import React from 'react';
-import { boolean, text } from '@storybook/addon-knobs';
 
 import SendContent from './send-content.component';
 
 export default {
   title: 'Pages/Send/SendContent',
   id: __filename,
+  argsTypes: {
+    showHexData: {
+      control: 'boolean',
+    },
+    isOwnedAccount: {
+      control: 'boolean',
+    },
+    contact: {
+      control: 'object',
+    },
+    noGasPrice: {
+      control: 'boolean',
+    },
+    isEthGasPrice: {
+      control: 'boolean',
+    },
+
+    gasIsExcessive: {
+      control: 'boolean',
+    },
+    networkOrAccountNotSupports1559: {
+      control: 'boolean',
+    },
+    getIsBalanceInsufficient: {
+      control: 'boolean',
+    },
+    error: {
+      control: 'text',
+    },
+    warning: {
+      control: 'text',
+    },
+    to: {
+      control: 'text',
+    },
+    assetError: {
+      control: 'text',
+    },
+    asset: {
+      control: 'object',
+    },
+    recipient: {
+      control: 'object',
+    },
+  },
 };
 
-export const DefaultStory = () => {
-  return (
-    <SendContent
-      showHexData={boolean('Show Hex Data', false)}
-      isOwnedAccount={boolean('Is In Address Book', true)}
-      noGasPrice={boolean('No Gas Price', false)}
-      isEthGasPrice={boolean('Backup Gas Price', false)}
-      gasIsExcessive={boolean('Gas Is Excessive', false)}
-      // Get error and warning message from messages.json
-      error={text('Error', 'connecting')}
-      warning={text('Warning', 'connecting')}
-    />
-  );
+export const DefaultStory = (args) => {
+  return <SendContent {...args} />;
 };
 
 DefaultStory.storyName = 'Default';
+DefaultStory.args = {
+  showHexData: false,
+  isOwnedAccount: true,
+  noGasPrice: false,
+  isEthGasPrice: false,
+  gasIsExcessive: false,
+  error: 'connecting',
+  warning: 'connecting',
+  asset: {
+    type: 'NATIVE',
+  },
+  recipient: {
+    mode: 'CONTACT_LIST',
+    userInput: '0x31A2764925BD47CCBd57b2F277702dB46e9C5F66',
+    address: '0x31A2764925BD47CCBd57b2F277702dB46e9C5F66',
+    nickname: 'John Doe',
+    error: null,
+    warning: null,
+  },
+  contact: { name: 'testName' },
+  networkOrAccountNotSupports1559: false,
+  getIsBalanceInsufficient: false,
+  to: 'string to',
+  assetError: 'newAccountDetectedDialogMessage',
+};