Skip to content

Commit

Permalink
refactor: chain data store (#11)
Browse files Browse the repository at this point in the history
  • Loading branch information
@filoozom
filoozom authored Oct 17, 2023
1 parent 6a403d0 commit 1c1045f
Show file tree
Hide file tree
Showing 9 changed files with 163 additions and 139 deletions.
28 changes: 11 additions & 17 deletions src/components/ContractsOverview/ContractsOverview.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,54 +1,48 @@
import { formatContractAddress } from "../../utils/utils";
import arrow_right from "../../assets/arrow_right.svg";
import { useShallow } from "zustand/shallow";
import { useLoadedAccountStore } from "../../stores/account";
import { useLoadedChainStore } from "../../stores/chain";

const ContractsOverview: React.FC = () => {
const account = useLoadedAccountStore(
useShallow(state => ({
chainData: state.chainData,
})),
true,
const { addresses, explorer } = useLoadedChainStore(
useShallow(({ addresses, explorer }) => ({ addresses, explorer })),
);

// Token input
const { chainData } = account;

return (
<div className="rounded-2xl border border-[#DDDAD0] bg-[#F9F7F5] text-left p-5">
<div className="contracts-row flex flex-row py-1">
<div className="text-[#7A776D] font-medium text-sm flex-start">WXDAI</div>
<div className="text-[#726F66] font-medium text-sm grow text-end font-mono">
{formatContractAddress(chainData.RESERVE_TOKEN_ADDRESS)}
{formatContractAddress(addresses.reserveToken)}
</div>
<a href={chainData.EXPLORER + "address/" + chainData.RESERVE_TOKEN_ADDRESS} target="_blank">
<a href={explorer + "address/" + addresses.reserveToken} target="_blank">
<img className="w-4 fill-[#726F66]" src={arrow_right} alt={arrow_right} />
</a>
</div>
<div className="contracts-row flex flex-row py-1">
<div className="text-[#7A776D] font-medium text-sm">sDAI</div>
<div className="text-[#726F66] font-medium text-sm grow text-end font-mono">
{formatContractAddress(chainData.ERC4626_VAULT_ADDRESS)}
{formatContractAddress(addresses.vault)}
</div>
<a href={chainData.EXPLORER + "address/" + chainData.ERC4626_VAULT_ADDRESS} target="_blank">
<a href={explorer + "address/" + addresses.vault} target="_blank">
<img className="w-4 fill-[#726F66]" src={arrow_right} alt={arrow_right} />
</a>
</div>
<div className="contracts-row flex flex-row py-1">
<div className="text-[#7A776D] font-medium text-sm">Bridge Receiver</div>
<div className="text-[#726F66] font-medium text-sm grow text-end font-mono">
{formatContractAddress(chainData.BRIDGE_RECEIVER)}
{formatContractAddress(addresses.bridgeReceiver)}
</div>
<a href={chainData.EXPLORER + "address/" + chainData.BRIDGE_RECEIVER} target="_blank">
<a href={explorer + "address/" + addresses.bridgeReceiver} target="_blank">
<img className="w-4 fill-[#726F66]" src={arrow_right} alt={arrow_right} />
</a>
</div>
<div className="contracts-row flex flex-row py-1">
<div className="text-[#7A776D] font-medium text-sm">Vault Adapter</div>
<div className="text-[#726F66] font-medium text-sm grow text-end font-mono">
{formatContractAddress(chainData.VAULT_ADAPTER_ADDRESS)}
{formatContractAddress(addresses.vaultAdapter)}
</div>
<a href={chainData.EXPLORER + "address/" + chainData.VAULT_ADAPTER_ADDRESS} target="_blank">
<a href={explorer + "address/" + addresses.vaultAdapter} target="_blank">
<img className="w-4 fill-[#726F66]" src={arrow_right} alt={arrow_right} />
</a>
</div>
Expand Down
44 changes: 22 additions & 22 deletions src/components/Form/Form.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@ import { TokenInput } from "../TokenInput/TokenInput";
import { useAccountStore, useLoadedAccountStore } from "../../stores/account";
import { Token } from "../TokenSelector/TokenSelector";
import { bigIntMax, bigIntMin } from "../../utils/utils";
import { useLoadedChainStore } from "../../stores/chain";

// Constants
const GAS_PRICE_OFFSET = 10000000000000000n;
Expand All @@ -35,21 +36,19 @@ enum Actions {
const handled: Record<string, boolean> = {};
const Form: React.FC = () => {
// Store
const addresses = useLoadedChainStore(({ addresses }) => addresses);
const account = useLoadedAccountStore(
useShallow(state => ({
chain: state.chainData,
address: state.address,
nativeBalance: state.nativeBalance,
sharesBalance: state.sharesBalance,
reservesBalance: state.reservesBalance,
depositAllowance: state.depositAllowance,
withdrawAllowance: state.withdrawAllowance,
})),
true,
);

// Token input
const { chain, address, depositAllowance, withdrawAllowance, sharesBalance } = account;
const { address, depositAllowance, withdrawAllowance, sharesBalance } = account;
const [tokenInput, setTokenInput] = useState<{
token: Token;
balance: bigint;
Expand Down Expand Up @@ -102,7 +101,8 @@ const Form: React.FC = () => {
action: Actions.WithdrawXDAI,
};
}
if (chain.VAULT_ADAPTER_ADDRESS === chain.ERC4626_VAULT_ADDRESS){

if (addresses.vaultAdapter === addresses.vault) {
return {
name: "Withdraw WXDAI From Vault",
action: Actions.WithdrawFromVault,
Expand All @@ -113,21 +113,21 @@ const Form: React.FC = () => {
name: "Withdraw WXDAI",
action: Actions.WithdrawWXDAI,
};
}, [isDeposit, isNative, depositAllowance, withdrawAllowance, amount, sharesAmount]);
}, [isDeposit, isNative, depositAllowance, withdrawAllowance, amount, sharesAmount, addresses]);

const approveWXDAI = useContractWrite(
usePrepareContractWrite({
address: chain.RESERVE_TOKEN_ADDRESS,
address: addresses.reserveToken,
abi: erc20ABI,
functionName: "approve",
args: [chain.VAULT_ADAPTER_ADDRESS, amount],
args: [addresses.vaultAdapter, amount],
enabled: action.action === Actions.ApproveWXDAI,
}).config,
);

const depositXDAI = useContractWrite(
usePrepareContractWrite({
address: chain.VAULT_ADAPTER_ADDRESS,
address: addresses.vaultAdapter,
abi: VaultAdapter,
functionName: "depositXDAI",
args: [receiver],
Expand All @@ -138,7 +138,7 @@ const Form: React.FC = () => {

const depositWXDAI = useContractWrite(
usePrepareContractWrite({
address: chain.VAULT_ADAPTER_ADDRESS,
address: addresses.vaultAdapter,
abi: VaultAdapter,
functionName: "deposit",
args: [amount, receiver],
Expand All @@ -148,17 +148,17 @@ const Form: React.FC = () => {

const approveSDAI = useContractWrite(
usePrepareContractWrite({
address: chain.ERC4626_VAULT_ADDRESS,
address: addresses.vault,
abi: erc20ABI,
functionName: "approve",
args: [chain.VAULT_ADAPTER_ADDRESS, MAX_UINT256],
args: [addresses.vaultAdapter, MAX_UINT256],
enabled: action.action === Actions.ApproveSDAI,
}).config,
);

const withdrawWXDAI = useContractWrite(
usePrepareContractWrite({
address: chain.VAULT_ADAPTER_ADDRESS,
address: addresses.vaultAdapter,
abi: VaultAdapter,
functionName: amountIsMax ? "redeem" : "withdraw",
args: [amountIsMax ? sharesBalance.value : amount, receiver],
Expand All @@ -168,22 +168,22 @@ const Form: React.FC = () => {

const withdrawXDAI = useContractWrite(
usePrepareContractWrite({
address: chain.VAULT_ADAPTER_ADDRESS,
address: addresses.vaultAdapter,
abi: VaultAdapter,
functionName: amountIsMax ? "redeemXDAI" : "withdrawXDAI",
args: [amountIsMax ? sharesBalance.value : amount, receiver],
enabled: action.action === Actions.WithdrawXDAI,
}).config,
);

const WithdrawFromVault = useContractWrite(
usePrepareContractWrite({
address: chain.ERC4626_VAULT_ADDRESS,
abi: erc4626ABI,
functionName: amountIsMax ? "redeem" : "withdraw",
args: [amountIsMax ? sharesBalance.value : amount, receiver, receiver],
enabled: action.action === Actions.WithdrawFromVault,
}).config,
const WithdrawFromVault = useContractWrite(
usePrepareContractWrite({
address: addresses.vault,
abi: erc4626ABI,
functionName: amountIsMax ? "redeem" : "withdraw",
args: [amountIsMax ? sharesBalance.value : amount, receiver, receiver],
enabled: action.action === Actions.WithdrawFromVault,
}).config,
);

// Store update
Expand Down
13 changes: 3 additions & 10 deletions src/components/Main/Main.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,22 +21,15 @@ import { useAccountShareValue } from "../../hooks/useAccountShareValue";
const Main: React.FC = () => {
const account = useLoadedAccountStore(
useShallow(state => ({
chain: state.chainData,
address: state.address,
nativeBalance: state.nativeBalance,
sharesBalance: state.sharesBalance,
reservesBalance: state.reservesBalance,
depositAllowance: state.depositAllowance,
withdrawAllowance: state.withdrawAllowance,
})),
true,
);

if (!account) {
throw new Error("rendered without account");
}

// Token input
const { address, sharesBalance } = account;

// Cards
const vaultAPY = useVaultAPY().data;
const sharesValue = useAccountShareValue();
Expand Down Expand Up @@ -74,7 +67,7 @@ const Main: React.FC = () => {
</a>
</div>
</div>
<div className=" flex flex-col flex-1 w-full sm:w-2/5 sm:my-5 items-start content-start gap-2">
<div className="flex flex-col flex-1 w-full sm:w-2/5 sm:my-5 items-start content-start gap-2">
<div className="title flex flex-start gap-2">
<img className="w-5" src={refresh}></img>
<div className="text-[#716E64] font-bold text-base">Need to bridge or swap?</div>
Expand Down
53 changes: 29 additions & 24 deletions src/constants.ts
View file
Original file line number Diff line number Diff line change
@@ -1,35 +1,40 @@
export interface ChainData {
chainId: number;
VAULT_ADAPTER_ADDRESS: `0x${string}`;
BRIDGE_RECEIVER: `0x${string}`;
RESERVE_TOKEN_ADDRESS: `0x${string}`;
ERC4626_VAULT_ADDRESS: `0x${string}`;
EXPLORER: string;
export interface ChainConfig {
id: number;
explorer: `https://${string}`;
addresses: {
vaultAdapter: `0x${string}`;
bridgeReceiver: `0x${string}`;
reserveToken: `0x${string}`; // wxDAI
vault: `0x${string}`; // sDAI
};
}

const gnosis: ChainData = {
chainId: 100,
VAULT_ADAPTER_ADDRESS: "0x02aE11DC9783467e0830041399a2D48251f63907",
//VAULT_ADAPTER_ADDRESS: "0xD499b51fcFc66bd31248ef4b28d656d67E591A94",
BRIDGE_RECEIVER: "0x670daeaF0F1a5e336090504C68179670B5059088",
RESERVE_TOKEN_ADDRESS: "0xe91D153E0b41518A2Ce8Dd3D7944Fa863463a97d",
ERC4626_VAULT_ADDRESS: "0xaf204776c7245bF4147c2612BF6e5972Ee483701",
EXPLORER: "https://gnosisscan.io/",
export const gnosis: ChainConfig = {
id: 100,
explorer: "https://gnosisscan.io/",
addresses: {
vaultAdapter: "0x02aE11DC9783467e0830041399a2D48251f63907",
bridgeReceiver: "0x670daeaF0F1a5e336090504C68179670B5059088",
reserveToken: "0xe91D153E0b41518A2Ce8Dd3D7944Fa863463a97d",
vault: "0xaf204776c7245bF4147c2612BF6e5972Ee483701",
},
};

const gnosisChiado: ChainData = {
chainId: 10200,
VAULT_ADAPTER_ADDRESS: "0xc1529e13A5842D790da01F778Bf23a3677830986",
BRIDGE_RECEIVER: "0x65e75819E4e8250a03958Ba303E8f95F8f578168",
RESERVE_TOKEN_ADDRESS: "0x18c8a7ec7897177E4529065a7E7B0878358B3BfF",
ERC4626_VAULT_ADDRESS: "0x20e5eB701E8d711D419D444814308f8c2243461F",
EXPLORER: "https://gnosis-chiado.blockscout.com",
export const gnosisChiado: ChainConfig = {
id: 10200,
explorer: "https://gnosis-chiado.blockscout.com",
addresses: {
vaultAdapter: "0xc1529e13A5842D790da01F778Bf23a3677830986",
bridgeReceiver: "0x65e75819E4e8250a03958Ba303E8f95F8f578168",
reserveToken: "0x18c8a7ec7897177E4529065a7E7B0878358B3BfF",
vault: "0x20e5eB701E8d711D419D444814308f8c2243461F",
},
};

export const supportedChains: ChainData[] = [gnosis, gnosisChiado];
export const supportedChains: ChainConfig[] = [gnosis, gnosisChiado];

export const getChainData = (id: number) => {
return supportedChains.find(x => x.chainId === id);
return supportedChains.find(chain => chain.id === id);
};

export const WALLETCONNECT_PROJECTID = "006ebb71415ac00246c619155f5d56f7";
Expand Down
13 changes: 3 additions & 10 deletions src/hooks/useAccountShareValue.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,27 +8,21 @@ import { useLoadedAccountStore } from "../stores/account";
import { useReceiverData, useTotalSupply } from "./useData";

export const useAccountShareValue = () => {
const account = useLoadedAccountStore(
const { sharesBalance, reservesBalance } = useLoadedAccountStore(
useShallow(state => ({
chain: state.chainData,
address: state.address,
sharesBalance: state.sharesBalance,
reservesBalance: state.reservesBalance,
})),
true,
);
if (!account) {
throw new Error("rendered without account");
}

const { sharesBalance, reservesBalance } = account;

const totalShares = useTotalSupply();
const { dripRate, lastClaimTimestamp } = useReceiverData();
const [sharesValue, setSharesValue] = useState<bigint>(0n);

useEffect(() => {
const update = () => {
if (account && totalShares.data) {
if (totalShares.data) {
if (lastClaimTimestamp.data && dripRate.data) {
const currentTime = Math.floor(Date.now() / 1000);
const unclaimedTime = BigInt(currentTime) - lastClaimTimestamp.data;
Expand All @@ -45,7 +39,6 @@ export const useAccountShareValue = () => {
const interval = setInterval(update, 5000);
return () => clearInterval(interval);
}, [
account,
lastClaimTimestamp.data,
dripRate.data,
totalShares.data,
Expand Down
Loading

0 comments on commit 1c1045f

Please sign in to comment.