refactor: remove unnecessay WordCloud abstraction

frontend/src/pages/Stats.tsx

@@ -9,9 +9,14 @@ import {
   CartesianGrid,
   ResponsiveContainer
 } from "recharts";
-import WordCloud from "../stats/WordCloud";
-import ActivityHeatmap from "../stats/ActivityHeatmap";
 
+import ActivityHeatmap from "../stats/ActivityHeatmap";
+import { ReactWordcloud } from '@cp949/react-wordcloud';
+
+type BackendWord = {
+    word: string;
+    count: number;
+}
 
 const StatPage = () => {
   const [data, setData] = useState([]);
@@ -19,13 +24,14 @@ const StatPage = () => {
   const [loading, setLoading] = useState(true);
 
   const [heatmapData, setHeatmapData] = useState([]);
+  const [wordFrequencyData, setWordFrequencyData] = useState([]);
 
   useEffect(() => {
     // Posts per Day
     axios
         .get("http://localhost:5000/stats/events_per_day")
         .then(res => {
-        setData(res.data.filter((item: any) => new Date(item.date) >= new Date("2025-06-01")));
+          setData(res.data.filter((item: any) => new Date(item.date) >= new Date("2026-01-10")));
           setLoading(false);
         })
         .catch(err => {
@@ -44,6 +50,19 @@ const StatPage = () => {
           setError(err.response?.data?.error || "Failed to load heatmap data");
           setLoading(false);
       });
+
+      // Word Frequencies
+    axios
+        .get("http://localhost:5000/stats/word_frequencies")
+        .then(res => {
+            const mapped = res.data.map((d: BackendWord) => (
+                {text: d.word, value: d.count}
+            ));
+            setWordFrequencyData(mapped);
+        })
+        .catch(err => {
+            setError(err);
+        });
   }, []);
 
   if (loading) return <p>Loading posts per day…</p>;
@@ -68,7 +87,7 @@ const StatPage = () => {
       </ResponsiveContainer>
 
       <h2>Word Cloud</h2>
-      <WordCloud />
+      <ReactWordcloud words={wordFrequencyData}/>
 
       <h2>Heatmap</h2>
       <ActivityHeatmap data={heatmapData} />

frontend/src/stats/WordCloud.tsx

@@ -1,41 +0,0 @@
-import { ReactWordcloud } from '@cp949/react-wordcloud';
-import { useEffect, useState } from 'react';
-import axios from "axios";
-
-type BackendWord = {
-    word: string;
-    count: number;
-}
-
-const WordCloud = () => {
-    const [words, setWords] = useState<{ text: string; value: number }[]>([]);
-    const [error, setError] = useState<string>('');
-
-
-    useEffect(() => {
-        axios
-            .get("http://localhost:5000/stats/word_frequencies")
-            .then(res => {
-                const mapped = res.data.map((d: BackendWord) => (
-                    {text: d.word, value: d.count}
-                ));
-                setWords(mapped);
-            })
-            .catch(err => {
-                setError(err);
-            });
-
-    }, [])
-
-    return (
-        <div>
-            <ReactWordcloud
-                words={words}
-            />
-        
-            <p>{error}</p>
-        </div>
-    );
-};
-
-export default WordCloud;