Merge pull request #68 from kateberryd/buner_wallet_fix

Fix issues with sending ETH/STRK using Burner wallet
horuslabsio · May 4, 2024 · 8d0dd0c · 8d0dd0c
2 parents bfec0b6 + 806fbc9
commit 8d0dd0c
Show file tree

Hide file tree

Showing 4 changed files with 33 additions and 34 deletions.
diff --git a/frontend/src/app/components/AssetTransferModal.tsx b/frontend/src/app/components/AssetTransferModal.tsx
@@ -55,19 +55,17 @@ function AssetTransferModal({
  }
 
  const provider = new RpcProvider({
- nodeUrl:
- "https://starknet-sepolia.public.blastapi.io",
+ nodeUrl: "https://starknet-sepolia.public.blastapi.io",
  });
 
  let starknet_contract: any;
- if(activeToken == "strk") {
+ if (activeToken == "strk") {
  starknet_contract = new Contract(
  abi,
  "0x04718f5a0fc34cc1af16a1cdee98ffb20c31f5cd61d6ab07201858f4287c938d",
  provider
  );
- }
- else{
+ } else {
  starknet_contract = new Contract(
  abi,
  "0x049d36570d4e46f48e99674bd3fcc84644ddd6b96f7c741b1562b82f9e004dc7",
@@ -80,12 +78,13 @@ function AssetTransferModal({
  if (!walletAddress.length && !amount) {
  return;
  }
+ starknet_contract.connect(account);
  const toTransferTk: Uint256 = cairo.uint256(Number(amount) * 1e18);
  const transferCall: Call = starknet_contract.populate("transfer", {
  recipient: walletAddress,
  amount: toTransferTk,
  });
- const { transaction_hash: transferTxHash } = await account.execute(transferCall);
+ const { transaction_hash: transferTxHash, } = await starknet_contract.transfer(transferCall.calldata);
  await provider.waitForTransaction(transferTxHash);
  window.alert("Your transfer was successful!");
  } catch (err: any) {

diff --git a/frontend/src/app/components/Burner/Burner.tsx b/frontend/src/app/components/Burner/Burner.tsx
@@ -62,21 +62,22 @@ const Burners: React.FC = () => {
 
  useEffect(() => {
  const loadedWallets = localStorage.getItem("wallets");
- if (loadedWallets) {
+ if (loadedWallets && loadedWallets.length > 0) {
  setWallets(JSON.parse(loadedWallets));
  }
  }, []);
 
  useEffect(() => {
- localStorage.setItem("wallets", JSON.stringify(wallets));
+ if (wallets.length > 0) {
+ localStorage.setItem("wallets", JSON.stringify(wallets));
+ }
  }, [wallets]);
 
  const handleCreate = async () => {
  if (wallets.length < 5) {
  if (burnerWalletDeployer) {
  const newWallet = await generateWallet(burnerWalletDeployer);
  setWallets([...wallets, newWallet]);
- console.log(newWallet);
  } else {
  console.error("Burner wallet deployer is undefined.");
  }

diff --git a/frontend/src/app/components/BurnerWallet/BurnerWallet.tsx b/frontend/src/app/components/BurnerWallet/BurnerWallet.tsx
@@ -3,11 +3,12 @@ import { useState } from "react";
 import { createPortal } from "react-dom";
 import AssetTransferModal from "../AssetTransferModal";
 import ConnectionModal from "../ConnectionModal";
-import {useContractRead} from "@starknet-react/core";
+import { useContractRead } from "@starknet-react/core";
 import { Account, RpcProvider } from "starknet";
 import CopyButton from "../CopyButton";
-import Erc20Abi from "../../abi/token.abi.json"
+import Erc20Abi from "../../abi/token.abi.json";
 import { ETH_SEPOLIA, STRK_SEPOLIA } from "@/app/utils/constant";
+import { formatCurrency } from "@/app/utils/currency";
 interface IWallet {
  address: string;
  privateKey: string;
@@ -20,38 +21,30 @@ function BurnerWallet({ wallet }: { wallet: IWallet }) {
  const [isConnecting, setIsConnecting] = useState(false);
  const [isConnected, setIsConnected] = useState(false);
 
-
- const {
- data: eth,
- isLoading: ethLoading,
- } = useContractRead({
+ const { data: eth, isLoading: ethLoading } = useContractRead({
  address: ETH_SEPOLIA,
  abi: Erc20Abi,
  functionName: "balanceOf",
  args: [wallet.address!],
  watch: true,
  });
 
- const {
- data: strk,
- isLoading: strkLoading,
- } = useContractRead({
+ const { data: strk, isLoading: strkLoading } = useContractRead({
  address: STRK_SEPOLIA,
  abi: Erc20Abi,
  functionName: "balanceOf",
  args: [wallet.address!],
  watch: true,
  });
 
-// @ts-ignore
- const ethBalance = eth?.balance.low.toString() / 1e18;
  // @ts-ignore
- const strkBalance = strk?.balance?.low
+ const ethBalance = formatCurrency(eth?.balance.low.toString());
+ // @ts-ignore
+ const strkBalance = formatCurrency(strk?.balance?.low.toString());
 
  function handleConnect() {
  const provider = new RpcProvider({
- nodeUrl:
- "https://starknet-sepolia.public.blastapi.io",
+ nodeUrl: "https://starknet-sepolia.public.blastapi.io",
  });
  const account: any = new Account(
  provider,
@@ -95,15 +88,15 @@ function BurnerWallet({ wallet }: { wallet: IWallet }) {
  {" "}
  {ethLoading
  ? "Loading..."
- : `${Number(ethBalance).toFixed(4)}ETH`}
+ : `${Number(ethBalance).toFixed(3)}ETH`}
  </span>
  </h2>
  <h2>
  STRK Balance:{" "}
  <span className="font-medium text-xl">
  {strkLoading
  ? "Loading..."
- : `${Number(strkBalance).toFixed(4)}STRK`}
+ : `${Number(strkBalance).toFixed(3)}STRK`}
  </span>
  </h2>
  </div>
@@ -120,13 +113,15 @@ function BurnerWallet({ wallet }: { wallet: IWallet }) {
  <div className="mt-[80px] flex gap-[60px] justify-center">
  {isConnected ? (
  <>
- <button
- className=" px-6 py-4 bg-blue-500 text-white rounded-[5px] disabled:cursor-not-allowed w-[200px] font-semibold"
- disabled={!eth || !strk}
- onClick={() => setIsSending(true)}
- >
- SEND
- </button>
+ {ethBalance != 0 && strkBalance != 0 && (
+ <button
+ className=" px-6 py-4 bg-blue-500 text-white rounded-[5px] disabled:cursor-not-allowed w-[200px] font-semibold"
+ disabled={!eth || !strk}
+ onClick={() => setIsSending(true)}
+ >
+ SEND
+ </button>
+ )}
  <button
  className=" px-6 py-4 bg-blue-500 text-white rounded-[5px] w-[200px] font-semibold disabled:cursor-not-allowed"
  disabled={!eth || !strk}

diff --git a/frontend/src/app/utils/currency.ts b/frontend/src/app/utils/currency.ts
@@ -0,0 +1,4 @@
+export function formatCurrency(currency: number) {
+ let amount = currency / 1e18;
+ return amount;
+}