From f62b807e0cc6796e119145e49491562af8f8e276 Mon Sep 17 00:00:00 2001
From: EvanLin3141 <evan.lin.3.141@gmail.com>
Date: Wed, 5 Mar 2025 19:59:09 +0000
Subject: [PATCH] FIX: Thumbnails show up on Content Box

---
 frontend/src/pages/UserPage.tsx | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/frontend/src/pages/UserPage.tsx b/frontend/src/pages/UserPage.tsx
index 0326050..46469a4 100644
--- a/frontend/src/pages/UserPage.tsx
+++ b/frontend/src/pages/UserPage.tsx
@@ -36,6 +36,13 @@ const UserPage: React.FC = () => {
 	const navigate = useNavigate();
 	const { streams } = useStreams(`/api/streams/${username}/data`);
 	const currentStream = streams[0];
+	console.log(vods)
+
+	const thumbnails = vods.map((vod) => ({
+		...vod,
+		thumbnail: `/vods/${vod.username}/${vod.vod_id}.png`,
+	  }));
+	
 
 	const fetchProfileData = useCallback(async () => {
 		try {
@@ -288,7 +295,8 @@ const UserPage: React.FC = () => {
     									font-black mb-4 rounded-full text-center"
 								>
 									Currently Live!
-								</h2>								<StreamListItem
+								</h2>								
+								<StreamListItem
 									id={profileData.id}
 									title={currentStream.title || ""}
 									streamCategory=""
@@ -308,7 +316,7 @@ const UserPage: React.FC = () => {
 								<ListRow
 									type="vod"
 									title={`Past Broadcasts (${vods.length})`}
-									items={vods}
+									items={thumbnails}
 									onItemClick={(vod) => {
 										console.log("VOD Clicked:", vod);
 									}}