feat: use swr for courses

front/app/_orgs/[orgslug]/courses/page.tsx

@@ -3,32 +3,21 @@ import Link from "next/link";
 import { useRouter } from "next/navigation";
 import React from "react";
 import styled from "styled-components";
-import { Header } from "../../../../components/UI/Header";
-import Layout from "../../../../components/UI/Layout";
 import { Title } from "../../../../components/UI/Elements/Styles/Title";
-import { getBackendUrl } from "../../../../services/config";
-import { deleteCourseFromBackend, getOrgCourses } from "../../../../services/courses/courses";
-import { getOrganizationContextInfo } from "../../../../services/orgs";
+import { getAPIUrl, getBackendUrl } from "../../../../services/config";
+import { deleteCourseFromBackend } from "../../../../services/courses/courses";
+import useSWR, { mutate } from "swr";
+import { swrFetcher } from "@services/utils/requests";
 
 const CoursesIndexPage = (params: any) => {
   const router = useRouter();
   const orgslug = params.params.orgslug;
 
-  const [isLoading, setIsLoading] = React.useState(true);
-  const [orgInfo, setOrgInfo] = React.useState(null);
-  const [courses, setCourses] = React.useState([]);
-
-  async function fetchCourses() {
-    const org = await getOrganizationContextInfo(orgslug);
-    const response = await getOrgCourses(org.org_id);
-    setCourses(response);
-    setIsLoading(false);
-  }
+  const { data: courses, error: error } = useSWR(`${getAPIUrl()}courses/org_slug/${orgslug}/page/1/limit/10`, swrFetcher);
 
   async function deleteCourses(course_id: any) {
-    const response = await deleteCourseFromBackend(course_id);
-    const newCourses = courses.filter((course: any) => course.course_id !== course_id);
-    setCourses(newCourses);
+    await deleteCourseFromBackend(course_id);
+    mutate(`${getAPIUrl()}courses/${orgslug}/page/1/limit/10`);
   }
 
   // function to remove "course_" from the course_id
@@ -36,15 +25,6 @@ const CoursesIndexPage = (params: any) => {
     return course_id.replace("course_", "");
   }
 
-  React.useEffect(() => {
-    if (orgslug) {
-      fetchCourses();
-      if (courses.length > 0) {
-        setIsLoading(false);
-      }
-    }
-  }, [isLoading, orgslug]);
-
   return (
     <>
       <Title>
@@ -55,7 +35,8 @@ const CoursesIndexPage = (params: any) => {
       </Title>
 
       <hr />
-      {isLoading ? (
+      {error && <p>Failed to load</p>}
+      {!courses ? (
         <div>Loading...</div>
       ) : (
         <div>

src/routers/courses/courses.py

@@ -1,7 +1,7 @@
 from fastapi import APIRouter, Depends, UploadFile, Form, Request
 from src.dependencies.auth import get_current_user
 
-from src.services.courses.courses import Course,  create_course,  get_course, get_course_meta, get_courses, update_course, delete_course, update_course_thumbnail
+from src.services.courses.courses import Course,  create_course,  get_course, get_course_meta, get_courses, get_courses_orgslug, update_course, delete_course, update_course_thumbnail
 from src.services.users import PublicUser
 
 
@@ -42,13 +42,20 @@ async def api_get_course_meta(request: Request,course_id: str,  current_user: Pu
     return await get_course_meta(request, course_id, current_user=current_user)
 
 
-@router.get("/{org_id}/page/{page}/limit/{limit}")
+@router.get("/org_id/{org_id}/page/{page}/limit/{limit}")
 async def api_get_course_by(request: Request,page: int, limit: int, org_id: str):
     """
     Get houses by page and limit
     """
     return await get_courses(request,page, limit, org_id)
 
+@router.get("/org_slug/{org_slug}/page/{page}/limit/{limit}")
+async def api_get_course_by_orgslug(request: Request,page: int, limit: int, org_slug: str):
+    """
+    Get houses by page and limit
+    """
+    return await get_courses_orgslug(request,page, limit, org_slug)
+
 
 @router.put("/{course_id}")
 async def api_update_course(request: Request,course_object: Course, course_id: str, current_user: PublicUser = Depends(get_current_user)):

src/services/courses/courses.py

@@ -258,6 +258,25 @@ async def get_courses(request: Request, page: int = 1, limit: int = 10, org_id:
 
     return [json.loads(json.dumps(course, default=str)) for course in all_courses]
 
+async def get_courses_orgslug(request: Request, page: int = 1, limit: int = 10, org_slug: str | None = None):
+    courses = request.app.db["courses"]
+    orgs = request.app.db["organizations"]
+    # TODO : Get only courses that user is admin/has roles of
+
+    # get org_id from slug
+    org = orgs.find_one({"slug": org_slug})
+
+    if not org:
+        raise HTTPException(
+            status_code=status.HTTP_409_CONFLICT, detail=f"Organization does not exist")
+    
+    # get all courses from database
+    all_courses = courses.find({"org_id": org['org_id']}).sort(
+        "name", 1).skip(10 * (page - 1)).limit(limit)
+
+    return [json.loads(json.dumps(course, default=str)) for course in all_courses]
+
+
 
 #### Security ####################################################