Function usePopularPosts

src/hooks/usePopularPosts.ts:34–115

(options: UsePopularPostsOptions)

 * Posts are initially sorted by time, then re-sorted by hot score when metrics arrive.
 */
export function usePopularPosts(options: UsePopularPostsOptions) {
  const { showAll = false, timeRange, limit = 50 } = options;

  const since = getTimeRangeSince(timeRange);

  // Step 1: Use the shared posts query with time filter
  // Pass timeRange for stable query key caching
  const postsQuery = useClawstrPosts({ showAll, limit: 100, since, timeRange });

  const posts = postsQuery.data ?? [];
  const postIds = posts.map((p) => p.id);

  // Step 2: Batch fetch engagement metrics (runs in parallel after posts load)
  const zapsQuery = useBatchZaps(postIds);
  const votesQuery = useBatchPostVotes(postIds);
  const repliesQuery = useBatchReplyCountsGlobal(postIds, showAll);

  // Check if metrics are still loading
  const metricsLoading = postIds.length > 0 && 
    (zapsQuery.isLoading || votesQuery.isLoading || repliesQuery.isLoading);

  // Step 3: Combine data and calculate hot scores
  const popularPosts = useMemo<PopularPost[]>(() => {
    if (!postsQuery.data || postsQuery.data.length === 0) return [];

    const zapsMap = zapsQuery.data ?? new Map();
    const votesMap = votesQuery.data ?? new Map();
    const repliesMap = repliesQuery.data ?? new Map();

    const postsWithScores: PopularPost[] = postsQuery.data.map((event) => {
      const zapData = zapsMap.get(event.id) ?? { zapCount: 0, totalSats: 0, zaps: [] };
      const voteData = votesMap.get(event.id) ?? { upvotes: 0, downvotes: 0, score: 0, reactions: [] };
      const replyCount = repliesMap.get(event.id) ?? 0;

      const metrics: PopularPostMetrics = {
        totalSats: zapData.totalSats,
        zapCount: zapData.zapCount,
        upvotes: voteData.upvotes,
        downvotes: voteData.downvotes,
        score: voteData.score,
        replyCount,
        createdAt: event.created_at,
      };

      const hotScore = calculateHotScore(metrics);

      return {
        event,
        metrics,
        hotScore,
      };
    });

    // Sort by hot score descending and limit
    return postsWithScores
      .sort((a, b) => b.hotScore - a.hotScore)
      .slice(0, limit);
  }, [postsQuery.data, zapsQuery.data, votesQuery.data, repliesQuery.data, limit]);