Implemented single nft bulk buy

[amenconi]

On the NFT page, when applicable, an input will allow a quantity to be typed in or incremented/decremented using up/down arrows. When "Buy now" button is pressed the input quantity of NFTs is passed to the checkout drawer.

If a quantity of more than 1 is passed then it will display a warning informing the user that multiple NFTs have been selected to be purchased.

NFT purchase flow for user will be same as for single NFT buy but once purchased they will only have a button to close the checkout.

Once shopping cart is implemented the selected quantity can be passed to cart as well, initially setting quantity of that cart NFT item to that quantity.

[cloudflare-workers-and-pages[bot]]

Deploying with    Cloudflare Pages

Latest commit:	619b91d
Status:	✅  Deploy successful!
Preview URL:	https://5ddb3d56.app-cqo.pages.dev
Branch Preview URL:	https://amenconi-bulk-buy-single-nft.app-cqo.pages.dev

View logs

[adamunchained]

@SoonaverseTF - I'll wait for you to approve the testing and give green light for release! Please comment here once done.

@SoonaverseTF - please also determine the TOKEN reward so we can update CONTRIBUTORS.md and execute SOON distribution

[thenikoboxman]

Not sure what would happen by an amount of 1.5

[amenconi]

Pushed commit with fixes so that all typed and pasted values get rounded to whole integers that are closest within the valid range. Looks like the Cloudflare Pages build failed though, looks like reviewing logs for that require log in access for Cloudflare, if I need to make any changes to fix this please let me know. Thanks!

[adamunchained]

@amenconi - would it make sense to merge this into https://github.com/soonaverse/app/pull/128 and merge this together into develop once it's all ready?

[amenconi]

@amenconi - would it make sense to merge this into #128 and merge this together into develop once it's all ready?

Hi Adam. I think so. Once done I can add a bit of code so that choosing a quantity over more than 1 for an NFT on the NFT page will allow you to buy that number in NFT checkout or alternately add that quantity of the NFT to the cart.

Thanks.

[emmap3-do]

@amenconi I run some tests, here is my feedback:

• When I type in 1.7 it rounds to 2 automatically. But if I type in 1.2 it doesn't round to 1. It does not affect the process because the modal popup still works as if I typed 1, but still may be best to adjust. An alternative solution would be to prevent the dot "." to be typed in (same as how it works with "," and "-" right now).

• May be nice to add the USD price next to the IOTA/SMR value in the checkout popup. This wasn't there before so it's an add for all cases (a single nft buy or set nft buy)

• See image below, how it looks like for a single nft purchase (left) vs how it look like for multiple nft purchase (right). Could you adjust the right mockup so that the NFT picture looks the same as the left one? Also, please add a space (eg. margin bottom) to the yellow warning message so it doesn't 'touch' the gray box with price details.

• I noticed that when you get to the last step and have to pay, the Bloom button is missing. Maybe because this PR is not merged yet or maybe because there is something wrong or missing, please check. Thanks!

[adamunchained]

@amenconi - would it make sense to merge this into #128 and merge this together into develop once it's all ready?

Hi Adam. I think so. Once done I can add a bit of code so that choosing a quantity over more than 1 for an NFT on the NFT page will allow you to buy that number in NFT checkout or alternately add that quantity of the NFT to the cart.

Thanks.

sounds great, I've rebased to "amenconi-shopping-cart" but there seems to be conflict. Once you resolve them I'll merge.

[adamunchained]

@amenconi I run some tests, here is my feedback:

• When I type in 1.7 it rounds to 2 automatically. But if I type in 1.2 it doesn't round to 1. It does not affect the process because the modal popup still works as if I typed 1, but still may be best to adjust. An alternative solution would be to prevent the dot "." to be typed in (same as how it works with "," and "-" right now).
• May be nice to add the USD price next to the IOTA/SMR value in the checkout popup. This wasn't there before so it's an add for all cases (a single nft buy or set nft buy)
• See image below, how it looks like for a single nft purchase (left) vs how it look like for multiple nft purchase (right). Could you adjust the right mockup so that the NFT picture looks the same as the left one? Also, please add a space (eg. margin bottom) to the yellow warning message so it doesn't 'touch' the gray box with price details.

• I noticed that when you get to the last step and have to pay, the Bloom button is missing. Maybe because this PR is not merged yet or maybe because there is something wrong or missing, please check. Thanks!

@amenconi / @amenconi - you can continue conversation about this one on the https://github.com/soonaverse/app/pull/128