Drops v1.99

[vikiival]

Context

Drop page is popular way how to use KodaDot.
It works ok, but I believe we can make it awesome.
Most bugs yet stems from the technical debt as it was done via the code-as-you-go approach.
So we have a quite a complex code and refactoring would solve 80% already created bugs.

This issue is a successor of - #9562

Architecture.

It works based on ticket assignment as you are @kodadot/internal-dev I highly recommend to read - https://github.com/kodadot/private-workers/issues/42 if something is unclear just let us know in the issue

Frontend

As you can see in the image above - appart from the layout there are 4 main Islands

1. Cyan - General - name, desc, and creator - this is loaded from the indexer
2. Red - Generator engine - handles the content - and emits image and hash to the main component
3. Purple - Requisites - coming from DB + from indexer - emits eligibility (boolean)
4. Green - Mint handler - gets all data, initiate minting process - modal emitting, and correct flow

Tasks

• - Closing success modal on Free mint freezes page #9570
• - List for sale button appearing on Latest NFT mints on drop page #9569
• - Denver test drop issues #9559
• - Holderof Listing modal opening behind success modal #9543

Refactor Tasks

after #9620 is merged

• move holderOfCollection into a composable #9635
• move minting logic out of components #9636
• this bug #9890

[exezbcz]

and what about this one?

• Drops Refactor #9562

is there any plan of refactoring?

[daiagi]

is there any plan of refactoring?

yes i'm working on it

[preschian]

@daiagi can we use toggle features for this? Add some key here: https://github.com/kodadot/nft-gallery/blob/main/composables/useExperiments.ts. to avoid very big diff in one PR

As you can see in the image above - appart from the layout there are 4 main Islands

1. Cyan - General - name, desc, and creator - this is loaded from the indexer
2. Red - Generator engine - handles the content - and emits image and hash to the main component
3. Purple - Requisites - coming from DB + from indexer - emits eligibility (boolean)
4. Green - Mint handler - gets all data, initiate minting process - modal emitting, and correct flow

then, we can open separate PRs based on this

[daiagi]

hi @preschian

so my plan is to have PR's against drops-refactor branch
where we would be able to test with help of @prury until all bugs are resolved and stabilized
only then we merge into main

that's same as what we did with nuxt3 refactor

it's almost impossible not to do the initial refactor in one big step, since all drops components are very tightly coupled together and my goal is exactly to uncouple them

after this big initial step, we will continue to have smaller PR's to refactor and fix bugs the popped up

[daiagi]

Refactor Tasks

after #9620 is merged

• move holderOfCollection into a composable #9635
• move minting logic out of components #9636

PR's against https://github.com/kodadot/nft-gallery/tree/drops-refactor branch

[prury]

to be solved:

• Changing from one drop another still shows the previous one #9729