feat: added a contact page#153
Conversation
|
@anujsharma8d is attempting to deploy a commit to the Kunal Verma's projects Team on Vercel. A member of the Team first needs to authorize it. |
🚀 PR Received SuccessfullyHello @anujsharma8d, Thank you for taking the initiative to contribute to this project. Please ensure that your PR follows all project guidelines properly before requesting review.
|
|
Warning Review limit reached
More reviews will be available in 53 minutes and 25 seconds. Learn how PR review limits work. Your organization has run out of usage credits. Purchase more in the billing tab. ⌛ How to resolve this issue?After more reviews become available, a review can be triggered using the We recommend that you space out your commits to avoid hitting the rate limit. 🚦 How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. Our paid plans include higher PR review limits than trial, open-source, and free plans. In all cases, reviews become available again over time. During sustained high-volume PR review activity, CodeRabbit may temporarily slow when the next review becomes available. Please see our Fair Usage Limits Policy for further information. ℹ️ Review info⚙️ Run configurationConfiguration used: defaults Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (1)
📝 WalkthroughWalkthroughAdds a new Contact page component with mapped external contact links and a "Send us a message" form (alerts and resets on submit), registers it at /contact, and inserts "Contact Us" links into the desktop navbar and mobile menu. ChangesContact Us Page Feature
Estimated code review effort🎯 2 (Simple) | ⏱️ ~10 minutes Possibly related PRs
Suggested labels
Poem
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 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 |
|
Hey @kunalverma2512 |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 2
🤖 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 `@frontend/src/pages/Contact.jsx`:
- Around line 24-65: The social links in Contact.jsx are pointing to generic
sites (and Discord is "#"); update the hrefs in the inline social links array
(the object literals mapped with .map((s) => ...)) to the real CodeLens
channels: the project's GitHub repo URL, the project's X/Twitter handle, the
CodeLens LinkedIn company page, and a valid Discord invite link (replace the "#"
value). If you have centralized config/constants for contact URLs (e.g.
CONTACT_LINKS or env vars), use those instead of hardcoding so future changes
are single-source.
- Around line 89-103: The contact UI is non-functional because there's no form
or submit handling; wrap the inputs and textarea in a <form> and add an onSubmit
handler (e.g., handleSubmit) in the Contact component that prevents default,
gathers values (ensure each input/textarea has a name or is controlled via React
state), and sends them to your backend (or shows a success/error state); also
change the Send message button to type="submit" so it triggers the handler. If
you prefer to keep it static for now, remove the clickable affordance by
disabling the button or replacing it with non-actionable text instead of a
submit control.
🪄 Autofix (Beta)
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: defaults
Review profile: CHILL
Plan: Pro
Run ID: cb72c9da-4f1c-4665-9bfb-e1b8c1388668
📒 Files selected for processing (3)
frontend/src/App.jsxfrontend/src/components/shared/Navbar.jsxfrontend/src/pages/Contact.jsx
| {[ | ||
| { | ||
| name: "GitHub", | ||
| desc: "Star us & contribute", | ||
| href: "https://github.com/", | ||
| icon: ( | ||
| <svg width="16" height="16" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"> | ||
| <path d="M12 0C5.37 0 0 5.37 0 12c0 5.31 3.435 9.795 8.205 11.385.6.105.825-.255.825-.57 0-.285-.015-1.23-.015-2.235-3.015.555-3.795-.735-4.035-1.41-.135-.345-.72-1.41-1.23-1.695-.42-.225-1.02-.78-.015-.795.945-.015 1.62.87 1.845 1.23 1.08 1.815 2.805 1.305 3.495.99.105-.78.42-1.305.765-1.605-2.67-.3-5.46-1.335-5.46-5.925 0-1.305.465-2.385 1.23-3.225-.12-.3-.54-1.53.12-3.18 0 0 1.005-.315 3.3 1.23.96-.27 1.98-.405 3-.405s2.04.135 3 .405c2.295-1.56 3.3-1.23 3.3-1.23.66 1.65.24 2.88.12 3.18.765.84 1.23 1.905 1.23 3.225 0 4.605-2.805 5.625-5.475 5.925.435.375.81 1.095.81 2.22 0 1.605-.015 2.895-.015 3.3 0 .315.225.69.825.57A12.02 12.02 0 0 0 24 12c0-6.63-5.37-12-12-12z" /> | ||
| </svg> | ||
| ), | ||
| }, | ||
| { | ||
| name: "X / Twitter", | ||
| desc: "Follow for updates", | ||
| href: "https://twitter.com/", | ||
| icon: ( | ||
| <svg width="16" height="16" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"> | ||
| <path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" /> | ||
| </svg> | ||
| ), | ||
| }, | ||
| { | ||
| name: "LinkedIn", | ||
| desc: "Connect with the team", | ||
| href: "https://linkedin.com/", | ||
| icon: ( | ||
| <svg width="16" height="16" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"> | ||
| <path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433a2.062 2.062 0 0 1-2.063-2.065 2.064 2.064 0 1 1 2.063 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z" /> | ||
| </svg> | ||
| ), | ||
| }, | ||
| { | ||
| name: "Discord", | ||
| desc: "Join the community", | ||
| href: "#", | ||
| icon: ( | ||
| <svg width="16" height="16" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"> | ||
| <path d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0 12.64 12.64 0 0 0-.617-1.25.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057c.002.022.015.042.031.056a19.9 19.9 0 0 0 5.993 3.03.077.077 0 0 0 .084-.028 14.09 14.09 0 0 0 1.226-1.994.075.075 0 0 0-.041-.106 13.107 13.107 0 0 1-1.872-.892.077.077 0 0 1-.008-.128 10.2 10.2 0 0 0 .372-.292.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127 12.299 12.299 0 0 1-1.873.892.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028 19.839 19.839 0 0 0 6.002-3.03.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03z" /> | ||
| </svg> | ||
| ), | ||
| }, | ||
| ].map((s) => ( |
There was a problem hiding this comment.
Point these links at real CodeLens contact channels.
Right now these URLs are generic homepages, and the Discord entry is just "#", so none of them actually take the user to the project team/admin. That misses the core goal of issue #146: providing a clear way to contact CodeLens.
🤖 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 `@frontend/src/pages/Contact.jsx` around lines 24 - 65, The social links in
Contact.jsx are pointing to generic sites (and Discord is "#"); update the hrefs
in the inline social links array (the object literals mapped with .map((s) =>
...)) to the real CodeLens channels: the project's GitHub repo URL, the
project's X/Twitter handle, the CodeLens LinkedIn company page, and a valid
Discord invite link (replace the "#" value). If you have centralized
config/constants for contact URLs (e.g. CONTACT_LINKS or env vars), use those
instead of hardcoding so future changes are single-source.
|
@kunalverma2512 |
write them as it is |
|
@coderabbitai please check whether this PR is ready to merge and is it compatible with nearby codes in codebase |
|
Tip For best results, initiate chat on the files or code changes. 🧩 Analysis chain🏁 Script executed: #!/bin/bash
echo "=== Contact.jsx ==="
cat frontend/src/pages/Contact.jsx
echo ""
echo "=== App.jsx (routes) ==="
cat frontend/src/App.jsx
echo ""
echo "=== Navbar.jsx (contact-related lines) ==="
grep -n -i "contact" frontend/src/components/shared/Navbar.jsx -A2 -B2
echo ""
echo "=== Existing pages structure ==="
fd . frontend/src/pages --type f
echo ""
echo "=== Sample existing page for pattern comparison ==="
cat frontend/src/pages/Home.jsx 2>/dev/null || echo "Home.jsx not found"
echo ""
echo "=== Check for unused imports pattern in Contact.jsx ==="
grep -n "useRef\|useState\|useNavigate" frontend/src/pages/Contact.jsx
echo ""
echo "=== Check other pages for form handling patterns ==="
rg "handleSubmit|FormData|fetch\|axios" frontend/src/pages/ -n -A2 -B2Length of output: 18783 The PR description images show a well-designed Contact page with a two-column desktop layout and properly stacked mobile layout matching the site's brutalist design language. The navigation integration also looks clean in the mobile expanded menu.
✅ Compatible with the codebase
❌ Not ready to merge — blockers found🔴 Critical Bug — Runtime crash on form submitLine 8 uses // ❌ Wrong — will crash at runtime
const formData = new formData(e.target)
// ✅ Fix
const formData = new FormData(e.target)🟠 Unused imports (dead code)Lines 1–2 import // ❌ Remove these — none are used
import { useRef, useState } from "react";
import { useNavigate } from "react-router-dom";🟠 Form has no backend integration
🟡 Minor issues (should fix before merge)
Summary: The form will crash on every submit due to the |
|
@coderabbitai i want in this pr to just create UI and not actual functioning |
|
Tip For best results, initiate chat on the files or code changes. The PR description images show a clean two-column desktop layout and properly stacked mobile view, matching the site's brutalist design language well.
✅ No longer blockers (deferred by design):
🔴 Still needs fixing (even for UI-only):
Once those two small things are cleaned up, the PR should be good to merge. The routing and navbar integration are already solid. 👍 (ㆁᴗㆁ✿) |
|
@anujsharma8d work on coderabbitai suggestions |
|
@kunalverma2512 |
There was a problem hiding this comment.
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
frontend/src/pages/Contact.jsx (1)
93-93:⚠️ Potential issue | 🟡 Minor | ⚡ Quick winChange the second heading to h2 for better accessibility.
Having two
h1elements on a single page breaks the document outline and harms accessibility. The page should have oneh1(line 21 already serves this role), and subsequent section headings should useh2.♿ Proposed fix for heading hierarchy
- <h1 className="text-2xl font-black uppercase leading-none tracking-tight text-black sm:text-2xl lg:text-2xl">Send us a message</h1> + <h2 className="text-2xl font-black uppercase leading-none tracking-tight text-black sm:text-2xl lg:text-2xl">Send us a message</h2>🤖 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 `@frontend/src/pages/Contact.jsx` at line 93, The "Send us a message" heading is an h1 but should be an h2 to maintain a single h1 on the page; locate the JSX element with className "text-2xl font-black uppercase leading-none tracking-tight text-black sm:text-2xl lg:text-2xl" and change the tag from h1 to h2 (preserve the className and inner text) so styling remains but the document outline uses h2 for this section.
🤖 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.
Outside diff comments:
In `@frontend/src/pages/Contact.jsx`:
- Line 93: The "Send us a message" heading is an h1 but should be an h2 to
maintain a single h1 on the page; locate the JSX element with className
"text-2xl font-black uppercase leading-none tracking-tight text-black
sm:text-2xl lg:text-2xl" and change the tag from h1 to h2 (preserve the
className and inner text) so styling remains but the document outline uses h2
for this section.
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: 06235e37-031f-455e-b0be-bcb9fe028c4d
📒 Files selected for processing (1)
frontend/src/pages/Contact.jsx
|
@coderabbitai please check whether this PR is ready to merge and is it compatible with nearby codes in codebase |
|
Tip For best results, initiate chat on the files or code changes. 🧩 Analysis chain🏁 Script executed: #!/bin/bash
echo "=== Contact.jsx (current) ==="
cat frontend/src/pages/Contact.jsx
echo ""
echo "=== Navbar contact additions ==="
grep -n -i "contact" frontend/src/components/shared/Navbar.jsx -A2 -B2
echo ""
echo "=== App.jsx contact route ==="
grep -n -i "contact" frontend/src/App.jsx -A2 -B2Length of output: 10853 The PR description images show the clean two-column desktop layout and properly responsive mobile view, all consistent with the site's brutalist design language.
✅ Ready to merge
Remaining minor items (all acceptable for this UI-only PR per your earlier decision):
The PR is compatible with the existing codebase and good to merge. 👍 (ᵔᴥᵔ) 🧠 Learnings used |
|
@kunalverma2512 |
|
@anujsharma8d for better communication regarding project join new channel : https://matrix.to/#/#codelensx:matrix.org |
|
@kunalverma2512 Please attach labels for GSSoC. |
kunalverma2512
added
enhancement
2 participants
📌 Pull Request Summary
🔗 Related Issue
Closes #146
📝 Description
Added a contact us page on the website and add a contact us button in the navbar.
Changes Made
Motivation
There is no contact page for users to reach the team.
🚀 Type of Change
Select all that apply:
🧪 Testing
Verification
📸 Screenshots / Demo (If Applicable)
✅ Checklist
Summary by CodeRabbit