From c37f05bd643c27995a0a4dec48a3831297a7458e Mon Sep 17 00:00:00 2001 From: "Justin R. Evans" <330911+jurevans@users.noreply.github.com> Date: Tue, 18 Jul 2023 10:49:50 -0400 Subject: [PATCH] feat/335 - Approve Bond Tx, Sign bond with Ledger (#336) * Hook up bond approval and Ledger signing * Clean up, fix naming * Add query for public_key * Hooking up Reveal PK tx to extension * Put public_key into explicit schema type * Fix schema order * Refactor submit calls to include signing * Fix error on submit public key reveal, clean up logs * Begin hooking up staking update events * Fix issue with Reveal PK tx --- apps/extension/package.json | 2 +- .../src/Approvals/Approvals.components.tsx | 44 +- apps/extension/src/Approvals/Approvals.tsx | 32 +- .../src/Approvals/ApproveBond/ApproveBond.tsx | 94 ++ .../src/Approvals/ApproveBond/ConfirmBond.tsx | 104 ++ .../ApproveBond/ConfirmLedgerBond.tsx | 192 +++ .../src/Approvals/ApproveBond/index.ts | 3 + .../ApproveConnection.components.tsx | 6 - .../ApproveTransfer.components.ts | 6 - .../ApproveTransfer/ApproveTransfer.tsx | 8 +- .../ApproveTransfer/ConfirmLedgerTransfer.tsx | 12 +- .../ConfirmTransfer.components.ts | 43 - .../ApproveTransfer/ConfirmTransfer.tsx | 7 +- .../src/Approvals/ApproveTransfer/index.ts | 1 + apps/extension/src/Approvals/types.ts | 15 +- .../src/background/approvals/handler.ts | 75 +- .../src/background/approvals/init.ts | 14 +- .../src/background/approvals/messages.ts | 82 +- .../src/background/approvals/service.ts | 121 +- apps/extension/src/background/index.ts | 3 +- .../src/background/keyring/handler.ts | 36 +- apps/extension/src/background/keyring/init.ts | 6 +- .../src/background/keyring/messages.ts | 27 +- .../src/background/keyring/service.ts | 12 +- .../src/background/ledger/handler.ts | 63 +- apps/extension/src/background/ledger/init.ts | 10 + .../extension/src/background/ledger/ledger.ts | 4 +- .../src/background/ledger/messages.ts | 179 ++- .../src/background/ledger/service.ts | 226 ++- apps/extension/src/content/events.ts | 28 + apps/extension/src/provider/Anoma.ts | 17 +- apps/extension/src/provider/InjectedAnoma.ts | 16 +- apps/extension/src/provider/Signer.ts | 27 +- apps/extension/src/provider/messages.ts | 46 +- apps/extension/src/test/init.ts | 3 +- .../NewBondingPosition/NewBondingPosition.tsx | 7 +- .../extensionEvents/handlers/anoma.ts | 6 + .../src/services/extensionEvents/provider.tsx | 3 + .../slices/StakingAndGovernance/actions.ts | 38 +- packages/ledger-namada/LICENSE | 201 +++ packages/ledger-namada/README.md | 12 + packages/ledger-namada/dist/common.d.ts | 90 ++ packages/ledger-namada/dist/common.js | 158 ++ packages/ledger-namada/dist/common.js.map | 1 + packages/ledger-namada/dist/config.d.ts | 30 + packages/ledger-namada/dist/config.js | 34 + packages/ledger-namada/dist/config.js.map | 1 + packages/ledger-namada/dist/index.d.ts | 16 + packages/ledger-namada/dist/index.js | 33 + packages/ledger-namada/dist/index.js.map | 1 + packages/ledger-namada/dist/namadaApp.d.ts | 34 + packages/ledger-namada/dist/namadaApp.js | 194 +++ packages/ledger-namada/dist/namadaApp.js.map | 1 + .../ledger-namada/dist/processResponses.d.ts | 24 + .../ledger-namada/dist/processResponses.js | 133 ++ .../dist/processResponses.js.map | 1 + packages/ledger-namada/dist/types.d.ts | 68 + packages/ledger-namada/dist/types.js | 25 + packages/ledger-namada/dist/types.js.map | 1 + packages/ledger-namada/package.json | 78 + packages/shared/lib/src/query.rs | 24 +- packages/shared/lib/src/sdk/mod.rs | 165 +- packages/shared/lib/src/sdk/tx.rs | 29 + packages/shared/src/index.ts | 24 +- packages/types/src/anoma.ts | 6 +- packages/types/src/events.ts | 1 + packages/types/src/signer.ts | 6 +- packages/types/src/tx/schema/bond.ts | 15 +- packages/types/src/tx/schema/index.ts | 1 + packages/types/src/tx/schema/revealPK.ts | 38 + packages/types/src/tx/schema/tx.ts | 5 + packages/types/src/tx/schema/unbond.ts | 8 +- packages/types/src/tx/types.ts | 5 + yarn.lock | 1345 ++++++++++++++++- 74 files changed, 4138 insertions(+), 288 deletions(-) create mode 100644 apps/extension/src/Approvals/ApproveBond/ApproveBond.tsx create mode 100644 apps/extension/src/Approvals/ApproveBond/ConfirmBond.tsx create mode 100644 apps/extension/src/Approvals/ApproveBond/ConfirmLedgerBond.tsx create mode 100644 apps/extension/src/Approvals/ApproveBond/index.ts delete mode 100644 apps/extension/src/Approvals/ApproveConnection/ApproveConnection.components.tsx delete mode 100644 apps/extension/src/Approvals/ApproveTransfer/ApproveTransfer.components.ts delete mode 100644 apps/extension/src/Approvals/ApproveTransfer/ConfirmTransfer.components.ts create mode 100644 packages/ledger-namada/LICENSE create mode 100644 packages/ledger-namada/README.md create mode 100644 packages/ledger-namada/dist/common.d.ts create mode 100644 packages/ledger-namada/dist/common.js create mode 100644 packages/ledger-namada/dist/common.js.map create mode 100644 packages/ledger-namada/dist/config.d.ts create mode 100644 packages/ledger-namada/dist/config.js create mode 100644 packages/ledger-namada/dist/config.js.map create mode 100644 packages/ledger-namada/dist/index.d.ts create mode 100644 packages/ledger-namada/dist/index.js create mode 100644 packages/ledger-namada/dist/index.js.map create mode 100644 packages/ledger-namada/dist/namadaApp.d.ts create mode 100644 packages/ledger-namada/dist/namadaApp.js create mode 100644 packages/ledger-namada/dist/namadaApp.js.map create mode 100644 packages/ledger-namada/dist/processResponses.d.ts create mode 100644 packages/ledger-namada/dist/processResponses.js create mode 100644 packages/ledger-namada/dist/processResponses.js.map create mode 100644 packages/ledger-namada/dist/types.d.ts create mode 100644 packages/ledger-namada/dist/types.js create mode 100644 packages/ledger-namada/dist/types.js.map create mode 100644 packages/ledger-namada/package.json create mode 100644 packages/types/src/tx/schema/revealPK.ts diff --git a/apps/extension/package.json b/apps/extension/package.json index 4528531219..0df2f637aa 100644 --- a/apps/extension/package.json +++ b/apps/extension/package.json @@ -33,11 +33,11 @@ "@anoma/storage": "0.1.0", "@anoma/types": "0.1.0", "@anoma/utils": "0.1.0", + "@anoma/ledger-namada": "0.0.1", "@cosmjs/encoding": "^0.29.0", "@ledgerhq/hw-transport": "^6.28.3", "@ledgerhq/hw-transport-webhid": "^6.27.14", "@ledgerhq/hw-transport-webusb": "^6.27.14", - "@zondax/ledger-namada": "^0.0.2", "bignumber.js": "^9.1.1", "borsh": "^0.7.0", "buffer": "^6.0.3", diff --git a/apps/extension/src/Approvals/Approvals.components.tsx b/apps/extension/src/Approvals/Approvals.components.tsx index 84940937ab..89c38be9a6 100644 --- a/apps/extension/src/Approvals/Approvals.components.tsx +++ b/apps/extension/src/Approvals/Approvals.components.tsx @@ -1,4 +1,4 @@ -import styled, { createGlobalStyle } from "styled-components"; +import styled, { createGlobalStyle, css } from "styled-components"; export const GlobalStyles = createGlobalStyle` html, body { @@ -93,3 +93,45 @@ export const ButtonContainer = styled.div` display: flex; flex-direction: row; `; + +export const Spinner = css` + content: ""; + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + border-top-color: ${(props) => props.theme.colors.primary.main}; + border-radius: 50%; + animation: button-loading-spinner 1s ease infinite; + + @keyframes button-loading-spinner { + from { + transform: rotate(0turn); + } + + to { + transform: rotate(1turn); + } + } + } +`; + +export const InfoHeader = styled.div` + display: flex; + align-items: center; + gap: 10px; +`; + +export const InfoLoader = styled.div` + position: relative; + width: 20px; + height: 20px; + + &::after { + width: 16px; + height: 16px; + border: 2px solid transparent; + ${Spinner} + } +`; diff --git a/apps/extension/src/Approvals/Approvals.tsx b/apps/extension/src/Approvals/Approvals.tsx index b7db641a81..e972c9c7f4 100644 --- a/apps/extension/src/Approvals/Approvals.tsx +++ b/apps/extension/src/Approvals/Approvals.tsx @@ -15,6 +15,7 @@ import { ApproveTransfer, ConfirmTransfer } from "./ApproveTransfer"; import { ApproveConnection } from "./ApproveConnection"; import { TopLevelRoute } from "Approvals/types"; import { ConfirmLedgerTransfer } from "./ApproveTransfer/ConfirmLedgerTransfer"; +import { ApproveBond, ConfirmBond, ConfirmLedgerBond } from "./ApproveBond"; export enum Status { Completed, @@ -26,6 +27,7 @@ export const Approvals: React.FC = () => { const theme = getTheme("dark"); const [msgId, setMsgId] = useState(""); const [address, setAddress] = useState(""); + const [publicKey, setPublicKey] = useState(""); return ( @@ -37,19 +39,43 @@ export const Approvals: React.FC = () => { } /> } /> } /> + + } + /> + } + /> + + } + /> void; + setMsgId: (msgId: string) => void; + setPublicKey: (publicKey: string) => void; +}; + +export const ApproveBond: React.FC = ({ + setAddress, + setMsgId, + setPublicKey, +}) => { + const navigate = useNavigate(); + const requester = useRequester(); + + const query = useQuery(); + const type = query.get("type") || ""; + const id = query.get("id") || ""; + const amount = query.get("amount") || ""; + const source = query.get("source") || ""; + const tokenAddress = query.get("token") || ""; + const tokenType = + Object.values(Tokens).find((token) => token.address === tokenAddress) + ?.symbol || ""; + const publicKey = query.get("publicKey") || ""; + + useEffect(() => { + if (source) { + setAddress(source); + } + if (publicKey) { + setPublicKey(publicKey); + } + }, [source]); + + const handleApproveClick = (): void => { + setMsgId(id); + if (type === AccountType.Ledger) { + return navigate(`${TopLevelRoute.ConfirmLedgerBond}`); + } + navigate(TopLevelRoute.ConfirmBond); + }; + + const handleReject = async (): Promise => { + try { + // TODO: use executeUntil here! + await requester.sendMessage(Ports.Background, new RejectTxMsg(id)); + + // Close tab + await closeCurrentTab(); + } catch (e) { + console.warn(e); + } + return; + }; + + return ( + +

Approve this Bond?

+

Source: 

+
{shortenAddress(source)}
+

+ Amount: {amount} {tokenType} +

+ + + + + + + ); +}; diff --git a/apps/extension/src/Approvals/ApproveBond/ConfirmBond.tsx b/apps/extension/src/Approvals/ApproveBond/ConfirmBond.tsx new file mode 100644 index 0000000000..10dff9e997 --- /dev/null +++ b/apps/extension/src/Approvals/ApproveBond/ConfirmBond.tsx @@ -0,0 +1,104 @@ +import { useEffect, useState } from "react"; +import { useNavigate } from "react-router-dom"; + +import { Button, ButtonVariant, Input, InputVariants } from "@anoma/components"; +import { shortenAddress } from "@anoma/utils"; + +import { Status } from "Approvals/Approvals"; +import { + ApprovalContainer, + ButtonContainer, + InfoHeader, + InfoLoader, +} from "Approvals/Approvals.components"; +import { Ports } from "router"; +import { useRequester } from "hooks/useRequester"; +import { SubmitApprovedBondMsg } from "background/approvals"; +import { Address } from "App/Accounts/AccountListing.components"; +import { closeCurrentTab } from "utils"; + +type Props = { + msgId: string; + address: string; +}; + +export const ConfirmBond: React.FC = ({ msgId, address }) => { + const navigate = useNavigate(); + const requester = useRequester(); + const [password, setPassword] = useState(""); + const [error, setError] = useState(); + const [status, setStatus] = useState(); + const [statusInfo, setStatusInfo] = useState(""); + + const handleApproveBond = async (): Promise => { + setStatus(Status.Pending); + try { + // TODO: use executeUntil here! + setStatusInfo("Decrypting keys and submitting transfer..."); + await requester.sendMessage( + Ports.Background, + new SubmitApprovedBondMsg(msgId, address, password) + ); + setStatus(Status.Completed); + } catch (e) { + setError("Unable to authenticate Tx!"); + setStatus(Status.Failed); + } + setStatusInfo(""); + setStatus(Status.Completed); + return; + }; + + useEffect(() => { + (async () => { + if (status === Status.Completed) { + await closeCurrentTab(); + } + })(); + }, [status]); + + return ( + + {status === Status.Pending && ( + + +

{statusInfo}

+ + )} + {status === Status.Failed && ( +

+ {error} +
+ Try again +

+ )} + {status !== (Status.Pending || Status.Completed) && ( + <> +
+ Decrypt keys for
{shortenAddress(address)}
+
+ setPassword(e.target.value)} + /> + + + + + + )} + + ); +}; diff --git a/apps/extension/src/Approvals/ApproveBond/ConfirmLedgerBond.tsx b/apps/extension/src/Approvals/ApproveBond/ConfirmLedgerBond.tsx new file mode 100644 index 0000000000..0aea99a6b9 --- /dev/null +++ b/apps/extension/src/Approvals/ApproveBond/ConfirmLedgerBond.tsx @@ -0,0 +1,192 @@ +import { useCallback, useState } from "react"; +import { toBase64 } from "@cosmjs/encoding"; +import BigNumber from "bignumber.js"; + +import { LedgerError } from "@anoma/ledger-namada"; +import { Button, ButtonVariant } from "@anoma/components"; +import { defaultChainId as chainId } from "@anoma/chains"; + +import { Ledger } from "background/ledger"; +import { + GetBondBytesMsg, + GetRevealPKBytesMsg, + SubmitSignedBondMsg, + SubmitSignedRevealPKMsg, +} from "background/ledger/messages"; +import { Ports } from "router"; +import { closeCurrentTab } from "utils"; +import { useRequester } from "hooks/useRequester"; +import { Status } from "Approvals/Approvals"; +import { + ApprovalContainer, + ButtonContainer, +} from "Approvals/Approvals.components"; +import { InfoHeader, InfoLoader } from "Approvals/Approvals.components"; +import { Message, RevealPKProps, Tokens } from "@anoma/types"; +import { SubmitRevealPKMsgSchema, RevealPKMsgValue } from "@anoma/types"; +import { QueryPublicKeyMsg } from "background/keyring"; + +type Props = { + address: string; + msgId: string; + publicKey: string; +}; + +export const ConfirmLedgerBond: React.FC = ({ + address, + msgId, + publicKey, +}) => { + const requester = useRequester(); + const [error, setError] = useState(); + const [status, setStatus] = useState(); + const [statusInfo, setStatusInfo] = useState(""); + + const revealPk = async (publicKey: string): Promise => { + const revealPKArgs: RevealPKProps = { + tx: { + token: Tokens.NAM.address || "", + feeAmount: new BigNumber(0), + gasLimit: new BigNumber(0), + chainId, + publicKey, + }, + publicKey, + }; + + const revealTxValue = new RevealPKMsgValue(revealPKArgs); + const txMsg = new Message(); + const serializedTx = txMsg.encode(SubmitRevealPKMsgSchema, revealTxValue); + + // Open Ledger transport + const ledger = await Ledger.init(); + + try { + const { bytes, path } = await requester.sendMessage( + Ports.Background, + new GetRevealPKBytesMsg(toBase64(serializedTx)) + ); + + // Sign with Ledgeg + const signatures = await ledger.sign(bytes, path); + + // Submit signatures for tx + setStatusInfo("Submitting reveal pk tx..."); + await requester.sendMessage( + Ports.Background, + new SubmitSignedRevealPKMsg( + toBase64(serializedTx), + toBase64(bytes), + signatures + ) + ); + } catch (e) { + console.warn("An error occured: ", e); + throw new Error(`${e}`); + } finally { + await ledger.closeTransport(); + } + }; + + const queryPublicKey = async ( + address: string + ): Promise => { + return await requester.sendMessage( + Ports.Background, + new QueryPublicKeyMsg(address) + ); + }; + + const submitBond = async (): Promise => { + setStatus(Status.Pending); + setStatusInfo("Querying for public key on chain..."); + + const pk = await queryPublicKey(address); + + if (!pk) { + setStatusInfo( + "Public key not found! Review and approve reveal pk on your Ledger" + ); + await revealPk(publicKey); + } + + // Open ledger transport + const ledger = await Ledger.init(); + + try { + // Constuct tx bytes from SDK + const { bytes, path } = await requester.sendMessage( + Ports.Background, + new GetBondBytesMsg(msgId) + ); + + setStatusInfo("Review and approve bond transaction on your Ledger"); + // Sign with Ledger + const signatures = await ledger.sign(bytes, path); + const { errorMessage, returnCode } = signatures; + + if (returnCode !== LedgerError.NoErrors) { + console.warn("Bond sign errors encountered, exiting: ", { + returnCode, + errorMessage, + }); + setError(errorMessage); + return setStatus(Status.Failed); + } + + // Submit signatures for tx + setStatusInfo("Submitting bond transaction..."); + await requester.sendMessage( + Ports.Background, + new SubmitSignedBondMsg(msgId, toBase64(bytes), signatures) + ); + setStatus(Status.Completed); + } catch (e) { + console.warn(e); + setStatus(Status.Failed); + await ledger.closeTransport(); + } + }; + + const handleCloseTab = useCallback(async (): Promise => { + await closeCurrentTab(); + }, []); + + return ( + + {status === Status.Failed && ( +

+ {error} +
+ Try again +

+ )} + {status === Status.Pending && ( + + + {statusInfo} + + )} + {status !== Status.Pending && status !== Status.Completed && ( + <> +

Make sure your Ledger is unlocked, and click "Submit"

+ + + + + )} + {status === Status.Completed && ( + <> +

Success! You may close this window.

+ + + + + )} + + ); +}; diff --git a/apps/extension/src/Approvals/ApproveBond/index.ts b/apps/extension/src/Approvals/ApproveBond/index.ts new file mode 100644 index 0000000000..e25c4c1552 --- /dev/null +++ b/apps/extension/src/Approvals/ApproveBond/index.ts @@ -0,0 +1,3 @@ +export * from "./ApproveBond"; +export * from "./ConfirmBond"; +export * from "./ConfirmLedgerBond"; diff --git a/apps/extension/src/Approvals/ApproveConnection/ApproveConnection.components.tsx b/apps/extension/src/Approvals/ApproveConnection/ApproveConnection.components.tsx deleted file mode 100644 index 08cf720e5d..0000000000 --- a/apps/extension/src/Approvals/ApproveConnection/ApproveConnection.components.tsx +++ /dev/null @@ -1,6 +0,0 @@ -import styled from "styled-components"; - -export const ApproveConnectionContainer = styled.div` - display: flex; - flex-direction: column; -`; diff --git a/apps/extension/src/Approvals/ApproveTransfer/ApproveTransfer.components.ts b/apps/extension/src/Approvals/ApproveTransfer/ApproveTransfer.components.ts deleted file mode 100644 index 4b17bbbe0e..0000000000 --- a/apps/extension/src/Approvals/ApproveTransfer/ApproveTransfer.components.ts +++ /dev/null @@ -1,6 +0,0 @@ -import styled from "styled-components"; - -export const ApproveTxContainer = styled.div` - display: flex; - flex-direction: column; -`; diff --git a/apps/extension/src/Approvals/ApproveTransfer/ApproveTransfer.tsx b/apps/extension/src/Approvals/ApproveTransfer/ApproveTransfer.tsx index a996cedbd9..1390d7a6c8 100644 --- a/apps/extension/src/Approvals/ApproveTransfer/ApproveTransfer.tsx +++ b/apps/extension/src/Approvals/ApproveTransfer/ApproveTransfer.tsx @@ -13,7 +13,7 @@ import { } from "Approvals/Approvals.components"; import { TopLevelRoute } from "Approvals/types"; import { Ports } from "router"; -import { RejectTransferMsg } from "background/approvals"; +import { RejectTxMsg } from "background/approvals"; import { useRequester } from "hooks/useRequester"; import { closeCurrentTab } from "utils"; @@ -47,15 +47,15 @@ export const ApproveTransfer: React.FC = ({ setAddress, setMsgId }) => { const handleApproveClick = (): void => { setMsgId(id); if (type === AccountType.Ledger) { - return navigate(`${TopLevelRoute.ConfirmLedgerTx}`); + return navigate(`${TopLevelRoute.ConfirmLedgerTransfer}`); } - navigate(TopLevelRoute.ConfirmTx); + navigate(TopLevelRoute.ConfirmTransfer); }; const handleReject = async (): Promise => { try { // TODO: use executeUntil here! - await requester.sendMessage(Ports.Background, new RejectTransferMsg(id)); + await requester.sendMessage(Ports.Background, new RejectTxMsg(id)); // Close tab await closeCurrentTab(); diff --git a/apps/extension/src/Approvals/ApproveTransfer/ConfirmLedgerTransfer.tsx b/apps/extension/src/Approvals/ApproveTransfer/ConfirmLedgerTransfer.tsx index e68dcd451e..09e77d9835 100644 --- a/apps/extension/src/Approvals/ApproveTransfer/ConfirmLedgerTransfer.tsx +++ b/apps/extension/src/Approvals/ApproveTransfer/ConfirmLedgerTransfer.tsx @@ -1,5 +1,5 @@ import { useCallback, useState } from "react"; -import { LedgerError } from "@zondax/ledger-namada"; +import { LedgerError } from "@anoma/ledger-namada"; import { toBase64 } from "@cosmjs/encoding"; import { Button, ButtonVariant } from "@anoma/components"; @@ -38,9 +38,6 @@ export const ConfirmLedgerTransfer: React.FC = ({ msgId }) => { new GetTransferBytesMsg(msgId) ); - // Retrieve publicKey from Ledger - const { publicKey } = await ledger.getAddressAndPublicKey(path); - // Sign with Ledger const signatures = await ledger.sign(bytes, path); const { errorMessage, returnCode } = signatures; @@ -56,12 +53,7 @@ export const ConfirmLedgerTransfer: React.FC = ({ msgId }) => { // Submit signatures for tx await requester.sendMessage( Ports.Background, - new SubmitSignedTransferMsg( - msgId, - toBase64(bytes), - signatures, - publicKey - ) + new SubmitSignedTransferMsg(msgId, toBase64(bytes), signatures) ); setStatus(Status.Completed); } catch (e) { diff --git a/apps/extension/src/Approvals/ApproveTransfer/ConfirmTransfer.components.ts b/apps/extension/src/Approvals/ApproveTransfer/ConfirmTransfer.components.ts deleted file mode 100644 index 9e5a44b80f..0000000000 --- a/apps/extension/src/Approvals/ApproveTransfer/ConfirmTransfer.components.ts +++ /dev/null @@ -1,43 +0,0 @@ -import styled, { css } from "styled-components"; - -export const Spinner = css` - content: ""; - position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 0; - border-top-color: ${(props) => props.theme.colors.primary.main}; - border-radius: 50%; - animation: button-loading-spinner 1s ease infinite; - - @keyframes button-loading-spinner { - from { - transform: rotate(0turn); - } - - to { - transform: rotate(1turn); - } - } - } -`; - -export const InfoHeader = styled.div` - display: flex; - align-items: center; - gap: 10px; -`; - -export const InfoLoader = styled.div` - position: relative; - width: 20px; - height: 20px; - - &::after { - width: 16px; - height: 16px; - border: 2px solid transparent; - ${Spinner} - } -`; diff --git a/apps/extension/src/Approvals/ApproveTransfer/ConfirmTransfer.tsx b/apps/extension/src/Approvals/ApproveTransfer/ConfirmTransfer.tsx index 49d39dc121..8722140886 100644 --- a/apps/extension/src/Approvals/ApproveTransfer/ConfirmTransfer.tsx +++ b/apps/extension/src/Approvals/ApproveTransfer/ConfirmTransfer.tsx @@ -8,6 +8,8 @@ import { Status } from "Approvals/Approvals"; import { ApprovalContainer, ButtonContainer, + InfoHeader, + InfoLoader, } from "Approvals/Approvals.components"; import { Ports } from "router"; import { useRequester } from "hooks/useRequester"; @@ -15,7 +17,6 @@ import { SubmitApprovedTransferMsg } from "background/approvals"; import { Address } from "App/Accounts/AccountListing.components"; import { closeCurrentTab } from "utils"; import { FetchAndStoreMaspParamsMsg, HasMaspParamsMsg } from "provider"; -import { InfoHeader, InfoLoader } from "./ConfirmTransfer.components"; type Props = { msgId: string; @@ -30,7 +31,7 @@ export const ConfirmTransfer: React.FC = ({ msgId, address }) => { const [status, setStatus] = useState(); const [statusInfo, setStatusInfo] = useState(""); - const handleApprove = async (): Promise => { + const handleApproveTransfer = async (): Promise => { setStatus(Status.Pending); const hasMaspParams = await requester.sendMessage( Ports.Background, @@ -101,7 +102,7 @@ export const ConfirmTransfer: React.FC = ({ msgId, address }) => { />