diff --git a/src/pages/root.tsx b/src/pages/root.tsx index 6b80bc8..7e0ff1c 100644 --- a/src/pages/root.tsx +++ b/src/pages/root.tsx @@ -1,6 +1,6 @@ import "./root.css"; import { FormattedMessage } from "react-intl"; -import { useCallback } from "react"; +import { useCallback, useMemo } from "react"; import type { NostrEvent } from "@snort/system"; import { VideoTile } from "@/element/video-tile"; @@ -28,6 +28,20 @@ export function RootPage() { const plannedEvents = planned.filter(e => !mutedHosts.has(getHost(e))).filter(followsHost); const endedEvents = ended.filter(e => !mutedHosts.has(getHost(e))); + const liveByHashtag = useMemo(() => { + return hashtags + .map(t => ({ + tag: t, + live: live + .filter(e => !mutedHosts.has(getHost(e))) + .filter(e => { + const evTags = getTagValues(e.tags, "t"); + return evTags.includes(t); + }), + })) + .filter(t => t.live.length > 0); + }, [live, hashtags]); + return (
{hasFollowingLive && ( @@ -51,19 +65,13 @@ export function RootPage() { ))}
)} - {hashtags.map(t => ( + {liveByHashtag.map(t => ( <> -

#{t}

+

#{t.tag}

- {live - .filter(e => !mutedHosts.has(getHost(e))) - .filter(e => { - const evTags = getTagValues(e.tags, "t"); - return evTags.includes(t); - }) - .map(e => ( - - ))} + {t.live.map(e => ( + + ))}
))}