Fix: Profile Syncing #9994
Fix: Profile Syncing #9994
Conversation
WalkthroughThe pull request modifies the Changes
Assessment against linked issues
Possibly related PRs
Suggested labels
Suggested reviewers
Poem
📜 Recent review detailsConfiguration used: CodeRabbit UI 📒 Files selected for processing (1)
🚧 Files skipped from review as they are similar to previous changes (1)
⏰ Context from checks skipped due to timeout of 90000ms (6)
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
✅ Deploy Preview for care-ohc ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (2)
src/components/Users/UserAvatar.tsx (2)
63-63: Consider invalidating queries in the error callback.While the success case is handled well, consider also invalidating queries in the error callback to ensure consistency if the upload partially succeeded but the XHR status wasn't 200.
}, null, - () => { + async () => { + await queryClient.invalidateQueries({ queryKey: ["currentUser"] }); onError(); },
Line range hint
84-86: Consider invalidating queries in the error case.Similar to the upload handler, consider invalidating queries in the error case to ensure consistency if the deletion partially succeeded but the response wasn't ok.
} else { + await queryClient.invalidateQueries({ queryKey: ["currentUser"] }); onError(); }
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
src/components/Users/UserAvatar.tsx(4 hunks)
⏰ Context from checks skipped due to timeout of 90000ms (2)
- GitHub Check: cypress-run (1)
- GitHub Check: OSSAR-Scan
🔇 Additional comments (3)
src/components/Users/UserAvatar.tsx (3)
2-2: LGTM! Good addition of React Query for cache management.The integration of
useQueryClientis a good approach for managing cache invalidation.Also applies to: 34-34
81-82: LGTM! Good sequencing of operations.The order of operations is correct: invalidate cache first, then show the success message.
63-63: Verify consistent usage of "currentUser" query key.Let's verify that the "currentUser" query key is consistently used across the codebase and identify any other components that might need similar cache invalidation.
Also applies to: 81-81
✅ Verification successful
"currentUser" query key usage is consistent and correct
The query key is consistently used across the codebase:
- Defined as
["currentUser", accessToken]for fetching current user data- Invalidated as
["currentUser"]after user-related changes and auth state changes- No inconsistencies or missing invalidations found
🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Search for other usages of the "currentUser" query key rg -l "currentUser.*queryKey|queryKey.*currentUser" # Search for similar avatar-related components that might need cache invalidation ast-grep --pattern 'profile_picture|avatar'Length of output: 225
Script:
#!/bin/bash # Check how currentUser query key is used in each file echo "=== AddFacilitySheet.tsx ===" rg "currentUser.*queryKey|queryKey.*currentUser" src/pages/Organization/components/AddFacilitySheet.tsx -B 2 -A 2 echo -e "\n=== UserAvatar.tsx ===" rg "currentUser.*queryKey|queryKey.*currentUser" src/components/Users/UserAvatar.tsx -B 2 -A 2 echo -e "\n=== AuthUserProvider.tsx ===" rg "currentUser.*queryKey|queryKey.*currentUser" src/Providers/AuthUserProvider.tsx -B 2 -A 2Length of output: 1652
|
@rithviknishad Any changes required ? |
src/components/Users/UserAvatar.tsx
Outdated
| refetchUserData?.(); | ||
| await queryClient.invalidateQueries({ queryKey: ["currentUser"] }); |
There was a problem hiding this comment.
we can skip awaiting the query invalidation. toast can be shown right after the mutation has upload/delete has completed without waiting for invalidation to complete.
| await queryClient.invalidateQueries({ queryKey: ["currentUser"] }); | |
| queryClient.invalidateQueries({ queryKey: ["currentUser"] }); |
src/components/Users/UserAvatar.tsx
Outdated
| @@ -58,6 +60,7 @@ export default function UserAvatar({ | |||
| if (xhr.status === 200) { | |||
| await sleep(1000); | |||
| refetchUserData?.(); | |||
| await queryClient.invalidateQueries({ queryKey: ["currentUser"] }); | |||
src/components/Users/UserAvatar.tsx
Outdated
| @@ -58,6 +60,7 @@ export default function UserAvatar({ | |||
| if (xhr.status === 200) { | |||
| await sleep(1000); | |||
| refetchUserData?.(); | |||
There was a problem hiding this comment.
now that we are invalidating the query, do we need to call refetchUserData?
check what the callees are doing with it and see if we can remove this.
rithviknishad
added
changes required
and removed
question
|
@Jeffrin2005 Your efforts have helped advance digital healthcare and TeleICU systems. 🚀 Thank you for taking the time out to make CARE better. We hope you continue to innovate and contribute; your impact is immense! 🙌 |
Proposed Changes
Fixes Profile Not Syncing with Sidebar Navigation #9960
used invalidateQueries
v1.mp4
@ohcnetwork/care-fe-code-reviewers
Merge Checklist
Summary by CodeRabbit