From 1fed25ea83da753357d711276ff702de2b7ad8e9 Mon Sep 17 00:00:00 2001
From: Thomas Eizinger <thomas@eizinger.io>
Date: Fri, 26 Nov 2021 09:56:53 +1100
Subject: [PATCH] Rewrite Trade as `function` component

This allows us to co-locate the `default` export with the component
definition.
---
 taker-frontend/src/components/Trade.tsx | 37 ++++++++++++-------------
 1 file changed, 17 insertions(+), 20 deletions(-)

diff --git a/taker-frontend/src/components/Trade.tsx b/taker-frontend/src/components/Trade.tsx
index fa85f0e..1ce5f32 100644
--- a/taker-frontend/src/components/Trade.tsx
+++ b/taker-frontend/src/components/Trade.tsx
@@ -79,24 +79,22 @@ function AlertBox({ title, description }: AlertBoxProps) {
     </Alert>);
 }
 
-const Trade = (
-    {
-        connectedToMaker,
-        minQuantity,
-        maxQuantity,
-        referencePrice: referencePriceAsNumber,
-        askPrice: askPriceAsNumber,
-        quantity,
-        onQuantityChange,
-        margin: marginAsNumber,
-        leverage,
-        liquidationPrice: liquidationPriceAsNumber,
-        onLongSubmit,
-        isLongSubmitting,
-        orderId,
-        walletBalance,
-    }: TradeProps,
-) => {
+export default function Trade({
+    connectedToMaker,
+    minQuantity,
+    maxQuantity,
+    referencePrice: referencePriceAsNumber,
+    askPrice: askPriceAsNumber,
+    quantity,
+    onQuantityChange,
+    margin: marginAsNumber,
+    leverage,
+    liquidationPrice: liquidationPriceAsNumber,
+    onLongSubmit,
+    isLongSubmitting,
+    orderId,
+    walletBalance,
+}: TradeProps) {
     let outerCircleBg = useColorModeValue("gray.100", "gray.700");
     let innerCircleBg = useColorModeValue("gray.200", "gray.600");
 
@@ -271,8 +269,7 @@ const Trade = (
             </Grid>
         </Center>
     );
-};
-export default Trade;
+}
 
 interface QuantityProps {
     min: number;