Skip to content

Fix session selector showing errors during slow loading#264

Open
jhodapp wants to merge 5 commits intomainfrom
255-bug-sessionsgoals-in-the-session-selector-dropdown-show-as-an-error-while-theyre-actually-loading-slowly
Open

Fix session selector showing errors during slow loading#264
jhodapp wants to merge 5 commits intomainfrom
255-bug-sessionsgoals-in-the-session-selector-dropdown-show-as-an-error-while-theyre-actually-loading-slowly

Conversation

@jhodapp
Copy link
Member

@jhodapp jhodapp commented Feb 5, 2026

Description

Fix the session selector dropdown showing "Error loading goal" messages when goals are actually just loading slowly due to network latency or database connection resource exhaustion on the backend. This was caused by an N+1 query pattern where each session item made its own API call.

GitHub Issue: Fixes #255

Changes

  • Replace N+1 query pattern with single useEnrichedCoachingSessionsForUser batch request
  • Add relationshipId parameter to listForUser and useEnrichedCoachingSessionsForUser for backend filtering
  • Replace plain text loading states with Skeleton components in dropdown
  • Add Spinner loading indicators for display value
  • Improve styling for loading/error/empty states
  • Extract EntityApiError class to dedicated file (src/types/entity-api-error.ts)
  • Add EntityApiError.isEntityApiError() static type guard method
  • Add isServiceUnavailable() method for future use

Screenshots / Videos Showing UI Changes (if applicable)

  • Loading state now shows skeleton placeholders instead of "Loading goal..." or "Error loading goal"
  • Spinner appears in the selector trigger during loading

Testing Strategy

  1. Open browser DevTools → Network tab
  2. Navigate to a coaching session page
  3. Open the session selector dropdown
  4. Verify only 1 API request to /users/{userId}/coaching_sessions (not N+1)
  5. Throttle network to "Slow 3G" and verify skeleton loading appears instead of error messages

Concerns

None - this is a straightforward optimization that maintains existing functionality while improving UX and performance.

Resolves the issue where session/goal items showed "Error loading goal"
during slow network conditions by eliminating the N+1 query pattern.

- Use useEnrichedCoachingSessionsForUser with include=goal for batch loading
- Add relationshipId parameter to filter sessions on the backend
- Replace plain text loading states with Skeleton and Spinner components
- Improve UX with proper loading indicators instead of error-like messages
@jhodapp jhodapp self-assigned this Feb 5, 2026
@jhodapp jhodapp added bug fix Fixes a specific Issue enhancement Improves existing functionality or feature labels Feb 5, 2026
@jhodapp jhodapp moved this to 🏗 In progress in Refactor Coaching Platform Feb 5, 2026
@jhodapp jhodapp added this to the 1.0.0-beta3 milestone Feb 5, 2026
- Move EntityApiError class from general.ts to entity-api-error.ts
- Add static type guard: EntityApiError.isEntityApiError()
- Add isServiceUnavailable() method for 503 status detection
- Handle 503 errors in session selector with user-friendly message
- Re-export from general.ts for backward compatibility
@jhodapp jhodapp moved this from 🏗 In progress to Review in Refactor Coaching Platform Feb 5, 2026
Copy link
Member Author

@jhodapp jhodapp Feb 5, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

FYI: Just moved this existing class from general.ts to its own type file entity-api-error.ts - this should have been done a while ago.

@jhodapp jhodapp requested a review from calebbourg February 5, 2026 23:49
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

bug fix Fixes a specific Issue enhancement Improves existing functionality or feature

Projects

Status: Review

Development

Successfully merging this pull request may close these issues.

[Bug]: Sessions/goals in the session selector dropdown show as an error while they're actually loading slowly

1 participant