diff --git a/packages/nextjs/hooks/scaffold-eth/useERC721List.ts b/packages/nextjs/hooks/scaffold-eth/useERC721List.ts
new file mode 100644
index 0000000..5ee1f2f
--- /dev/null
+++ b/packages/nextjs/hooks/scaffold-eth/useERC721List.ts
@@ -0,0 +1,27 @@
+'use client';
+
+import { useScaffoldReadContract } from './useScaffoldReadContract';
+import { BigNumber } from 'ethers';
+
+interface Voucher {
+ title: string;
+ issueDate: BigNumber;
+ amount: BigNumber;
+ expiryDate: BigNumber;
+ usageScope: string;
+}
+
+export const useERC721List = ( ownerAddress: string) => {
+
+ // Fetch the list of vouchers owned by the specified address
+ const { data: vouchers } = useScaffoldReadContract({
+ contractName: "ExpirableERC721",
+ functionName: "listVouchers",
+ args: [ownerAddress],
+ });
+
+
+ return {
+ vouchers: vouchers as Voucher[] | undefined,
+ };
+};
diff --git a/packages/nextjs/hooks/scaffold-eth/useERC721Mintbatch.ts b/packages/nextjs/hooks/scaffold-eth/useERC721Mintbatch.ts
new file mode 100644
index 0000000..68f926f
--- /dev/null
+++ b/packages/nextjs/hooks/scaffold-eth/useERC721Mintbatch.ts
@@ -0,0 +1,44 @@
+import { useState } from "react";
+import { useScaffoldWriteContract } from "~~/hooks/scaffold-eth";
+
+/**
+ * Custom hook to interact with the mintBatch function of the ExpirableERC721 contract.
+ */
+export const useERC721MintBatch = () => {
+ const [isMinting, setIsMinting] = useState(false);
+ const { writeContractAsync } = useScaffoldWriteContract("ExpirableERC721");
+
+ /**
+ * Function to mint a batch of ERC721 tokens.
+ * @param to Address to mint the tokens to.
+ * @param numberOfTokens Number of tokens to mint.
+ * @param title Title of the voucher.
+ * @param issueDate Issue date of the voucher.
+ * @param amount Amount associated with the voucher.
+ * @param expiryDate Expiry date of the voucher.
+ * @param usageScope Usage scope of the voucher.
+ */
+ const mintBatch = async (
+ to: string,
+ numberOfTokens: bigint,
+ title: string,
+ issueDate: bigint,
+ amount: bigint,
+ expiryDate: bigint,
+ usageScope: string
+ ) => {
+ setIsMinting(true);
+ try {
+ await writeContractAsync({
+ functionName: "mintBatch",
+ args: [to, numberOfTokens, title, issueDate, amount, expiryDate, usageScope],
+ });
+ } catch (error) {
+ console.error("Error minting batch:", error);
+ } finally {
+ setIsMinting(false);
+ }
+ };
+
+ return { mintBatch, isMinting };
+};
diff --git a/packages/nextjs/public/logo.svg b/packages/nextjs/public/logo.svg
index 93e4b40..7521d84 100644
--- a/packages/nextjs/public/logo.svg
+++ b/packages/nextjs/public/logo.svg
@@ -1,10 +1,26 @@
-