Feat/UI overhaul - #30
Conversation
WalkthroughThis pull request scopes deployment permissions to the deploy job, updates deployment documentation, improves component typing and accessibility, adjusts navigation and theme initialization, handles empty user-agent values, and changes the Hindi hero title. ChangesDeployment and UI refinements
Estimated code review effort: 3 (Moderate) | ~20 minutes Possibly related PRs
Suggested labels: Suggested reviewers: Poem
🚥 Pre-merge checks | ✅ 4✅ Passed checks (4 passed)
✨ Finishing Touches 💡 1🛠️ Fix failing CI checks 💡
🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
|
Review the following changes in direct dependencies. Learn more about Socket for GitHub.
|
|
Warning Review the following alerts detected in dependencies. According to your organization's Security Policy, it is recommended to resolve "Warn" alerts. Learn more about Socket for GitHub.
|
|
@coderabbitai review. |
|
✅ Action performedReview finished.
|
There was a problem hiding this comment.
Actionable comments posted: 3
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (2)
src/components/ui/Navbar.tsx (1)
189-196: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick winMake the overlay button accessible and non-submitting.
When
sidebarOpenis false, this invisible button remains focusable. It has no accessible name. It also defaults totype="submit"inside an ancestor form.Render it only while the sidebar is open. Set
type="button". Add a localizedaria-label, such as acloseMenutranslation.Proposed fix
- <button - className={`fixed bg-bg z-40 transition-opacity duration-300 min-[1000px]:hidden ${ - sidebarOpen - ? "opacity-100 pointer-events-auto" - : "opacity-0 pointer-events-none" - }`} - onClick={() => setSidebarOpen(false)} - /> + {sidebarOpen && ( + <button + type="button" + aria-label={tN("closeMenu")} + className="fixed bg-bg z-40 transition-opacity duration-300 min-[1000px]:hidden" + onClick={() => setSidebarOpen(false)} + /> + )}As per path instructions, user-visible strings should be externalized to resource files (i18n).
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/components/ui/Navbar.tsx` around lines 189 - 196, Update the overlay button in the Navbar component to render only when sidebarOpen is true, preventing an invisible focusable element. Set its type to button and add an aria-label using the localized closeMenu translation rather than a hardcoded string.Sources: Path instructions, Linters/SAST tools
README.md (1)
381-385: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick winDocument static deployment instead of
npm run start
output: "export"generates static files inout, andnpm run startinvokes the incompatiblenext startcommand. Document deployment ofoutto static hosting. For local preview, usenpx serve@latest out.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@README.md` around lines 381 - 385, Update the README deployment section to describe serving the statically generated out directory on static hosting instead of running npm run start. Add the local preview command using npx serve@latest out, while preserving the existing export workflow context.Source: MCP tools
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In @.github/workflows/CD.yml:
- Around line 50-53: Add concise inline comments to the permissions block
documenting that pages: write enables GitHub Pages deployment and id-token:
write enables OIDC authentication; leave contents: read unchanged.
- Around line 50-53: Add a workflow-level permissions block in CD.yml with at
least contents: read to establish a least-privilege baseline for build and other
non-deploy jobs. Keep pages: write and id-token: write scoped exclusively to the
deploy job’s permissions block.
- Around line 55-58: Update the “Deploy to GitHub Pages” step’s
actions/deploy-pages reference to the specified immutable commit SHA, retaining
the v4 version comment.
---
Outside diff comments:
In `@README.md`:
- Around line 381-385: Update the README deployment section to describe serving
the statically generated out directory on static hosting instead of running npm
run start. Add the local preview command using npx serve@latest out, while
preserving the existing export workflow context.
In `@src/components/ui/Navbar.tsx`:
- Around line 189-196: Update the overlay button in the Navbar component to
render only when sidebarOpen is true, preventing an invisible focusable element.
Set its type to button and add an aria-label using the localized closeMenu
translation rather than a hardcoded string.
🪄 Autofix
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yml
Review profile: ASSERTIVE
Plan: Pro Plus
Run ID: caa0f9a2-5652-437f-844f-101c2763c7ac
📒 Files selected for processing (11)
.github/workflows/CD.ymlREADME.mdTasks.mdsrc/components/Download.tsxsrc/components/MockUp.tsxsrc/components/ShuffleGrid.tsxsrc/components/SocialMediaCTA.tsxsrc/components/ui/Navbar.tsxsrc/context/theme-provider.tsxsrc/hooks/usePlatform.tssrc/messages/hi.json
Link your account with GitcordThanks for opening this PR, @rahul-vyas-dev! To receive Discord notifications and contributor tracking for this organization:
Once linked, Gitcord can notify you about reviews, merges, and more. — Posted by Gitcord |
Additional Notes:
Addressed all the comments from codeRabbitAI.
Checklist
We encourage contributors to use AI tools responsibly when creating Pull Requests. While AI can be a valuable aid, it is essential to ensure that your contributions meet the task requirements, build successfully, include relevant tests, and pass all linters. Submissions that do not meet these standards may be closed without warning to maintain the quality and integrity of the project. Please take the time to understand the changes you are proposing and their impact.
Summary by CodeRabbit
Bug Fixes
Documentation
Localization