diff --git a/src/app/components/mint-unmint/components/lock-screen/components/protocol-fee.tsx b/src/app/components/mint-unmint/components/lock-screen/components/protocol-fee.tsx
index d36f27ac..29c1cae9 100644
--- a/src/app/components/mint-unmint/components/lock-screen/components/protocol-fee.tsx
+++ b/src/app/components/mint-unmint/components/lock-screen/components/protocol-fee.tsx
@@ -3,6 +3,7 @@ import { HStack, Text, VStack } from '@chakra-ui/react';
interface LockScreenProtocolFeeProps {
assetAmount?: number;
bitcoinPrice?: number;
+ protocolFeePercentage?: number;
}
function calculateProtocolFee(amount: number, protocolFeePercentage: number): string {
@@ -20,6 +21,7 @@ function calculateProtocolFeeInUSD(
export function LockScreenProtocolFee({
assetAmount,
bitcoinPrice,
+ protocolFeePercentage,
}: LockScreenProtocolFeeProps): React.JSX.Element {
return (
- {assetAmount && calculateProtocolFee(assetAmount, 0.0001)} BTC
+ {assetAmount &&
+ protocolFeePercentage &&
+ calculateProtocolFee(assetAmount, protocolFeePercentage)}{' '}
+ BTC
{' '}
={' '}
{assetAmount &&
bitcoinPrice &&
- calculateProtocolFeeInUSD(assetAmount, bitcoinPrice, 0.0001)}{' '}
+ protocolFeePercentage &&
+ calculateProtocolFeeInUSD(assetAmount, bitcoinPrice, protocolFeePercentage)}{' '}
$
diff --git a/src/app/components/mint-unmint/components/lock-screen/lock-screen.tsx b/src/app/components/mint-unmint/components/lock-screen/lock-screen.tsx
index 06f52836..44c974ad 100644
--- a/src/app/components/mint-unmint/components/lock-screen/lock-screen.tsx
+++ b/src/app/components/mint-unmint/components/lock-screen/lock-screen.tsx
@@ -1,4 +1,4 @@
-import { useContext, useState } from 'react';
+import { useContext, useEffect, useState } from 'react';
import { useDispatch } from 'react-redux';
import { Button, VStack } from '@chakra-ui/react';
@@ -19,10 +19,21 @@ export function LockScreen({ currentStep }: LockScreenProps): React.JSX.Element
const { readyVaults } = useVaults();
const blockchainContext = useContext(BlockchainContext);
const bitcoin = blockchainContext?.bitcoin;
+ const ethereum = blockchainContext?.ethereum;
+
const [isSubmitting, setIsSubmitting] = useState(false);
+ const [protocolFeePercentage, setProtocolFeePercentage] = useState(undefined);
const currentVault = readyVaults.find(vault => vault.uuid === currentStep[1]);
+ useEffect(() => {
+ const fetchProtocolFeePercentage = async () => {
+ const currentProtocolFeePercentage = await ethereum?.getProtocolFee();
+ setProtocolFeePercentage(currentProtocolFeePercentage);
+ };
+ fetchProtocolFeePercentage();
+ }, [ethereum]);
+
async function handleClick(currentVault?: Vault) {
if (!currentVault) return;
@@ -41,6 +52,7 @@ export function LockScreen({ currentStep }: LockScreenProps): React.JSX.Element