allow sending txns via tenderly fork
This commit is contained in:
@@ -15,6 +15,7 @@
|
||||
"@testing-library/react": "^11.1.0",
|
||||
"@testing-library/user-event": "^12.1.10",
|
||||
"@walletconnect/client": "^1.6.2",
|
||||
"axios": "^0.24.0",
|
||||
"ethereum-checksum-address": "^0.0.6",
|
||||
"ethers": "^5.4.5",
|
||||
"framer-motion": "^4",
|
||||
|
||||
@@ -17,15 +17,28 @@ import {
|
||||
useToast,
|
||||
CircularProgress,
|
||||
Center,
|
||||
Spacer,
|
||||
Flex,
|
||||
useDisclosure,
|
||||
Popover,
|
||||
PopoverTrigger,
|
||||
PopoverContent,
|
||||
Tooltip,
|
||||
HStack,
|
||||
chakra,
|
||||
ListItem,
|
||||
} from "@chakra-ui/react";
|
||||
import { SettingsIcon, InfoIcon } from "@chakra-ui/icons";
|
||||
import WalletConnect from "@walletconnect/client";
|
||||
import { ethers } from "ethers";
|
||||
import axios from "axios";
|
||||
import networkInfo from "./networkInfo";
|
||||
|
||||
function Body() {
|
||||
const { colorMode } = useColorMode();
|
||||
const bgColor = { light: "white", dark: "gray.700" };
|
||||
const toast = useToast();
|
||||
const { onOpen, onClose, isOpen } = useDisclosure();
|
||||
|
||||
const [provider, setProvider] = useState();
|
||||
const [showAddress, setShowAddress] = useState(""); // gets displayed in input. ENS name remains as it is
|
||||
@@ -38,6 +51,8 @@ function Body() {
|
||||
const [isConnected, setIsConnected] = useState(false);
|
||||
const [loading, setLoading] = useState(false);
|
||||
|
||||
const [tenderlyForkId, setTenderlyForkId] = useState("");
|
||||
|
||||
useEffect(() => {
|
||||
const session = getCachedSession();
|
||||
if (session) {
|
||||
@@ -78,6 +93,15 @@ function Body() {
|
||||
// eslint-disable-next-line
|
||||
}, [connector]);
|
||||
|
||||
useEffect(() => {
|
||||
const storedTenderlyForkId = localStorage.getItem("tenderlyForkId");
|
||||
setTenderlyForkId(storedTenderlyForkId ? storedTenderlyForkId : "");
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
localStorage.setItem("tenderlyForkId", tenderlyForkId);
|
||||
}, [tenderlyForkId]);
|
||||
|
||||
const resolveAndValidateAddress = async () => {
|
||||
let isValid;
|
||||
let _address = address;
|
||||
@@ -187,8 +211,38 @@ function Body() {
|
||||
});
|
||||
|
||||
connector.on("call_request", async (error, payload) => {
|
||||
console.log("EVENT", "call_request", "method", payload.method);
|
||||
console.log("EVENT", "call_request", "params", payload.params);
|
||||
console.log({ payload });
|
||||
|
||||
if (
|
||||
payload.method === "eth_sendTransaction" &&
|
||||
tenderlyForkId.length > 0
|
||||
) {
|
||||
const { data: res } = await axios.post(
|
||||
"https://rpc.tenderly.co/fork/" + tenderlyForkId,
|
||||
{
|
||||
jsonrpc: "2.0",
|
||||
id: payload.id,
|
||||
method: payload.method,
|
||||
params: payload.params,
|
||||
}
|
||||
);
|
||||
console.log({ res });
|
||||
|
||||
// Approve Call Request
|
||||
connector.approveRequest({
|
||||
id: res.id,
|
||||
result: res.result,
|
||||
});
|
||||
|
||||
toast({
|
||||
title: "Txn successful",
|
||||
description: `Hash: ${res.result}`,
|
||||
status: "success",
|
||||
position: "bottom-right",
|
||||
duration: null,
|
||||
isClosable: true,
|
||||
});
|
||||
}
|
||||
|
||||
// if (error) {
|
||||
// throw error;
|
||||
@@ -281,6 +335,63 @@ function Body() {
|
||||
|
||||
return (
|
||||
<Container my="16" minW={["0", "0", "2xl", "2xl"]}>
|
||||
<Flex>
|
||||
<Spacer flex="1" />
|
||||
<Popover
|
||||
placement="bottom-start"
|
||||
isOpen={isOpen}
|
||||
onOpen={onOpen}
|
||||
onClose={onClose}
|
||||
>
|
||||
<PopoverTrigger>
|
||||
<Box>
|
||||
<Button>
|
||||
<SettingsIcon
|
||||
transition="900ms rotate ease-in-out"
|
||||
transform={isOpen ? "rotate(33deg)" : "rotate(0deg)"}
|
||||
/>
|
||||
</Button>
|
||||
</Box>
|
||||
</PopoverTrigger>
|
||||
<PopoverContent
|
||||
border={0}
|
||||
boxShadow="xl"
|
||||
rounded="xl"
|
||||
overflowY="auto"
|
||||
>
|
||||
<Box px="1rem" py="1rem">
|
||||
<HStack>
|
||||
<Text>(optional) Tenderly Fork Id:</Text>
|
||||
<Tooltip
|
||||
label={
|
||||
<>
|
||||
<Text>Simulate sending transactions on forked node.</Text>
|
||||
<chakra.hr bg="gray.400" />
|
||||
<ListItem>
|
||||
Create a fork on Tenderly and grab the id from it's URL.
|
||||
</ListItem>
|
||||
</>
|
||||
}
|
||||
hasArrow
|
||||
placement="top"
|
||||
>
|
||||
<InfoIcon />
|
||||
</Tooltip>
|
||||
</HStack>
|
||||
<Input
|
||||
mt="0.5rem"
|
||||
aria-label="fork-rpc"
|
||||
placeholder="xxxx-xxxx-xxxx-xxxx"
|
||||
autoComplete="off"
|
||||
value={tenderlyForkId}
|
||||
onChange={(e) => {
|
||||
setTenderlyForkId(e.target.value);
|
||||
}}
|
||||
/>
|
||||
</Box>
|
||||
</PopoverContent>
|
||||
</Popover>
|
||||
</Flex>
|
||||
<FormControl>
|
||||
<FormLabel>Enter Address or ENS to Impersonate</FormLabel>
|
||||
<InputGroup>
|
||||
@@ -308,7 +419,26 @@ function Body() {
|
||||
</InputGroup>
|
||||
</FormControl>
|
||||
<FormControl my={4}>
|
||||
<FormLabel>WalletConnect URI</FormLabel>
|
||||
<HStack>
|
||||
<FormLabel>WalletConnect URI</FormLabel>
|
||||
<Tooltip
|
||||
label={
|
||||
<>
|
||||
<Text>Visit any DApp and select WalletConnect.</Text>
|
||||
<Text>
|
||||
Click "Copy to Clipboard" beneath the QR code, and paste it
|
||||
here.
|
||||
</Text>
|
||||
</>
|
||||
}
|
||||
hasArrow
|
||||
placement="top"
|
||||
>
|
||||
<Box pb="0.8rem">
|
||||
<InfoIcon />
|
||||
</Box>
|
||||
</Tooltip>
|
||||
</HStack>
|
||||
<Input
|
||||
placeholder="wc:xyz123"
|
||||
aria-label="uri"
|
||||
|
||||
12
yarn.lock
12
yarn.lock
@@ -3738,6 +3738,13 @@ axe-core@^4.0.2:
|
||||
resolved "https://registry.yarnpkg.com/axe-core/-/axe-core-4.1.2.tgz#7cf783331320098bfbef620df3b3c770147bc224"
|
||||
integrity sha512-V+Nq70NxKhYt89ArVcaNL9FDryB3vQOd+BFXZIfO3RP6rwtj+2yqqqdHEkacutglPaZLkJeuXKCjCJDMGPtPqg==
|
||||
|
||||
axios@^0.24.0:
|
||||
version "0.24.0"
|
||||
resolved "https://registry.yarnpkg.com/axios/-/axios-0.24.0.tgz#804e6fa1e4b9c5288501dd9dff56a7a0940d20d6"
|
||||
integrity sha512-Q6cWsys88HoPgAaFAVUb0WpPk0O8iTeisR9IMqy9G8AbO4NlpVknrnQS03zzF9PGAWgO3cgletO3VjV/P7VztA==
|
||||
dependencies:
|
||||
follow-redirects "^1.14.4"
|
||||
|
||||
axobject-query@^2.2.0:
|
||||
version "2.2.0"
|
||||
resolved "https://registry.yarnpkg.com/axobject-query/-/axobject-query-2.2.0.tgz#943d47e10c0b704aa42275e20edf3722648989be"
|
||||
@@ -6389,6 +6396,11 @@ follow-redirects@^1.0.0:
|
||||
resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.13.2.tgz#dd73c8effc12728ba5cf4259d760ea5fb83e3147"
|
||||
integrity sha512-6mPTgLxYm3r6Bkkg0vNM0HTjfGrOEtsfbhagQvbxDEsEkpNhw582upBaoRZylzen6krEmxXJgt9Ju6HiI4O7BA==
|
||||
|
||||
follow-redirects@^1.14.4:
|
||||
version "1.14.7"
|
||||
resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.14.7.tgz#2004c02eb9436eee9a21446a6477debf17e81685"
|
||||
integrity sha512-+hbxoLbFMbRKDwohX8GkTataGqO6Jb7jGwpAlwgy2bIz25XtRm7KEzJM76R1WiNT5SwZkX4Y75SwBolkpmE7iQ==
|
||||
|
||||
for-in@^1.0.2:
|
||||
version "1.0.2"
|
||||
resolved "https://registry.yarnpkg.com/for-in/-/for-in-1.0.2.tgz#81068d295a8142ec0ac726c6e2200c30fb6d5e80"
|
||||
|
||||
Reference in New Issue
Block a user