TCA-590 - update resource-provider & user-completed-certifications providers to use SWR

Author: vas3a

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

@@ -18,7 +18,7 @@ import {
     useGetCertification,
     useGetCourses,
     UserCompletedCertificationsProviderData,
-    useUserCompletedCertifications,
+    useGetUserCompletedCertifications,
 } from '../../learn-lib'
 import { getCoursePath, getUserCertificateSsr } from '../../learn.routes'
 
@@ -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

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

@@ -20,7 +20,7 @@ import {
     useLearnBreadcrumb,
     UserCertificationProgressProviderData,
     UserCertificationProgressStatus,
-    useResourceProvider,
+    useGetResourceProvider,
     useGetUserCertificationProgress
 } from '../learn-lib'
 import { getCoursePath } from '../learn.routes'
@@ -36,7 +36,7 @@ const CourseDetailsPage: FC<{}> = () => {
 
     const {
         provider: resourceProvider,
-    }: ResourceProviderData = useResourceProvider(routeParams.provider)
+    }: ResourceProviderData = useGetResourceProvider(routeParams.provider)
 
     const {
         course,

src-ts/tools/learn/learn-lib/data-providers/resource-provider-provider/index.ts

@@ -1,3 +1,3 @@
-export * from './resource-provider-functions'
 export * from './resource-provider-data.model'
 export * from './resource-provider.provider'
+export * from './resource-provider.model'

src-ts/tools/learn/learn-lib/data-providers/resource-provider-provider/resource-provider-functions/index.ts

@@ -1,4 +1,4 @@
-import { LearnModelBase } from '../../../functions'
+import { LearnModelBase } from '../../functions'
 
 export interface ResourceProvider extends LearnModelBase {
     attributionStatement: string

src-ts/tools/learn/learn-lib/data-providers/resource-provider-provider/resource-provider-functions/resource-provider.store.ts

@@ -1,39 +1,19 @@
-import { Dispatch, SetStateAction, useEffect, useState } from 'react'
+import { find } from 'lodash'
+import useSWR, { SWRResponse } from 'swr'
+import { learnUrlGet } from '../../functions'
 
 import { ResourceProviderData } from './resource-provider-data.model'
-import { getResourceProvidersAsync } from './resource-provider-functions/resource-provider.store'
+import { ResourceProvider } from './resource-provider.model'
 
-export function useResourceProvider(providerName?: string): ResourceProviderData {
-    const [state, setState]: [ResourceProviderData, Dispatch<SetStateAction<ResourceProviderData>>] = useState<ResourceProviderData>({
-        loading: false,
-        ready: false,
-    })
+export function useGetResourceProvider(providerName?: string): ResourceProviderData {
 
-    useEffect(() => {
-        if (!providerName) {
-            setState((prevState) => ({
-                ...prevState,
-                loading: false,
-                provider: undefined,
-                ready: false,
-            }))
-            return
-        }
+    const url: string = learnUrlGet('providers')
 
-        setState((prevState) => ({
-            ...prevState,
-            loading: true,
-        }))
+    const {data, error}: SWRResponse<ReadonlyArray<ResourceProvider>> = useSWR(url)
 
-        getResourceProvidersAsync().then((providers) => {
-            setState((prevState) => ({
-                ...prevState,
-                loading: false,
-                provider: providers?.find(p => p.name === providerName),
-                ready: true,
-            }))
-        })
-    }, [providerName])
-
-    return state
+    return {
+        provider: find(data, {name: providerName}),
+        loading: !data && !error,
+        ready: !!data || !!error,
+    }
 }

src-ts/tools/learn/learn-lib/data-providers/resource-provider-provider/resource-provider-functions/resource-provider.model.ts renamed to src-ts/tools/learn/learn-lib/data-providers/resource-provider-provider/resource-provider.model.ts

@@ -5,7 +5,11 @@ import { learnUrlGet } from '../../functions'
 import { UserCertificationProgressProviderData } from './user-certification-progress-provider-data.model'
 import { LearnUserCertificationProgress } from './user-certifications-functions'
 
-export function useGetUserCertificationProgress(userId?: number, provider?: string, certification?: string):
+export function useGetUserCertificationProgress(
+    userId?: number,
+    provider?: string,
+    certification?: string
+):
     UserCertificationProgressProviderData {
 
     const params: string = [

src-ts/tools/learn/learn-lib/data-providers/resource-provider-provider/resource-provider.provider.tsx

@@ -1,3 +1,3 @@
-export * from './user-completed-certifications-functions'
 export * from './user-completed-certifications-provider-data.model'
 export * from './user-completed-certifications.provider'
+export * from './user-completed-certification.model'

src-ts/tools/learn/learn-lib/data-providers/user-certifications-provider/user-certification-progress.provider.tsx

@@ -1,6 +1,6 @@
-import { LearnCertificateTrackType } from '../../all-certifications-provider'
-import { LearnModelBase } from '../../../functions'
-import { UserCertificationProgressStatus } from '../../user-certifications-provider'
+import { LearnCertificateTrackType } from '../all-certifications-provider'
+import { LearnModelBase } from '../../functions'
+import { UserCertificationProgressStatus } from '../user-certifications-provider'
 
 export interface LearnUserCompletedCertification extends LearnModelBase {
     certification: string,