From d17be58abc7306178a9258f761458df96f424021 Mon Sep 17 00:00:00 2001
From: Adam Chambers <adammchambers@gmail.com>
Date: Wed, 11 Oct 2023 12:41:59 -0400
Subject: [PATCH] feat: trigger borrow / lend when LST dialog closed (mobile)

---
 .../MobileAssetsList/AssetCard/AssetCard.tsx  | 56 ++++++++++++++-----
 .../MobileAssetsList/MobileAssetsList.tsx     | 10 +++-
 2 files changed, 52 insertions(+), 14 deletions(-)

diff --git a/apps/marginfi-v2-ui/src/components/mobile/MobileAssetsList/AssetCard/AssetCard.tsx b/apps/marginfi-v2-ui/src/components/mobile/MobileAssetsList/AssetCard/AssetCard.tsx
index d9dd4c36e6..794e25f6a1 100644
--- a/apps/marginfi-v2-ui/src/components/mobile/MobileAssetsList/AssetCard/AssetCard.tsx
+++ b/apps/marginfi-v2-ui/src/components/mobile/MobileAssetsList/AssetCard/AssetCard.tsx
@@ -3,7 +3,7 @@ import { WSOL_MINT } from "@mrgnlabs/mrgn-common";
 import { ExtendedBankInfo, ActionType, getCurrentAction } from "@mrgnlabs/marginfi-v2-ui-state";
 import { MarginfiAccountWrapper } from "@mrgnlabs/marginfi-client-v2";
 import { useMrgnlendStore } from "~/store";
-import { borrowOrLend, closeBalance } from "~/utils";
+import { borrowOrLend, closeBalance, BorrowOrLendParams } from "~/utils";
 import { useAssetItemData } from "~/hooks/useAssetItemData";
 import { LSTDialogVariants } from "~/components/common/AssetList";
 import { AssetCardStats } from "./AssetCardStats";
@@ -18,7 +18,7 @@ export const AssetCard: FC<{
   isConnected: boolean;
   marginfiAccount: MarginfiAccountWrapper | null;
   inputRefs?: React.MutableRefObject<Record<string, HTMLInputElement | null>>;
-  showLSTDialog?: (variant: LSTDialogVariants) => void;
+  showLSTDialog?: (variant: LSTDialogVariants, callback?: () => void) => void;
 }> = ({ bank, nativeSolBalance, isInLendingMode, marginfiAccount, inputRefs, showLSTDialog }) => {
   const { rateAP, assetWeight, isBankFilled, isBankHigh, bankCap } = useAssetItemData({ bank, isInLendingMode });
   const [mfiClient, fetchMrgnlendState] = useMrgnlendStore((state) => [state.marginfiClient, state.fetchMrgnlendState]);
@@ -71,11 +71,25 @@ export const AssetCard: FC<{
         showLSTDialog
       ) {
         setHasLSTDialogShown((prev) => [...prev, bank.meta.tokenSymbol as LSTDialogVariants]);
-        showLSTDialog(bank.meta.tokenSymbol as LSTDialogVariants);
+        showLSTDialog(bank.meta.tokenSymbol as LSTDialogVariants, async () => {
+          await actionBorrowOrLend(borrowOrLendAmount, {
+            mfiClient,
+            currentAction,
+            bank,
+            nativeSolBalance,
+            marginfiAccount,
+          });
+        });
         return;
       }
 
-      await borrowOrLend({ mfiClient, currentAction, bank, borrowOrLendAmount, nativeSolBalance, marginfiAccount });
+      await actionBorrowOrLend(borrowOrLendAmount, {
+        mfiClient,
+        currentAction,
+        bank,
+        nativeSolBalance,
+        marginfiAccount,
+      });
 
       if (
         currentAction === ActionType.Withdraw &&
@@ -87,15 +101,6 @@ export const AssetCard: FC<{
         showLSTDialog(bank.meta.tokenSymbol as LSTDialogVariants);
         return;
       }
-
-      // -------- Refresh state
-      try {
-        setIsRefreshingStore(true);
-        await fetchMrgnlendState();
-      } catch (error: any) {
-        console.log("Error while reloading state");
-        console.log(error);
-      }
     },
     [
       bank,
@@ -109,6 +114,31 @@ export const AssetCard: FC<{
     ]
   );
 
+  const actionBorrowOrLend = useCallback(
+    async (
+      borrowOrLendAmount: number,
+      {
+        mfiClient,
+        currentAction,
+        bank,
+        nativeSolBalance,
+        marginfiAccount,
+      }: Omit<BorrowOrLendParams, "borrowOrLendAmount">
+    ) => {
+      await borrowOrLend({ mfiClient, currentAction, bank, borrowOrLendAmount, nativeSolBalance, marginfiAccount });
+
+      // -------- Refresh state
+      try {
+        setIsRefreshingStore(true);
+        await fetchMrgnlendState();
+      } catch (error: any) {
+        console.log("Error while reloading state");
+        console.log(error);
+      }
+    },
+    []
+  );
+
   return (
     <div className="bg-[#1A1F22] rounded-xl px-[12px] py-[16px] flex flex-col gap-[16px] max-w-sm min-w-[300px] flex-1">
       <AssetCardHeader bank={bank} isInLendingMode={isInLendingMode} rateAP={rateAP} />
diff --git a/apps/marginfi-v2-ui/src/components/mobile/MobileAssetsList/MobileAssetsList.tsx b/apps/marginfi-v2-ui/src/components/mobile/MobileAssetsList/MobileAssetsList.tsx
index ec39a3811c..339038acb5 100644
--- a/apps/marginfi-v2-ui/src/components/mobile/MobileAssetsList/MobileAssetsList.tsx
+++ b/apps/marginfi-v2-ui/src/components/mobile/MobileAssetsList/MobileAssetsList.tsx
@@ -26,6 +26,7 @@ export const MobileAssetsList: FC = () => {
   const [isInLendingMode, setIsInLendingMode] = useState(true);
   const [isLSTDialogOpen, setIsLSTDialogOpen] = useState(false);
   const [lstDialogVariant, setLSTDialogVariant] = useState<LSTDialogVariants | null>(null);
+  const [lstDialogCallback, setLSTDialogCallback] = useState<(() => void) | null>(null);
 
   const sortBanks = useCallback(
     (banks: ExtendedBankInfo[]) => {
@@ -159,9 +160,12 @@ export const MobileAssetsList: FC = () => {
                   isConnected={connected}
                   marginfiAccount={selectedAccount}
                   inputRefs={inputRefs}
-                  showLSTDialog={(variant: LSTDialogVariants) => {
+                  showLSTDialog={(variant: LSTDialogVariants, onClose?: () => void) => {
                     setLSTDialogVariant(variant);
                     setIsLSTDialogOpen(true);
+                    if (onClose) {
+                      setLSTDialogCallback(() => onClose);
+                    }
                   }}
                 />
               ))}
@@ -226,6 +230,10 @@ export const MobileAssetsList: FC = () => {
         onClose={() => {
           setIsLSTDialogOpen(false);
           setLSTDialogVariant(null);
+          if (lstDialogCallback) {
+            lstDialogCallback();
+            setLSTDialogCallback(null);
+          }
         }}
       />
     </>