From c81b2c0a1d55b9eeaca613323e692701cd969ea7 Mon Sep 17 00:00:00 2001 From: enes Date: Wed, 6 Nov 2024 13:12:19 +0100 Subject: [PATCH] refactor(home): fetch latest blogs in parallel w/ nsfw filter --- src/pages/home.tsx | 50 ++++++++++++++++++++++++++++++++++++---------- 1 file changed, 39 insertions(+), 11 deletions(-) diff --git a/src/pages/home.tsx b/src/pages/home.tsx index 3346d7e..5532e22 100644 --- a/src/pages/home.tsx +++ b/src/pages/home.tsx @@ -10,13 +10,15 @@ import { LANDING_PAGE_DATA } from '../constants' import { useDidMount, useGames, + useLocalStorage, useMuteLists, useNDKContext, useNSFWList } from '../hooks' import { appRoutes, getModPageRoute } from '../routes' -import { BlogCardDetails, ModDetails } from '../types' +import { BlogCardDetails, ModDetails, NSFWFilter, SortBy } from '../types' import { + extractBlogCardDetails, extractModData, handleModImageError, log, @@ -29,11 +31,14 @@ import '../styles/SimpleSlider.css' import '../styles/styles.css' // Import Swiper styles -import { filterForEventsTaggingId, NDKFilter } from '@nostr-dev-kit/ndk' +import { + filterForEventsTaggingId, + NDKEvent, + NDKFilter +} from '@nostr-dev-kit/ndk' import 'swiper/css' import 'swiper/css/navigation' import 'swiper/css/pagination' -import { extractBlogCardDetails } from 'utils/blog' export const HomePage = () => { const navigate = useNavigate() @@ -317,13 +322,15 @@ const Spinner = () => { const DisplayLatestBlogs = () => { const [blogs, setBlogs] = useState[]>() const { fetchEvents } = useNDKContext() - + const [filterOptions] = useLocalStorage('filter-blog-curated', { + sort: SortBy.Latest, + nsfw: NSFWFilter.Hide_NSFW + }) useDidMount(() => { const fetchBlogs = async () => { try { // Show maximum of 4 blog posts // 2 should be featured and the most recent 2 from blog npubs - // Populate the filter from known naddr (constants.ts) const filters: NDKFilter[] = [] for (let i = 0; i < LANDING_PAGE_DATA.featuredBlogPosts.length; i++) { @@ -350,25 +357,46 @@ const DisplayLatestBlogs = () => { '#a': [] } as NDKFilter ) - // Fetch featured blogs posts - const featuredBlogPosts = await fetchEvents(filter) - - // Fetch latest blog npubs posts + // Prepare filter for the latest const blogNpubs = import.meta.env.VITE_BLOG_NPUBS.split(',') const blogHexkeys = blogNpubs .map(npubToHex) .filter((hexkey) => hexkey !== null) // We fetch 4 posts in case of duplicates (from featured) - const latestBlogPosts = await fetchEvents({ + const latestFilter: NDKFilter = { authors: blogHexkeys, kinds: [kinds.LongFormArticle], limit: 4 + } + + // Filter by NSFW tag + // NSFWFilter.Show_NSFW -> filter not needed + // NSFWFilter.Only_NSFW -> true + // NSFWFilter.Hide_NSFW -> false + if (filterOptions.nsfw !== NSFWFilter.Show_NSFW) { + latestFilter['#nsfw'] = [ + (filterOptions.nsfw === NSFWFilter.Only_NSFW).toString() + ] + } + + const results = await Promise.allSettled([ + fetchEvents(filter), + fetchEvents(latestFilter) + ]) + + const events: NDKEvent[] = [] + // Get featured blogs posts result + results.forEach((r) => { + // Add events from both promises to the array + if (r.status === 'fulfilled' && r.value) { + events.push(...r.value) + } }) // Remove duplicates const unique = Array.from( - [...featuredBlogPosts, ...latestBlogPosts] + events .reduce((map, obj) => { map.set(obj.id, obj) return map