From f61dd3e4e77c0882864fddf3939b68ce427aa296 Mon Sep 17 00:00:00 2001
From: Linkie Link <linkielink.dev@gmail.com>
Date: Mon, 11 Sep 2023 11:34:30 +0200
Subject: [PATCH] fix: added isCreate flag to the vaultModal (#450)

---
 src/components/Earn/Farm/VaultCard.tsx          | 16 +++++-----------
 src/components/Earn/Farm/VaultExpanded.tsx      |  5 +++--
 src/components/Earn/Farm/VaultTable.tsx         |  1 +
 src/components/Modals/Vault/VaultBorrowings.tsx |  3 ++-
 src/components/Toaster.tsx                      | 15 +++++++++------
 src/store/slices/broadcast.ts                   | 12 ++++++++----
 src/types/interfaces/store/broadcast.d.ts       |  1 +
 src/types/interfaces/store/modals.d.ts          |  1 +
 8 files changed, 30 insertions(+), 24 deletions(-)

diff --git a/src/components/Earn/Farm/VaultCard.tsx b/src/components/Earn/Farm/VaultCard.tsx
index 74a577ee..85592e30 100644
--- a/src/components/Earn/Farm/VaultCard.tsx
+++ b/src/components/Earn/Farm/VaultCard.tsx
@@ -1,4 +1,4 @@
-import Button from 'components/Button'
+import ActionButton from 'components/Button/ActionButton'
 import VaultLogo from 'components/Earn/Farm/VaultLogo'
 import Text from 'components/Text'
 import TitleAndSubCell from 'components/TitleAndSubCell'
@@ -23,13 +23,14 @@ export default function VaultCard(props: Props) {
       vaultModal: {
         vault: props.vault,
         selectedBorrowDenoms: [props.vault.denoms.secondary],
+        isCreate: true,
       },
     })
   }
 
   return (
     <div className='border-r-[1px] border-r-white/10 p-4'>
-      <div className='align-center mb-8 flex justify-between'>
+      <div className='flex justify-between mb-8 align-center'>
         <div>
           <Text size='xs' className='mb-2 text-white/60'>
             {props.subtitle}
@@ -45,7 +46,7 @@ export default function VaultCard(props: Props) {
         </div>
         <VaultLogo vault={props.vault} />
       </div>
-      <div className='mb-6 flex justify-between'>
+      <div className='flex justify-between mb-6'>
         <TitleAndSubCell
           className='text-xs'
           title={props.vault.apy ? formatPercent(props.vault.apy, 2) : '-'}
@@ -73,14 +74,7 @@ export default function VaultCard(props: Props) {
           sub={'Depo. Cap'}
         />
       </div>
-      <Button
-        color='secondary'
-        onClick={openVaultModal}
-        className='w-full'
-        disabled={!currentAccount}
-      >
-        {currentAccount ? 'Deposit' : 'Select Account'}
-      </Button>
+      <ActionButton onClick={openVaultModal} color='secondary' text='Deposit' className='w-full' />
     </div>
   )
 }
diff --git a/src/components/Earn/Farm/VaultExpanded.tsx b/src/components/Earn/Farm/VaultExpanded.tsx
index eeb33d12..c9153875 100644
--- a/src/components/Earn/Farm/VaultExpanded.tsx
+++ b/src/components/Earn/Farm/VaultExpanded.tsx
@@ -26,6 +26,7 @@ export default function VaultExpanded(props: Props) {
         vault: props.row.original,
         isDeposited: true,
         selectedBorrowDenoms: [props.row.original.denoms.secondary],
+        isCreate: false,
       },
     })
   }
@@ -99,7 +100,7 @@ export default function VaultExpanded(props: Props) {
   return (
     <tr
       key={props.row.id}
-      className='cursor-pointer bg-black/20 transition-colors'
+      className='transition-colors cursor-pointer bg-black/20'
       onClick={(e) => {
         e.preventDefault()
         const isExpanded = props.row.getIsExpanded()
@@ -108,7 +109,7 @@ export default function VaultExpanded(props: Props) {
       }}
     >
       <td colSpan={!status ? 7 : 8}>
-        <div className='align-center flex justify-end gap-3 p-4'>
+        <div className='flex justify-end gap-3 p-4 align-center'>
           {status && <DepositMoreButton />}
           {status === VaultStatus.ACTIVE && <UnlockButton />}
           {status === VaultStatus.UNLOCKING && <UnlockingButton />}
diff --git a/src/components/Earn/Farm/VaultTable.tsx b/src/components/Earn/Farm/VaultTable.tsx
index e80ec597..828b7c6b 100644
--- a/src/components/Earn/Farm/VaultTable.tsx
+++ b/src/components/Earn/Farm/VaultTable.tsx
@@ -209,6 +209,7 @@ export const VaultTable = (props: Props) => {
               vaultModal: {
                 vault,
                 selectedBorrowDenoms: [vault.denoms.secondary],
+                isCreate: true,
               },
             })
           }
diff --git a/src/components/Modals/Vault/VaultBorrowings.tsx b/src/components/Modals/Vault/VaultBorrowings.tsx
index 296cb820..60066f61 100644
--- a/src/components/Modals/Vault/VaultBorrowings.tsx
+++ b/src/components/Modals/Vault/VaultBorrowings.tsx
@@ -144,13 +144,14 @@ export default function VaultBorrowings(props: VaultBorrowingsProps) {
   }
 
   async function onConfirm() {
-    if (!updatedAccount) return
+    if (!updatedAccount || !vaultModal) return
     setIsConfirming(true)
     const isSuccess = await depositIntoVault({
       accountId: updatedAccount.id,
       actions: props.depositActions,
       deposits: props.deposits,
       borrowings: props.borrowings,
+      isCreate: vaultModal.isCreate,
     })
     setIsConfirming(false)
     if (isSuccess) {
diff --git a/src/components/Toaster.tsx b/src/components/Toaster.tsx
index e3ff6ab5..6ce2e5a1 100644
--- a/src/components/Toaster.tsx
+++ b/src/components/Toaster.tsx
@@ -13,6 +13,7 @@ import useLocalStorage from 'hooks/useLocalStorage'
 import useTransactionStore from 'hooks/useTransactionStore'
 import useStore from 'store'
 import { formatAmountWithSymbol } from 'utils/formatters'
+import { BN } from 'utils/helpers'
 
 export function generateToastContent(content: ToastSuccess['content']): ReactNode {
   return content.map((item, index) => (
@@ -23,11 +24,13 @@ export function generateToastContent(content: ToastSuccess['content']): ReactNod
             {item.text}
           </Text>
           <ul className='flex flex-wrap w-full gap-1 p-1 pl-4 list-disc'>
-            {item.coins.map((coin) => (
-              <li className='w-full p-0 text-sm text-white' key={coin.denom}>
-                {formatAmountWithSymbol(coin)}
-              </li>
-            ))}
+            {item.coins.map((coin) =>
+              BN(coin.amount).isZero() ? null : (
+                <li className='w-full p-0 text-sm text-white' key={coin.denom}>
+                  {formatAmountWithSymbol(coin)}
+                </li>
+              ),
+            )}
           </ul>
         </>
       )}
@@ -70,7 +73,7 @@ export default function Toaster() {
           <Text className='mb-1 font-bold text-white'>{`Credit Account ${toast.accountId}`}</Text>
         )}
         {toast.message && (
-          <Text size='sm' className='text-white'>
+          <Text size='sm' className='w-full mb-1 text-white'>
             {toast.message}
           </Text>
         )}
diff --git a/src/store/slices/broadcast.ts b/src/store/slices/broadcast.ts
index 33a45694..284784fe 100644
--- a/src/store/slices/broadcast.ts
+++ b/src/store/slices/broadcast.ts
@@ -29,6 +29,7 @@ interface HandleResponse {
     | 'borrow'
     | 'repay'
     | 'vault'
+    | 'vaultCreate'
     | 'lend'
     | 'create'
     | 'delete'
@@ -94,10 +95,10 @@ export default function createBroadcastSlice(
     switch (action) {
       case 'borrow':
         const borrowCoin = changes.debts ? [changes.debts[0].toCoin()] : []
-        const action = lend ? 'Borrowed and lend' : 'Borrowed'
+        const borrowAction = lend ? 'Borrowed and lend' : 'Borrowed'
         toast.content.push({
           coins: borrowCoin,
-          text: target === 'wallet' ? 'Borrowed to wallet' : action,
+          text: target === 'wallet' ? 'Borrowed to wallet' : borrowAction,
         })
         break
 
@@ -132,7 +133,9 @@ export default function createBroadcastSlice(
         break
 
       case 'vault':
-        toast.message = 'Add to Vault Position'
+      case 'vaultCreate':
+        toast.message =
+          action === 'vaultCreate' ? 'Created a Vault Position' : 'Add to Vault Position'
         toast.content.push({
           coins: changes.debts?.map((debt) => debt.toCoin()) ?? [],
           text: 'Borrowed for the Vault Position',
@@ -422,6 +425,7 @@ export default function createBroadcastSlice(
       actions: Action[]
       deposits: BNCoin[]
       borrowings: BNCoin[]
+      isCreate: boolean
     }) => {
       const msg: CreditManagerExecuteMsg = {
         update_credit_account: {
@@ -436,7 +440,7 @@ export default function createBroadcastSlice(
 
       handleResponseMessages({
         response,
-        action: 'vault',
+        action: options.isCreate ? 'vaultCreate' : 'vault',
         accountId: options.accountId,
         changes: { deposits: options.deposits, debts: options.borrowings },
       })
diff --git a/src/types/interfaces/store/broadcast.d.ts b/src/types/interfaces/store/broadcast.d.ts
index 88018224..d6d4beeb 100644
--- a/src/types/interfaces/store/broadcast.d.ts
+++ b/src/types/interfaces/store/broadcast.d.ts
@@ -50,6 +50,7 @@ interface BroadcastSlice {
     actions: Action[]
     deposits: BNCoin[]
     borrowings: BNCoin[]
+    isCreate: boolean
   }) => Promise<boolean>
   executeMsg: (options: { messages: MsgExecuteContract[] }) => Promise<BroadcastResult>
   lend: (options: { accountId: string; coin: BNCoin; isMax?: boolean }) => Promise<boolean>
diff --git a/src/types/interfaces/store/modals.d.ts b/src/types/interfaces/store/modals.d.ts
index 031f5878..a938a3d6 100644
--- a/src/types/interfaces/store/modals.d.ts
+++ b/src/types/interfaces/store/modals.d.ts
@@ -47,6 +47,7 @@ interface VaultModal {
   vault: Vault | DepositedVault
   isDeposited?: boolean
   selectedBorrowDenoms: string[]
+  isCreate: boolean
 }
 
 interface AddVaultBorrowingsModal {