From 731b7a777621711f6f2437c5a59d445be2aaa5c2 Mon Sep 17 00:00:00 2001
From: Sinclair Chen <abc.sinclair@gmail.com>
Date: Thu, 18 Aug 2022 14:45:43 -0700
Subject: [PATCH] Fix error state conditions

- Reset amount input on success
- Reset success state on user input
---
 web/components/bet-inline.tsx | 14 ++++++++++----
 1 file changed, 10 insertions(+), 4 deletions(-)

diff --git a/web/components/bet-inline.tsx b/web/components/bet-inline.tsx
index 632670e7..920c4d26 100644
--- a/web/components/bet-inline.tsx
+++ b/web/components/bet-inline.tsx
@@ -61,11 +61,19 @@ export function BetInline(props: {
           outcome,
           isLimitOrder: false,
         })
+        setAmount(undefined)
       },
     }
   )
 
-  const betDisabled = submitBet.isLoading || submitBet.isError || !amount
+  // reset error / success state on user change
+  useEffect(() => {
+    amount && submitBet.reset()
+  }, [outcome, amount])
+
+  const tooFewFunds = error === 'Insufficient balance'
+
+  const betDisabled = submitBet.isLoading || tooFewFunds || !amount
 
   return (
     <Col className={clsx('items-center', className)}>
@@ -110,9 +118,7 @@ export function BetInline(props: {
       </Row>
       {error && (
         <div className="text-error my-1 text-sm">
-          {error}{' '}
-          {error === 'Insufficient balance' &&
-            `(${formatMoney(user?.balance ?? 0)})`}
+          {error} {tooFewFunds && `(${formatMoney(user?.balance ?? 0)})`}
         </div>
       )}
     </Col>