0

I am trying to integrate the CrossmintPayButton from the @crossmint/client-sdk-react-ui package and the button opens the crossmint gateway but shows an error. I cannot backtrace the error since there is no specific error message. Has anyone also faced this issue before? Can someone from the Crossmint team help on this?

Here is the CrossmintPayButton component configuration.

<CrossmintPayButton
  collectionId="c0fd62fc-cb1b-4242-9d60-c55834cf85a0"
  environment="staging"
  getButtonText={(connecting) => (connecting ? "Connecting" : title)}
  mintConfig={{
    type: "erc-721",
    totalPrice: "100",
    amount: [1],

    // Custom values
    EventNFTCollectionAddress: "0xba872bfc6fb9b7f67a6b28cc018210a523982797",
    ticmintDisplayAmount: "1",
    ticketType: ["79b4b2b9-ad69-41f7-af11-100902756c4b"],
    seatNumbers: [],
    serverSignature: "0x48687d282116f41fa6c553eb1d7d379fffea75dc49c47758ddc8de51460d61ba1b0fa09ad9febb6c78ab88fb7c24561b6109824e713655376e23aaa8f4241a491c",
    to: "0xC8efCcCb0514ca741f85Fd638150384dbcB9877C",
  }}
  projectId="2b9e972d-c6ce-458d-a772-b3000dd45641"
  {...buttonProps}
/>

buttonProps={{
 className: "crossmint-pay-button",
}}

Error message screenshot: Most of the time, I get this error

At times, this error is shown but it gets fixed without changes any configuration after sometime

I expect crossmint pay button to list the item purchasing and payment to go through.

EDIT 2:

<CrossmintPayButton
  {...buttonProps}
  collectionId="c0fd62fc-cb1b-4242-9d60-c55834cf85a0"
  environment="staging"
  getButtonText={(connecting) => (connecting ? "Connecting" : title)}
  mintConfig={{
    type: "erc-721",
    totalPrice: "1",
    EventNFTCollectionAddress:
    "0x3023abd5abe9e54edbd3eda6b5fe08809e1bce90",
    ticketType: ["70231b9d-60ad-4a9f-849b-0c788f69fe19"],
    amount: [1],
    seatNumbers: [],
    ticmintDisplayAmount: "1",
    quantity: "1",
    serverSignature: "0x48687d282116f41fa6c553eb1d7d379fffea75dc49c47758ddc8de51460d61ba1b0fa09ad9febb6c78ab88fb7c24561b6109824e713655376e23aaa8f4241a491c",
    to: "0xC8efCcCb0514ca741f85Fd638150384dbcB9877C",
  }}
  projectId="2b9e972d-c6ce-458d-a772-b3000dd45641"
/>

EDIT 3: Issue has been resolved. Thank you for the help.

EDIT 4: Is there any way to get the events or success/failure details for CrossmintPayButton component other than by redirect URLS?

Suggestion: Crossmint dev docs needs to be improved.

  • Admittedly, we should be showing you a more actionable error and I have an internal ticket open to improve exactly that. In the meantime I can help out if you can share the collectionId and valid info for all the values you're passing in the mintConfig! – dmulvi Aug 02 '23 at 16:09
  • I have updated the questions without variables. – Mohammed Ferbin Karumannil Aug 03 '23 at 10:33
  • Thanks! That is very helpful. I just tested this out am getting a contract level reversion. This typically means something incorrect is being passed to the contract or it is reverting for some other reason. I simulated this transaction using tenderly.co and found that the execution reverted error is: "Sale Has Ended". – dmulvi Aug 03 '23 at 17:45
  • I have rectified the Sale Has Ended error but still it's giving the same error as before. Also, I have updated the question with the last contractAddress and other values used. – Mohammed Ferbin Karumannil Aug 04 '23 at 11:06
  • Is there anyway to get payment events or get payment status for CrossmintPayButton without using redirect URLs? – Mohammed Ferbin Karumannil Aug 05 '23 at 16:16
  • The hosted payment tools (`CrossmintPayButton`) doesn't support events. We do have a premium embedded checkout with a client side events though. You can test it out on staging for free. Docs here: https://docs.crossmint.com/docs/2c-embed-checkout-inside-your-ui – dmulvi Aug 08 '23 at 21:25

1 Answers1

0

First of all, I recognize Crossmint needs to return more actionable error messages to the end developer. I'm working on that internally! I'll answer this question from the perspective of what to do when you get a generic "Execution Reverted" error message while testing the checkout.

  1. The easiest troubleshooting step is always to ensure you can actually call the function you've registered with Crossmint directly. In your case the function registered is buy, but there are not any transactions using that as I type this. With a valid transaction you know that you're passing correct arguments to the contract and there is nothing else reverting. In your case the contract is returning "Sale Has Ended". This could be discovered via testing a normal buy before integrating Crossmint.

  2. If the first step doesn't reveal anything you should try simulating the transaction using a tool like tenderly.co. It is very good at getting the exact reason a transaction failed and showing you where in the code the reversion was thrown.

The solution in your case it update the smart contract to have an active sale phase.

dmulvi
  • 639
  • 5
  • 6