feat(chat): hide "load older messages" until first batch received

Previously the "load older messages" button would appear immediately when opening
a chat, even before the first batch of messages had loaded. This was confusing
as we don't yet know if there are older messages to load.

This change adds state tracking to only show the button after the first batch
of messages has been received, providing better UX and avoiding premature
display of the load button.

Changes:
- Add hasLoadedFirstBatch state to track initial message load
- Show button only after first batch is received
- Reset flag when conversation changes

src/components/ChatViewer.tsx

@@ -534,6 +534,9 @@ export function ChatViewer({
 
   // Cleanup subscriptions when conversation changes or component unmounts
   useEffect(() => {
+    // Reset first batch flag when conversation changes
+    setHasLoadedFirstBatch(false);
+
     return () => {
       if (conversation) {
         adapter.cleanup(conversation.id);
@@ -547,6 +550,13 @@ export function ChatViewer({
     [adapter, conversation],
   );
 
+  // Track when first batch of messages has loaded
+  useEffect(() => {
+    if (messages && messages.length > 0 && !hasLoadedFirstBatch) {
+      setHasLoadedFirstBatch(true);
+    }
+  }, [messages, hasLoadedFirstBatch]);
+
   // Process messages to include day markers
   const messagesWithMarkers = useMemo(() => {
     if (!messages || messages.length === 0) return [];
@@ -588,6 +598,7 @@ export function ChatViewer({
   // State for loading older messages
   const [isLoadingOlder, setIsLoadingOlder] = useState(false);
   const [hasMore, setHasMore] = useState(true);
+  const [hasLoadedFirstBatch, setHasLoadedFirstBatch] = useState(false);
 
   // Ref to Virtuoso for programmatic scrolling
   const virtuosoRef = useRef<VirtuosoHandle>(null);
@@ -998,6 +1009,7 @@ export function ChatViewer({
             components={{
               Header: () =>
                 hasMore &&
+                hasLoadedFirstBatch &&
                 conversationResult.status === "success" &&
                 protocol !== "nip-10" ? (
                   <div className="flex justify-center py-2">