Skip to content

Commit

Permalink
feat: merged dev updates
Browse files Browse the repository at this point in the history
  • Loading branch information
Polybius93 committed Dec 7, 2023
2 parents 15200b5 + 4a03232 commit 3e7611d
Show file tree
Hide file tree
Showing 5 changed files with 80 additions and 46 deletions.
13 changes: 8 additions & 5 deletions src/app/app.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -5,18 +5,21 @@ import { MyVaults } from "@pages/my-vaults/my-vaults";

import { About } from "./pages/about/about";
import { Dashboard } from "./pages/dashboard/dashboard";
import { BalanceContextProvider } from "./providers/balance-context-provider";
import { BlockchainContextProvider } from "./providers/blockchain-context-provider";
import { VaultContextProvider } from "./providers/vault-context-provider";

export function App(): React.JSX.Element {
return (
<BlockchainContextProvider>
<VaultContextProvider>
<AppLayout>
<Route path="/" element={<Dashboard />} />
<Route path="/my-vaults" element={<MyVaults />} />
<Route path="/how-it-works" element={<About />} />
</AppLayout>
<BalanceContextProvider>
<AppLayout>
<Route path="/" element={<Dashboard />} />
<Route path="/my-vaults" element={<MyVaults />} />
<Route path="/how-it-works" element={<About />} />
</AppLayout>
</BalanceContextProvider>
</VaultContextProvider>
</BlockchainContextProvider>
);
Expand Down
26 changes: 6 additions & 20 deletions src/app/components/my-vaults/my-vaults-large.tsx
Original file line number Diff line number Diff line change
@@ -1,24 +1,21 @@
import { useContext, useEffect } from "react";
import { useContext } from "react";
import { useSelector } from "react-redux";

import { HStack } from "@chakra-ui/react";
import { VaultsListGroupBlankContainer } from "@components/vaults-list/components/vaults-list-group-blank-container";
import { VaultsListGroupContainer } from "@components/vaults-list/components/vaults-list-group-container";
import { VaultsList } from "@components/vaults-list/vaults-list";
import { RootState } from "@store/index";
import { VaultContext } from "../../providers/vault-context-provider";

import { BlockchainContext } from "../../providers/blockchain-context-provider";
import { VaultContext } from "../../providers/vault-context-provider";
import { MyVaultsLargeHeader } from "./components/my-vaults-header/my-vaults-header";
import { MyVaultsLargeLayout } from "./components/my-vaults-large.layout";
import { MyVaultsSetupInformationStack } from "./components/my-vaults-setup-information-stack";
import { BalanceContext } from "../../providers/balance-context-provider";

export function MyVaultsLarge(): React.JSX.Element {
const { address } = useSelector((state: RootState) => state.account);

const blockchainContext = useContext(BlockchainContext);
const ethereum = blockchainContext?.ethereum;

const { dlcBTCBalance, lockedBTCBalance } = useContext(BalanceContext);
const vaultContext = useContext(VaultContext);
const {
readyVaults,
Expand All @@ -28,23 +25,12 @@ export function MyVaultsLarge(): React.JSX.Element {
closedVaults,
} = vaultContext.vaults;

useEffect(() => {
if (!ethereum || !address) return;

const { getDLCBTCBalance, getLockedBTCBalance } = ethereum;
const fetchData = async () => {
await getDLCBTCBalance();
await getLockedBTCBalance();
};
fetchData();
}, [ethereum?.isLoaded, address]);

return (
<MyVaultsLargeLayout>
<MyVaultsLargeHeader
address={address}
dlcBTCBalance={ethereum?.dlcBTCBalance}
lockedBTCBalance={ethereum?.lockedBTCBalance}
dlcBTCBalance={dlcBTCBalance}
lockedBTCBalance={lockedBTCBalance}
/>
<HStack spacing={"35px"} w={"100%"}>
{address ? (
Expand Down
22 changes: 6 additions & 16 deletions src/app/hooks/use-ethereum.ts
Original file line number Diff line number Diff line change
Expand Up @@ -25,10 +25,8 @@ export interface UseEthereumReturnType {
protocolContract: Contract | undefined;
dlcManagerContract: Contract | undefined;
dlcBTCContract: Contract | undefined;
dlcBTCBalance: number | undefined;
getDLCBTCBalance: () => Promise<void>;
lockedBTCBalance: number | undefined;
getLockedBTCBalance: () => Promise<void>;
getDLCBTCBalance: () => Promise<number | undefined>;
getLockedBTCBalance: () => Promise<number | undefined>;
totalSupply: number | undefined;
requestEthereumAccount: (
network: Network,
Expand Down Expand Up @@ -74,12 +72,6 @@ export function useEthereum(): UseEthereumReturnType {
undefined,
);

const [dlcBTCBalance, setDLCBTCBalance] = useState<number | undefined>(
undefined,
);
const [lockedBTCBalance, setLockedBTCBalance] = useState<number | undefined>(
undefined,
);
const [totalSupply, setTotalSupply] = useState<number | undefined>(undefined);

useEffect(() => {
Expand Down Expand Up @@ -338,19 +330,19 @@ export function useEthereum(): UseEthereumReturnType {
}
}

async function getLockedBTCBalance(): Promise<void> {
async function getLockedBTCBalance(): Promise<number | undefined> {
try {
const totalCollateral = fundedVaults.reduce(
(sum: number, vault: Vault) => sum + vault.collateral,
0,
);
setLockedBTCBalance(Number(totalCollateral.toFixed(5)));
return Number(totalCollateral.toFixed(5));
} catch (error) {
throwEthereumError(`Could not fetch locked BTC balance: `, error);
}
}

async function getDLCBTCBalance(): Promise<void> {
async function getDLCBTCBalance(): Promise<number | undefined> {
try {
if (!dlcBTCContract) throw new Error("Protocol contract not initialized");
await dlcBTCContract.callStatic.balanceOf(address);
Expand All @@ -359,7 +351,7 @@ export function useEthereum(): UseEthereumReturnType {
8,
true,
);
setDLCBTCBalance(dlcBTCBalance);
return dlcBTCBalance;
} catch (error) {
throwEthereumError(`Could not fetch dlcBTC balance: `, error);
}
Expand Down Expand Up @@ -474,9 +466,7 @@ export function useEthereum(): UseEthereumReturnType {
protocolContract,
dlcManagerContract,
dlcBTCContract,
dlcBTCBalance,
getDLCBTCBalance,
lockedBTCBalance,
totalSupply,
getLockedBTCBalance,
requestEthereumAccount,
Expand Down
6 changes: 1 addition & 5 deletions src/app/hooks/use-observer.ts
Original file line number Diff line number Diff line change
Expand Up @@ -10,11 +10,7 @@ import { UseEthereumReturnType } from "./use-ethereum";
export function useObserver(ethereum: UseEthereumReturnType): void {
const dispatch = useDispatch();
const { address, network } = useSelector((state: RootState) => state.account);
const {
protocolContract,
dlcBTCContract,
getVault,
} = ethereum;
const { protocolContract, dlcBTCContract, getVault } = ethereum;

useEffect(() => {
if (!protocolContract || !dlcBTCContract) return;
Expand Down
59 changes: 59 additions & 0 deletions src/app/providers/balance-context-provider.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,59 @@
import { createContext, useContext, useEffect, useState } from "react";
import { useSelector } from "react-redux";

import { HasChildren } from "@models/has-children";
import { RootState } from "@store/index";

import { BlockchainContext } from "./blockchain-context-provider";
import { VaultContext } from "./vault-context-provider";

interface VaultContextType {
dlcBTCBalance: number | undefined;
lockedBTCBalance: number | undefined;
}

export const BalanceContext = createContext<VaultContextType>({
dlcBTCBalance: undefined,
lockedBTCBalance: undefined,
});

export function BalanceContextProvider({
children,
}: HasChildren): React.JSX.Element {
const { address } = useSelector((state: RootState) => state.account);

const blockchainContext = useContext(BlockchainContext);
const { vaults } = useContext(VaultContext);

const ethereum = blockchainContext?.ethereum;

const [dlcBTCBalance, setDLCBTCBalance] = useState<number | undefined>(
undefined,
);
const [lockedBTCBalance, setLockedBTCBalance] = useState<number | undefined>(
undefined,
);

useEffect(() => {
if (!ethereum || !address) return;

const { getDLCBTCBalance, getLockedBTCBalance } = ethereum;
const fetchData = async () => {
const currentTokenBalance = await getDLCBTCBalance();
if (currentTokenBalance !== dlcBTCBalance) {
setDLCBTCBalance(currentTokenBalance);
}
const currentLockedBTCBalance = await getLockedBTCBalance();
if (currentLockedBTCBalance !== lockedBTCBalance) {
setLockedBTCBalance(currentLockedBTCBalance);
}
};
fetchData();
}, [address, vaults]);

return (
<BalanceContext.Provider value={{ dlcBTCBalance, lockedBTCBalance }}>
{children}
</BalanceContext.Provider>
);
}

0 comments on commit 3e7611d

Please sign in to comment.