🔄 Sync: [TanStack Query Optimization] Refactor profile update to useMutation#259
🔄 Sync: [TanStack Query Optimization] Refactor profile update to useMutation#259ldsgroups225 wants to merge 1 commit intomasterfrom
Conversation
Migrates manual `isSaving` state and `try/catch` logic to a proper TanStack Query `useMutation` in the profile page, aligning with the project's standard data synchronization practices.
|
👋 Jules, reporting for duty! I'm here to lend a hand with this pull request. When you start a review, I'll add a 👀 emoji to each comment to let you know I've read it. I'll focus on feedback directed at me and will do my best to stay out of conversations between you and other bots or reviewers to keep the noise down. I'll push a commit with your requested changes shortly after. Please note there might be a delay between these steps, but rest assured I'm on the job! For more direct control, you can switch me to Reactive Mode. When this mode is on, I will only act on comments where you specifically mention me with New to Jules? Learn more at jules.google/docs. For security, I will only act on instructions from the user who triggered this task. |
|
You have reached your Codex usage limits for code reviews. You can see your limits in the Codex usage dashboard. |
📝 WalkthroughWalkthroughThe teacher app's profile component was refactored to use React Query's Changes
Estimated code review effort🎯 2 (Simple) | ⏱️ ~12 minutes Poem
🚥 Pre-merge checks | ✅ 2 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (2 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches📝 Generate docstrings
🧪 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 |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (1)
apps/teacher/src/routes/_auth/app/profile.tsx (1)
90-95: Consider adding Zod schema validation for form input.The current validation only checks if
newNameis non-empty. Per coding guidelines, form inputs in routes should be validated using Zod schemas from@repo/data-ops/zod-schema/*.Additionally,
newNameshould be passed tomutate()so the mutation has access to the value being saved:💡 Suggested improvement
+ import { z } from 'zod' + + const profileUpdateSchema = z.object({ + name: z.string().min(1).max(100), + }) const handleUpdateProfile = () => { - if (!newName.trim()) - return - - updateProfileMutation.mutate() + const result = profileUpdateSchema.safeParse({ name: newName.trim() }) + if (!result.success) { + toast.error(LL.profile.invalidName?.() ?? 'Invalid name') + return + } + updateProfileMutation.mutate({ name: result.data.name }) }And update the mutation to accept variables:
- const updateProfileMutation = useMutation({ - mutationFn: async () => { + const updateProfileMutation = useMutation({ + mutationFn: async (variables: { name: string }) => { // TODO: Call actual profile update API with variables.name return Promise.resolve() },As per coding guidelines: "Validate all form inputs and server function inputs using Zod schemas from
@repo/data-ops/zod-schema/*"🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@apps/teacher/src/routes/_auth/app/profile.tsx` around lines 90 - 95, The handler handleUpdateProfile currently only checks newName.trim() and calls updateProfileMutation.mutate() with no data; add Zod validation using the appropriate schema from `@repo/data-ops/zod-schema/`* (e.g., a profile/updateName schema) to validate newName before mutating, and pass the validated value into updateProfileMutation.mutate({ name: validatedName }); also update the mutation resolver (the function referenced by updateProfileMutation) to accept and validate the incoming variables with the same Zod schema so the server-side receives typed/validated input.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@apps/teacher/src/routes/_auth/app/profile.tsx`:
- Around line 72-86: The current updateProfileMutation's mutationFn is a
placeholder that doesn't persist the newName state and mutate() is called
without arguments; replace the stub in updateProfileMutation (mutationFn) to
call the real server-side profile update function (e.g., updateProfile or an
equivalent data-ops function) and accept typed input (e.g., { name: string }),
then call mutate({ name: newName }) from the UI instead of mutate() so newName
is passed through; only show LL.profile.updated(), close the editor
(setIsEditProfileOpen(false)) and call router.invalidate() after the server call
succeeds; also ensure you validate the current session/auth before invoking
updateProfile (check session or a validateSession helper) and surface server
errors in onError (toast.error and console.error) so persistence is ensured
before signaling success.
---
Nitpick comments:
In `@apps/teacher/src/routes/_auth/app/profile.tsx`:
- Around line 90-95: The handler handleUpdateProfile currently only checks
newName.trim() and calls updateProfileMutation.mutate() with no data; add Zod
validation using the appropriate schema from `@repo/data-ops/zod-schema/`* (e.g.,
a profile/updateName schema) to validate newName before mutating, and pass the
validated value into updateProfileMutation.mutate({ name: validatedName }); also
update the mutation resolver (the function referenced by updateProfileMutation)
to accept and validate the incoming variables with the same Zod schema so the
server-side receives typed/validated input.
🪄 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: b582774b-271b-44fb-a4b5-bc1d9be1d078
📒 Files selected for processing (1)
apps/teacher/src/routes/_auth/app/profile.tsx
| const updateProfileMutation = useMutation({ | ||
| mutationFn: async () => { | ||
| // simulate save | ||
| return Promise.resolve() | ||
| }, | ||
| onSuccess: () => { | ||
| toast.success(LL.profile.updated()) | ||
| setIsEditProfileOpen(false) | ||
| router.invalidate() // Refresh data | ||
| } | ||
| catch (error) { | ||
| }, | ||
| onError: (error) => { | ||
| console.error('Failed to update profile', error) | ||
| toast.error(LL.profile.updateError()) | ||
| } | ||
| finally { | ||
| setIsSaving(false) | ||
| } | ||
| }, | ||
| }) |
There was a problem hiding this comment.
🧩 Analysis chain
🏁 Script executed:
#!/bin/bash
# Check if there's an existing profile update API/server function in the codebase
echo "=== Searching for profile update functions ==="
rg -n -C3 'updateProfile|update.*profile|profile.*update' --type ts --type tsx -g '!*.test.*' -g '!*.spec.*' || echo "No matches found"
echo ""
echo "=== Searching for user update mutations ==="
rg -n -C3 'updateUser|user.*update' --type ts --type tsx -g '!*.test.*' -g '!*.spec.*' || echo "No matches found"
echo ""
echo "=== Checking auth client methods ==="
rg -n 'authClient\.' apps/teacher/src/ | head -20Repository: ldsgroups225/Yeko
Length of output: 571
🏁 Script executed:
#!/bin/bash
# Read the complete profile.tsx file to understand the full context
echo "=== Reading profile.tsx file ==="
wc -l apps/teacher/src/routes/_auth/app/profile.tsx
echo ""
echo "=== Content of profile.tsx ==="
cat -n apps/teacher/src/routes/_auth/app/profile.tsx
echo ""
echo "=== Searching for profile/user update API routes ==="
find apps/teacher/src/routes -name "*.ts" -o -name "*.tsx" | xargs grep -l "profile\|user" 2>/dev/null | head -10Repository: ldsgroups225/Yeko
Length of output: 17057
🏁 Script executed:
#!/bin/bash
# Search for any server-side mutations or server actions related to profile/user updates
echo "=== Searching for server functions in data-ops ==="
find . -path "*/data-ops/*" -name "*.ts" | xargs grep -l "profile\|updateUser\|updateProfile" 2>/dev/null | head -10
echo ""
echo "=== Searching for any POST/PUT endpoints in routes ==="
rg -n "POST|PUT|PATCH" apps/teacher/src/routes/ --type ts 2>/dev/null | grep -i "profile\|user" | head -10
echo ""
echo "=== Checking if there's a useUpdateProfile or similar hook ==="
rg -n "useUpdateProfile|useUpdateUser\|useMutation" apps/teacher/src/ | grep -i profileRepository: ldsgroups225/Yeko
Length of output: 447
🏁 Script executed:
#!/bin/bash
# Check if this is part of a larger refactor or intentional scaffolding
echo "=== Looking for TODO or FIXME comments related to profile ==="
rg -n "TODO|FIXME|WIP" apps/teacher/src/routes/_auth/app/profile.tsx
echo ""
echo "=== Checking git status or recent changes (if available) ==="
git log --oneline apps/teacher/src/routes/_auth/app/profile.tsx 2>/dev/null | head -5 || echo "Git history not available"
echo ""
echo "=== Checking for env or config related to profile API ==="
rg -n "profile.*api\|profile.*endpoint" apps/teacher/src/ --type ts --type tsx 2>/dev/null | head -10Repository: ldsgroups225/Yeko
Length of output: 307
🏁 Script executed:
#!/bin/bash
# Check the write.ts files in data-ops to see available functions
echo "=== Checking data-ops write functions ==="
cat -n ./packages/data-ops/src/queries/school-admin/users/write.ts | head -50
echo ""
echo "=== Searching for any update or write functions exported from data-ops ==="
rg -n "export.*function|export const" ./packages/data-ops/src/queries/ | grep -i "user\|profile" | head -20
echo ""
echo "=== Check what's available in data-ops index or main exports ==="
find ./packages/data-ops/src -name "index.ts" -o -name "index.js" | xargs cat 2>/dev/null | head -30Repository: ldsgroups225/Yeko
Length of output: 6387
Mutation is a placeholder that doesn't persist newName.
The mutationFn resolves immediately without calling an actual API or server function to update the profile. The newName value from state is never passed to the mutation—mutate() is called without arguments on line 94. Consequently:
router.invalidate()will re-fetch unchanged session data- The success toast misleads the user into thinking their name was saved
- No user profile update function exists in data-ops yet
To complete this implementation:
- Create or locate the profile update server function
- Pass
newNameto the mutation:mutate({ name: newName })with proper types - Ensure the mutation actually persists changes before showing the success toast
- Verify the session is validated before executing the mutation (per auth requirements)
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.
In `@apps/teacher/src/routes/_auth/app/profile.tsx` around lines 72 - 86, The
current updateProfileMutation's mutationFn is a placeholder that doesn't persist
the newName state and mutate() is called without arguments; replace the stub in
updateProfileMutation (mutationFn) to call the real server-side profile update
function (e.g., updateProfile or an equivalent data-ops function) and accept
typed input (e.g., { name: string }), then call mutate({ name: newName }) from
the UI instead of mutate() so newName is passed through; only show
LL.profile.updated(), close the editor (setIsEditProfileOpen(false)) and call
router.invalidate() after the server call succeeds; also ensure you validate the
current session/auth before invoking updateProfile (check session or a
validateSession helper) and surface server errors in onError (toast.error and
console.error) so persistence is ensured before signaling success.
1 participant
What
Refactored the profile update flow in
apps/teacher/src/routes/_auth/app/profile.tsxto use TanStack Query'suseMutationinstead of localisSavingstate.Why
To align with TanStack Query v5 best practices and the application's global mutation tracking patterns. Manual
try/catchwith local boolean loading states (isSaving) is an anti-pattern whenuseMutationhandles this out of the box withonSuccess/onErrorcallbacks and.isPendingstates.Impact on performance
Minimal, but improves code maintainability and sets the stage for future global mutation tracking or optimistic updates.
Measurement / Verification
pnpm --filter yeko-teacher test --exclude e2e-testspnpm --filter yeko-teacher typecheckPR created automatically by Jules for task 10182944810760341213 started by @ldsgroups225
Summary by CodeRabbit