✨ swap page landing

[roiLeo]

• closes Create Swap Page #11128
• /:prefix/swap

[netlify]

✅ Deploy Preview for koda-canary ready!

Name	Link
🔨 Latest commit	55a6c88
🔍 Latest deploy log	https://app.netlify.com/sites/koda-canary/deploys/674d21568717180008194a37
😎 Deploy Preview	https://deploy-preview-11163--koda-canary.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[hassnian]

nice!

@roiLeo I see that the pr does not close the issue, do you want to finish it ? otherwise I can take over.

can you

• use translation keys for all words
• limit this page to only assethub inside redirect.global using getPermissionRouteCondition -> permission.config.ts
• if you are not logged this should be a button (I guess like the transfer page)
  

[roiLeo]

I see that the pr does not close the issue, do you want to finish it ? otherwise I can take over.

Yea it's WIP, feel free to take it if you need to ship it faster

use translation keys for all words

yes, that would be ideal

limit this page to only assethub inside redirect.global using getPermissionRouteCondition -> permission.config.ts
if you are not logged this should be a button (I guess like the transfer page)

noted! ty

[roiLeo]

@hassnian any way to split the work? so we don't erase each other stuff
like someone handle the logic, any other step or maybe you want full control?

[hassnian]

@hassnian any way to split the work? so we don't erase each other stuff like someone handle the logic, any other step or maybe you want full control?

yeah it's gonna be hard since its a lot of new code, I'll let you finish it. I can work on something else in the meantime

[vikiival]

Well how swap works:

• you take your NFT
• you select nft you want
• call same call as offer :P

So my recommendation is that one can start with item detail:

• create button, or add swap for another in the more select

The Swap page (cc @exezbcz):
On one side is your nft
on the other is either desired nft or considered collection

It means if desired on the indexer is null you want nft from particular collection

Future
You can additionally add surcharge which https://github.com/kodadot/stick/blob/39ac052e60cc0b9c03ca1d3e23cb6c3f869e5822/schema.graphql#L244

You can either send or receive

[vikiival]

However I like also your idea to invite a "conter-party" so you can easily look for "his/hers" nfts

[hassnian]

@roiLeo a08d281 I think we should not use bulma anymore , new code should only use tailwind since we have

• Bulma conflicting with Tailwind classes  #9973
• remove bulma css #9013

wdyt?

[roiLeo]

@roiLeo a08d281 I think we should not use bulma anymore , new code should only use tailwind since we have

* [Bulma conflicting with Tailwind classes  #9973](https://github.com/kodadot/nft-gallery/issues/9973)

* [remove bulma css #9013](https://github.com/kodadot/nft-gallery/issues/9013)

wdyt?

sure i'll replace is-hidden-touch with tailwind equivalent, same goes for colums with grid/flex layout.
I'm not too worried about Bulma, I'm more concerned with oruga UI.

[vikiival]

https://github.com/paritytech/polkadot-sdk/blob/aff3a0796176ff3c0ee1b89c2f1d811a858f17a8/substrate/frame/nfts/src/features/atomic_swap.rs#L49

Yes

offered_collection_id: T::CollectionId,
offered_item_id: T::ItemId,
desired_collection_id: T::CollectionId,
maybe_desired_item_id: Option<T::ItemId>,

as I have mentioned in #11163 (comment)

You need to provided NFT you want to swap (offered_collection_id, offered_item_id)
and the thing you want to get:

• any NFT from particular collection (desired_collection_id, null)
• that exact NFT from that collection (desired_collection_id, maybe_desired_item_id)

and yes It can be anything

e.g I have nft (ahp: 263-4231008173)
(that is from collection 263)

and I want this NFT (ahp: 152-2406426862) which is from collecton (152)

Hope it makes sense now

[sonarcloud]

Quality Gate passed

Issues
1 New issue
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud

[hassnian]

I'm removing myslef and asking @preschian for a review since there's a lot of my code on this pr