update

Author: kien-ngo

apps/dashboard/src/app/drops/[slug]/data.ts

@@ -1,4 +1,5 @@
 import type { Metadata } from "next";
+import type { GaslessOptions } from "thirdweb/transaction";
 
 type DropPageData = {
   slug: string;
@@ -9,6 +10,7 @@ type DropPageData = {
   // If not defined, we will use the image of the NFT or contract's image
   thumbnail?: string;
   metadata: Metadata;
+  gasless?: GaslessOptions;
 } & ({ type: "erc1155"; tokenId: bigint } | { type: "erc721" });
 
 export const DROP_PAGES: DropPageData[] = [
@@ -45,6 +47,12 @@ export const DROP_PAGES: DropPageData[] = [
           "This exclusive commemorative NFT marks the official launch of ZERϴ's mainnet and our exciting partnership with thirdweb. Own a piece of this milestone in blockchain history as we make onchain transactions free with zero.network",
       },
     },
+    gasless: {
+      provider: "engine",
+      relayerForwarderAddress: "0x8ef65cb8a0bc22d61b6f1431e16aa8aca355c771",
+      relayerUrl:
+        "https://thirdweb.engine-usw2.thirdweb.com/relayer/790e2b34-a35d-4526-9396-f2163eb6e3a5",
+    },
   },
 
   // Add more chains here

apps/dashboard/src/app/drops/[slug]/mint-ui.tsx

@@ -21,6 +21,7 @@ import {
   useActiveAccount,
   useReadContract,
 } from "thirdweb/react";
+import type { GaslessOptions } from "thirdweb/transaction";
 
 type Props = {
   contract: ThirdwebContract;
@@ -36,6 +37,7 @@ type Props = {
         currencySymbol: string | null;
         noActiveClaimCondition: false;
         quantityLimitPerWallet: bigint;
+        gasless?: GaslessOptions;
       }
     | { noActiveClaimCondition: true }
   );
@@ -181,6 +183,11 @@ export function NftMint(props: Props) {
               contractAddress={props.contract.address}
               chain={props.contract.chain}
               client={props.contract.client}
+              gasless={
+                props.noActiveClaimCondition === false
+                  ? props.gasless
+                  : undefined
+              }
               claimParams={
                 props.type === "erc1155"
                   ? {

apps/dashboard/src/app/drops/[slug]/page.tsx

@@ -112,6 +112,7 @@ export default async function DropPage({
       pricePerToken={pricePerToken}
       noActiveClaimCondition={false}
       quantityLimitPerWallet={claimCondition.quantityLimitPerWallet}
+      gasless={project.gasless}
       {...project}
     />
   );