fix: added isCreate flag to the vaultModal (#450)

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>
   )
 }

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 />}

src/components/Earn/Farm/VaultTable.tsx

@@ -209,6 +209,7 @@ export const VaultTable = (props: Props) => {
               vaultModal: {
                 vault,
                 selectedBorrowDenoms: [vault.denoms.secondary],
+                isCreate: true,
               },
             })
           }

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) {

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>
         )}

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 },
       })

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>

src/types/interfaces/store/modals.d.ts

@@ -47,6 +47,7 @@ interface VaultModal {
   vault: Vault | DepositedVault
   isDeposited?: boolean
   selectedBorrowDenoms: string[]
+  isCreate: boolean
 }
 
 interface AddVaultBorrowingsModal {