#32 Fetch enrolled course data from backend and store the data

frontend/src/components/CoursesWidget.jsx

@@ -1,7 +1,11 @@
+import { useContext, useEffect, useState } from "react";
 import { Card, Container } from "react-bootstrap";
 import { Link } from "wouter";
+import UserContext from "../contexts/UserContext";
 
 const CoursesWidget = ({ className = "" }) => {
+  const [courseData, setCourseData] = useState({});
+  const { currentUser } = useContext(UserContext);
   const dummyData = [
     {
       course_id: 1,
@@ -34,6 +38,14 @@ const CoursesWidget = ({ className = "" }) => {
       instructor: "Arunita Jaekel",
     },
   ];
+
+  useEffect(() => {
+    fetch(`http://localhost:5000/user/${currentUser.id}/courses`)
+      .then((resp) => resp.json())
+      .then((data) => {
+        setCourseData(data.courses);
+      });
+  }, []);
   return (
     <Container className={`${className} py-3 grid`}>
       <div className="row justify-content-center">