diff --git a/src/features/stake/components/InfoTooltip/index.tsx b/src/features/stake/components/InfoTooltip/index.tsx
new file mode 100644
index 0000000000..5dae2afa21
--- /dev/null
+++ b/src/features/stake/components/InfoTooltip/index.tsx
@@ -0,0 +1,22 @@
+import { SvgIcon, Tooltip } from '@mui/material'
+import InfoIcon from '@/public/images/notifications/info.svg'
+import type { ReactNode } from 'react'
+
+export function InfoTooltip({ title }: { title: string | ReactNode }) {
+ return (
+
+
+
+
+
+ )
+}
diff --git a/src/features/stake/components/StakingConfirmationTx/Deposit.tsx b/src/features/stake/components/StakingConfirmationTx/Deposit.tsx
index 2334c48a11..bf523741c3 100644
--- a/src/features/stake/components/StakingConfirmationTx/Deposit.tsx
+++ b/src/features/stake/components/StakingConfirmationTx/Deposit.tsx
@@ -10,6 +10,7 @@ import ConfirmationOrderHeader from '@/components/tx/ConfirmationOrder/Confirmat
import { formatDurationFromSeconds, formatVisualAmount } from '@/utils/formatters'
import { formatCurrency } from '@/utils/formatNumber'
import StakingStatus from '@/features/stake/components/StakingStatus'
+import { InfoTooltip } from '@/features/stake/components/InfoTooltip'
type StakingOrderConfirmationViewProps = {
order: NativeStakingDepositConfirmationView | StakingTxDepositInfo
@@ -50,7 +51,16 @@ const StakingConfirmationTxDeposit = ({ order }: StakingOrderConfirmationViewPro
{formatCurrency(order.expectedFiatMonthlyReward, CURRENCY)})
- {order.fee}%
+
+ Fee
+
+ >
+ }
+ >
+ {order.fee}%
+
Withdraw in
-
Withdrawal time is the sum of:
@@ -46,22 +46,7 @@ const StakingConfirmationTxExit = ({ order }: StakingOrderConfirmationViewProps)
>
}
- arrow
- placement="top"
- >
-
-
-
-
+ />
>
}
>