forked from Uniswap/widgets
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat: permit2 and universal-router integration (Uniswap#321)
* build: bump to valid version of universal-router-sdk * fix: check for zero * refactor: look up pending approval by spender * fix: style nits * feat: add tooltip to ActionButton * fix: disable confirm button while pending * fix: improve onSubmit typing * fix: avoid setting controller when uncontrolled * feat: add token allowance callback * feat: permit2 logic * feat: universal-router logic * feat: integrate permit2 * chore: initial PR review * fix: do not err on unsupported chain * refactor: try-catch each swap action * refactor: use async-await for ur call
- Loading branch information
Showing
19 changed files
with
518 additions
and
82 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,97 @@ | ||
import { t, Trans } from '@lingui/macro' | ||
import { PERMIT2_ADDRESS } from '@uniswap/permit2-sdk' | ||
import ActionButton from 'components/ActionButton' | ||
import EtherscanLink from 'components/EtherscanLink' | ||
import { usePendingApproval } from 'hooks/transactions' | ||
import { PermitState } from 'hooks/usePermit2' | ||
import { Spinner } from 'icons' | ||
import { useCallback, useEffect, useMemo, useState } from 'react' | ||
import { InterfaceTrade } from 'state/routing/types' | ||
import { ApprovalTransactionInfo } from 'state/transactions' | ||
import { Colors } from 'theme' | ||
import { ExplorerDataType } from 'utils/getExplorerLink' | ||
|
||
/** | ||
* An approving PermitButton. | ||
* Should only be rendered if a valid trade exists that is not yet permitted. | ||
*/ | ||
export default function PermitButton({ | ||
color, | ||
trade, | ||
state, | ||
callback, | ||
onSubmit, | ||
}: { | ||
color: keyof Colors | ||
trade?: InterfaceTrade | ||
state: PermitState | ||
callback?: () => Promise<ApprovalTransactionInfo | void> | ||
onSubmit: (submit?: () => Promise<ApprovalTransactionInfo | void>) => Promise<void> | ||
}) { | ||
const currency = trade?.inputAmount?.currency | ||
const [isPending, setIsPending] = useState(false) | ||
const [isFailed, setIsFailed] = useState(false) | ||
useEffect(() => { | ||
// Reset pending/failed state if currency changes. | ||
setIsPending(false) | ||
setIsFailed(false) | ||
}, [currency]) | ||
|
||
const onClick = useCallback(async () => { | ||
setIsPending(true) | ||
try { | ||
await onSubmit(callback) | ||
setIsFailed(false) | ||
} catch (e) { | ||
console.error(e) | ||
setIsFailed(true) | ||
} finally { | ||
setIsPending(false) | ||
} | ||
}, [callback, onSubmit]) | ||
|
||
const pendingApproval = usePendingApproval(currency?.isToken ? currency : undefined, PERMIT2_ADDRESS) | ||
|
||
const actionProps = useMemo(() => { | ||
switch (state) { | ||
case PermitState.UNKNOWN: | ||
case PermitState.PERMITTED: | ||
return | ||
case PermitState.APPROVAL_NEEDED: | ||
case PermitState.PERMIT_NEEDED: | ||
} | ||
|
||
if (isPending) { | ||
return { | ||
icon: Spinner, | ||
message: t`Approve in your wallet`, | ||
} | ||
} else if (pendingApproval) { | ||
return { | ||
icon: Spinner, | ||
message: ( | ||
<EtherscanLink type={ExplorerDataType.TRANSACTION} data={pendingApproval}> | ||
<Trans>Approval pending</Trans> | ||
</EtherscanLink> | ||
), | ||
} | ||
} else if (isFailed) { | ||
return { | ||
message: t`Approval failed`, | ||
onClick, | ||
} | ||
} else { | ||
return { | ||
tooltip: t`Permission is required for Uniswap to swap each token. This will expire after one month for your security.`, | ||
message: `Approve use of ${currency?.symbol ?? 'token'}`, | ||
onClick, | ||
} | ||
} | ||
}, [currency?.symbol, isFailed, isPending, onClick, pendingApproval, state]) | ||
|
||
return ( | ||
<ActionButton color={color} disabled={!actionProps?.onClick} action={actionProps}> | ||
{isFailed ? t`Try again` : t`Approve`} | ||
</ActionButton> | ||
) | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.