From c295b8e4bfd367d32592a58e696df10b3527107d Mon Sep 17 00:00:00 2001
From: juan <juandgoc@gmail.com>
Date: Sun, 24 Jan 2021 15:21:29 -0500
Subject: [PATCH] lint

---
 src/components/BorrowInput/index.tsx | 79 +++++++++++++++++---------
 src/components/RepayInput/index.tsx  | 83 +++++++++++++++++++---------
 2 files changed, 111 insertions(+), 51 deletions(-)

diff --git a/src/components/BorrowInput/index.tsx b/src/components/BorrowInput/index.tsx
index ca559ca..83dceba 100644
--- a/src/components/BorrowInput/index.tsx
+++ b/src/components/BorrowInput/index.tsx
@@ -1,8 +1,5 @@
-import React, {useCallback, useEffect, useMemo, useState} from "react";
-import {
-  useUserBalance,
-  useUserObligationByReserve,
-} from "../../hooks";
+import React, { useCallback, useEffect, useMemo, useState } from "react";
+import { useUserBalance, useUserObligationByReserve } from "../../hooks";
 import {
   BorrowAmountType,
   LendingReserve,
@@ -19,8 +16,8 @@ import { ActionConfirmation } from "./../ActionConfirmation";
 import { BackButton } from "./../BackButton";
 import { ConnectButton } from "../ConnectButton";
 import CollateralInput from "../CollateralInput";
-import {ArrowDownOutlined} from "@ant-design/icons";
-import {useMidPriceInUSD} from "../../contexts/market";
+import { ArrowDownOutlined } from "@ant-design/icons";
+import { useMidPriceInUSD } from "../../contexts/market";
 
 export const BorrowInput = (props: {
   className?: string;
@@ -47,8 +44,12 @@ export const BorrowInput = (props: {
     return cache.get(id) as ParsedAccount<LendingReserve>;
   }, [collateralReserveKey]);
 
-  const borrowPrice = useMidPriceInUSD(borrowReserve.info.liquidityMint.toBase58()).price;
-  const collateralPrice = useMidPriceInUSD(collateralReserve?.info.liquidityMint.toBase58())?.price;
+  const borrowPrice = useMidPriceInUSD(
+    borrowReserve.info.liquidityMint.toBase58()
+  ).price;
+  const collateralPrice = useMidPriceInUSD(
+    collateralReserve?.info.liquidityMint.toBase58()
+  )?.price;
 
   useEffect(() => {
     if (collateralReserve && lastTyped === "collateral") {
@@ -58,12 +59,19 @@ export const BorrowInput = (props: {
         const nCollateralValue = parseFloat(collateralValue);
         const borrowInUSD = nCollateralValue * collateralPrice * ltv;
         const borrowAmount = borrowInUSD / borrowPrice;
-        setValue(borrowAmount.toString())
+        setValue(borrowAmount.toString());
       } else {
-        setValue("")
+        setValue("");
       }
     }
-  }, [lastTyped, collateralReserve, collateralPrice, borrowPrice, borrowReserve, collateralValue])
+  }, [
+    lastTyped,
+    collateralReserve,
+    collateralPrice,
+    borrowPrice,
+    borrowReserve,
+    collateralValue,
+  ]);
 
   useEffect(() => {
     if (collateralReserve && lastTyped === "borrow") {
@@ -72,13 +80,20 @@ export const BorrowInput = (props: {
       if (value) {
         const nValue = parseFloat(value);
         const borrowInUSD = nValue * borrowPrice;
-        const collateralAmount = (borrowInUSD / ltv) / collateralPrice
-        setCollateralValue(collateralAmount.toString())
+        const collateralAmount = borrowInUSD / ltv / collateralPrice;
+        setCollateralValue(collateralAmount.toString());
       } else {
-        setCollateralValue("")
+        setCollateralValue("");
       }
     }
-  }, [lastTyped, collateralReserve, collateralPrice, borrowPrice, borrowReserve, value])
+  }, [
+    lastTyped,
+    collateralReserve,
+    collateralPrice,
+    borrowPrice,
+    borrowReserve,
+    value,
+  ]);
 
   const { accounts: fromAccounts } = useUserBalance(
     collateralReserve?.info.collateralMint
@@ -160,14 +175,21 @@ export const BorrowInput = (props: {
             justifyContent: "space-around",
           }}
         >
-          <div style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-evenly', alignItems: 'center' }}>
+          <div
+            style={{
+              display: "flex",
+              flexDirection: "row",
+              justifyContent: "space-evenly",
+              alignItems: "center",
+            }}
+          >
             <CollateralInput
-              title='Collateral (estimated)'
+              title="Collateral (estimated)"
               reserve={borrowReserve.info}
               amount={parseFloat(collateralValue) || 0}
               onInputChange={(val: number | null) => {
-                setCollateralValue(val?.toString() || "")
-                setLastTyped("collateral")
+                setCollateralValue(val?.toString() || "");
+                setLastTyped("collateral");
               }}
               onCollateralReserve={(key) => {
                 setCollateralReserveKey(key);
@@ -175,21 +197,28 @@ export const BorrowInput = (props: {
             />
           </div>
           <ArrowDownOutlined />
-          <div style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-evenly', alignItems: 'center' }}>
+          <div
+            style={{
+              display: "flex",
+              flexDirection: "row",
+              justifyContent: "space-evenly",
+              alignItems: "center",
+            }}
+          >
             <CollateralInput
-              title='Borrow Amount'
+              title="Borrow Amount"
               reserve={borrowReserve.info}
               amount={parseFloat(value) || 0}
               onInputChange={(val: number | null) => {
-                setValue(val?.toString() || "")
-                setLastTyped("borrow")
+                setValue(val?.toString() || "");
+                setLastTyped("borrow");
               }}
               disabled={true}
               hideBalance={true}
             />
           </div>
           <ConnectButton
-            size='large'
+            size="large"
             type="primary"
             onClick={onBorrow}
             loading={pendingTx}
diff --git a/src/components/RepayInput/index.tsx b/src/components/RepayInput/index.tsx
index d116fca..f0b7538 100644
--- a/src/components/RepayInput/index.tsx
+++ b/src/components/RepayInput/index.tsx
@@ -1,4 +1,4 @@
-import React, {useCallback, useEffect, useState} from "react";
+import React, { useCallback, useEffect, useState } from "react";
 import {
   EnrichedLendingObligation,
   InputType,
@@ -19,7 +19,7 @@ import { fromLamports, wadToLamports } from "../../utils/utils";
 import { notify } from "../../utils/notifications";
 import { ConnectButton } from "../ConnectButton";
 import CollateralInput from "../CollateralInput";
-import {useMidPriceInUSD} from "../../contexts/market";
+import { useMidPriceInUSD } from "../../contexts/market";
 
 export const RepayInput = (props: {
   className?: string;
@@ -53,11 +53,11 @@ export const RepayInput = (props: {
 
   const convert = useCallback(
     (val: string | number) => {
-      setLastTyped("repay")
+      setLastTyped("repay");
       if (typeof val === "string") {
         return (parseFloat(val) / borrowAmount) * 100;
       } else {
-        return ((val * borrowAmount) / 100);
+        return (val * borrowAmount) / 100;
       }
     },
     [borrowAmount]
@@ -97,7 +97,7 @@ export const RepayInput = (props: {
         );
 
         setValue("");
-        setCollateralValue("")
+        setCollateralValue("");
         setShowConfirmation(true);
       } catch (error) {
         notify({
@@ -125,35 +125,52 @@ export const RepayInput = (props: {
     setValue,
   ]);
 
-  const collateralPrice = useMidPriceInUSD(collateralReserve?.info.liquidityMint.toBase58())?.price;
+  const collateralPrice = useMidPriceInUSD(
+    collateralReserve?.info.liquidityMint.toBase58()
+  )?.price;
 
   useEffect(() => {
     if (collateralReserve && lastTyped === "repay") {
       const collateralInQuote = obligation.info.collateralInQuote;
-      const collateral = collateralInQuote * collateralPrice
+      const collateral = collateralInQuote * collateralPrice;
       if (value) {
-        const borrowRatio = (parseFloat(value) / borrowAmount) * 100
-        const collateralAmount = (borrowRatio * collateral) / 100
-        setCollateralValue(collateralAmount.toString())
+        const borrowRatio = (parseFloat(value) / borrowAmount) * 100;
+        const collateralAmount = (borrowRatio * collateral) / 100;
+        setCollateralValue(collateralAmount.toString());
       } else {
-        setCollateralValue("")
+        setCollateralValue("");
       }
     }
-  }, [lastTyped, collateralReserve, obligation.info.collateralInQuote, collateralPrice, borrowAmount, value])
+  }, [
+    lastTyped,
+    collateralReserve,
+    obligation.info.collateralInQuote,
+    collateralPrice,
+    borrowAmount,
+    value,
+  ]);
 
   useEffect(() => {
     if (collateralReserve && lastTyped === "collateral") {
       const collateralInQuote = obligation.info.collateralInQuote;
-      const collateral = collateralInQuote * collateralPrice
+      const collateral = collateralInQuote * collateralPrice;
       if (collateralValue) {
-        const collateralRatio = (parseFloat(collateralValue) / collateral) * 100
-        const borrowValue = (collateralRatio * borrowAmount) / 100
-        setValue(borrowValue.toString())
+        const collateralRatio =
+          (parseFloat(collateralValue) / collateral) * 100;
+        const borrowValue = (collateralRatio * borrowAmount) / 100;
+        setValue(borrowValue.toString());
       } else {
-        setValue("")
+        setValue("");
       }
     }
-  }, [lastTyped, collateralReserve, obligation.info.collateralInQuote, collateralPrice, borrowAmount, collateralValue])
+  }, [
+    lastTyped,
+    collateralReserve,
+    obligation.info.collateralInQuote,
+    collateralPrice,
+    borrowAmount,
+    collateralValue,
+  ]);
 
   const bodyStyle: React.CSSProperties = {
     display: "flex",
@@ -175,28 +192,42 @@ export const RepayInput = (props: {
             justifyContent: "space-around",
           }}
         >
-          <div style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-evenly', alignItems: 'center' }}>
+          <div
+            style={{
+              display: "flex",
+              flexDirection: "row",
+              justifyContent: "space-evenly",
+              alignItems: "center",
+            }}
+          >
             <CollateralInput
-              title='Repay Amount'
+              title="Repay Amount"
               reserve={repayReserve.info}
               amount={parseFloat(value) || 0}
               onInputChange={(val: number | null) => {
-                setValue(val?.toString() || "")
-                setLastTyped("repay")
+                setValue(val?.toString() || "");
+                setLastTyped("repay");
               }}
               disabled={true}
               hideBalance={true}
             />
           </div>
           <Slider marks={marks} value={pct} onChange={setPct} />
-          <div style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-evenly', alignItems: 'center' }}>
+          <div
+            style={{
+              display: "flex",
+              flexDirection: "row",
+              justifyContent: "space-evenly",
+              alignItems: "center",
+            }}
+          >
             <CollateralInput
-              title='Collateral Amount (estimated)'
+              title="Collateral Amount (estimated)"
               reserve={collateralReserve?.info}
               amount={parseFloat(collateralValue) || 0}
               onInputChange={(val: number | null) => {
-                setCollateralValue(val?.toString() || "")
-                setLastTyped("collateral")
+                setCollateralValue(val?.toString() || "");
+                setLastTyped("collateral");
               }}
               disabled={true}
               hideBalance={true}