diff --git a/apps/web/components/BTCConnect.tsx b/apps/web/components/BTCConnect.tsx
new file mode 100644
index 0000000..33f1886
--- /dev/null
+++ b/apps/web/components/BTCConnect.tsx
@@ -0,0 +1,78 @@
+import {
+ useETHProvider,
+ useBTCProvider,
+ useConnectModal,
+} from '@particle-network/btc-connectkit';
+
+import React, { useCallback, useEffect, useState } from 'react';
+
+import { Button, WalletIdentity } from '@sovryn/ui';
+
+const BTCConnect = () => {
+ const { account } = useETHProvider();
+ const { openConnectModal, disconnect } = useConnectModal();
+ const { accounts, sendBitcoin, getNetwork } = useBTCProvider();
+ const [balanceBtc, setBalanceBtc] = useState('');
+
+ useEffect(() => {
+ if (!account || accounts.length === 0) {
+ return;
+ }
+
+ const fetchBalances = async () => {
+ try {
+ const networkSuffix =
+ (await getNetwork()) === 'livenet' ? 'main' : 'test3';
+ const response = await fetch(
+ `https://api.blockcypher.com/v1/btc/${networkSuffix}/addrs/${accounts[0]}/balance`,
+ );
+
+ if (!response.ok) {
+ throw new Error('Failed to fetch BTC balance');
+ }
+
+ const data = await response.json();
+ setBalanceBtc((data.balance / 1e8).toFixed(8));
+ } catch (error) {
+ console.error('Error fetching balances:', error);
+ }
+ };
+
+ fetchBalances();
+ }, [account, accounts, getNetwork]);
+
+ const executeTxBtc = useCallback(async () => {
+ try {
+ const hash = await sendBitcoin(accounts[0], 1);
+ alert(`Transaction mined: ${hash}`);
+ } catch (error) {
+ console.error('Error executing BTC transaction:', error);
+ }
+ }, [accounts, sendBitcoin]);
+
+ return !account ? (
+
+ ) : (
+
+
Connected
+
+
BTC Wallet
+
+
+
Balance: {balanceBtc} BTC
+
+
+
+