diff options
Diffstat (limited to 'site/src/components')
| -rw-r--r-- | site/src/components/NewsFeed.tsx | 14 |
1 files changed, 13 insertions, 1 deletions
diff --git a/site/src/components/NewsFeed.tsx b/site/src/components/NewsFeed.tsx index 95183a1..0151975 100644 --- a/site/src/components/NewsFeed.tsx +++ b/site/src/components/NewsFeed.tsx @@ -1,4 +1,4 @@ -import { useState } from "react"; +import { useState, useEffect } from "react"; import { getGameTitle } from "../utils.ts"; import { useSearchParams } from "react-router-dom"; @@ -33,12 +33,24 @@ export const NewsFeed: React.FC<NewsFeedProps> = ({ newsItems }) => { const toggleLanguage = (id: string) => setShowEnglish((prev) => ({ ...prev, [id]: !prev[id] })); const toggleExpand = (id: string) => setExpanded((prev) => ({ ...prev, [id]: !prev[id] })); const changeImage = (id: string, i: number) => { + if (currentImageIndex[id] == i) + return setCurrentImageIndex((p) => ({ ...p, [id]: i })); setLoadingImages((p) => ({ ...p, [id]: true })); }; const handleImageLoad = (id: string) => setLoadingImages((p) => ({ ...p, [id]: false })); const PREVIEW_CHAR_LIMIT = 600; + useEffect(() => { + const initialImageIndex: Record<string, number> = {}; + newsItems.forEach((news) => { + const contentHash = news.content.split('').reduce((hash, char) => ((hash << 5) + hash) + char.charCodeAt(0), 5381) >>> 0; + const newsId = `${news.identifier}-${news.timestamp}-${contentHash.toString(16)}-${news.headline}`; + initialImageIndex[newsId] = 0; + }); + setCurrentImageIndex(initialImageIndex); + }, [newsItems]); + return ( <div className="max-w-[600px] w-full mx-auto py-8 space-y-4 font-[Zen_Maru_Gothic]"> {newsItems.map((news) => { |
