[docs] A better Merchant Explanation

[MarioProjects]

Hey, first of all thanks for your work!

I wanna create a store of merch on my webpage and I wanna use Solana Pay. I use React and I am trying to follow the docs and looking in the code. I created the connection and the URL but now I stuck on this point https://github.com/solana-labs/solana-pay/blob/master/core/example/payment-flow-merchant/main.ts#L46 where it says that the interaction will be handled by a wallet provider. How can we launch that interaction? In the docs I only see the QR option (https://docs.solanapay.com/core/merchant-integration#3-encode-link-into-a-qr-code) but I would like to prompt a response with the wallet, as when minting a NFT or something like that, right?

[jordaaash]

@cogoo you wrote this documentation, is this something you want to tackle?

[MarioProjects]

@cogoo can you help?

[cogoo]

@cogoo can you help?

@MarioProjects sure. I understand what you're after.

The flow you're looking to implement is https://docs.solanapay.com/core/overview#web-app-to-browser-wallet. In short:

1. It's your dApp that has to create the transaction
2. Use the wallet adapter lib to get the users connected wallet
3. Create the transaction; similar if not identical to https://github.com/solana-labs/solana-pay/blob/master/core/example/payment-flow-merchant/simulateWalletInteraction.ts#L25
4. Use web3.js to sendAndConfirmTransaction upon user interaction

I may have some actual code examples for you in the coming weeks 🙏🏾

[kylebragger]

Not sure if this is worth its own ticket but the merchant docs[1] have example code for validateTransactionSignature that passes amountInLamports but the API docs specify that the amount should be the same amount as passed to e.g. encodeURL, i.e. in SOL (if not using an spl-token).

1. https://docs.solanapay.com/core/merchant-integration

[cogoo]

3. rchant/simulateWalletInteraction.ts#L25 4. Use web3.js to sendAndConfirmTransaction upon user interaction

I may have some actual code examples for you in the coming weeks 🙏🏾

This is a good catch! thanks for raising.

~~The amount in encodeURL is indeed different to the amount in validateTransactionSignature.~~ ~~The amount in validateTransactionSignature should be in lamports~~

[kylebragger]

@cogoo hi, I'm not sure I'm following then, because validateTransactionSignature fails when using lamports and only seems to succeed when using the original SOL amount from the generated URL/QR code:

(Note: I've removed irrelevant lines)

const amount = new BigNumber(0.1); // in SOL
const url = encodeURL({ recipient, amount, reference, label, message, memo });
const qrCode = createQR(url);
...
await validateTransactionSignature(connection, signatureInfo.signature, recipient, amount, undefined, reference);

If I pass amount as above, validation succeeds. If I do the below, it fails:

const amountInLamports = amount.times(LAMPORTS_PER_SOL).integerValue(BigNumber.ROUND_FLOOR);
await validateTransactionSignature(connection, signatureInfo.signature, recipient, amountInLamports, undefined, reference);

[cogoo]

@cogoo hi, I'm not sure I'm following then, because validateTransactionSignature fails when using lamports and only seems to succeed when using the original SOL amount from the generated URL/QR code:

(Note: I've removed irrelevant lines)

const amount = new BigNumber(0.1); // in SOL
const url = encodeURL({ recipient, amount, reference, label, message, memo });
const qrCode = createQR(url);
...
await validateTransactionSignature(connection, signatureInfo.signature, recipient, amount, undefined, reference);

If I pass amount as above, validation succeeds. If I do the below, it fails:

const amountInLamports = amount.times(LAMPORTS_PER_SOL).integerValue(BigNumber.ROUND_FLOOR);
await validateTransactionSignature(connection, signatureInfo.signature, recipient, amountInLamports, undefined, reference);

You're right. I see the example code was fixed here.

I'll update the example in the docs. Thanks!

[kylebragger]

@cogoo amazing, thank you for the speedy action! really impressed with Pay so far.