cameron.stream / co
A React Native app for the ultimate thinking partner.
fork atom

fix: load more messages to show recent history after streaming and on refresh

Fixed issue where recent messages weren't loading after streaming completion
or on app refresh, showing only ~10 old messages from the middle of history.

Root causes:
1. Stale closure: Stream completion callback used old 'messages' state
to calculate fetch limit, resulting in fetching too few messages
2. Initial load limit too low: INITIAL_LOAD_LIMIT was only 20, so refresh
only loaded 20 messages (less after filtering system messages)
3. Insufficient buffer: Only adding 5 extra messages after streaming

Solutions:
- Use setMessages callback to access current state (fixes stale closure)
- Increase INITIAL_LOAD_LIMIT from 20 to 100 for better initial load
- Increase stream completion minimum from 50 to 100 messages
- Increase buffer from +5 to +10 messages
- Add detailed logging to debug message fetching

Now users see:
- 100 most recent messages on refresh (instead of 20)
- Proper message count after streaming completes
- All recent messages including newly created ones

Added console logs to track:
- Current message count before fetching
- How many messages will be fetched
- How many messages received from server
- First and last message IDs in response

cameron.stream 6d3f2366 53271685

+12 -5
+12 -5
App.tsx
··· 82 82 // Message state 83 83 const [messages, setMessages] = useState<LettaMessage[]>([]); 84 84 const PAGE_SIZE = 50; 85 - const INITIAL_LOAD_LIMIT = 20; 85 + const INITIAL_LOAD_LIMIT = 100; // Increased to show more history by default 86 86 const [earliestCursor, setEarliestCursor] = useState<string | null>(null); 87 87 const [hasMoreBefore, setHasMoreBefore] = useState<boolean>(false); 88 88 const [isLoadingMore, setIsLoadingMore] = useState<boolean>(false); ··· 699 699 // Wait for server to finalize messages 700 700 setTimeout(async () => { 701 701 try { 702 - // Count how many messages we currently have (excluding temp messages) 703 - const currentCount = messages.filter(msg => !msg.id.startsWith('temp-')).length; 704 - const fetchLimit = Math.max(currentCount + 5, 50); // Fetch at least current count + some buffer 702 + // Use setMessages callback to get current state and calculate fetch limit 703 + let fetchLimit = 100; // Default minimum increased to be safer 705 704 706 - console.log('[STREAM COMPLETE] Current message count:', currentCount, 'Fetching:', fetchLimit); 705 + setMessages(prev => { 706 + const currentCount = prev.filter(msg => !msg.id.startsWith('temp-')).length; 707 + fetchLimit = Math.max(currentCount + 10, 100); // Fetch more buffer 708 + console.log('[STREAM COMPLETE] Current message count:', currentCount, 'Will fetch:', fetchLimit); 709 + return prev; // Don't change messages yet 710 + }); 707 711 708 712 // Fetch recent messages with enough limit to cover what we had plus new ones 709 713 const recentMessages = await lettaApi.listMessages(coAgent.id, { ··· 712 716 }); 713 717 714 718 console.log('[STREAM COMPLETE] Received', recentMessages.length, 'messages from server'); 719 + console.log('[STREAM COMPLETE] First message ID:', recentMessages[0]?.id); 720 + console.log('[STREAM COMPLETE] Last message ID:', recentMessages[recentMessages.length - 1]?.id); 715 721 716 722 if (recentMessages.length > 0) { 717 723 // Replace messages entirely with server response (this removes temp messages) 718 724 setMessages(filterFirstMessage(recentMessages)); 725 + console.log('[STREAM COMPLETE] Updated messages state'); 719 726 } 720 727 } catch (error) { 721 728 console.error('Failed to fetch finalized messages:', error);