From 23bbfad299c3f03c60df11fb02c72f9fd554bc1b Mon Sep 17 00:00:00 2001
From: chibuike-19 <emmanuelobiechina8@gmail.com>
Date: Thu, 28 Nov 2024 15:28:40 +0100
Subject: [PATCH] fix: updated fetchplatforms api

---
 .../routes/dashboard/projects/[id]/index.tsx  | 29 +++++++++++--------
 1 file changed, 17 insertions(+), 12 deletions(-)

diff --git a/packages/frontend/src/routes/dashboard/projects/[id]/index.tsx b/packages/frontend/src/routes/dashboard/projects/[id]/index.tsx
index 5dd5154..777bbe1 100644
--- a/packages/frontend/src/routes/dashboard/projects/[id]/index.tsx
+++ b/packages/frontend/src/routes/dashboard/projects/[id]/index.tsx
@@ -9,6 +9,7 @@ import "react-calendar/dist/Calendar.css";
 import "react-clock/dist/Clock.css";
 import LivestreamCard from "../../../../lib/components/LivestreamCard";
 import {
+  fetchPlatforms,
   FetchProjectById,
   getAccessToken,
   sendPeerInvite,
@@ -59,6 +60,7 @@ const ProjectPage = () => {
   const [selectedPlatform, setSelectedPlatform] = useState<
     ("Twitch" | "Youtube")[]
   >([]);
+  const [platforms, setPlatforms] = useState([]);
   const [selectedDate, setSelectedDate] = useState<Date | null>(new Date());
   const [loading, setLoading] = useState({
     project: false,
@@ -79,16 +81,20 @@ const ProjectPage = () => {
     },
   };
 
-  const UserResponseData = JSON.parse(getDataInCookie("userDataResponse"));
-
-  const platforms =
-    UserResponseData?.data?.platforms?.map(
-      (platform: "Twitch" | "Youtube") => ({
-        label: platformStyles[platform]?.label || platform,
-        value: platform,
-        icon: platformStyles[platform]?.icon || null,
-      })
-    ) || [];
+  const fetchPlatformsData = async () => {
+    try {
+      const response = await fetchPlatforms();
+      response?.data?.platforms
+        ? setPlatforms(response?.data?.platforms)
+        : setPlatforms([]);
+    } catch (err: any) {
+      if (err?.response?.data?.message) {
+        toast.error(err?.response?.data?.message);
+      } else {
+        toast.error(err?.message);
+      }
+    }
+  };
 
   // Fetch project details
   const fetchProjectDetails = async () => {
@@ -140,8 +146,6 @@ const ProjectPage = () => {
     }
   };
 
-  useEffect(() => {}, [livestreamData]);
-
   // Handle livestream creation
   const handleCreateLiveStream = async () => {
     setLoading((prev) => ({ ...prev, createStream: true }));
@@ -178,6 +182,7 @@ const ProjectPage = () => {
   useEffect(() => {
     fetchProjectDetails();
     fetchStreams();
+    fetchPlatformsData();
   }, []);
 
   // Helpers