feat: add loader when user getting validated and generating preview#145
Conversation
|
@palchhinparihar is attempting to deploy a commit to the vansh-codes1's projects Team on Vercel. A member of the Team first needs to authorize it. |
|
Thank you for submitting your pull request! 🙌 We'll review it as soon as possible. In the meantime, please ensure that your changes align with our CONTRIBUTING.md. If there are any specific instructions or feedback regarding your PR, we'll provide them here. Thanks again for your contribution! 😊 |
|
hi @vansh-codes, please review both this and #140. :) |
There was a problem hiding this comment.
Pull Request Overview
This PR adds a custom loader component to improve user experience during asynchronous operations (user validation and preview generation). The changes include a new Loader component, loading state management in both the home and preview pages, and a refactoring of the preview page to use descriptor files for better maintainability.
Key Changes
- Created a reusable
Loadercomponent with a spinner and customizable message - Added loading states during GitHub username validation and preview image generation
- Refactored preview page controls into separate descriptor files (exportTools.js, selectTools.js, checkboxTools.js)
Reviewed Changes
Copilot reviewed 7 out of 8 changed files in this pull request and generated 8 comments.
Show a summary per file
| File | Description |
|---|---|
| src/components/Loader.jsx | New loader component with spinner animation and message display |
| src/pages/Home.jsx | Integrated loader during username validation with timeout logic |
| src/app/[username]/page.jsx | Added loader for image generation and refactored UI controls |
| src/app/[username]/exportTools.js | New descriptor file for export button configuration |
| src/app/[username]/selectTools.js | New descriptor file for select dropdown configuration |
| src/app/[username]/checkboxTools.js | New descriptor file for checkbox configuration |
| package.json | Added lottie-react dependency |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
vansh-codes
left a comment
There was a problem hiding this comment.
Do remove the extra installed library which is not needed to get this PR merged!
|
oh before merging, you had to add the label, or else it won't come under my contribution. |
|
The points for this PR have been updated. The changes will be reflected in about 30 minutes. |
|
@palchhinparihar yes I'm aware about it, missed it for this PR bymistake Hopefully it must be resolved by now? |
|
It is resolved! :) |
📄 Description
This PR adds a custom loader that is displayed during user validation and while the preview is being generated. The loader improves user experience by providing clear visual feedback during these asynchronous operations, preventing confusion when the UI temporarily pauses for processing.
Included in this update:
Motivation:
Previously, there was no visual indicator when user validation or preview generation was happening, making the UI feel unresponsive. Introducing this loader enhances usability and transparency.
Testing:
🔗 Related Issues
🖼️ Screenshots (if applicable)
🧩 Type of Change
Select the type of change your PR introduces (check all that apply):
✅ Checklist
Before submitting your PR, please confirm the following:
Let me know for any change.
Thank you.