[HIGH] Stabilize AuthContext provider value - prevent consumer re-render cascade #34

New issue

Closed

opened 2026-06-09 00:03:13 +00:00 by Mark · 0 comments

Mark commented

2026-06-09 00:03:13 +00:00

Owner

Location: src/contexts/AuthContext.tsx:155-172

Problem: Provider value object is recreated as a new inline object literal on every render. All useAuth() consumers re-render unconditionally.

Impact: Unnecessary re-render cascade across the entire auth-dependent component tree on every state change.

Fix:

const value = useMemo(() => ({
  user, token, isLoading, isAuthenticated, login, register,
  logout, updatePayday, error, clearError,
}), [user, token, isLoading, isAuthenticated, error]);

Effort: ~30 mins

**Location:** `src/contexts/AuthContext.tsx:155-172` **Problem:** Provider `value` object is recreated as a new inline object literal on every render. All `useAuth()` consumers re-render unconditionally. **Impact:** Unnecessary re-render cascade across the entire auth-dependent component tree on every state change. **Fix:** ```ts const value = useMemo(() => ({ user, token, isLoading, isAuthenticated, login, register, logout, updatePayday, error, clearError, }), [user, token, isLoading, isAuthenticated, error]); ``` **Effort:** ~30 mins