Skip to content

Commit

Permalink
APT-1622, APT-1611, APT-1623 (#17)
Browse files Browse the repository at this point in the history
* APT-1611 wallet connect fixes

* APT-1622: Devnet config

* APT-1623: extend available wallets

* minor visual fixes

---------

Co-authored-by: Lukasz Kosiak <[email protected]>
  • Loading branch information
lukozill and uHappyLogic authored Dec 27, 2024
1 parent d4db7d9 commit 33583fa
Show file tree
Hide file tree
Showing 9 changed files with 100 additions and 43 deletions.
2 changes: 1 addition & 1 deletion .env.local_zq2
Original file line number Diff line number Diff line change
@@ -1,2 +1,2 @@
ZQ2_STAKING_CHAIN_ID=32769
ZQ2_STAKING_WALLET_CONNECT_API_KEY=ewewewejwje
ZQ2_STAKING_WALLET_CONNECT_API_KEY=TODO_REPLACE_THIS_KEY_WITH_YOUR_OWN # you can get one for free on https://reown.com/
2 changes: 1 addition & 1 deletion .env.mocked
Original file line number Diff line number Diff line change
@@ -1,2 +1,2 @@
ZQ2_STAKING_CHAIN_ID=9999999
ZQ2_STAKING_WALLET_CONNECT_API_KEY=ewewewejwje
ZQ2_STAKING_WALLET_CONNECT_API_KEY=UNUSED
2 changes: 1 addition & 1 deletion .env.zq2_testnet
Original file line number Diff line number Diff line change
@@ -1,2 +1,2 @@
ZQ2_STAKING_CHAIN_ID=33103
ZQ2_STAKING_WALLET_CONNECT_API_KEY=ewewewejwje
ZQ2_STAKING_WALLET_CONNECT_API_KEY=TODO_REPLACE_THIS_KEY_WITH_YOUR_OWN # you can get one for free on https://reown.com/
28 changes: 11 additions & 17 deletions src/components/withdrawUnstakedZilPanel.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -74,17 +74,15 @@ const WithdrawZilPanel: React.FC<WithdrawZilPanelProps> = ({
) : (
<div className="w-[4em] h-[1em] animated-gradient" />
)}

<div className='lg:w-1/3 lg:max-w-[218px]'>
<Button
className="btn-primary-gradient-aqua"
onClick={() => claim(item.address)}
loading={isClaimingInProgress}
>
Claim
</Button>
</div>

<div className='lg:w-1/3 lg:max-w-[218px]'>
<Button
className="btn-primary-gradient-aqua"
onClick={() => claim(item.address)}
loading={isClaimingInProgress}
>
Claim
</Button>
</div>
</div>
</div>
))
Expand Down Expand Up @@ -126,15 +124,11 @@ const WithdrawZilPanel: React.FC<WithdrawZilPanelProps> = ({
{stakingPoolData.data ? (
<div className='flex gap-2.5'>
<div className='body1 text-gray4'>
200.00 avZIL
</div>

<div className='regular-base text-gray4 mt-1'>
={' '}{parseFloat(
{parseFloat(
formatUnits(claim.zilAmount, 18)
).toFixed(3)}{' '}
ZIL
</div>
</div>
</div>
) : (
<div className="w-[4em] h-[1em] animated-gradient" />
Expand Down
28 changes: 22 additions & 6 deletions src/contexts/stakingOperations.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -33,20 +33,24 @@ const useStakingOperations = () => {
*/

const [stakingCallTxHash, setStakingCallTxHash] = useState<Address | undefined>(undefined);
const [preparingStakingTx, setPreparingStakingTx] = useState(false);

const {
isLoading: isStakingInProgress,
isLoading: submittingStakingTx,
error: stakeContractCallError,
status: stakingCallReceiptStatus,
} = useWaitForTransactionReceipt({
hash: stakingCallTxHash,
})

const stake = (delegatorAddress: string, weiToStake: bigint) => {
setPreparingStakingTx(true);

if (isDummyWalletConnected) {
setDummyWalletPopupContent(`Now User gonna approve the wallet transaction for staking ZIL`);
setIsDummyWalletPopupOpen(true);
setStakingCallTxHash("0x1234567890234567890234567890234567890" as Address);
setPreparingStakingTx(false);
} else {
writeContract(
wagmiConfig,
Expand All @@ -69,6 +73,8 @@ const useStakingOperations = () => {
placement: "topRight"
});
}
).finally(
() => setPreparingStakingTx(false)
)
}
}
Expand Down Expand Up @@ -98,20 +104,23 @@ const useStakingOperations = () => {
*/

const [unstakingCallTxHash, setUnstakingCallTxHash] = useState<Address | undefined>(undefined);
const [preparingUnstakingTx, setPreparingUnstakingTx] = useState(false);

const {
isLoading: isUnstakingInProgress,
isLoading: submittingUnstakingTx,
error: unstakeContractCallError,
status: unstakeCallReceiptStatus,
} = useWaitForTransactionReceipt({
hash: unstakingCallTxHash,
})

const unstake = (delegatorAddress: string, tokensToUnstake: bigint) => {
setPreparingUnstakingTx(true);
if (isDummyWalletConnected) {
setDummyWalletPopupContent(`Now User gonna approve the wallet transaction for unstaking ${tokensToUnstake} staked tokens`);
setIsDummyWalletPopupOpen(true);
setUnstakingCallTxHash("0x1234567890234567890234567890234567890" as Address);
setPreparingUnstakingTx(false);
} else {
writeContract(
wagmiConfig,
Expand All @@ -133,6 +142,8 @@ const useStakingOperations = () => {
placement: "topRight"
});
}
).finally(
() => setPreparingUnstakingTx(false)
)
}
}
Expand Down Expand Up @@ -162,20 +173,23 @@ const useStakingOperations = () => {
*/

const [claimCallTxHash, setClaimCallTxHash] = useState<Address | undefined>(undefined);
const [preparingClaimTx, setPreparingClaimTx] = useState(false);

const {
isLoading: isClaimingInProgress,
isLoading: submittingClaimTx,
error: claimContractCallError,
status: claimCallReceiptStatus,
} = useWaitForTransactionReceipt({
hash: claimCallTxHash,
})

const claim = (delegatorAddress: string) => {
setPreparingClaimTx(true);
if (isDummyWalletConnected) {
setDummyWalletPopupContent(`Now User gonna approve the wallet transaction for withdrawing/claiming ZIL`);
setIsDummyWalletPopupOpen(true);
setClaimCallTxHash("0x1234567890234567890234567890234567890" as Address);
setPreparingClaimTx(false);
} else {
writeContract(
wagmiConfig,
Expand All @@ -197,6 +211,8 @@ const useStakingOperations = () => {
placement: "topRight"
});
}
).finally(
() => setPreparingClaimTx(false)
)
}
}
Expand Down Expand Up @@ -240,17 +256,17 @@ const useStakingOperations = () => {
setIsDummyWalletPopupOpen,

stake,
isStakingInProgress,
isStakingInProgress: submittingStakingTx || preparingStakingTx,
stakingCallTxHash,
stakeContractCallError,

unstake,
isUnstakingInProgress,
isUnstakingInProgress: submittingUnstakingTx || preparingUnstakingTx,
unstakingCallTxHash,
unstakeContractCallError,

claim,
isClaimingInProgress,
isClaimingInProgress: submittingClaimTx || preparingClaimTx,
claimCallTxHash,
claimContractCallError,
}
Expand Down
16 changes: 13 additions & 3 deletions src/misc/chainConfig.ts
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
import { connectorsForWallets } from '@rainbow-me/rainbowkit';
import { rainbowWallet, walletConnectWallet } from '@rainbow-me/rainbowkit/wallets';
import { coinbaseWallet, ledgerWallet, metaMaskWallet, phantomWallet, rabbyWallet, rainbowWallet, trustWallet, walletConnectWallet } from '@rainbow-me/rainbowkit/wallets';
import { createClient, createPublicClient, defineChain, http } from 'viem';
import { createConfig } from 'wagmi';
import { rabbyWallet } from '@rainbow-me/rainbowkit/wallets';


export const CHAIN_ZQ2_DEVNET = defineChain({
id: 33469,
Expand Down Expand Up @@ -77,7 +77,16 @@ function getConnectorsForWallets(walletConnectApiKey: string) {
[
{
groupName: 'Recommended',
wallets: [rainbowWallet, walletConnectWallet, rabbyWallet],
wallets: [
metaMaskWallet,
walletConnectWallet,
coinbaseWallet,
rabbyWallet,
trustWallet,
ledgerWallet,
rainbowWallet,
phantomWallet
],
},
],
{
Expand All @@ -89,6 +98,7 @@ function getConnectorsForWallets(walletConnectApiKey: string) {

export function getChain(chainId: number) {
const chain = [
CHAIN_ZQ2_DEVNET,
CHAIN_ZQ2_PROTOTESTNET,
CHAIN_ZQ2_DOCKERCOMPOSE,
MOCK_CHAIN,
Expand Down
26 changes: 16 additions & 10 deletions src/misc/formatting.ts
Original file line number Diff line number Diff line change
Expand Up @@ -14,21 +14,27 @@ export function getHumanFormDuration(availableAt: DateTime) {
const units = availableAt.diff(DateTime.now()).shiftTo('days', 'hours', 'minutes').toHuman({
unitDisplay: 'long',
listStyle: 'narrow',
maximumFractionDigits: 0,
})

const mostSignificantUnit = units.split(',').reduce((acc, unit) => {
if (acc !== '') {
return acc
}
const mostSignificantUnit = units
.split(',')
.map(units => units.trim())
.reduce((acc, unit) => {
if (acc !== '') {
return acc
}

if (unit[0] !== '0') {
return unit.trim()
}
// check if unit starts with smh different that 0
// e.g., 0 days 2 hours 5 minutes should return "2 hours"
if (unit[0] !== '0') {
return unit
}

return acc
}, '')
return acc
}, '')

return `~${mostSignificantUnit}`
return `~${mostSignificantUnit || '< 1 minute'}`
}

export function convertTokenToZil(tokenAmount: bigint, zilToTokenRate: number): bigint {
Expand Down
37 changes: 34 additions & 3 deletions src/misc/stakingPoolsConfig.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { Address, erc20Abi, formatUnits, parseUnits } from "viem";
import { CHAIN_ZQ2_PROTOTESTNET, CHAIN_ZQ2_DOCKERCOMPOSE, getViemClient, MOCK_CHAIN } from "./chainConfig";
import { CHAIN_ZQ2_PROTOTESTNET, CHAIN_ZQ2_DOCKERCOMPOSE, getViemClient, MOCK_CHAIN, CHAIN_ZQ2_DEVNET } from "./chainConfig";
import { readContract } from "viem/actions";
import { delegatorAbi, depositAbi } from "./stakingAbis";

Expand Down Expand Up @@ -116,6 +116,7 @@ async function fetchDelegatorDataFromNetwork(definition: StakingPoolDefinition,
}

const twoWeeksInMinutes = 60 * 24 * 14;
const fiveMinutesInMinutes = 5;

export const stakingPoolsConfigForChainId: Record<string, Array<StakingPoolConfig>> = {
[MOCK_CHAIN.id]: [
Expand Down Expand Up @@ -225,7 +226,7 @@ export const stakingPoolsConfigForChainId: Record<string, Array<StakingPoolConfi
minimumStake: parseUnits("100", 18),
withdrawPeriodInMinutes: twoWeeksInMinutes,
},
delegatorDataProvider: fetchDelegatorDataFromNetwork.bind(null)
delegatorDataProvider: fetchDelegatorDataFromNetwork
},
{
definition: {
Expand All @@ -239,7 +240,37 @@ export const stakingPoolsConfigForChainId: Record<string, Array<StakingPoolConfi
minimumStake: parseUnits("100", 18),
withdrawPeriodInMinutes: twoWeeksInMinutes,
},
delegatorDataProvider: fetchDelegatorDataFromNetwork.bind(null)
delegatorDataProvider: fetchDelegatorDataFromNetwork
}
],
[CHAIN_ZQ2_DEVNET.id]: [
{
definition: {
id: 'MHg3YTBi',
address: '0x7a0b7e6d24ede78260c9ddbd98e828b0e11a8ea2',
tokenAddress: '0x9e5c257D1c6dF74EaA54e58CdccaCb924669dc83',
iconUrl: '/static/logo1.webp',
name: 'Dev Validator 1',
tokenDecimals: 18,
tokenSymbol: "devLST1",
minimumStake: 100000000000000000000n,
withdrawPeriodInMinutes: fiveMinutesInMinutes
},
delegatorDataProvider: fetchDelegatorDataFromNetwork
},
{
definition: {
id: 'MHg1YmMz',
address: '0x5bc3FcC25638725aaA2ED801b7BA21516f718655',
tokenAddress: '0x3261f96C307BAd745578fAa470C8dC2841Dd36E0',
iconUrl: '/static/logo2.webp',
name: 'Dev Validator 2',
tokenDecimals: 18,
tokenSymbol: "devLST2",
minimumStake: 100000000000000000000n,
withdrawPeriodInMinutes: fiveMinutesInMinutes
},
delegatorDataProvider: fetchDelegatorDataFromNetwork
}
],
[CHAIN_ZQ2_DOCKERCOMPOSE.id]: [
Expand Down
2 changes: 1 addition & 1 deletion src/pages/_app.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,7 @@ export default function App({ Component, pageProps }: AppProps) {
<ConfigProvider>
<WagmiProvider config={getWagmiConfig(appConfig.chainId, appConfig.walletConnectPrivateKey)}>
<QueryClientProvider client={queryClient}>
<RainbowKitProvider>
<RainbowKitProvider showRecentTransactions={true}>
<WalletConnector.Provider>
<StakingPoolsStorage.Provider>
<StakingOperations.Provider>
Expand Down

0 comments on commit 33583fa

Please sign in to comment.