chore: prettier

src/components/ActionConfirmation/index.tsx

@@ -1,9 +1,9 @@
-import React, { } from "react";
+import React from "react";
 import { Button } from "antd";
 import "./style.less";
 import { LABELS } from "../../constants";
 import { Link } from "react-router-dom";
-import './style.less';
+import "./style.less";
 
 export const ActionConfirmation = (props: {
   className?: string;
@@ -22,11 +22,7 @@ export const ActionConfirmation = (props: {
       <div>Your action has been successfully executed</div>
       <div className="success-icon" />
       <Link to="/dashboard">
-        <Button
-          type="primary"
-        >
-          {LABELS.DASHBOARD_ACTION}
-        </Button>
+        <Button type="primary">{LABELS.DASHBOARD_ACTION}</Button>
       </Link>
       <Button type="text" onClick={props.onClose}>
         {LABELS.GO_BACK_ACTION}

src/components/BackButton/index.tsx

@@ -1,4 +1,4 @@
-import React, { } from "react";
+import React from "react";
 import { Button } from "antd";
 import { LABELS } from "../../constants";
 import { useHistory } from "react-router-dom";

src/components/BorrowInput/index.tsx

@@ -20,7 +20,7 @@ import { CollateralSelector } from "./../CollateralSelector";
 import "./style.less";
 import { LABELS } from "../../constants";
 import { LoadingOutlined } from "@ant-design/icons";
-import { ActionConfirmation} from './../ActionConfirmation';
+import { ActionConfirmation } from "./../ActionConfirmation";
 import { BackButton } from "./../BackButton";
 
 const antIcon = <LoadingOutlined style={{ fontSize: 24 }} spin />;
@@ -66,7 +66,6 @@ export const BorrowInput = (props: {
 
     (async () => {
       try {
-
         await borrow(
           connection,
           wallet,
@@ -117,7 +116,9 @@ export const BorrowInput = (props: {
 
   return (
     <Card className={props.className} bodyStyle={bodyStyle}>
-      {showConfirmation ? <ActionConfirmation onClose={() => setShowConfirmation(false)} /> : 
+      {showConfirmation ? (
+        <ActionConfirmation onClose={() => setShowConfirmation(false)} />
+      ) : (
         <div
           style={{
             display: "flex",
@@ -157,10 +158,13 @@ export const BorrowInput = (props: {
             disabled={fromAccounts.length === 0 || pendingTx}
           >
             {LABELS.BORROW_ACTION}
-          {pendingTx && <Spin indicator={antIcon} className="action-spinner" />}
+            {pendingTx && (
+              <Spin indicator={antIcon} className="action-spinner" />
+            )}
           </Button>
           <BackButton />
-      </div>}
+        </div>
+      )}
     </Card>
   );
 };

src/components/DepositInput/index.tsx

@@ -10,7 +10,7 @@ import { deposit } from "../../actions/deposit";
 import { PublicKey } from "@solana/web3.js";
 import "./style.less";
 import { LoadingOutlined } from "@ant-design/icons";
-import { ActionConfirmation} from './../ActionConfirmation';
+import { ActionConfirmation } from "./../ActionConfirmation";
 
 const antIcon = <LoadingOutlined style={{ fontSize: 24 }} spin />;
 
@@ -54,7 +54,6 @@ export const DepositInput = (props: {
         setPendingTx(false);
       }
     })();
-
   }, [connection, wallet, value, reserve, fromAccounts, address]);
 
   const bodyStyle: React.CSSProperties = {
@@ -67,7 +66,9 @@ export const DepositInput = (props: {
 
   return (
     <Card className={props.className} bodyStyle={bodyStyle}>
-      {showConfirmation ? <ActionConfirmation onClose={() => setShowConfirmation(false)} /> : 
+      {showConfirmation ? (
+        <ActionConfirmation onClose={() => setShowConfirmation(false)} />
+      ) : (
         <div
           style={{
             display: "flex",
@@ -103,9 +104,12 @@ export const DepositInput = (props: {
             disabled={fromAccounts.length === 0 || pendingTx}
           >
             Deposit
-          {pendingTx && <Spin indicator={antIcon} className="action-spinner" />}
+            {pendingTx && (
+              <Spin indicator={antIcon} className="action-spinner" />
+            )}
           </Button>
-      </div>}
+        </div>
+      )}
     </Card>
   );
 };

src/components/RepayInput/index.tsx

@@ -14,13 +14,10 @@ import { useWallet } from "../../contexts/wallet";
 import { repay } from "../../actions";
 import { CollateralSelector } from "./../CollateralSelector";
 import "./style.less";
-import {
-  formatNumber,
-  toLamports,
-} from "../../utils/utils";
+import { formatNumber, toLamports } from "../../utils/utils";
 import { LABELS } from "../../constants";
 import { LoadingOutlined } from "@ant-design/icons";
-import { ActionConfirmation} from './../ActionConfirmation';
+import { ActionConfirmation } from "./../ActionConfirmation";
 
 const antIcon = <LoadingOutlined style={{ fontSize: 24 }} spin />;
 
@@ -64,7 +61,6 @@ export const RepayInput = (props: {
     [value, repayLiquidityMint]
   );
 
-
   const onRepay = useCallback(() => {
     if (
       !collateralReserve ||
@@ -79,7 +75,6 @@ export const RepayInput = (props: {
 
     (async () => {
       try {
-
         await repay(
           fromAccounts[0],
           lamports,
@@ -120,7 +115,9 @@ export const RepayInput = (props: {
 
   return (
     <Card className={props.className} bodyStyle={bodyStyle}>
-      {showConfirmation ? <ActionConfirmation onClose={() => setShowConfirmation(false)} /> :  
+      {showConfirmation ? (
+        <ActionConfirmation onClose={() => setShowConfirmation(false)} />
+      ) : (
         <div
           style={{
             display: "flex",
@@ -180,11 +177,12 @@ export const RepayInput = (props: {
             disabled={fromAccounts.length === 0}
           >
             {LABELS.REPAY_ACTION}
-          {pendingTx && <Spin indicator={antIcon} className="action-spinner" />}
+            {pendingTx && (
+              <Spin indicator={antIcon} className="action-spinner" />
+            )}
           </Button>
-      </div>}
+        </div>
+      )}
     </Card>
   );
 };
-
-

src/components/SideReserveOverview/index.tsx

@@ -1,6 +1,11 @@
 import React from "react";
 import { useTokenName } from "./../../hooks";
-import { calculateBorrowAPY, calculateDepositAPY, calculateUtilizationRatio, LendingReserve } from "../../models/lending";
+import {
+  calculateBorrowAPY,
+  calculateDepositAPY,
+  calculateUtilizationRatio,
+  LendingReserve,
+} from "../../models/lending";
 import { TokenIcon } from "../../components/TokenIcon";
 import { formatNumber, formatPct, fromLamports } from "../../utils/utils";
 import { Card, Typography } from "antd";

src/components/WithdrawInput/index.tsx

@@ -15,7 +15,7 @@ import { PublicKey } from "@solana/web3.js";
 import "./style.less";
 import { LABELS } from "../../constants";
 import { LoadingOutlined } from "@ant-design/icons";
-import { ActionConfirmation} from './../ActionConfirmation';
+import { ActionConfirmation } from "./../ActionConfirmation";
 
 const antIcon = <LoadingOutlined style={{ fontSize: 24 }} spin />;
 
@@ -88,7 +88,9 @@ export const WithdrawInput = (props: {
 
   return (
     <Card className={props.className} bodyStyle={bodyStyle}>
-      {showConfirmation ? <ActionConfirmation onClose={() => setShowConfirmation(false)} /> : 
+      {showConfirmation ? (
+        <ActionConfirmation onClose={() => setShowConfirmation(false)} />
+      ) : (
         <div
           style={{
             display: "flex",
@@ -122,9 +124,12 @@ export const WithdrawInput = (props: {
             disabled={fromAccounts.length === 0 || pendingTx}
           >
             {LABELS.WITHDRAW_ACTION}
-          {pendingTx && <Spin indicator={antIcon} className="action-spinner" />}
+            {pendingTx && (
+              <Spin indicator={antIcon} className="action-spinner" />
+            )}
           </Button>
-      </div>}
+        </div>
+      )}
     </Card>
   );
 };

src/constants/ids.tsx

@@ -13,11 +13,11 @@ export let LENDING_PROGRAM_ID = new PublicKey(
 
 export const setProgramIds = (envName: string) => {
   // Add dynamic program ids
-  if(envName === 'mainnet-beta') {
-    LENDING_PROGRAM_ID = new PublicKey('2KfJP7pZ6QSpXa26RmsN6kKVQteDEdQmizLSvuyryeiW');
+  if (envName === "mainnet-beta") {
+    LENDING_PROGRAM_ID = new PublicKey(
+      "2KfJP7pZ6QSpXa26RmsN6kKVQteDEdQmizLSvuyryeiW"
+    );
   }
-
-
 };
 
 export const programIds = () => {

src/constants/labels.ts

@@ -7,8 +7,10 @@ export const LABELS = {
   REPAY_QUESTION: "How much would you like to repay?",
   REPAY_ACTION: "Repay",
   RESERVE_STATUS_TITLE: "Reserve Status & Configuration",
-  AUDIT_WARNING: "Oyster is an unaudited software project used for internal purposes at the Solana Foundation. This app is not for public use.",
-  FOOTER: "This page was produced by the Solana Foundation (\"SF\") for internal educational and inspiration purposes only. SF does not encourage, induce or sanction the deployment, integration or use of Oyster or any similar application (including its code) in violation of applicable laws or regulations and hereby prohibits any such deployment, integration or use. Anyone using this code or a derivation thereof must comply with applicable laws and regulations when releasing related software.",
+  AUDIT_WARNING:
+    "Oyster is an unaudited software project used for internal purposes at the Solana Foundation. This app is not for public use.",
+  FOOTER:
+    'This page was produced by the Solana Foundation ("SF") for internal educational and inspiration purposes only. SF does not encourage, induce or sanction the deployment, integration or use of Oyster or any similar application (including its code) in violation of applicable laws or regulations and hereby prohibits any such deployment, integration or use. Anyone using this code or a derivation thereof must comply with applicable laws and regulations when releasing related software.',
   MENU_HOME: "Home",
   MENU_DASHBOARD: "Dashboard",
   MENU_DEPOSIT: "Deposit",

src/models/lending/reserve.ts

@@ -167,6 +167,11 @@ export const initReserveInstruction = (
 };
 
 export const calculateUtilizationRatio = (reserve: LendingReserve) => {
-  let borrowedLiquidity = wadToLamports(reserve.borrowedLiquidityWad).toNumber();
-  return borrowedLiquidity / (reserve.availableLiquidity.toNumber() + borrowedLiquidity);
-}
+  let borrowedLiquidity = wadToLamports(
+    reserve.borrowedLiquidityWad
+  ).toNumber();
+  return (
+    borrowedLiquidity /
+    (reserve.availableLiquidity.toNumber() + borrowedLiquidity)
+  );
+};

src/views/dashboard/index.tsx

@@ -13,9 +13,18 @@ export const DashboardView = () => {
 
   return (
     <div className="dashboard-container">
-      {!connected && <div className="dashboard-info">Connect to a wallet to view your deposits/loans.</div>}
-      {connected && userDeposits.length === 0 &&userObligations.length === 0 && <div className="dashboard-info">No loans or deposits.</div>}
-      {userDeposits.length > 0 && (<div className="dashboard-left">
+      {!connected && (
+        <div className="dashboard-info">
+          Connect to a wallet to view your deposits/loans.
+        </div>
+      )}
+      {connected &&
+        userDeposits.length === 0 &&
+        userObligations.length === 0 && (
+          <div className="dashboard-info">No loans or deposits.</div>
+        )}
+      {userDeposits.length > 0 && (
+        <div className="dashboard-left">
           <span>{LABELS.DASHBOARD_TITLE_DEPOSITS}</span>
           <div className="dashboard-item dashboard-header">
             <div>{LABELS.TABLE_TITLE_ASSET}</div>
@@ -26,8 +35,10 @@ export const DashboardView = () => {
           {userDeposits.map((deposit) => (
             <DepositItem reserve={deposit.reserve} account={deposit.account} />
           ))}
-      </div>)}
-      {userObligations.length > 0 && (<div className="dashboard-right">
+        </div>
+      )}
+      {userObligations.length > 0 && (
+        <div className="dashboard-right">
           <span>{LABELS.DASHBOARD_TITLE_LOANS}</span>
           <div className="dashboard-item dashboard-header">
             <div>{LABELS.TABLE_TITLE_ASSET}</div>

src/views/dashboard/obligationItem.tsx

@@ -1,8 +1,17 @@
 import React, { useMemo } from "react";
 import { useTokenName } from "../../hooks";
-import { calculateBorrowAPY, LendingObligation, LendingReserve } from "../../models/lending";
+import {
+  calculateBorrowAPY,
+  LendingObligation,
+  LendingReserve,
+} from "../../models/lending";
 import { TokenIcon } from "../../components/TokenIcon";
-import { wadToLamports, formatNumber, fromLamports, formatPct } from "../../utils/utils";
+import {
+  wadToLamports,
+  formatNumber,
+  fromLamports,
+  formatPct,
+} from "../../utils/utils";
 import { Button, Card } from "antd";
 import { Link } from "react-router-dom";
 import { cache, ParsedAccount, useMint } from "../../contexts/accounts";