From bb114d679632efcf470033187c1a10ec6aed3435 Mon Sep 17 00:00:00 2001
From: vivianzhang <jzhang230@usfca.edu>
Date: Tue, 15 Oct 2024 15:39:36 -0700
Subject: [PATCH 1/2] add link to news

---
 components/basketball/news/NewsCard.tsx | 25 +++++++++++-
 components/basketball/news/NewsList.tsx | 53 ++++++++++++++++++-------
 2 files changed, 62 insertions(+), 16 deletions(-)

diff --git a/components/basketball/news/NewsCard.tsx b/components/basketball/news/NewsCard.tsx
index 3e9d0dd..fee9db9 100644
--- a/components/basketball/news/NewsCard.tsx
+++ b/components/basketball/news/NewsCard.tsx
@@ -1,6 +1,9 @@
 "use client";
+import Custom404 from "@/components/404";
+import { asyncFetch } from "@/utils/fetch";
+import { COMPETITIONID_TO_GROUPNAME } from "@/utils/variables";
 import { Card, CardBody, CardFooter, Image } from "@nextui-org/react";
-import { useState } from "react";
+import { useEffect, useState } from "react";
 
 interface NewsCardProp {
   newsObject: BbNews;
@@ -10,6 +13,24 @@ const NULL = "http://svcsa.org/uploads/null";
 const NewsCard: React.FC<NewsCardProp> = ({ newsObject }) => {
   const [imageLoadingError, setImageLoadingError] = useState(false);
   const indexOfTeamName = newsObject.content.indexOf("team") + 5;
+  const [season, setSeason] = useState<BbSeason | null>(null);
+  useEffect(()=> {
+    async function fetchSeason() {
+      const seasonData = await asyncFetch(`/basketball/season/${newsObject.seasonid}`);
+      setSeason(seasonData);
+    }
+    fetchSeason();
+  }, [newsObject.seasonid])
+  if (!season) {
+    return <Custom404 />;
+  }
+  const competitionid = season.competitionid;
+  const groupName = COMPETITIONID_TO_GROUPNAME[competitionid];
+  const CATEGORY_TO_URL: Record<string, string> = {
+    "bb_result" : `/basketball/${groupName}/matches/${newsObject.matchid}`,
+    "bb_schedule" : `/basketball/${groupName}/matches`,
+  };
+  const categoryUrl = CATEGORY_TO_URL[newsObject.category] ?? "#";
   return (
     <Card className="text-white">
       <CardBody className="grid justify-items-center content-center">
@@ -34,7 +55,7 @@ const NewsCard: React.FC<NewsCardProp> = ({ newsObject }) => {
       <CardFooter className="flex flex-col text-xs w-48 h-40">
         <h3 className="text-center font-bold leading-6">{newsObject.title}</h3>
         <p className="text-center font-medium text-slate-900">{newsObject.content}</p>
-        <a className="text-orange-700 underline cursor-pointer">learn more</a>
+        <a className="text-orange-700 underline cursor-pointer" href={categoryUrl}>learn more</a>
       </CardFooter>
     </Card>
   );
diff --git a/components/basketball/news/NewsList.tsx b/components/basketball/news/NewsList.tsx
index 951c7e7..ae50404 100644
--- a/components/basketball/news/NewsList.tsx
+++ b/components/basketball/news/NewsList.tsx
@@ -1,8 +1,11 @@
-"use clinet"
-import { useState } from "react";
+"use clinet";
+import { useEffect, useState } from "react";
 import NewsLogo from "./NewsLogo";
 import Link from "next/link";
 import { Pagination } from "@nextui-org/react";
+import { asyncFetch } from "@/utils/fetch";
+import Custom404 from "@/components/404";
+import { COMPETITIONID_TO_GROUPNAME } from "@/utils/variables";
 
 interface NewsListProps {
   newsList: BbNews[];
@@ -22,20 +25,42 @@ const NewsList: React.FC<NewsListProps> = ({ newsList }) => {
   };
   return (
     <div>
-      {currentNewsList.map((news, index) => (
-        <div key={index}>
-          <div className="grid grid-cols-10 gap-4 min-h-16">
-            <NewsLogo news={news} />
-            <div className="col-start-3 col-span-8 cursor-pointer py-3 hover:bg-slate-300">
-              <Link href={news.category == "bb_schedule" ? "/basketball" : "#"}>
-                <p className="font-bold">{news.title}</p>
-                {news.content}{" "}
-              </Link>
+      {currentNewsList.map((news, index) => {
+        const [season, setSeason] = useState<BbSeason | null>(null);
+        useEffect(() => {
+          async function fetchSeason() {
+            const seasonData = await asyncFetch(
+              `/basketball/season/${news.seasonid}`
+            );
+            setSeason(seasonData);
+          }
+          fetchSeason();
+        }, [news.seasonid]);
+        if (!season) {
+          return <Custom404 />;
+        }
+        const competitionid = season.competitionid;
+        const groupName = COMPETITIONID_TO_GROUPNAME[competitionid];
+        const CATEGORY_TO_URL: Record<string, string> = {
+          bb_result: `/basketball/${groupName}/matches/${news.matchid}`,
+          bb_schedule: `/basketball/${groupName}/matches`,
+        };
+        const categoryUrl = CATEGORY_TO_URL[news.category] ?? "#";
+        return (
+          <div key={index}>
+            <div className="grid grid-cols-10 gap-4 min-h-16">
+              <NewsLogo news={news} />
+              <div className="col-start-3 col-span-8 cursor-pointer py-3 hover:bg-slate-300">
+                <Link href={categoryUrl}>
+                  <p className="font-bold">{news.title}</p>
+                  {news.content}{" "}
+                </Link>
+              </div>
             </div>
+            <hr className="border-gray-300" />
           </div>
-          <hr className="border-gray-300" />
-        </div>
-      ))}
+        );
+      })}
       <Pagination
         className="grid justify-items-center mt-2"
         isCompact

From 39ec4b4dd2fb4c8eeb9760c5ce91d9f6a00dd5c9 Mon Sep 17 00:00:00 2001
From: vivianzhang <jzhang230@usfca.edu>
Date: Tue, 15 Oct 2024 21:18:08 -0700
Subject: [PATCH 2/2] fix error

---
 components/basketball/news/NewsItem.tsx | 45 +++++++++++++++++++++++++
 components/basketball/news/NewsList.tsx | 41 ++--------------------
 2 files changed, 48 insertions(+), 38 deletions(-)
 create mode 100644 components/basketball/news/NewsItem.tsx

diff --git a/components/basketball/news/NewsItem.tsx b/components/basketball/news/NewsItem.tsx
new file mode 100644
index 0000000..f2e21a8
--- /dev/null
+++ b/components/basketball/news/NewsItem.tsx
@@ -0,0 +1,45 @@
+import Link from "next/link"
+import NewsLogo from "./NewsLogo"
+import { useEffect, useState } from "react";
+import { asyncFetch } from "@/utils/fetch";
+import Custom404 from "@/components/404";
+import { COMPETITIONID_TO_GROUPNAME } from "@/utils/variables";
+
+interface NewsItemProps {
+    news: BbNews
+}
+const NewsItem: React.FC<NewsItemProps> = ({news}) => {
+    const [season, setSeason] = useState<BbSeason | null>(null);
+  useEffect(()=> {
+    async function fetchSeason() {
+      const seasonData = await asyncFetch(`/basketball/season/${news.seasonid}`);
+      setSeason(seasonData);
+    }
+    fetchSeason();
+  }, [news.seasonid])
+  if (!season) {
+    return <Custom404 />;
+  }
+  const competitionid = season.competitionid;
+  const groupName = COMPETITIONID_TO_GROUPNAME[competitionid];
+  const CATEGORY_TO_URL: Record<string, string> = {
+    "bb_result" : `/basketball/${groupName}/matches/${news.matchid}`,
+    "bb_schedule" : `/basketball/${groupName}/matches`,
+  };
+  const categoryUrl = CATEGORY_TO_URL[news.category] ?? "#";
+    return(
+        <div >
+            <div className="grid grid-cols-10 gap-4 min-h-16">
+              <NewsLogo news={news} />
+              <div className="col-start-3 col-span-8 cursor-pointer py-3 hover:bg-slate-300">
+                <Link href={categoryUrl}>
+                  <p className="font-bold">{news.title}</p>
+                  {news.content}{" "}
+                </Link>
+              </div>
+            </div>
+            <hr className="border-gray-300" />
+          </div>
+    )
+}
+export default NewsItem;
\ No newline at end of file
diff --git a/components/basketball/news/NewsList.tsx b/components/basketball/news/NewsList.tsx
index ae50404..803a6ca 100644
--- a/components/basketball/news/NewsList.tsx
+++ b/components/basketball/news/NewsList.tsx
@@ -1,11 +1,7 @@
 "use clinet";
-import { useEffect, useState } from "react";
-import NewsLogo from "./NewsLogo";
-import Link from "next/link";
+import { useState } from "react";
 import { Pagination } from "@nextui-org/react";
-import { asyncFetch } from "@/utils/fetch";
-import Custom404 from "@/components/404";
-import { COMPETITIONID_TO_GROUPNAME } from "@/utils/variables";
+import NewsItem from "./NewsItem";
 
 interface NewsListProps {
   newsList: BbNews[];
@@ -26,39 +22,8 @@ const NewsList: React.FC<NewsListProps> = ({ newsList }) => {
   return (
     <div>
       {currentNewsList.map((news, index) => {
-        const [season, setSeason] = useState<BbSeason | null>(null);
-        useEffect(() => {
-          async function fetchSeason() {
-            const seasonData = await asyncFetch(
-              `/basketball/season/${news.seasonid}`
-            );
-            setSeason(seasonData);
-          }
-          fetchSeason();
-        }, [news.seasonid]);
-        if (!season) {
-          return <Custom404 />;
-        }
-        const competitionid = season.competitionid;
-        const groupName = COMPETITIONID_TO_GROUPNAME[competitionid];
-        const CATEGORY_TO_URL: Record<string, string> = {
-          bb_result: `/basketball/${groupName}/matches/${news.matchid}`,
-          bb_schedule: `/basketball/${groupName}/matches`,
-        };
-        const categoryUrl = CATEGORY_TO_URL[news.category] ?? "#";
         return (
-          <div key={index}>
-            <div className="grid grid-cols-10 gap-4 min-h-16">
-              <NewsLogo news={news} />
-              <div className="col-start-3 col-span-8 cursor-pointer py-3 hover:bg-slate-300">
-                <Link href={categoryUrl}>
-                  <p className="font-bold">{news.title}</p>
-                  {news.content}{" "}
-                </Link>
-              </div>
-            </div>
-            <hr className="border-gray-300" />
-          </div>
+          <NewsItem news={news} key={index}/>
         );
       })}
       <Pagination