From 8e8b5e5e3029d747e6e48d4d558afbf283e09fd9 Mon Sep 17 00:00:00 2001
From: Connor Bryan <cchromium@gmail.com>
Date: Fri, 29 Jun 2018 17:32:02 -0500
Subject: [PATCH] Adjust logic for NoneField

---
 common/components/NonceField.tsx                       | 10 +++++++++-
 .../TXMetaDataPanel/components/AdvancedGas.tsx         |  2 +-
 common/components/ui/Input.tsx                         |  2 +-
 3 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/common/components/NonceField.tsx b/common/components/NonceField.tsx
index 32b889f5..c9831642 100644
--- a/common/components/NonceField.tsx
+++ b/common/components/NonceField.tsx
@@ -12,6 +12,7 @@ import './NonceField.scss';
 
 interface OwnProps {
   alwaysDisplay: boolean;
+  showInvalidBeforeBlur?: boolean;
 }
 
 interface StateProps {
@@ -27,7 +28,13 @@ type Props = OwnProps & DispatchProps & StateProps;
 
 class NonceField extends React.Component<Props> {
   public render() {
-    const { alwaysDisplay, requestNonce, noncePending, isOffline } = this.props;
+    const {
+      alwaysDisplay,
+      showInvalidBeforeBlur,
+      requestNonce,
+      noncePending,
+      isOffline
+    } = this.props;
     return (
       <NonceFieldFactory
         withProps={({ nonce: { raw, value }, onChange, readOnly, shouldDisplay }) => {
@@ -51,6 +58,7 @@ class NonceField extends React.Component<Props> {
                   onChange={onChange}
                   disabled={noncePending}
                   showInvalidWithoutValue={true}
+                  showInvalidBeforeBlur={showInvalidBeforeBlur}
                 />
                 {noncePending ? (
                   <div className="Nonce-spinner">
diff --git a/common/components/TXMetaDataPanel/components/AdvancedGas.tsx b/common/components/TXMetaDataPanel/components/AdvancedGas.tsx
index 92ac3359..98452d58 100644
--- a/common/components/TXMetaDataPanel/components/AdvancedGas.tsx
+++ b/common/components/TXMetaDataPanel/components/AdvancedGas.tsx
@@ -106,7 +106,7 @@ class AdvancedGas extends React.Component<Props, State> {
           )}
           {nonceField && (
             <div className="AdvancedGas-nonce">
-              <NonceField alwaysDisplay={true} />
+              <NonceField alwaysDisplay={true} showInvalidBeforeBlur={true} />
             </div>
           )}
         </div>
diff --git a/common/components/ui/Input.tsx b/common/components/ui/Input.tsx
index c67d8c96..21dbaadc 100644
--- a/common/components/ui/Input.tsx
+++ b/common/components/ui/Input.tsx
@@ -49,7 +49,7 @@ class Input extends React.Component<Props, State> {
     } else if (!hasBlurred && !showInvalidBeforeBlur) {
       validClass = '';
     }
-    if (!isStateless && !hasValue && showInvalidWithoutValue) {
+    if ((!isStateless || showInvalidBeforeBlur) && !hasValue && showInvalidWithoutValue) {
       validClass = 'invalid';
     }