From d1d2785c386b2398bc06266629c01c96f8d88d9f Mon Sep 17 00:00:00 2001
From: Chris-1010 <122332721@umail.ucc.ie>
Date: Sun, 16 Feb 2025 23:02:05 +0000
Subject: [PATCH] FEAT: Update ResultsPage to route user to corresponding page
 upon click;

---
 frontend/src/pages/ResultsPage.tsx | 20 ++++++++++++++++----
 1 file changed, 16 insertions(+), 4 deletions(-)

diff --git a/frontend/src/pages/ResultsPage.tsx b/frontend/src/pages/ResultsPage.tsx
index 7320f3c..06ec957 100644
--- a/frontend/src/pages/ResultsPage.tsx
+++ b/frontend/src/pages/ResultsPage.tsx
@@ -30,7 +30,11 @@ const ResultsPage: React.FC = ({}) => {
         <h3 className="text-lg font-semibold">Categories</h3>
         <ul>
           {searchResults.categories.map((category: any, index: number) => (
-            <li key={index} className="border p-2 rounded my-2">
+            <li
+              key={index}
+              className="border p-2 rounded my-2 cursor-pointer"
+              onClick={() => navigate(`/category/${category.category_name}`)}
+            >
               {category.category_name}
             </li>
           ))}
@@ -41,8 +45,12 @@ const ResultsPage: React.FC = ({}) => {
         <h3 className="text-lg font-semibold">Users</h3>
         <ul>
           {searchResults.users.map((user: any, index: number) => (
-            <li key={index} className="border p-2 rounded my-2">
-              {user.username} {user.is_live ? "🔴" : ""}
+            <li
+              key={index}
+              className="border p-2 rounded my-2 cursor-pointer"
+              onClick={() => navigate(`/user/${user.username}`)}
+            >
+              {user.is_live ? "🔴" : ""} {user.username}
             </li>
           ))}
         </ul>
@@ -52,7 +60,11 @@ const ResultsPage: React.FC = ({}) => {
         <h3 className="text-lg font-semibold">Streams</h3>
         <ul>
           {searchResults.streams.map((stream: any, index: number) => (
-            <li key={index} className="border p-2 rounded my-2">
+            <li
+              key={index}
+              className="border p-2 rounded my-2 cursor-pointer"
+              onClick={() => navigate(`/${stream.streamer_name}`)}
+            >
               {stream.title} - {stream.num_viewers} viewers
             </li>
           ))}