FIX: Live Broadcast Not Appearing

Style: Added some Styling

frontend/src/hooks/useContent.ts

@@ -105,6 +105,7 @@ export function useStreams(customUrl?: string): {
 	const [streams, setStreams] = useState<StreamType[]>([]);
 	const [isLoading, setIsLoading] = useState(true);
 	const [error, setError] = useState<string | null>(null);
+	console.log(streams)
 
 	useEffect(() => {
 		const fetchStreams = async () => {
@@ -158,7 +159,11 @@ export function useStreams(customUrl?: string): {
 					}
 
 					const data = await response.json();
-					setStreams(processStreamData(data));
+					console.log("Data: ", data)
+
+					// Make sure it is 100% ARRAY NOT OBJECT
+					const formattedData = Array.isArray(data) ? data : [data];
+					setStreams(processStreamData(formattedData));
 				}
 
 				setError(null);
@@ -184,7 +189,6 @@ export function useStreams(customUrl?: string): {
 
 		fetchStreams();
 	}, [isLoggedIn, customUrl]);
-
 	return { streams, isLoading, error };
 }
 

frontend/src/pages/UserPage.tsx

@@ -217,12 +217,12 @@ const UserPage: React.FC = () => {
 					{/* Content Section */}
 					<div
 						id="content"
-						className="col-span-2 bg-[var(--user-contentBox)] rounded-lg p-6 grid grid-rows-[auto_1fr] text-center items-center justify-center"
+						className="col-span-2 bg-[var(--user-contentBox)] rounded-lg p-6 flex flex-col items-center w-full"
 						>
 						{/* Stream */}
 						{currentStream && (
 							<div className="mb-8">
-								<h2 className="text-2xl bg-[#ff0000] border py-4 px-12 font-black mb-4 rounded-[4rem]">Currently Live!</h2>
+								<h2 className="text-2xl bg-[#ff0000] border py-4 px-[9rem] font-black mb-4 rounded-[4rem]">Currently Live!</h2>
 								<StreamListItem
 									id={profileData.id}
 									title={currentStream.title || ""}

web_server/blueprints/streams.py

@@ -87,7 +87,7 @@ def stream_data(username=None, streamer_id=None) -> dict:
             else:
                 data = {"stream_key": stream_key["stream_key"]}
 
-    return jsonify(data)
+    return jsonify([data])
 
 
 # Category Routes