Profile page feature#515
Conversation
✅ Deploy Preview for github-spy ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
|
Warning Review limit reached
More reviews will be available in 32 minutes and 2 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 (7)
📝 WalkthroughWalkthroughAdds a complete Profile feature: reusable profile UI components and pages, GitHub data hooks, Tracker persistence to localStorage, login session persistence, logout service, Navbar conditional auth UI, Router routes, CSS tweak, and a package dependency for the contributions calendar. ChangesProfile and Authentication UI
Sequence Diagram(s)sequenceDiagram
participant User
participant LoginPage
participant localStorage
participant Tracker
participant ProfilePage
User->>LoginPage: Submit credentials
LoginPage->>LoginPage: Validate & receive user
LoginPage->>localStorage: setItem("user", user)
LoginPage->>User: Navigate to /home
User->>Tracker: Submit username to track
Tracker->>Tracker: fetchProfile / fetchRepositories / fetchActivity
Tracker->>localStorage: setItem("githubDashboard", dashboard)
User->>ProfilePage: Navigate to /me
ProfilePage->>localStorage: getItem("githubDashboard")
ProfilePage->>User: Render profile UI components
sequenceDiagram
participant User
participant Navbar
participant ProfileDropDown
participant logoutUser
participant Backend
participant localStorage
User->>Navbar: Page load
Navbar->>localStorage: getItem("user")
Navbar->>User: Render authenticated UI
User->>ProfileDropDown: Click Logout
ProfileDropDown->>logoutUser: invoke()
logoutUser->>Backend: GET /api/auth/logout
Backend-->>logoutUser: Response
logoutUser->>localStorage: clear()
logoutUser->>User: Redirect to /login
Estimated code review effort🎯 4 (Complex) | ⏱️ ~75 minutes Possibly related issues
Possibly related PRs
Suggested labels
Poem
🚥 Pre-merge checks | ✅ 3 | ❌ 2❌ Failed checks (2 inconclusive)
✅ Passed checks (3 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 |
There was a problem hiding this comment.
🎉 Thank you @Pran-bot for your contribution. Please make sure your PR follows https://github.com/GitMetricsLab/github_tracker/blob/main/CONTRIBUTING.md#-pull-request-guidelines
There was a problem hiding this comment.
Actionable comments posted: 4
🧹 Nitpick comments (3)
src/components/Navbar.tsx (1)
19-19: ⚡ Quick winRemove the user debug log in navbar render.
Line 19 logs the full user object on every render, including email. Please remove this debug output.
🤖 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/Navbar.tsx` at line 19, Remove the debug console.log in the Navbar component: locate the console.log("User", user) statement inside the Navbar render (or function) and delete it so the component no longer logs the full user object (including email) on every render; ensure no other stray debug console.log calls remain in the Navbar.tsx file.src/components/Profile/ProfileDropDown.tsx (2)
50-57: ⚡ Quick winRemove auth-flow debug logs from this component.
Lines 50-57 add console logging in logout paths. Please remove or gate these behind a dev-only logger.
🤖 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/Profile/ProfileDropDown.tsx` around lines 50 - 57, In ProfileDropDown.tsx, remove the auth-flow debug console.log calls in the logout handler (the console.log(response.data.message) in both success/error branches and console.log("Logout failed", error) in the catch) or wrap them behind a dev-only guard (e.g., if (process.env.NODE_ENV === 'development') { ... }) so no auth debug output is emitted in production; locate these calls inside the component's logout handler (e.g., handleLogout) and either delete them or replace them with the guarded logging.
48-48: ⚡ Quick winUse React Router navigation instead of
window.location.hreffor the logout redirect.
window.location.href = "/login"forces a full page reload;useNavigate()keeps routing SPA-consistent.Suggested fix
+import { useNavigate } from "react-router-dom"; ... const ProfileDropDown = ({ user }: UserProps) => { + const navigate = useNavigate(); ... - window.location.href = "/login"; + navigate("/login");🤖 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/Profile/ProfileDropDown.tsx` at line 48, The logout redirect in ProfileDropDown uses window.location.href = "/login" which causes a full reload; replace it with React Router navigation by importing useNavigate from 'react-router-dom', call const navigate = useNavigate() inside the ProfileDropDown component, and use navigate('/login') in the logout handler (replace the window.location.href line). Ensure the import and the navigate call are inside the same component scope so routing remains SPA-consistent.
🤖 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 `@src/components/Navbar.tsx`:
- Around line 17-18: The Navbar currently calls JSON.parse on the value returned
by localStorage.getItem("user") which can throw for malformed data; update the
logic in the Navbar component to safely parse storedUser (wrap JSON.parse in
try/catch or use a small safeParse helper) so that on parse error you remove or
reset the bad localStorage key (localStorage.removeItem("user") or set it to
null) and set user to null (or a safe default) instead of letting the exception
propagate; target the storedUser and user initialization in the Navbar component
and ensure the code still returns a valid render path when parsing fails.
- Around line 123-131: The mobile view currently only renders a Login Link when
user is falsy, leaving authenticated mobile users without account controls; in
Navbar.tsx update the conditional rendering that uses user and setIsOpen to
render a mobile account menu when user is truthy (instead of the Login Link)
that includes links/actions for Profile/Edit and Logout (each should call
setIsOpen(false) on click and Logout should invoke the existing logout
handler/function used elsewhere in the component); ensure the new mobile entries
match styling of the removed Login Link and reuse any existing route paths or
methods (e.g., Profile route, edit profile route, and the component's logout
function) so authenticated users have profile and logout access on mobile.
In `@src/components/Profile/ProfileDropDown.tsx`:
- Around line 108-118: In ProfileDropDown.tsx the "My Profile" and "Edit
Profile" buttons are non-functional; update the two button elements in the
ProfileDropDown component to perform navigation or actions (e.g., wrap with a
Link to the appropriate routes or add onClick handlers that call
useRouter().push('/profile') and useRouter().push('/profile/edit') or dispatch
your profile modal open action), ensuring you reference the exact button
elements that render the User and Settings icons so the menu items actually
navigate to the profile view and edit flow.
In `@src/pages/Login/Login.tsx`:
- Around line 37-38: Guard the localStorage write so a storage error won't block
navigation: in the Login component where you call localStorage.setItem("user",
JSON.stringify(response.data.user)) immediately before navigate("/home"), wrap
the setItem in a try/catch (or feature-detect localStorage) and swallow/log any
exceptions, then always call navigate("/home") regardless of whether storing
succeeded; reference the localStorage.setItem call and the navigate("/home")
invocation in your change so the write failure doesn't prevent navigation.
---
Nitpick comments:
In `@src/components/Navbar.tsx`:
- Line 19: Remove the debug console.log in the Navbar component: locate the
console.log("User", user) statement inside the Navbar render (or function) and
delete it so the component no longer logs the full user object (including email)
on every render; ensure no other stray debug console.log calls remain in the
Navbar.tsx file.
In `@src/components/Profile/ProfileDropDown.tsx`:
- Around line 50-57: In ProfileDropDown.tsx, remove the auth-flow debug
console.log calls in the logout handler (the console.log(response.data.message)
in both success/error branches and console.log("Logout failed", error) in the
catch) or wrap them behind a dev-only guard (e.g., if (process.env.NODE_ENV ===
'development') { ... }) so no auth debug output is emitted in production; locate
these calls inside the component's logout handler (e.g., handleLogout) and
either delete them or replace them with the guarded logging.
- Line 48: The logout redirect in ProfileDropDown uses window.location.href =
"/login" which causes a full reload; replace it with React Router navigation by
importing useNavigate from 'react-router-dom', call const navigate =
useNavigate() inside the ProfileDropDown component, and use navigate('/login')
in the logout handler (replace the window.location.href line). Ensure the import
and the navigate call are inside the same component scope so routing remains
SPA-consistent.
🪄 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: 6be55666-d717-4368-96af-541fd2a6205b
📒 Files selected for processing (4)
backend/routes/auth.jssrc/components/Navbar.tsxsrc/components/Profile/ProfileDropDown.tsxsrc/pages/Login/Login.tsx
There was a problem hiding this comment.
Actionable comments posted: 12
🤖 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 `@src/components/Navbar.tsx`:
- Around line 140-158: Add an "Edit Profile" entry to the authenticated mobile
menu between the existing "My Profile" Link and the Logout button: render a Link
(same component used for "My Profile") with text "Edit Profile", a to="/me/edit"
route (or the app's existing edit-profile route if different), the same classes
as the "My Profile" Link, and onClick={() => setIsOpen(false)} so the menu
closes on navigation; keep the surrounding conditional that checks user and
leave logoutUser unchanged.
In `@src/components/Profile/ContributionHeatmap.tsx`:
- Around line 9-16: The heatmap's container currently renders 50 fixed-size
cells in a single row (see the div with className "flex gap-2" in
ContributionHeatmap and the cell div using "h-8 w-8"); this overflows on small
screens—enable wrapping by changing the container to allow wrapping (e.g., add
flex-wrap or switch to a responsive CSS grid) and make the cell sizes responsive
(use smaller tailwind classes for mobile like h-4 w-4 or sm:h-8 sm:w-8) so the
mapped cells reflow instead of overflowing horizontally.
In `@src/components/Profile/EditProfileForm.tsx`:
- Around line 29-38: handleSubmit currently prevents default and only logs
formData, so edits are never persisted; replace the no-op with a proper save
flow: call the profile update API or Redux action (e.g., updateProfile or
saveUserProfile) using the current formData inside handleSubmit, await the
response, handle success by updating local state or dispatching the resulting
user data and navigating/closing the form, and handle errors by showing a
validation/error message and not leaving the form. Also add loading state
toggling in handleSubmit so the Save Changes button (and any optimistic UI) is
disabled while the request is in-flight and ensure form validation runs before
sending.
- Around line 74-79: The avatar upload button in EditProfileForm.tsx is an
icon-only control (the button containing the Camera component) and lacks an
accessible name; add an appropriate aria-label (e.g., aria-label="Upload avatar"
or "Change profile photo") to the button element so screen readers can identify
its action, and ensure the label text matches the UI terminology used elsewhere
for consistency.
- Line 35: Remove the debug console.log(formData) from the submit flow in
EditProfileForm.tsx (the submit handler that references formData); either delete
the log entirely or replace it with a safe, non-sensitive debug mechanism (e.g.,
only log in development via process.env.NODE_ENV === 'development' or use a
sanitized object omitting email/bio/location). Ensure no personal fields (email,
bio, location) are printed to the console when handling form submission.
- Around line 92-170: The labels in the EditProfileForm JSX are not
programmatically linked to their controls; update each <label> to include
htmlFor and add a matching id on the corresponding <input> or <textarea> (use
the control's name, e.g., id="username", id="email", id="location", id="github",
id="bio") so label click focuses the control and screen readers can associate
them; make these changes inside the EditProfileForm component where handleChange
and formData are used.
In `@src/components/Profile/ProfileDropDown.tsx`:
- Around line 85-87: The dropdown stays open after navigation because menu
actions don't update the `open` state; for each interactive item in
ProfileDropDown (the Link to "/me" and the other menu items around the same
area), add an onClick handler that closes the menu by calling the dropdown close
routine (e.g., setOpen(false) or the existing closeMenu/closeDropdown function)
so selecting Profile/Edit/Logout will reset `open` and hide the menu
before/after navigation. Ensure the same fix is applied to all menu items
referenced in the comment.
In `@src/components/Profile/ProfileHeader.tsx`:
- Around line 13-15: The Connect GitHub button in ProfileHeader.tsx is missing
an onClick handler; add an event handler (e.g., handleConnectGitHub) in the
ProfileHeader component and bind it to the button's onClick to start the OAuth
flow (for example, open the GitHub auth endpoint or call a provided
connectGitHub prop/API method), handle success/error responses and update
component state (loading/disabled) accordingly, and ensure the button uses that
handler instead of being inert.
In `@src/components/Profile/ProfileSidebar.tsx`:
- Around line 8-25: The sidebar currently renders hardcoded profile data (image
src, <h1> Deep Patel, role paragraph, and the location/followers/repositories
<p> elements) instead of using the authenticated user's data; update
ProfileSidebar to accept or consume the authenticated user (e.g., a user prop or
useAuth/useUser hook) and replace the hardcoded values with the corresponding
user fields (avatar/url, name, title/role, location, followersCount, repoCount)
so the JSX elements (img src/alt, <h1>, and the <p> entries) render dynamic
profile data from the authenticated user object.
In `@src/pages/Profile/ProfilePage.tsx`:
- Line 12: The ProfilePage container div (className="min-h-screen bg-black
text-white p-6") hard-codes dark theme colors, preventing the page from
following the app theme toggle; replace bg-black and text-white with theme-aware
utility classes (e.g., use bg-white/ bg-black fallbacks or dark: variants like
bg-white dark:bg-black and text-black dark:text-white) on the div in
ProfilePage.tsx so the page responds to the app's light/dark theme state while
keeping padding and min-h-screen intact.
- Around line 13-38: The layout uses fixed grid classes causing poor mobile
rendering; update the container and child grid classes to be responsive: change
the outer container's "grid grid-cols-12" to use responsive breakpoints (e.g.,
"grid grid-cols-1 md:grid-cols-12"), change the sidebar and main content spans
(ProfileSidebar and ProfileHeader wrapper) from "col-span-3" and "col-span-9" to
"col-span-12 md:col-span-3" and "col-span-12 md:col-span-9", change the stats
grid ("grid-cols-4") to a responsive set like "grid grid-cols-1 sm:grid-cols-2
lg:grid-cols-4" for StatsCard, and change the lower content grid ("grid-cols-2")
to "grid grid-cols-1 md:grid-cols-2" for RepositoryList and LanguageChart so
components (ContributionHeatmap, RepositoryList, LanguageChart, StatsCard) stack
properly on small screens.
In `@src/services/auth.ts`:
- Around line 9-24: The logout flow currently only clears storage and redirects
when response.data is truthy and still attempts to read response.data.message in
the falsy branch; make the cleanup unconditional by moving
localStorage.removeItem("user") and window.location.href = "/login" outside the
if (response.data) block so they always run, and guard any logging of the server
message by checking response.data before dereferencing (e.g., use
response.data?.message or an existence check before console.log) inside the
function handling the logout response.
🪄 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: 96054aa3-eb35-448c-925c-64c046df76df
📒 Files selected for processing (17)
src/Routes/Router.tsxsrc/components/Navbar.tsxsrc/components/Profile/AchievementCard.tsxsrc/components/Profile/ContributionHeatmap.tsxsrc/components/Profile/EditProfileForm.tsxsrc/components/Profile/LanguageChart.tsxsrc/components/Profile/ProfileDropDown.tsxsrc/components/Profile/ProfileHeader.tsxsrc/components/Profile/ProfileSidebar.tsxsrc/components/Profile/RecentActivity.tsxsrc/components/Profile/RepoStats.tsxsrc/components/Profile/RepositoryList.tsxsrc/components/Profile/StatsCard.tsxsrc/pages/Login/Login.tsxsrc/pages/Profile/EditProfilePage.tsxsrc/pages/Profile/ProfilePage.tsxsrc/services/auth.ts
✅ Files skipped from review due to trivial changes (1)
- src/components/Profile/AchievementCard.tsx
There was a problem hiding this comment.
Actionable comments posted: 14
♻️ Duplicate comments (1)
src/services/auth.ts (1)
6-26:⚠️ Potential issue | 🟠 Major | ⚡ Quick winMake logout cleanup truly unconditional and avoid clearing unrelated local storage.
At Line 18 and Line 20, cleanup/redirect only run when the request succeeds; a failed request leaves the session UI state intact. Also,
localStorage.clear()removes unrelated persisted keys.Suggested fix
export const logoutUser = async (): Promise<void> => { - try { - const response = await axios.get( - `${backendUrl}/api/auth/logout` - ); - - // Safe logging - if (response.data?.message) { - console.log(response.data.message); - } - - // Always cleanup + redirect - localStorage.clear(); - - window.location.href = "/login"; - - } catch (error) { - - console.error("Logout failed", error); - - } + try { + const response = await axios.get(`${backendUrl}/api/auth/logout`); + if (response.data?.message) { + console.log(response.data.message); + } + } catch (error) { + console.error("Logout failed", error); + } finally { + localStorage.removeItem("user"); + localStorage.removeItem("githubDashboard"); + window.location.href = "/login"; + } };🤖 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/services/auth.ts` around lines 6 - 26, The logout flow currently performs cleanup (localStorage.clear() and window.location.href="/login") only on success; move the cleanup and redirect into a finally block so they run regardless of axios.get(`${backendUrl}/api/auth/logout`) success, and replace the broad localStorage.clear() with targeted removals (e.g., localStorage.removeItem for auth/session keys used by your app) to avoid wiping unrelated persisted data; keep the safe logging of response.data?.message in the try block and ensure window.location.href and targeted localStorage removals occur in finally.
🤖 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 `@src/components/Navbar.tsx`:
- Around line 150-156: The mobile menu Link that navigates to "/profile/edit"
has the wrong label; update the text children of the Link (the JSX element using
Link to="/profile/edit" and onClick={() => setIsOpen(false)}) from "My Profile"
to "Edit Profile" so the visible label matches the edit route.
In `@src/components/Profile/LanguageChart.tsx`:
- Around line 6-22: The percentage calculation in LanguageChart (where total is
computed from languages and percentage is set via (count / total) * 100) can
divide by zero when total === 0; update the logic in the map (the block that
computes percentage) to guard against total === 0 by setting percentage = 0 (or
using a conditional like total ? Math.round((count/total)*100) : 0), and
likewise protect any subsequent usage (the label and the bar width render logic
around lines 44-46) to use the guarded percentage value so no NaN/Infinity
propagates into text or style widths.
In `@src/components/Profile/ProfileDropDown.tsx`:
- Around line 19-32: The useEffect reading "githubDashboard" from localStorage
uses JSON.parse directly which can throw on malformed data; update the effect in
ProfileDropDown.tsx to safely parse by wrapping
JSON.parse(localStorage.getItem("githubDashboard") || "{}") in a try/catch (or
use a small helper like safeParse) and fall back to an empty object on error,
then call setAvatar(dashboard.profile?.avatar_url || ""); ensure you reference
the existing useEffect, localStorage.getItem("githubDashboard"), and setAvatar
when applying the change.
In `@src/components/Profile/ProfileSidebar.tsx`:
- Around line 24-25: In ProfileSidebar.tsx update the invalid Tailwind class
names used on the avatar <img> and the location row: replace the non-existent
utilities "h-45 w-45" on the avatar element with valid JIT bracket syntax like
"h-[45px] w-[45px]" and change "items-left" to the correct "items-start" on the
container that aligns the location row; search for the avatar <img> in the
ProfileSidebar component and update its className string and likewise update the
className on the element that currently uses items-left.
In `@src/components/Profile/RecentActivity.tsx`:
- Around line 33-35: The label for the "IssueCommentEvent" case in the
RecentActivity component is incorrect; update the switch case handling
"IssueCommentEvent" (in RecentActivity.tsx) to return a comment-specific label
such as "Commented on an issue" (or similar phrasing) instead of "Created an
issue" so the UI accurately reflects commenting activity.
- Line 50: The collapsed/expanded threshold is inconsistent: update
RecentActivity to use a single constant (e.g., VISIBLE_COUNT) and apply it to
both visibleActivities and the show-more button condition so items 4–5 aren’t
hidden; replace the hardcoded slice(0, 3) in the visibleActivities computation
and the activities.length > 5 check with the same VISIBLE_COUNT (use slice(0,
VISIBLE_COUNT) and activities.length > VISIBLE_COUNT) and update any references
to showAll logic accordingly.
In `@src/hooks/useGithubActivity.ts`:
- Around line 10-26: fetchActivity currently can throw if getOctokit() returns
null or octokit.request fails and is invoked from handleSubmit without awaiting,
causing unhandled rejections; fix by adding a null guard after calling
getOctokit() in fetchActivity (return early and optionally setActivities([]) or
set an error state if octokit is null), wrap the octokit.request call in
try/catch and handle/log the error (and avoid rethrowing), and update the caller
(handleSubmit/Tracker) to either await fetchActivity(username) or handle the
returned promise with .catch to prevent unhandled promise rejections.
In `@src/hooks/useGithubRepos.ts`:
- Around line 39-50: The current useGithubRepos hook only fetches the first page
(per_page: 100) via octokit.request and computes totals from response.data;
modify useGithubRepos to retrieve all paginated results before computing stats
by either using octokit.paginate("GET /users/{username}/repos", {username,
per_page: 100, sort: "updated"}) or loop over page numbers (adding page param)
and concatenate each response.data into repositories, then run the existing
totals/top-language calculations against the full accumulated repositories array
(replace the single response.data usage with the combined list).
In `@src/hooks/useProfileData.ts`:
- Around line 17-19: The hook useGitHubProfile's fetchProfile currently always
calls the authenticated GET /user endpoint, which can mix profile data with
repos/activity fetched for another username; modify fetchProfile (in
useGitHubProfile) to accept an optional username parameter and when provided
call the username-scoped endpoint GET /users/:username (fall back to GET /user
when no username), and update the Tracker component call site in
src/pages/Tracker/Tracker.tsx to pass the entered username into fetchProfile so
profile, repos and activity are all requested for the same user.
In `@src/pages/Profile/EditProfilePage.tsx`:
- Around line 22-27: Wrap the unguarded JSON.parse calls in EditProfilePage (the
code that sets the dashboard const from localStorage and the similar parse
around lines 62–67 used during save) in a try/catch and fall back to a safe
default (e.g., {}). Specifically, replace direct
JSON.parse(localStorage.getItem("githubDashboard") || "{}") with a guarded parse
that catches any SyntaxError, returns {} on failure, and logs or silently
handles the error; alternatively extract into a small helper like
safeParseDashboard(value) and use that in both places to avoid duplication.
Ensure the variable name 'dashboard' and the save-time parse use this guarded
logic so malformed localStorage won’t break render or save.
- Around line 334-335: The Cancel button's onClick in EditProfilePage currently
calls navigate("/profile") which points to the wrong route; update the onClick
handler (the navigate call used in the Cancel button within the EditProfilePage
component) to navigate("/me") so it matches the registered profile route. Ensure
you change the literal route string passed to navigate in the Cancel button's
onClick and run the app to verify the Cancel now returns to "/me".
In `@src/pages/Profile/ProfilePage.tsx`:
- Around line 32-37: Wrap the JSON.parse of
localStorage.getItem("githubDashboard") used to create the dashboard variable in
a try/catch to avoid throwing on malformed JSON: call
localStorage.getItem("githubDashboard"), attempt JSON.parse(...) inside try, on
error set dashboard = {} (and optionally log the parse error), ensuring any code
that uses dashboard remains safe; update the dashboard initialization in
ProfilePage (the dashboard constant) to use this guarded parse and fallback.
- Around line 38-52: The code sets state via setUserInfo and setStats but only
guards for dashboard.profile and dashboard.repositories; add a check that
dashboard.analytics exists (or use optional chaining/defaults) before accessing
dashboard.analytics.totalIssues and dashboard.analytics.totalPrs so the
ProfilePage component won't crash; update the conditional that surrounds the
setUserInfo/setStats block to include dashboard.analytics (or change the pulls
to use dashboard.analytics?.totalIssues ?? 0 and dashboard.analytics?.totalPrs
?? 0) so setStats uses safe defaults when analytics is missing.
In `@src/pages/Tracker/Tracker.tsx`:
- Around line 196-224: The useEffect that writes to localStorage
(localStorage.setItem in the useEffect) is missing a dependency array and blocks
persistence when repos or activities are empty arrays; change the guard to only
return when profile is falsy or repos/activities are null/undefined (e.g., repos
== null || activities == null) so empty arrays are allowed, and add a proper
dependency array for the effect including profile plus all values used to build
gitHubDashBoard (repos, totalStars, totalForks, topRepositories, languages,
totalIssues, totalPrs, activities) so the effect runs only when those inputs
change.
---
Duplicate comments:
In `@src/services/auth.ts`:
- Around line 6-26: The logout flow currently performs cleanup
(localStorage.clear() and window.location.href="/login") only on success; move
the cleanup and redirect into a finally block so they run regardless of
axios.get(`${backendUrl}/api/auth/logout`) success, and replace the broad
localStorage.clear() with targeted removals (e.g., localStorage.removeItem for
auth/session keys used by your app) to avoid wiping unrelated persisted data;
keep the safe logging of response.data?.message in the try block and ensure
window.location.href and targeted localStorage removals occur in finally.
🪄 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: 1a53b4cd-ee44-4dec-ae02-08c734a177ca
📒 Files selected for processing (18)
package.jsonsrc/App.csssrc/components/Navbar.tsxsrc/components/Profile/ContributionHeatmap.tsxsrc/components/Profile/LanguageChart.tsxsrc/components/Profile/ProfileDropDown.tsxsrc/components/Profile/ProfileHeader.tsxsrc/components/Profile/ProfileSidebar.tsxsrc/components/Profile/RecentActivity.tsxsrc/components/Profile/RepositoryList.tsxsrc/components/Profile/StatsCard.tsxsrc/hooks/useGithubActivity.tssrc/hooks/useGithubRepos.tssrc/hooks/useProfileData.tssrc/pages/Profile/EditProfilePage.tsxsrc/pages/Profile/ProfilePage.tsxsrc/pages/Tracker/Tracker.tsxsrc/services/auth.ts
✅ Files skipped from review due to trivial changes (1)
- package.json
🚧 Files skipped from review as they are similar to previous changes (2)
- src/components/Profile/StatsCard.tsx
- src/components/Profile/ProfileHeader.tsx
|
Actionable comments posted: 0 |
|
When will this PR get merged? |
Related Issue
Description
Added a responsive profile dropdown component for the navbar with storing login credentials in local Storage ,remaining to add profile page and edit profile page also logout functionality is remaining.
How Has This Been Tested?
Tested locally.
Screenshots (if applicable)
dark theme:


light theme:
Type of Change
Summary by CodeRabbit
New Features
Bug Fixes
Chores