From 4be9a253893129ec4635cf628ae4741b4620c542 Mon Sep 17 00:00:00 2001
From: Philipp Hoenisch <philipp@hoenisch.at>
Date: Fri, 15 Oct 2021 12:06:48 +1100
Subject: [PATCH] Fix default quantity in taker UI

If the user did not change the quantity but clicks on `Buy`. Hence, we should not use `quantity` but the derived variable `effectiveQuantity`.
---
 frontend/src/TakerApp.tsx | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/frontend/src/TakerApp.tsx b/frontend/src/TakerApp.tsx
index 4cb0c1e..392d867 100644
--- a/frontend/src/TakerApp.tsx
+++ b/frontend/src/TakerApp.tsx
@@ -73,7 +73,7 @@ export default function App() {
     let [margin, setMargin] = useState("0");
     let [userHasEdited, setUserHasEdited] = useState(false);
 
-    let quantityToShow = userHasEdited ? quantity : (order?.min_quantity.toString() || "0");
+    let effectiveQuantity = userHasEdited ? quantity : (order?.min_quantity.toString() || "0");
 
     let { run: calculateMargin } = useAsync({
         deferFn: async ([payload]: any[]) => {
@@ -98,7 +98,7 @@ export default function App() {
         if (!order) {
             return;
         }
-        let quantity = quantityToShow ? Number.parseFloat(quantityToShow) : 0;
+        let quantity = effectiveQuantity ? Number.parseFloat(effectiveQuantity) : 0;
         let payload: MarginRequestPayload = {
             leverage: order.leverage,
             price: order.price,
@@ -109,7 +109,7 @@ export default function App() {
      // We don't want that as we will end up in an endless loop. It is safe to ignore `calculateMargin` because
     // nothing in `calculateMargin` depends on outside values, i.e. is guaranteed to be stable.
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    [margin, quantityToShow, order]);
+    [margin, effectiveQuantity, order]);
 
     const format = (val: any) => `$` + val;
     const parse = (val: any) => val.replace(/^\$/, "");
@@ -169,7 +169,7 @@ export default function App() {
                                 };
                                 calculateMargin(payload);
                             }}
-                            value={format(quantityToShow)}
+                            value={format(effectiveQuantity)}
                             min={order?.min_quantity}
                             max={order?.max_quantity}
                         />
@@ -197,7 +197,7 @@ export default function App() {
                                 onClick={() => {
                                     let payload: CfdOrderRequestPayload = {
                                         order_id: order!.id,
-                                        quantity: Number.parseFloat(quantity),
+                                        quantity: Number.parseFloat(effectiveQuantity),
                                     };
                                     makeNewOrderRequest(payload);
                                 }}