diff --git a/src/components/Explore.tsx b/src/components/Explore.tsx index c0936554..3ca08747 100644 --- a/src/components/Explore.tsx +++ b/src/components/Explore.tsx @@ -316,9 +316,18 @@ const Explore: React.FC = ({ relayPool, eventStore, settings, acti const renderTabContent = () => { switch (activeTab) { case 'writings': + if (showSkeletons) { + return ( +
+ {Array.from({ length: 6 }).map((_, i) => ( + + ))} +
+ ) + } return filteredBlogPosts.length === 0 ? ( -
-

No blog posts found yet.

+
+

No blog posts yet. Pull to refresh!

) : (
@@ -333,9 +342,18 @@ const Explore: React.FC = ({ relayPool, eventStore, settings, acti ) case 'highlights': + if (showSkeletons) { + return ( +
+ {Array.from({ length: 8 }).map((_, i) => ( + + ))} +
+ ) + } return classifiedHighlights.length === 0 ? ( -
-

No highlights yet. Your friends should start highlighting content!

+
+

No highlights yet. Pull to refresh!

) : (
@@ -355,43 +373,9 @@ const Explore: React.FC = ({ relayPool, eventStore, settings, acti } } - // Only show full loading screen if we don't have any data yet + // Show content progressively - no blocking error screens const hasData = highlights.length > 0 || blogPosts.length > 0 - - if (loading && !hasData) { - return ( -
-
-

- - Explore -

-
-
- {activeTab === 'writings' ? ( - Array.from({ length: 6 }).map((_, i) => ( - - )) - ) : ( - Array.from({ length: 8 }).map((_, i) => ( - - )) - )} -
-
- ) - } - - if (error) { - return ( -
-
- -

{error}

-
-
- ) - } + const showSkeletons = loading && !hasData return (
diff --git a/src/components/Me.tsx b/src/components/Me.tsx index 95b537ef..34466095 100644 --- a/src/components/Me.tsx +++ b/src/components/Me.tsx @@ -195,56 +195,28 @@ const Me: React.FC = ({ relayPool, activeTab: propActiveTab, pubkey: pr .filter(hasContentOrUrl) .sort((a, b) => ((b.added_at || 0) - (a.added_at || 0)) || ((b.created_at || 0) - (a.created_at || 0))) - // Only show full loading screen if we don't have any data yet + // Show content progressively - no blocking error screens const hasData = highlights.length > 0 || bookmarks.length > 0 || readArticles.length > 0 || writings.length > 0 - - if (loading && !hasData) { - return ( -
- {viewingPubkey && ( -
- -
- )} -
- {activeTab === 'writings' ? ( - Array.from({ length: 6 }).map((_, i) => ( - - )) - ) : activeTab === 'highlights' ? ( - Array.from({ length: 8 }).map((_, i) => ( - - )) - ) : ( - Array.from({ length: 6 }).map((_, i) => ( - - )) - )} -
-
- ) - } - - if (error) { - return ( -
-
- -

{error}

-
-
- ) - } + const showSkeletons = loading && !hasData const renderTabContent = () => { switch (activeTab) { case 'highlights': + if (showSkeletons) { + return ( +
+ {Array.from({ length: 8 }).map((_, i) => ( + + ))} +
+ ) + } return highlights.length === 0 ? ( -
+

{isOwnProfile - ? 'No highlights yet. Start highlighting content to see them here!' - : 'No highlights yet. You should shame them on nostr!'} + ? 'No highlights yet. Pull to refresh!' + : 'No highlights yet. Pull to refresh!'}

) : ( @@ -261,9 +233,20 @@ const Me: React.FC = ({ relayPool, activeTab: propActiveTab, pubkey: pr ) case 'reading-list': + if (showSkeletons) { + return ( +
+
+ {Array.from({ length: 6 }).map((_, i) => ( + + ))} +
+
+ ) + } return allIndividualBookmarks.length === 0 ? ( -
-

No bookmarks yet. Bookmark articles to see them here!

+
+

No bookmarks yet. Pull to refresh!

) : (
@@ -312,9 +295,18 @@ const Me: React.FC = ({ relayPool, activeTab: propActiveTab, pubkey: pr ) case 'archive': + if (showSkeletons) { + return ( +
+ {Array.from({ length: 6 }).map((_, i) => ( + + ))} +
+ ) + } return readArticles.length === 0 ? ( -
-

No read articles yet. Mark articles as read to see them here!

+
+

No read articles yet. Pull to refresh!

) : (
@@ -329,25 +321,21 @@ const Me: React.FC = ({ relayPool, activeTab: propActiveTab, pubkey: pr ) case 'writings': + if (showSkeletons) { + return ( +
+ {Array.from({ length: 6 }).map((_, i) => ( + + ))} +
+ ) + } return writings.length === 0 ? ( -
+

{isOwnProfile - ? 'No articles written yet. Publish your first article to see it here!' - : ( - <> - No articles written. You can find other stuff from this user using{' '} - - ants - - . - - )} + ? 'No articles written yet. Pull to refresh!' + : 'No articles written yet. Pull to refresh!'}

) : (