feat: init routes protection

front/app/_editor/course/[courseid]/activity/[activityid]/edit/page.tsx

@@ -9,7 +9,7 @@ import AuthProvider from "@components/Security/AuthProvider";
 import EditorWrapper from "@components/Editor/EditorWrapper";
 import useSWR, { mutate } from "swr";
 import { getAPIUrl } from "@services/config/config";
-import { swrFetcher } from "@services/utils/requests";
+import { swrFetcher } from "@services/utils/ts/requests";
 
 
 function EditActivity(params: any) {

front/app/_orgs/[orgslug]/(withmenu)/collections/new/page.tsx

@@ -5,7 +5,7 @@ import { Title } from "@components/UI/Elements/Styles/Title";
 import { createCollection } from "@services/courses/collections";
 import useSWR from "swr";
 import { getAPIUrl } from "@services/config/config";
-import { swrFetcher } from "@services/utils/requests";
+import { swrFetcher } from "@services/utils/ts/requests";
 import { getOrganizationContextInfo } from "@services/organizations/orgs";
 
 function NewCollection(params : any) {

front/app/_orgs/[orgslug]/(withmenu)/collections/page.tsx

@@ -5,7 +5,7 @@ import styled from "styled-components";
 import { Title } from "@components/UI/Elements/Styles/Title";
 import { deleteCollection } from "@services/courses/collections";
 import { getAPIUrl, getBackendUrl, getUriWithOrg } from "@services/config/config";
-import { swrFetcher } from "@services/utils/requests";
+import { swrFetcher } from "@services/utils/ts/requests";
 import useSWR, { mutate } from "swr";
 
 function Collections(params: any) {

front/app/_orgs/[orgslug]/(withmenu)/course/[courseid]/activity/[activityid]/page.tsx

@@ -10,7 +10,7 @@ import { getCourse } from "@services/courses/courses";
 import VideoActivity from "@components/Pages/Activities/Video/Video";
 import useSWR, { mutate } from "swr";
 import { Check } from "lucide-react";
-import { swrFetcher } from "@services/utils/requests";
+import { swrFetcher } from "@services/utils/ts/requests";
 import { markActivityAsComplete } from "@services/courses/activity";
 
 function ActivityPage(params: any) {

front/app/_orgs/[orgslug]/(withmenu)/course/[courseid]/edit/page.tsx

@@ -15,6 +15,7 @@ import { createActivity, createFileActivity } from "@services/courses/activities
 import { getOrganizationContextInfo } from "@services/organizations/orgs";
 import Modal from "@components/UI/Modal/Modal";
 import AuthProvider from "@components/Security/AuthProvider";
+import { denyAccessToUser } from "@services/utils/react/middlewares/views";
 
 function CourseEdit(params: any) {
 
@@ -38,9 +39,7 @@ function CourseEdit(params: any) {
       const courseChapters = await getCourseChaptersMetadata(courseid);
       setData(courseChapters);
     } catch (error: any) {
-      if (error.status === 401) {
-        router.push("/login");
-      }
+      denyAccessToUser(error, router)
     }
   }
 

front/app/_orgs/[orgslug]/(withmenu)/course/[courseid]/page.tsx

@@ -6,12 +6,17 @@ import React from "react";
 import styled from "styled-components";
 import { getAPIUrl, getBackendUrl, getUriWithOrg } from "@services/config/config";
 import useSWR, { mutate } from "swr";
-import { swrFetcher } from "@services/utils/requests";
+import { swrFetcher } from "@services/utils/ts/requests";
+import { useRouter } from "next/navigation";
 
 const CourseIdPage = (params: any) => {
   const courseid = params.params.courseid;
   const orgslug = params.params.orgslug;
-  const { data: course, error: error } = useSWR(`${getAPIUrl()}courses/meta/course_${courseid}`, swrFetcher);
+  const router = useRouter();
+  
+  const { data: course, error: error } = useSWR(`${getAPIUrl()}courses/meta/course_${courseid}`,
+    (url: string, body: any) => swrFetcher(url, body, router)
+  );
 
   async function startCourseUI() {
     // Create activity
@@ -42,7 +47,7 @@ const CourseIdPage = (params: any) => {
           <p>Course</p>
           <h1>
             {course.course.name}{" "}
-            <Link href={getUriWithOrg(orgslug,"") +`/course/${courseid}/edit`} rel="noopener noreferrer">
+            <Link href={getUriWithOrg(orgslug, "") + `/course/${courseid}/edit`} rel="noopener noreferrer">
               <Pencil2Icon />
             </Link>{" "}
           </h1>
@@ -53,7 +58,7 @@ const CourseIdPage = (params: any) => {
                   {chapter.activities.map((activity: any) => {
                     return (
                       <>
-                        <Link href={getUriWithOrg(orgslug,"") +`/course/${courseid}/activity/${activity.id.replace("activity_", "")}`}>
+                        <Link href={getUriWithOrg(orgslug, "") + `/course/${courseid}/activity/${activity.id.replace("activity_", "")}`}>
                           <ChapterIndicator />
                         </Link>{" "}
                       </>
@@ -94,7 +99,7 @@ const CourseIdPage = (params: any) => {
                           <>
                             <p>
                               Activity {activity.name}
-                              <Link href={getUriWithOrg(orgslug,"") +`/course/${courseid}/activity/${activity.id.replace("activity_", "")}`} rel="noopener noreferrer">
+                              <Link href={getUriWithOrg(orgslug, "") + `/course/${courseid}/activity/${activity.id.replace("activity_", "")}`} rel="noopener noreferrer">
                                 <EyeOpenIcon />
                               </Link>{" "}
                             </p>

front/app/_orgs/[orgslug]/(withmenu)/courses/page.tsx

@@ -7,7 +7,7 @@ import { Title } from "@components/UI/Elements/Styles/Title";
 import { getAPIUrl, getBackendUrl, getSelfHostedOption, getUriWithOrg } from "@services/config/config";
 import { deleteCourseFromBackend } from "@services/courses/courses";
 import useSWR, { mutate } from "swr";
-import { swrFetcher } from "@services/utils/requests";
+import { swrFetcher } from "@services/utils/ts/requests";
 import { Edit2, Trash } from "lucide-react";
 
 const CoursesIndexPage = (params: any) => {

front/app/_orgs/[orgslug]/(withmenu)/trail/page.tsx

@@ -1,6 +1,6 @@
 "use client";
 import { getAPIUrl, getBackendUrl } from "@services/config/config";
-import { swrFetcher } from "@services/utils/requests";
+import { swrFetcher } from "@services/utils/ts/requests";
 import React from "react";
 import { styled } from "styled-components";
 import useSWR from "swr";

front/app/_orgs/[orgslug]/settings/organization/general/page.tsx

@@ -1,7 +1,7 @@
 "use client";
 import React from 'react'
 import useSWR, { mutate } from "swr";
-import { swrFetcher } from "@services/utils/requests";
+import { swrFetcher } from "@services/utils/ts/requests";
 import { getAPIUrl } from '@services/config/config';
 import { Field, Form, Formik } from 'formik';
 import { updateOrganization } from '@services/settings/org';

front/app/organizations/page.tsx

@@ -4,7 +4,7 @@ import React from "react";
 import { Title } from "../../components/UI/Elements/Styles/Title";
 import { deleteOrganizationFromBackend } from "@services/organizations/orgs";
 import useSWR, { mutate } from "swr";
-import { swrFetcher } from "@services/utils/requests";
+import { swrFetcher } from "@services/utils/ts/requests";
 import { getAPIUrl, getUriWithOrg } from "@services/config/config";
 import AuthProvider from "@components/Security/AuthProvider";
 

front/services/blocks/Image/images.ts

@@ -1,5 +1,5 @@
 import { getAPIUrl } from "@services/config/config";
-import { RequestBody, RequestBodyForm } from "@services/utils/requests";
+import { RequestBody, RequestBodyForm } from "@services/utils/ts/requests";
 
 export async function uploadNewImageFile(file: any, activity_id: string) {
   // Send file thumbnail as form data

front/services/blocks/Pdf/pdf.ts

@@ -1,5 +1,5 @@
 import { getAPIUrl } from "@services/config/config";
-import { RequestBody, RequestBodyForm } from "@services/utils/requests";
+import { RequestBody, RequestBodyForm } from "@services/utils/ts/requests";
 
 export async function uploadNewPDFFile(file: any, activity_id: string) {
   // Send file thumbnail as form data

front/services/blocks/Quiz/quiz.ts

@@ -1,5 +1,5 @@
 import { getAPIUrl } from "@services/config/config";
-import { RequestBody, RequestBodyForm } from "@services/utils/requests";
+import { RequestBody, RequestBodyForm } from "@services/utils/ts/requests";
 
 
 export async function submitQuizBlock(activity_id: string, data: any) {

front/services/blocks/Video/video.ts

@@ -1,5 +1,5 @@
 import { getAPIUrl } from "@services/config/config";
-import { RequestBody, RequestBodyForm } from "@services/utils/requests";
+import { RequestBody, RequestBodyForm } from "@services/utils/ts/requests";
 
 export async function uploadNewVideoFile(file: any, activity_id: string) {
   // Send file thumbnail as form data

front/services/courses/activities.ts

@@ -1,5 +1,5 @@
 import { getAPIUrl } from "@services/config/config";
-import { RequestBody, RequestBodyForm } from "@services/utils/requests";
+import { RequestBody, RequestBodyForm } from "@services/utils/ts/requests";
 
 export async function createActivity(data: any, chapter_id: any, org_id: any) {
   data.content = {};

front/services/courses/activity.ts

@@ -1,4 +1,4 @@
-import { RequestBody } from "@services/utils/requests";
+import { RequestBody } from "@services/utils/ts/requests";
 import { getAPIUrl } from "@services/config/config";
 
 /*

front/services/courses/chapters.ts

@@ -1,6 +1,5 @@
-import { initialData } from "../../components/Pages/CourseEdit/Draggables/data";
 import { getAPIUrl } from "@services/config/config";
-import { RequestBody } from "@services/utils/requests";
+import { RequestBody, errorHandling } from "@services/utils/ts/requests";
 
 /*
  This file includes only POST, PUT, DELETE requests
@@ -9,38 +8,26 @@ import { RequestBody } from "@services/utils/requests";
 
 //TODO : depreciate this function
 export async function getCourseChaptersMetadata(course_id: any) {
-  const response = await fetch(`${getAPIUrl()}chapters/meta/course_${course_id}`, RequestBody("GET", null));
-
-  if (!response.ok) {
-    const error: any = new Error(`Error ${response.status}: ${response.statusText}`, {});
-    error.status = response.status;
-    throw error;
-  }
-
-  const data = await response.json();
-  return data;
+  const result = await fetch(`${getAPIUrl()}chapters/meta/course_${course_id}`, RequestBody("GET", null));
+  const res = await errorHandling(result);
+  return res;
 }
 
 export async function updateChaptersMetadata(course_id: any, data: any) {
-  const result: any = await fetch(`${getAPIUrl()}chapters/meta/course_${course_id}`, RequestBody("PUT", data))
-    .then((result) => result.json())
-    .catch((error) => console.log("error", error));
-
-  return result;
+  const result: any = await fetch(`${getAPIUrl()}chapters/meta/course_${course_id}`, RequestBody("PUT", data));
+  const res = await errorHandling(result);
+  return res;
 }
 
 export async function createChapter(data: any, course_id: any) {
-  const result: any = await fetch(`${getAPIUrl()}chapters/?course_id=course_${course_id}`, RequestBody("POST", data))
-    .then((result) => result.json())
-    .catch((error) => console.log("error", error));
+  const result: any = await fetch(`${getAPIUrl()}chapters/?course_id=course_${course_id}`, RequestBody("POST", data));
+  const res = await errorHandling(result);
 
-  return result;
+  return res;
 }
 
 export async function deleteChapter(coursechapter_id: any) {
-  const result: any = await fetch(`${getAPIUrl()}chapters/${coursechapter_id}`, RequestBody("DELETE", null))
-    .then((result) => result.json())
-    .catch((error) => console.log("error", error));
-
-  return result;
+  const result: any = await fetch(`${getAPIUrl()}chapters/${coursechapter_id}`, RequestBody("DELETE", null));
+  const res = await errorHandling(result);
+  return res;
 }

front/services/courses/collections.ts

@@ -1,5 +1,5 @@
 import { getAPIUrl } from "../config/config";
-import { RequestBody } from "../utils/requests";
+import { RequestBody } from "../utils/ts/requests";
 
 /*
  This file includes only POST, PUT, DELETE requests

front/services/courses/courses.ts

@@ -1,5 +1,5 @@
 import { getAPIUrl } from "@services/config/config";
-import { RequestBody, RequestBodyForm } from "@services/utils/requests";
+import { RequestBody, RequestBodyForm } from "@services/utils/ts/requests";
 
 /*
  This file includes only POST, PUT, DELETE requests

front/services/organizations/orgs.ts

@@ -1,5 +1,5 @@
 import { getAPIUrl } from "@services/config/config";
-import { RequestBody } from "../utils/requests";
+import { RequestBody } from "../utils/ts/requests";
 
 /*
  This file includes only POST, PUT, DELETE requests

front/services/settings/org.ts

@@ -1,5 +1,5 @@
 import { getAPIUrl } from "@services/config/config";
-import { RequestBody } from "@services/utils/requests";
+import { RequestBody } from "@services/utils/ts/requests";
 
 /*
  This file includes only POST, PUT, DELETE requests

front/services/settings/password.ts

@@ -1,5 +1,5 @@
 import { getAPIUrl } from "@services/config/config";
-import { RequestBody } from "@services/utils/requests";
+import { RequestBody } from "@services/utils/ts/requests";
 
 /*
  This file includes only POST, PUT, DELETE requests

front/services/settings/profile.ts

@@ -1,5 +1,5 @@
 import { getAPIUrl } from "@services/config/config";
-import { RequestBody } from "@services/utils/requests";
+import { RequestBody } from "@services/utils/ts/requests";
 
 /*
  This file includes only POST, PUT, DELETE requests

front/services/utils/react/middlewares/views.ts

@@ -0,0 +1,14 @@
+import { AppRouterInstance } from "next/dist/shared/lib/app-router-context";
+import { NextRouter } from "next/router";
+
+export const denyAccessToUser = (error : any, router: AppRouterInstance) => {
+  if (error.status === 401) {
+    router.push("/login");
+  }
+
+  if (error.status === 403) {
+    router.push("/login");
+    // TODO : add a message to the user to tell him he is not allowed to access this page, route to /error
+  }
+  
+}

front/services/utils/ts/requests.ts

@@ -1,3 +1,6 @@
+import { AppRouterInstance } from "next/dist/shared/lib/app-router-context";
+import { denyAccessToUser } from "../react/middlewares/views";
+
 export const RequestBody = (method: string, data: any) => {
   let HeadersConfig = new Headers({ "Content-Type": "application/json" });
   let options: any = {
@@ -24,7 +27,7 @@ export const RequestBodyForm = (method: string, data: any) => {
   return options;
 };
 
-export const swrFetcher = async (url: string, body: any) => {
+export const swrFetcher = async (url: string, body: any, router?: AppRouterInstance) => {
   // Create the request options
   let HeadersConfig = new Headers({ "Content-Type": "application/json" });
   let options: any = {
@@ -39,15 +42,25 @@ export const swrFetcher = async (url: string, body: any) => {
     options.body = JSON.stringify(body);
   }
 
+  try {
     // Fetch the data
-  const res = await fetch(url, options);
-
-  // If the response is not in the 200 range, throw an error
-  if (!res.ok) {
-    const error = new Error("An error occurred while fetching the data.");
-    throw error;
-  }
+    const request = await fetch(url, options);
+    let res = errorHandling(request);
 
     // Return the data
+    return res;
+  } catch (error: any) {
+    if (router) {
+      denyAccessToUser(error, router);
+    }
+  }
+};
+
+export const errorHandling = (res: any) => {
+  if (!res.ok) {
+    const error: any = new Error(`Error ${res.status}: ${res.statusText}`, {});
+    error.status = res.status;
+    throw error;
+  }
   return res.json();
 };