diff --git a/front/app/_orgs/[orgslug]/collections/new/page.tsx b/front/app/_orgs/[orgslug]/collections/new/page.tsx
index cf5a5052..171c25ef 100644
--- a/front/app/_orgs/[orgslug]/collections/new/page.tsx
+++ b/front/app/_orgs/[orgslug]/collections/new/page.tsx
@@ -2,9 +2,10 @@
 import { useRouter } from "next/navigation";
 import React from "react";
 import { Title } from "@components/UI/Elements/Styles/Title";
-import { getOrganizationContextInfo } from "@services/orgs";
-import { getOrgCourses } from "@services/courses/courses";
 import { createCollection } from "@services/collections";
+import useSWR from "swr";
+import { getAPIUrl } from "@services/config";
+import { swrFetcher } from "@services/utils/requests";
 
 function NewCollection(params : any) {
   const orgslug = params.params.orgslug;
@@ -12,18 +13,9 @@ function NewCollection(params : any) {
   const [org, setOrg] = React.useState({}) as any;
   const [description, setDescription] = React.useState("");
   const [selectedCourses, setSelectedCourses] = React.useState([]) as any;
-  const [courses, setCourses] = React.useState([]) as any;
-  const [isLoading, setIsLoading] = React.useState(false);
   const router = useRouter();
 
-  async function getCourses() {
-    setIsLoading(true);
-    const org = await getOrganizationContextInfo(orgslug);
-    setOrg(org);
-    const courses = await getOrgCourses(org.org_id);
-    setCourses(courses);
-    setIsLoading(false);
-  }
+  const { data: courses, error: error } = useSWR(`${getAPIUrl()}courses/org_slug/${orgslug}/page/1/limit/10`, swrFetcher);
 
   const handleNameChange = (event: React.ChangeEvent<HTMLInputElement>) => {
     setName(event.target.value);
@@ -46,20 +38,13 @@ function NewCollection(params : any) {
     router.push("/org/" + orgslug + "/collections");
   };
 
-  React.useEffect(() => {
-    if (params.params.orgslug) {
-      getCourses();
-    }
-    return () => {};
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [params.params.orgslug]);
 
   return (
     <>
       <Title>Add new</Title>
       <br />
       <input type="text" placeholder="Name" value={name} onChange={handleNameChange} />
-      {isLoading ? (
+      {!courses ? (
         <p>Loading...</p>
       ) : (
         <div>