Remove hexdata field from token send (#12565)

* added acccess to asset from state, updated SendHexDataRow display logic

* fixed invalid propType and updated tests

* updated logic and tests to only disable hex data field for TOKEN (ERC-20) types

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

@@ -9,6 +9,7 @@ import {
   UNSENDABLE_ASSET_ERROR_KEY,
   INSUFFICIENT_FUNDS_FOR_GAS_ERROR_KEY,
 } from '../../../helpers/constants/error-keys';
+import { ASSET_TYPES } from '../../../ducks/send';
 import SendAmountRow from './send-amount-row';
 import SendHexDataRow from './send-hex-data-row';
 import SendAssetRow from './send-asset-row';
@@ -32,6 +33,7 @@ export default class SendContent extends Component {
     noGasPrice: PropTypes.bool,
     networkOrAccountNotSupports1559: PropTypes.bool,
     getIsBalanceInsufficient: PropTypes.bool,
+    asset: PropTypes.object,
   };
 
   render() {
@@ -44,6 +46,7 @@ export default class SendContent extends Component {
       isAssetSendable,
       networkOrAccountNotSupports1559,
       getIsBalanceInsufficient,
+      asset,
     } = this.props;
 
     let gasError;
@@ -51,6 +54,8 @@ export default class SendContent extends Component {
     else if (noGasPrice) gasError = GAS_PRICE_FETCH_FAILURE_ERROR_KEY;
     else if (getIsBalanceInsufficient)
       gasError = INSUFFICIENT_FUNDS_FOR_GAS_ERROR_KEY;
+    const showHexData =
+      this.props.showHexData && asset.type !== ASSET_TYPES.TOKEN;
 
     return (
       <PageContainerContent>
@@ -68,7 +73,7 @@ export default class SendContent extends Component {
           <SendAssetRow />
           <SendAmountRow />
           {networkOrAccountNotSupports1559 ? <SendGasRow /> : null}
-          {this.props.showHexData ? <SendHexDataRow /> : null}
+          {showHexData ? <SendHexDataRow /> : null}
         </div>
       </PageContainerContent>
     );

ui/pages/send/send-content/send-content.component.test.js

@@ -15,6 +15,7 @@ describe('SendContent Component', () => {
     showHexData: true,
     gasIsExcessive: false,
     networkAndAccountSupports1559: true,
+    asset: { type: 'NATIVE' },
   };
 
   beforeEach(() => {
@@ -73,6 +74,23 @@ describe('SendContent Component', () => {
       expect(wrapper.find(SendHexDataRow)).toHaveLength(0);
     });
 
+    it('should not render the SendHexDataRow if the asset type is TOKEN (ERC-20)', () => {
+      wrapper.setProps({ asset: { type: 'TOKEN' } });
+      const PageContainerContentChild = wrapper
+        .find(PageContainerContent)
+        .children();
+      expect(PageContainerContentChild.childAt(0).is(Dialog)).toStrictEqual(
+        true,
+      );
+      expect(
+        PageContainerContentChild.childAt(1).is(SendAssetRow),
+      ).toStrictEqual(true);
+      expect(
+        PageContainerContentChild.childAt(2).is(SendAmountRow),
+      ).toStrictEqual(true);
+      expect(wrapper.find(SendHexDataRow)).toHaveLength(0);
+    });
+
     it('should not render the Dialog if contact has a name', () => {
       wrapper.setProps({
         showHexData: false,

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

@@ -10,6 +10,7 @@ import {
   getIsAssetSendable,
   getIsBalanceInsufficient,
   getSendTo,
+  getSendAsset,
 } from '../../../ducks/send';
 
 import * as actions from '../../../store/actions';
@@ -33,6 +34,7 @@ function mapStateToProps(state) {
       state,
     ),
     getIsBalanceInsufficient: getIsBalanceInsufficient(state),
+    asset: getSendAsset(state),
   };
 }