Merge pull request #391 from topcoder-platform/TCA-590_use-swr-for-data-fetching-in-learn

TCA-590 use swr for data fetching in learn -> TCA-586

Author: vas3a

src-ts/tools/learn/Learn.tsx

@@ -7,19 +7,21 @@ import {
     RouteContextData,
 } from '../../lib'
 
+import { LearnSwr } from './learn-lib'
+
 export const toolTitle: string = ToolTitle.learn
 
 const Learn: FC<{}> = () => {
 
     const { getChildRoutes }: RouteContextData = useContext(routeContext)
 
     return (
-        <>
+        <LearnSwr>
             <Outlet />
             <Routes>
                 {getChildRoutes(toolTitle)}
             </Routes>
-        </>
+        </LearnSwr>
     )
 }
 

src-ts/tools/learn/course-certificate/certificate-view/CertificateView.tsx

@@ -15,10 +15,10 @@ import {
 import {
     AllCertificationsProviderData,
     CoursesProviderData,
-    useAllCertifications,
-    useCourses,
+    useGetCertification,
+    useGetCourses,
+    useGetUserCompletedCertifications,
     UserCompletedCertificationsProviderData,
-    useUserCompletedCertifications,
 } from '../../learn-lib'
 import { getCoursePath, getUserCertificateSsr } from '../../learn.routes'
 
@@ -54,7 +54,7 @@ const CertificateView: FC<CertificateViewProps> = (props: CertificateViewProps)
     const {
         course,
         ready: courseReady,
-    }: CoursesProviderData = useCourses(props.provider, props.certification)
+    }: CoursesProviderData = useGetCourses(props.provider, props.certification)
 
     function getCertTitle(user: string): string {
         return `${user} - ${course?.title} Certification`
@@ -72,7 +72,7 @@ const CertificateView: FC<CertificateViewProps> = (props: CertificateViewProps)
     const {
         certifications: [completedCertificate],
         ready: completedCertificateReady,
-    }: UserCompletedCertificationsProviderData = useUserCompletedCertifications(
+    }: UserCompletedCertificationsProviderData = useGetUserCompletedCertifications(
         props.profile.userId,
         props.provider,
         props.certification
@@ -82,9 +82,9 @@ const CertificateView: FC<CertificateViewProps> = (props: CertificateViewProps)
     const {
         certification: certificate,
         ready: certificateReady,
-    }: AllCertificationsProviderData = useAllCertifications(
+    }: AllCertificationsProviderData = useGetCertification(
         props.provider,
-        course?.certificationId,
+        course?.certificationId ?? '',
         { enabled: !!course?.certificationId }
     )
 

src-ts/tools/learn/course-completed/CourseCompletedPage.tsx

@@ -14,12 +14,12 @@ import {
     AllCertificationsProviderData,
     CoursesProviderData,
     CourseTitle,
-    useAllCertifications,
-    useCourses,
+    useGetCertification,
+    useGetCourses,
+    useGetUserCertificationProgress,
     useLearnBreadcrumb,
     UserCertificationProgressProviderData,
-    UserCertificationProgressStatus,
-    useUserCertificationProgress
+    UserCertificationProgressStatus
 } from '../learn-lib'
 import { getCertificatePath, getCoursePath, LEARN_PATHS, rootRoute } from '../learn.routes'
 
@@ -38,12 +38,12 @@ const CourseCompletedPage: FC<{}> = () => {
     const {
         course: courseData,
         ready: courseDataReady,
-    }: CoursesProviderData = useCourses(providerParam, certificationParam)
+    }: CoursesProviderData = useGetCourses(providerParam, certificationParam)
 
     const {
         certificationProgress: progress,
         ready: progressReady,
-    }: UserCertificationProgressProviderData = useUserCertificationProgress(
+    }: UserCertificationProgressProviderData = useGetUserCertificationProgress(
         profile?.userId,
         routeParams.provider,
         routeParams.certification
@@ -52,8 +52,8 @@ const CourseCompletedPage: FC<{}> = () => {
     const {
         certification,
         ready: certifReady,
-    }: AllCertificationsProviderData = useAllCertifications(providerParam, progress?.certificationId, {
-        enabled: progressReady && !!progress,
+    }: AllCertificationsProviderData = useGetCertification(providerParam, progress?.certificationId ?? '', {
+        enabled: progressReady && !!progress?.certificationId,
     })
 
     /* tslint:disable:cyclomatic-complexity */

src-ts/tools/learn/course-details/CourseDetailsPage.tsx

@@ -15,13 +15,13 @@ import {
     CoursesProviderData,
     CourseTitle,
     ResourceProviderData,
-    useAllCertifications,
-    useCourses,
+    useGetCertification,
+    useGetCourses,
+    useGetResourceProvider,
+    useGetUserCertificationProgress,
     useLearnBreadcrumb,
     UserCertificationProgressProviderData,
-    UserCertificationProgressStatus,
-    useResourceProvider,
-    useUserCertificationProgress
+    UserCertificationProgressStatus
 } from '../learn-lib'
 import { getCoursePath } from '../learn.routes'
 
@@ -36,17 +36,17 @@ const CourseDetailsPage: FC<{}> = () => {
 
     const {
         provider: resourceProvider,
-    }: ResourceProviderData = useResourceProvider(routeParams.provider)
+    }: ResourceProviderData = useGetResourceProvider(routeParams.provider)
 
     const {
         course,
         ready: courseReady,
-    }: CoursesProviderData = useCourses(routeParams.provider ?? '', routeParams.certification)
+    }: CoursesProviderData = useGetCourses(routeParams.provider ?? '', routeParams.certification)
 
     const {
         certificationProgress: progress,
         ready: progressReady,
-    }: UserCertificationProgressProviderData = useUserCertificationProgress(
+    }: UserCertificationProgressProviderData = useGetUserCertificationProgress(
         profile?.userId,
         routeParams.provider,
         routeParams.certification,
@@ -55,8 +55,8 @@ const CourseDetailsPage: FC<{}> = () => {
     const {
         certification: certificate,
         ready: certificateReady,
-    }: AllCertificationsProviderData = useAllCertifications(routeParams.provider, course?.certificationId, {
-        enabled: courseReady,
+    }: AllCertificationsProviderData = useGetCertification(routeParams.provider, course?.certificationId ?? '', {
+        enabled: courseReady && !!course?.certificationId,
     })
 
     // this looks better than finding workarounds for cyclomatic-complexity

src-ts/tools/learn/free-code-camp/FreeCodeCamp.tsx

@@ -24,16 +24,16 @@ import {
     LearnModule,
     LearnModuleProgress,
     LessonProviderData,
-    useCourses,
+    useGetCourses,
+    useGetLesson,
+    useGetUserCertificationProgress,
     useLearnBreadcrumb,
-    useLessonProvider,
     userCertificationProgressCompleteCourseAsync,
     UserCertificationProgressProviderData,
     userCertificationProgressStartAsync,
     UserCertificationProgressStatus,
     userCertificationProgressUpdateAsync,
     UserCertificationUpdateProgressActions,
-    useUserCertificationProgress,
 } from '../learn-lib'
 import { getCertificationCompletedPath, getCoursePath, getLessonPathFromModule } from '../learn.routes'
 
@@ -63,7 +63,7 @@ const FreeCodeCamp: FC<{}> = () => {
         setCertificateProgress,
         ready: progressReady,
         refetch: refetchProgress,
-    }: UserCertificationProgressProviderData = useUserCertificationProgress(
+    }: UserCertificationProgressProviderData = useGetUserCertificationProgress(
         profile?.userId,
         routeParams.provider,
         certificationParam
@@ -72,9 +72,9 @@ const FreeCodeCamp: FC<{}> = () => {
     const {
         course: courseData,
         ready: courseDataReady,
-    }: CoursesProviderData = useCourses(providerParam, certificationParam)
+    }: CoursesProviderData = useGetCourses(providerParam, certificationParam)
 
-    const { lesson, ready: lessonReady }: LessonProviderData = useLessonProvider(
+    const { lesson, ready: lessonReady }: LessonProviderData = useGetLesson(
         providerParam,
         certificationParam,
         moduleParam,