From d2ebcd8fbe0a5525da22d7fd3512861fc0ca76b1 Mon Sep 17 00:00:00 2001
From: Gigi <dergigi@pm.me>
Date: Sun, 12 Oct 2025 23:25:05 +0200
Subject: [PATCH] ux(explore): keep posts visible during refresh; inline
 spinner; no list wipe

---
 src/components/Explore.tsx | 22 +++++++++++-----------
 1 file changed, 11 insertions(+), 11 deletions(-)

diff --git a/src/components/Explore.tsx b/src/components/Explore.tsx
index 91ee344d..e871217b 100644
--- a/src/components/Explore.tsx
+++ b/src/components/Explore.tsx
@@ -110,17 +110,6 @@ const Explore: React.FC<ExploreProps> = ({ relayPool }) => {
     return `/a/${naddr}`
   }
 
-  if (loading) {
-    return (
-      <div className="explore-container">
-        <div className="explore-loading">
-          <FontAwesomeIcon icon={faSpinner} spin size="2x" />
-          <p>Loading blog posts from your friends...</p>
-        </div>
-      </div>
-    )
-  }
-
   if (error) {
     return (
       <div className="explore-container">
@@ -143,6 +132,12 @@ const Explore: React.FC<ExploreProps> = ({ relayPool }) => {
           Discover blog posts from your friends on Nostr
         </p>
       </div>
+      {loading && (
+        <div className="explore-loading" style={{ display: 'flex', alignItems: 'center', gap: '0.5rem', padding: '0.5rem 0' }}>
+          <FontAwesomeIcon icon={faSpinner} spin />
+          <span>Refreshing posts…</span>
+        </div>
+      )}
       <div className="explore-grid">
         {blogPosts.map((post) => (
           <BlogPostCard
@@ -151,6 +146,11 @@ const Explore: React.FC<ExploreProps> = ({ relayPool }) => {
             href={getPostUrl(post)}
           />
         ))}
+        {!loading && blogPosts.length === 0 && (
+          <div className="explore-empty" style={{ gridColumn: '1/-1', textAlign: 'center', color: 'var(--text-secondary)' }}>
+            <p>No blog posts found yet.</p>
+          </div>
+        )}
       </div>
     </div>
   )