refactor: abstract hooks from transfer panel #1838
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanel.tsx
Outdated
Show resolved
Hide resolved
packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanelMain.tsx
Outdated
Show resolved
Hide resolved
packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanel.tsx
Outdated
Show resolved
Hide resolved
packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanel.tsx
Outdated
Show resolved
Hide resolved
| import { useIsConnectedToOrbitChain } from '../../../hooks/useIsConnectedToOrbitChain' | ||
| import { useIsConnectedToArbitrum } from '../../../hooks/useIsConnectedToArbitrum' | ||
|
|
||
| export function useTransferRequiresChainSwitch() { |
There was a problem hiding this comment.
what if this was a return value from useTransferReadiness?
There was a problem hiding this comment.
i deleted the hook and used a simple condition const isConnectedToTheWrongChain = chainId !== latestNetworks.current.sourceChain.id instead
also abstracted the relevant code from transferCctp and transfer into a reusable function
| selectedToken && warningTokens[selectedToken.address.toLowerCase()] | ||
| if (warningToken) { | ||
| const description = getWarningTokenDescription(warningToken.type) | ||
| warningToast( |
There was a problem hiding this comment.
I don't think we should be showing toasts from this method, it should only tell us if it's warning token or not.
if (isWarningToken()) {
showWarningTokenToast(warningToken: WarningToken) {
// here use warningToken.address and warningToken.type
}
}There was a problem hiding this comment.
With this we can just refactor this method to:
function isWarningToken(token: ERC20BridgeToken | null) {
if (!token) {
return false
}
return typeof warningTokens[token.address.toLowerCase()] !== 'undefined'
}There was a problem hiding this comment.
Also this could probably be a part of TokenUtils
There was a problem hiding this comment.
warningTokens is from useAppState() so unless further refactoring is done, it can't be moved out of a hook or component, so i wouldn't move it to the utils file
|
|
||
| async function isTransferAllowed(isCctp: boolean) { |
There was a problem hiding this comment.
Could just get isCctp directly instead of passing the prop
There was a problem hiding this comment.
Also this method uses a lot of hook values directly, are we sure we are not running into stale values or race conditions here?
| const hasBothSigners = parentSigner && childSigner | ||
| if (isEOA && !hasBothSigners) { | ||
| throw signerUndefinedError | ||
| if (isConnectedToTheWrongChain) { |
There was a problem hiding this comment.
I don't know about this entire code block, I'd expect isTransferAllowed to be pure. I'd have the network switching logic in its own method.
| isTeleportMode | ||
| }) | ||
| if (destinationAddressError) { | ||
| console.error(destinationAddressError) |
There was a problem hiding this comment.
I don't think this is needed, function like this shouldn't produce side effects like this imho
There was a problem hiding this comment.
We can just
return typeof destinationAddressError !== nullThere was a problem hiding this comment.
But also not sure if we need a helper, we could just use useState for this, and then we can use useMemo for isTransferAllowed
There was a problem hiding this comment.
i refactored the code for destination address error across files
| throw 'Signer is undefined' | ||
| const signer = sourceChainSigner | ||
|
|
||
| if (!(await isTransferAllowed(true))) { |
There was a problem hiding this comment.
this boolean prop is not very clear, but maybe it will be gone if we refactor the method, I don't think we need props here at all, this could probably be done with useMemo
|
no longer needed for reference |
Closes FS-744