From e281ebbb85018235d61f0d2886060e66ec6a2bd5 Mon Sep 17 00:00:00 2001
From: Dmitry Lobachevsky <dmitriylobachevskiy@gmail.com>
Date: Wed, 31 Jul 2024 15:34:10 +0200
Subject: [PATCH] feat(Fees): handle fees upcoming breaking changes

---
 .../src/components/Strategy/components/Fees.tsx  | 16 ++++------------
 .../TradingRecap/TradingTransactionOverview.tsx  |  8 +++++++-
 package.json                                     |  4 ++--
 yarn.lock                                        | 16 ++++++++--------
 4 files changed, 21 insertions(+), 23 deletions(-)

diff --git a/libs/mstable/vault/src/components/Strategy/components/Fees.tsx b/libs/mstable/vault/src/components/Strategy/components/Fees.tsx
index 594eb98e..e647ccb7 100644
--- a/libs/mstable/vault/src/components/Strategy/components/Fees.tsx
+++ b/libs/mstable/vault/src/components/Strategy/components/Fees.tsx
@@ -51,18 +51,9 @@ export const Fees = (props: StackProps) => {
             },
           )}
         </Typography>
-        {fees?.hasPoolEntryFee && (
-          <Typography sx={{ typography: 'subtitle2', paddingBottom: 1 }}>
-            {intl.formatMessage({
-              defaultMessage:
-                'Entry fees are collected during deposit. The entry fee is distributed to all token holders to pay for rebalancing costs after new deposits.',
-              id: 'uBC8fe',
-            })}
-          </Typography>
-        )}
       </Stack>
       <Stack {...feeCardProps}>
-        <Typography {...rateChipProps}>0%</Typography>
+        <Typography {...rateChipProps}>{fees?.exitFee}</Typography>
         <Typography variant="h5" gutterBottom>
           {intl.formatMessage({
             defaultMessage: 'Exit Fee',
@@ -72,11 +63,12 @@ export const Fees = (props: StackProps) => {
         <Typography sx={{ typography: 'subtitle2', paddingBottom: 1 }}>
           {intl.formatMessage(
             {
-              defaultMessage: `The {symbol} Vault doesn't charge exit fee.`,
-              id: 'epCeiH',
+              defaultMessage: `The {symbol} Vault charges a {fee} exit fee.`,
+              id: '0/F4cj',
             },
             {
               symbol: config.symbol,
+              fee: fees?.exitFee,
             },
           )}
         </Typography>
diff --git a/libs/mstable/vault/src/components/TradingPanel/TradingRecap/TradingTransactionOverview.tsx b/libs/mstable/vault/src/components/TradingPanel/TradingRecap/TradingTransactionOverview.tsx
index 7a677a7d..5f6c21ba 100644
--- a/libs/mstable/vault/src/components/TradingPanel/TradingRecap/TradingTransactionOverview.tsx
+++ b/libs/mstable/vault/src/components/TradingPanel/TradingRecap/TradingTransactionOverview.tsx
@@ -69,7 +69,10 @@ const useTradingTransactionOverview = () => {
   } = useVault();
   const [{ slippage, minSlippage, isMaxSlippageLoading }] =
     useTradingPanelSettings();
-  const { entryFee, hasPoolEntryFee } = usePoolFees({ address, chainId });
+  const { entryFee, hasPoolEntryFee, exitFee } = usePoolFees({
+    address,
+    chainId,
+  });
   const { minDepositUSD } = usePoolManagerLogicData(address, chainId);
   const lockTime = useTradingPanelLockTime();
   const isDeposit = useIsDepositTradingPanelType();
@@ -99,6 +102,7 @@ const useTradingTransactionOverview = () => {
     minWithdrawalUsd,
     isDisclosureOpen,
     toggleDisclosureSection,
+    exitFee,
   };
 };
 
@@ -119,6 +123,7 @@ export const TradingTransactionOverview: FC<StackProps> = (props) => {
     minWithdrawalUsd,
     toggleDisclosureSection,
     isDisclosureOpen,
+    exitFee,
   } = useTradingTransactionOverview();
 
   return (
@@ -152,6 +157,7 @@ export const TradingTransactionOverview: FC<StackProps> = (props) => {
         })}
         value={minReceivedText}
       />
+      {!isDeposit && <OverviewItem label="Exit Fee" value={exitFee} />}
       {isDeposit && (
         <OverviewItem
           label="Insurance"
diff --git a/package.json b/package.json
index 90af3e51..4f8ae14f 100644
--- a/package.json
+++ b/package.json
@@ -17,8 +17,8 @@
     "*.{js,jsx,ts,tsx,mdx}": "eslint --fix"
   },
   "dependencies": {
-    "@dhedge/core-ui-kit": "^0.4.1",
-    "@dhedge/crypto-assets": "^0.2.6",
+    "@dhedge/core-ui-kit": "^0.4.6",
+    "@dhedge/crypto-assets": "^0.2.27",
     "@emotion/react": "11.10.6",
     "@emotion/styled": "11.10.6",
     "@fontsource/plus-jakarta-sans": "^4.5.11",
diff --git a/yarn.lock b/yarn.lock
index b52f5165..cddd918e 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1983,10 +1983,10 @@
     enabled "2.0.x"
     kuler "^2.0.0"
 
-"@dhedge/core-ui-kit@^0.4.1":
-  version "0.4.1"
-  resolved "https://registry.yarnpkg.com/@dhedge/core-ui-kit/-/core-ui-kit-0.4.1.tgz#838c56c905f1a110dcfd8a6b859992946d1985a9"
-  integrity sha512-MmxfFVUw8peC1ahhZKafmAMMKrdM9fFkzxqTDy8IeHuFmtOvFyN9A5j8o2eF3pXvM4cOXIE+9Ay73k9yf2A0WA==
+"@dhedge/core-ui-kit@^0.4.6":
+  version "0.4.6"
+  resolved "https://registry.yarnpkg.com/@dhedge/core-ui-kit/-/core-ui-kit-0.4.6.tgz#7924edc15dee15c888ff0f2ff0f61ba2ef67e874"
+  integrity sha512-BiynKdaIjJqGZiQJ1h8Qn0dsD5ugJAGJJHsYpGxngG4qKIOX7gukbcFxYcMnbQDN90hWrew16MLQS932hfhD7Q==
   dependencies:
     "@wagmi/chains" "^0.2.25"
     lodash.chunk "^4.2.0"
@@ -1995,10 +1995,10 @@
     lodash.noop "^3.0.1"
     lodash.uniqby "^4.7.0"
 
-"@dhedge/crypto-assets@^0.2.6":
-  version "0.2.6"
-  resolved "https://registry.yarnpkg.com/@dhedge/crypto-assets/-/crypto-assets-0.2.6.tgz#1be6de4b6bdb1616b2ae2038e36a9d89adc2e677"
-  integrity sha512-NaJx+u1+eppejH9Lll3+jg7EB8dwyDUnotMFKQYUskmK4ofmE7yglpBdgyMtIn8nSx7MmKIAAllnmzTIwuXgtw==
+"@dhedge/crypto-assets@^0.2.27":
+  version "0.2.27"
+  resolved "https://registry.yarnpkg.com/@dhedge/crypto-assets/-/crypto-assets-0.2.27.tgz#cb7dd92a4936a72d033d904bedc9505c94122fe2"
+  integrity sha512-SKBGfAAjoS8Fm4c/hXY+xqF8cpt2VBYV8fzjmBQQJ415uJjLTHC+CamvUbEr4g0iUKpjAWu8c2qzZ/a2kq6zKQ==
 
 "@discoveryjs/json-ext@^0.5.3", "@discoveryjs/json-ext@^0.5.7":
   version "0.5.7"