diff --git a/boxes/react/src/hooks/useContract.tsx b/boxes/react/src/hooks/useContract.tsx
index 0174c205d395..8082005867c5 100644
--- a/boxes/react/src/hooks/useContract.tsx
+++ b/boxes/react/src/hooks/useContract.tsx
@@ -14,17 +14,17 @@ export function useContract() {
e.preventDefault();
setWait(true);
- const contractDeployer = new ContractDeployer(artifact, deployerEnv.pxe);
const wallet = await deployerEnv.getWallet();
+ const contractDeployer = new ContractDeployer(artifact, wallet);
const salt = Fr.random();
const tx = contractDeployer
.deploy(Fr.random(), wallet.getCompleteAddress().address)
.send({ contractAddressSalt: salt });
- const { contractAddress } = await toast.promise(tx.wait(), {
+ const { address: contractAddress } = await toast.promise(tx.deployed(), {
pending: 'Deploying contract...',
success: {
- render: ({ data }) => `Address: ${data.contractAddress}`,
+ render: ({ data }) => `Address: ${data.address}`,
},
error: 'Error deploying contract',
});
diff --git a/boxes/react/src/index.tsx b/boxes/react/src/index.tsx
index e71d6ce7dcfe..3c657332834c 100644
--- a/boxes/react/src/index.tsx
+++ b/boxes/react/src/index.tsx
@@ -1,11 +1,9 @@
-import { Home } from "./pages/home";
-import "react-toastify/dist/ReactToastify.css";
-import * as ReactDOM from "react-dom/client";
-import { ToastContainer } from "react-toastify";
+import { Home } from './pages/home';
+import 'react-toastify/dist/ReactToastify.css';
+import * as ReactDOM from 'react-dom/client';
+import { ToastContainer } from 'react-toastify';
-const root = ReactDOM.createRoot(
- document.getElementById("root") as HTMLElement,
-);
+const root = ReactDOM.createRoot(document.getElementById('root') as HTMLElement);
root.render(
<>
diff --git a/boxes/react/src/pages/contract.tsx b/boxes/react/src/pages/contract.tsx
index 1310eae0c485..93d398ef1f4a 100644
--- a/boxes/react/src/pages/contract.tsx
+++ b/boxes/react/src/pages/contract.tsx
@@ -1,7 +1,7 @@
-import { useState } from "react";
-import { Contract } from "@aztec/aztec.js";
-import { useNumber } from "../hooks/useNumber";
-import { filteredInterface } from "../config";
+import { useState } from 'react';
+import { Contract } from '@aztec/aztec.js';
+import { useNumber } from '../hooks/useNumber';
+import { filteredInterface } from '../config';
export function ContractComponent({ contract }: { contract: Contract }) {
const [showInput, setShowInput] = useState(true);
@@ -15,7 +15,7 @@ export function ContractComponent({ contract }: { contract: Contract }) {