Debug chat screen loading issue on mobile #44
Merged
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Co-authored-by: edgarpavlovsky <edgarpavlovsky@gmail.com>
|
Cursor Agent can help with this pull request. Just |
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Co-authored-by: edgarpavlovsky <edgarpavlovsky@gmail.com>
Co-authored-by: edgarpavlovsky <edgarpavlovsky@gmail.com>
Co-authored-by: edgarpavlovsky <edgarpavlovsky@gmail.com>
Co-authored-by: edgarpavlovsky <edgarpavlovsky@gmail.com>
![vercel[bot]](https://avatars.githubusercontent.com/in/8329?s=60&v=4){kind=small}
Fix syntax error in useActiveConversation.infiniteLoop.test.ts
- Add happy-dom as devDependency - Setup DOM environment in test-env.ts - Fix "document is not defined" errors in unit tests - Enable @testing-library/react renderHook to work The new useActiveConversation tests use renderHook which requires a DOM environment. happy-dom provides a lightweight DOM for testing.
When secure storage read fails, we now: - Catch the error specifically - Continue to create a new conversation - Only fail if conversation creation itself fails This ensures the app remains functional even if storage is broken.
Effects run synchronously in testing environment with happy-dom, making initial state checks unreliable. Focus on final state instead.
**Problem**: Real-time subscriptions were setting up before initial data load completed, causing real-time updates to be overwritten when the initial load's setState replaced the state. **Solution**: Add isInitialized guard: - Set isInitialized=false at start of data loading - Set isInitialized=true after data load completes - Real-time subscriptions only set up when isInitialized=true - This ensures subscriptions don't conflict with initial state replacement **Test**: Added integration test to verify race condition is prevented. Thanks to @vercel review agent for catching this!
Clean up temporary documentation files - not needed in repo
**Problem**: setIsInitialized(true) was only called on successful load, so if initial data fetch failed, real-time subscriptions would never start and users couldn't receive updates. **Fix**: Move setIsInitialized(true) to finally block so real-time subscriptions always initialize, even if initial load encounters errors. This ensures users can still receive real-time updates after recovering from network issues. Thanks to @vercel review agent for catching this!
**Problem**: When navigating back to chat-history, the loading spinner wouldn't show because: - Old conversations still in state (filteredConversations.length > 0) - isLoading only set to true inside async function (after delay) - UI condition: isLoading && filteredConversations.length === 0 = false **Fix**: Set isLoading(true) synchronously in useEffect before calling the async load function. This ensures the loading state is set immediately when navigation occurs. Thanks to @vercel review agent for catching this UX issue!
edgarpavlovsky
added a commit
that referenced
this pull request
Nov 8, 2025
* Refactor chat initialization and active conversation loading Co-authored-by: edgarpavlovsky <edgarpavlovsky@gmail.com> * Fix: Improve chat screen loading and navigation logic Co-authored-by: edgarpavlovsky <edgarpavlovsky@gmail.com> * feat: Add comprehensive infinite loop prevention tests Co-authored-by: edgarpavlovsky <edgarpavlovsky@gmail.com> * feat: Add comprehensive navigation loading tests Co-authored-by: edgarpavlovsky <edgarpavlovsky@gmail.com> * Fix: Add @ts-nocheck to bun test files Co-authored-by: edgarpavlovsky <edgarpavlovsky@gmail.com> * fix: Remove duplicate closing brace in test file Fix syntax error in useActiveConversation.infiniteLoop.test.ts * fix: Add happy-dom for React hooks testing - Add happy-dom as devDependency - Setup DOM environment in test-env.ts - Fix "document is not defined" errors in unit tests - Enable @testing-library/react renderHook to work The new useActiveConversation tests use renderHook which requires a DOM environment. happy-dom provides a lightweight DOM for testing. * fix: Use happy-dom v15 (v16 not available) * fix: Handle storage errors gracefully in useActiveConversation When secure storage read fails, we now: - Catch the error specifically - Continue to create a new conversation - Only fail if conversation creation itself fails This ensures the app remains functional even if storage is broken. * fix: Remove flaky initial state assertions in test Effects run synchronously in testing environment with happy-dom, making initial state checks unreliable. Focus on final state instead. * fix: Prevent race condition in chat-history real-time subscriptions **Problem**: Real-time subscriptions were setting up before initial data load completed, causing real-time updates to be overwritten when the initial load's setState replaced the state. **Solution**: Add isInitialized guard: - Set isInitialized=false at start of data loading - Set isInitialized=true after data load completes - Real-time subscriptions only set up when isInitialized=true - This ensures subscriptions don't conflict with initial state replacement **Test**: Added integration test to verify race condition is prevented. Thanks to @vercel review agent for catching this! * chore: Remove documentation markdown files Clean up temporary documentation files - not needed in repo * fix: Initialize real-time subscriptions even if initial load fails **Problem**: setIsInitialized(true) was only called on successful load, so if initial data fetch failed, real-time subscriptions would never start and users couldn't receive updates. **Fix**: Move setIsInitialized(true) to finally block so real-time subscriptions always initialize, even if initial load encounters errors. This ensures users can still receive real-time updates after recovering from network issues. Thanks to @vercel review agent for catching this! * fix: Show loading indicator when navigating back to chat-history **Problem**: When navigating back to chat-history, the loading spinner wouldn't show because: - Old conversations still in state (filteredConversations.length > 0) - isLoading only set to true inside async function (after delay) - UI condition: isLoading && filteredConversations.length === 0 = false **Fix**: Set isLoading(true) synchronously in useEffect before calling the async load function. This ensures the loading state is set immediately when navigation occurs. Thanks to @vercel review agent for catching this UX issue! --------- Co-authored-by: Cursor Agent <cursoragent@cursor.com>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Simplify chat and chat-history screen data loading to fix "Loading conversation history" stuck state on mobile/Safari.
The previous implementation used complex ref-based guards and pathname detection to prevent re-loading, which led to a race condition on mobile/Safari where the loading state was not reset. This PR removes these fragile guards, allowing React effects to naturally re-execute and load data when dependencies change or the component mounts.