Massmint - Table + Edit Panel + Dialogs

[daiagi]

Thank you for your contribution to the KodaDot - One Stop Shop for Polkadot NFTs.

👇 __ Let's make a quick check before the contribution.

PR Type

• Bugfix
• Feature
• Refactoring

Context

• Closes Mass Mint: step 4 - Overview table #5180
• Closes Mass Mint: Edit Panel #5181
• Closes Mass Mint: Dialogs #5182
• Requires deployment <snek/rubick/worker>

Before submitting pull request, please make sure:

• My contribution builds clean without any errors or warnings
• I've merged recent default branch -- main and I've no conflicts
• I've tried to respect high code quality standards
• I've didn't break any original functionality

Optional

• I've tested it at </ksm/collection>
• I've tested PR on mobile
• I've written unit tests 🧪
• I've found edge cases

Had issue bounty label?

• Fill up your KSM address: Payout

Testing

• https://deploy-preview-5765--koda-canary.netlify.app/bsx/massmint

Community participation

• Are you at KodaDot Discord?

Screenshot 📸

• My fix has changed something on UI; a screenshot is best to understand changes for others.

Copilot Summary

🤖 Generated by Copilot at 77d56d2

This pull request implements the mass mint feature for the NFT gallery, which allows users to upload a zip file of images and mint multiple NFTs with metadata. It adds and modifies several components, such as Massmint, OverviewTable, EditPanel, and various modals, to handle the user interface and logic of the feature. It also adds some types, utility classes, and props to the NeoModal and NeoSidebar components to support the feature.

🤖 Generated by Copilot at 77d56d2

We are the masters of the mint
We create and destroy with a click
We unleash the power of the NFT
We rule the gallery with the NeoModal and the NeoSidebar

[kodabot]

WARNING @daiagi PR for issue #5180 which isn't assigned to you. Please be warned that this PR may get rejected if there's another assignee for issue #5180

[kodabot]

SUCCESS @daiagi PR for issue #5181 which is assigned to you. Please wait for review and don't hesitate to grab another issue in the meantime!

[kodabot]

SUCCESS @daiagi PR for issue #5182 which is assigned to you. Please wait for review and don't hesitate to grab another issue in the meantime!

[netlify]

✅ Deploy Preview for koda-canary ready!

Name	Link
🔨 Latest commit	d5fb4e6
🔍 Latest deploy log	https://app.netlify.com/sites/koda-canary/deploys/645b61454271200008c9c179
😎 Deploy Preview	https://deploy-preview-5765--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 settings.

[reviewpad]

AI-Generated Summary: This pull request introduces several improvements and new features to the project, including:

1. Enhancements to the user interface for minting NFTs, adding new key-value pairs in the en.json locale file.
2. New Vue components: DeleteModal, EditPanel, MissingInfoModal, ReviewModal, and MintingModal, handling various user interactions and modals.
3. Significant updates to the OverviewTable.vue component for better NFT information display and improved user experience.
4. Additional CSS classes for styling and theming.
5. Introduction of new types for handling NFT data: Status and NFT.
6. Modification of existing NeoSidebar and NeoModal components for greater customization and functionality.
7. Changes to Massmint.vue file, integrating new components and methods for better overall functionality.

Overall, this pull request provides a more polished user experience and expanded feature set for mass minting NFTs.

[daiagi]

It doesn't actually mint yest

[exezbcz]

hey hey, nice job! Mass mint almost done!

Feedback

• it will be bit harder for my since I did not fully make the designs, but I will do my best to identify the issues

• I would maybe remove the footer completely on mass mint and these subpages

• should scroll be enabled when edit sidebar is opened?
  

• can you please add some padding into the text container
  

• this text to normal weight

please see this screen:

• the column names should be grey, operation icons as well
• divider to grey please as well
  

• picture preview should work the same as on gallery cards - that means the img is scaled, not stretched

description input limit missing

the sidebar is too wide, can you make it smaller please

• the input fields should have more height - similar for example to the buy button in gallery item detail:
  

the tags are bit different from the design

• we can maybe use the same that are in collection activity - with a change of the pink to more red-ish color (#FFB6B6)
• they have also dark mode alternative
  
  

I may notice something else, but these are some starting points:D

[preschian]

btw, not sure what's up with DeepSource
all of these issues are wrong (i.e not true, the vars are used)

seems like DeepSource is unable to scan the .vue component properly. imo, CodeClimate also unable to scan composable function properly

[daiagi]

@preschian do you have any idea what to do to solve it?

[preschian]

@preschian do you have any idea what to do to solve it?

no idea, I think it is safe to ignore for that case

[daiagi]

[daiagi]

@vikiival why no merge?

[codeclimate]

Code Climate has analyzed commit d5fb4e6 and detected 1 issue on this pull request.

Here's the issue category breakdown:

Category	Count
Complexity	1

View more on Code Climate.

[vikiival]

Pinging @yangwao about payout

[yangwao]

pay 200 usd

[yangwao]

😍 Perfect, I’ve sent the payout
💵 $200 @ 24.95 USD/KSM ~ 8.016 $KSM
🧗 EfmnRhHaQqfT3phm4cUCHCU3gFVDoSPR1U9WXzMRQBMqZ4L
🔗 0xeb2ecffae95774e71deb9d8a36aeeea2b6075d2e0c388568b566be24eb321b72

🪅 Let’s grab another issue and get rewarded!
🪄 github.com/kodadot/nft-gallery/issues