From 1a2e0abc21fd3b1c7f7d6e979009c5d6f4d88cb8 Mon Sep 17 00:00:00 2001
From: Vasilica Olariu <olariu.vasilica@gmail.com>
Date: Thu, 10 Nov 2022 16:29:45 +0200
Subject: [PATCH 1/8] lint issues in src-ts/util

---
 .../ContactSupportForm.tsx                    | 36 +++++++++++--------
 .../utils/contact-support/ContactSupport.tsx  |  6 ++--
 src-ts/utils/settings/account/Account.tsx     | 28 ++++++++-------
 .../change-password/ChangePassword.tsx        | 20 ++++++-----
 .../settings/account/edit-name/EditName.tsx   | 20 ++++++-----
 5 files changed, 64 insertions(+), 46 deletions(-)

diff --git a/src-ts/lib/contact-support-form/ContactSupportForm.tsx b/src-ts/lib/contact-support-form/ContactSupportForm.tsx
index 6a4c92470..7f63a0625 100644
--- a/src-ts/lib/contact-support-form/ContactSupportForm.tsx
+++ b/src-ts/lib/contact-support-form/ContactSupportForm.tsx
@@ -1,4 +1,4 @@
-import { Dispatch, FC, SetStateAction, useContext, useEffect, useState } from 'react'
+import { Dispatch, FC, SetStateAction, useCallback, useContext, useEffect, useState } from 'react'
 
 import { Form, FormDefinition, formGetInputModel, FormInputModel } from '../form'
 import { LoadingSpinner } from '../loading-spinner'
@@ -19,20 +19,28 @@ const ContactSupportForm: FC<ContactSupportFormProps> = (props: ContactSupportFo
 
     const { profile }: ProfileContextData = useContext(profileContext)
 
-    const [loading, setLoading]: [boolean, Dispatch<SetStateAction<boolean>>] = useState<boolean>(false)
-    const [saveOnSuccess, setSaveOnSuccess]: [boolean, Dispatch<SetStateAction<boolean>>] = useState<boolean>(false)
+    const [loading, setLoading]: [boolean, Dispatch<SetStateAction<boolean>>]
+        = useState<boolean>(false)
+    const [saveOnSuccess, setSaveOnSuccess]: [boolean, Dispatch<SetStateAction<boolean>>]
+        = useState<boolean>(false)
 
     useEffect(() => {
         if (!loading && saveOnSuccess) {
             props.onSave()
         }
-    }, [loading, saveOnSuccess])
+    }, [loading, saveOnSuccess, props.onSave])
 
-    function generateRequest(inputs: ReadonlyArray<FormInputModel>): ContactSupportRequest {
-        const firstName: string = formGetInputModel(inputs, ContactSupportFormField.first).value as string
-        const lastName: string = formGetInputModel(inputs, ContactSupportFormField.last).value as string
-        const email: string = formGetInputModel(inputs, ContactSupportFormField.email).value as string
-        const question: string = formGetInputModel(inputs, ContactSupportFormField.question).value as string
+    const generateRequest = useCallback((
+        inputs: ReadonlyArray<FormInputModel>,
+    ): ContactSupportRequest => {
+        const firstName: string
+            = formGetInputModel(inputs, ContactSupportFormField.first).value as string
+        const lastName: string
+            = formGetInputModel(inputs, ContactSupportFormField.last).value as string
+        const email: string
+            = formGetInputModel(inputs, ContactSupportFormField.email).value as string
+        const question: string
+            = formGetInputModel(inputs, ContactSupportFormField.question).value as string
         return {
             challengeId: props.workId,
             email,
@@ -41,15 +49,15 @@ const ContactSupportForm: FC<ContactSupportFormProps> = (props: ContactSupportFo
             lastName,
             question,
         }
-    }
+    }, [props.workId])
 
-    async function saveAsync(request: ContactSupportRequest): Promise<void> {
+    const saveAsync = useCallback(async (request: ContactSupportRequest): Promise<void> => {
         setLoading(true)
         return contactSupportSubmitRequestAsync(request)
             .then(() => {
                 setSaveOnSuccess(true)
             }).finally(() => setLoading(false))
-    }
+    }, [])
 
     const emailElement: JSX.Element | undefined = !!profile?.email
         ? (
@@ -69,10 +77,10 @@ const ContactSupportForm: FC<ContactSupportFormProps> = (props: ContactSupportFo
                     Hi
                     {' '}
                     {profile?.firstName || 'there'}
-                    , we're here to help.
+                    , we&apos;re here to help.
                 </p>
                 <p>
-                    Please describe what you'd like to discuss, and a
+                    Please describe what you&apos;d like to discuss, and a
                     Topcoder Solutions Expert will email you back
                     {emailElement}
                     &nbsp;within one business day.
diff --git a/src-ts/utils/contact-support/ContactSupport.tsx b/src-ts/utils/contact-support/ContactSupport.tsx
index 2bd846335..65938aae6 100644
--- a/src-ts/utils/contact-support/ContactSupport.tsx
+++ b/src-ts/utils/contact-support/ContactSupport.tsx
@@ -1,4 +1,4 @@
-import { Dispatch, FC, SetStateAction, useState } from 'react'
+import { Dispatch, FC, SetStateAction, useCallback, useState } from 'react'
 
 import {
     ContactSupportForm,
@@ -16,11 +16,11 @@ const ContactSupport: FC<{}> = () => {
     const [formDef, setFormDef]: [FormDefinition, Dispatch<SetStateAction<FormDefinition>>]
         = useState<FormDefinition>({ ...contactSupportFormDef })
 
-    function onSave(): void {
+    const onSave = useCallback((): void => {
         const updatedForm: FormDefinition = { ...formDef }
         formOnReset(formGetInputFields(updatedForm.groups || []))
         setFormDef(updatedForm)
-    }
+    }, [formDef])
 
     return (
         <ContentLayout title={toolTitle}>
diff --git a/src-ts/utils/settings/account/Account.tsx b/src-ts/utils/settings/account/Account.tsx
index 326c8ba19..248731e5e 100644
--- a/src-ts/utils/settings/account/Account.tsx
+++ b/src-ts/utils/settings/account/Account.tsx
@@ -1,4 +1,4 @@
-import { Dispatch, FC, SetStateAction, useContext, useState } from 'react'
+import { Dispatch, FC, SetStateAction, useCallback, useContext, useState } from 'react'
 import Modal from 'react-responsive-modal'
 
 import {
@@ -20,24 +20,26 @@ const Account: FC<{}> = () => {
     const profileContextData: ProfileContextData = useContext(profileContext)
     const { profile }: ProfileContextData = profileContextData
 
-    const [editProfileOpen, setEditNameOpen]: [boolean, Dispatch<SetStateAction<boolean>>] = useState<boolean>(false)
-    const [changePasswordOpen, setChangePasswordOpen]: [boolean, Dispatch<SetStateAction<boolean>>] = useState<boolean>(false)
+    const [editProfileOpen, setEditNameOpen]: [boolean, Dispatch<SetStateAction<boolean>>]
+        = useState<boolean>(false)
+    const [changePasswordOpen, setChangePasswordOpen]: [boolean, Dispatch<SetStateAction<boolean>>]
+        = useState<boolean>(false)
 
-    // if we don't have a profile, don't show the page
-    if (!profile) {
-        return <></>
-    }
-
-    function toggleEditName(): void {
+    const toggleEditName = useCallback((): void => {
         const inputs: Array<FormInputModel> = formGetInputFields(editNameFormDef.groups || [])
         formOnReset(inputs)
         setEditNameOpen(!editProfileOpen)
-    }
+    }, [editProfileOpen])
 
-    function toggleChangePassword(): void {
+    const toggleChangePassword = useCallback((): void => {
         const inputs: Array<FormInputModel> = formGetInputFields(editNameFormDef.groups || [])
         formOnReset(inputs)
         setChangePasswordOpen(!changePasswordOpen)
+    }, [changePasswordOpen])
+
+    // if we don't have a profile, don't show the page
+    if (!profile) {
+        return <></>
     }
 
     return (
@@ -68,7 +70,7 @@ const Account: FC<{}> = () => {
                 <Button
                     label='edit name'
                     onClick={toggleEditName}
-                    tabIndex={1}
+                    tabIndex={-1}
                     buttonStyle='secondary'
                 />
             </Card>
@@ -91,7 +93,7 @@ const Account: FC<{}> = () => {
                 <Button
                     label='change password'
                     onClick={toggleChangePassword}
-                    tabIndex={2}
+                    tabIndex={-1}
                     buttonStyle='secondary'
                 />
             </Card>
diff --git a/src-ts/utils/settings/account/change-password/ChangePassword.tsx b/src-ts/utils/settings/account/change-password/ChangePassword.tsx
index 9857dcfdd..37f967151 100644
--- a/src-ts/utils/settings/account/change-password/ChangePassword.tsx
+++ b/src-ts/utils/settings/account/change-password/ChangePassword.tsx
@@ -1,4 +1,4 @@
-import { Dispatch, FC, SetStateAction, useContext, useState } from 'react'
+import { Dispatch, FC, SetStateAction, useCallback, useContext, useState } from 'react'
 
 import {
     ChangePasswordRequest,
@@ -25,21 +25,25 @@ const ChangePassword: FC<ChangePasswordProps> = (props: ChangePasswordProps) =>
     const [passwordForm]: [FormDefinition, Dispatch<SetStateAction<FormDefinition>>]
         = useState<FormDefinition>(changePasswordFormDef)
 
-    function requestGenerator(inputs: ReadonlyArray<FormInputModel>): ChangePasswordRequest {
-        const password: string = formGetInputModel(inputs, ChangePasswordFieldName.currentPassword).value as string
-        const newPassword: string = formGetInputModel(inputs, ChangePasswordFieldName.newPassword).value as string
+    const requestGenerator = useCallback((
+        inputs: ReadonlyArray<FormInputModel>,
+    ): ChangePasswordRequest => {
+        const password: string
+            = formGetInputModel(inputs, ChangePasswordFieldName.currentPassword).value as string
+        const newPassword: string
+            = formGetInputModel(inputs, ChangePasswordFieldName.newPassword).value as string
         return {
             newPassword,
             password,
         }
-    }
+    }, [])
 
-    function save(updatedPassword: ChangePasswordRequest): Promise<void> {
-        return changePassword((profile as UserProfile).userId, updatedPassword)
+    const save = useCallback((updatedPassword: ChangePasswordRequest): Promise<void> => (
+        changePassword((profile as UserProfile).userId, updatedPassword)
             .then(() => {
                 props.onClose()
             })
-    }
+    ), [changePassword, profile, props.onClose])
 
     return (
         <Form
diff --git a/src-ts/utils/settings/account/edit-name/EditName.tsx b/src-ts/utils/settings/account/edit-name/EditName.tsx
index adf0bfff9..3af3a36dc 100644
--- a/src-ts/utils/settings/account/edit-name/EditName.tsx
+++ b/src-ts/utils/settings/account/edit-name/EditName.tsx
@@ -1,4 +1,4 @@
-import { Dispatch, FC, SetStateAction, useContext, useState } from 'react'
+import { Dispatch, FC, SetStateAction, useCallback, useContext, useState } from 'react'
 
 import {
     EditNameRequest,
@@ -26,17 +26,21 @@ const EditName: FC<EditNameProps> = (props: EditNameProps) => {
     const [profileForm]: [FormDefinition, Dispatch<SetStateAction<FormDefinition>>]
         = useState<FormDefinition>(editNameFormDef)
 
-    function requestGenerator(inputs: ReadonlyArray<FormInputModel>): EditNameRequest {
-        const firstName: string = formGetInputModel(inputs, EditNameFieldName.firstName).value as string
-        const lastName: string = formGetInputModel(inputs, EditNameFieldName.lastName).value as string
+    const requestGenerator = useCallback((
+        inputs: ReadonlyArray<FormInputModel>,
+    ): EditNameRequest => {
+        const firstName: string
+            = formGetInputModel(inputs, EditNameFieldName.firstName).value as string
+        const lastName: string
+            = formGetInputModel(inputs, EditNameFieldName.lastName).value as string
         return {
             firstName,
             lastName,
         }
-    }
+    }, [])
 
-    function saveProfile(updatedProfile: EditNameRequest): Promise<void> {
-        return updateProfile({
+    const saveProfile = useCallback((updatedProfile: EditNameRequest): Promise<void> => (
+        updateProfile({
             ...profileContextData,
             profile: {
                 ...profileContextData.profile as UserProfile,
@@ -47,7 +51,7 @@ const EditName: FC<EditNameProps> = (props: EditNameProps) => {
             .then(() => {
                 props.onClose()
             })
-    }
+    ), [profileContextData, props.onClose, updateProfile])
 
     return (
         <Form

From 820dcbbc1fcfc0a47484e0eaf190cf5e58296fdb Mon Sep 17 00:00:00 2001
From: Vasilica Olariu <olariu.vasilica@gmail.com>
Date: Fri, 11 Nov 2022 10:29:05 +0200
Subject: [PATCH 2/8] fix lint errors for part of tools/learn

---
 .../certificate/course-card/CourseCard.tsx    |  8 +-
 .../collapsible-item/CollapsibleItem.tsx      | 83 +++++++++++--------
 .../course-outline/status-icon/StatusIcon.tsx | 18 ++--
 .../course-outline/step-icon/StepIcon.tsx     |  2 +-
 .../courses-provider/courses.provider.tsx     |  3 +-
 .../functions/learn-xhr.functions.ts          | 18 ++--
 .../learn-lib/functions/learn.factory.ts      | 10 ++-
 .../lesson-provider/lesson.provider.tsx       | 29 ++++---
 .../my-course-card/completed/Completed.tsx    | 16 +++-
 .../resource-provider.provider.tsx            | 12 ++-
 .../user-certification-progress.provider.tsx  | 25 ++++--
 .../user-certification-progress.store.ts      | 16 +++-
 .../user-certifications.provider.tsx          | 10 ++-
 ...user-completed-certifications.provider.tsx | 21 +++--
 .../learn/learn-lib/wave-hero/WaveHero.tsx    |  2 +-
 src-ts/tools/learn/learn.routes.tsx           | 19 +++--
 src-ts/tools/learn/my-learning/MyLearning.tsx | 17 +++-
 .../my-tabs-navbar/MyTabsNavbar.tsx           |  5 +-
 .../AvailableCoursesList.tsx                  | 61 ++++++++------
 .../welcome/courses-card/CoursesCard.tsx      |  6 +-
 .../welcome/progress-block/ProgressBlock.tsx  |  4 +-
 .../cards-slider/CardsSlider.tsx              | 34 ++++----
 .../progress-action/ProgressAction.tsx        | 18 ++--
 23 files changed, 278 insertions(+), 159 deletions(-)

diff --git a/src-ts/tools/learn/course-certificate/certificate-view/certificate/course-card/CourseCard.tsx b/src-ts/tools/learn/course-certificate/certificate-view/certificate/course-card/CourseCard.tsx
index 75b93db0e..aa669788c 100644
--- a/src-ts/tools/learn/course-certificate/certificate-view/certificate/course-card/CourseCard.tsx
+++ b/src-ts/tools/learn/course-certificate/certificate-view/certificate/course-card/CourseCard.tsx
@@ -26,7 +26,13 @@ const CourseCard: FC<CourseCardProps> = (props: CourseCardProps) => (
             <IconOutline.CalendarIcon />
             <span className='large-subtitle'>
                 <span>Completed</span>
-                <span>{props.completedDate && textFormatDateLocaleShortString(new Date(props.completedDate))}</span>
+                <span>
+                    {
+                        props.completedDate && (
+                            textFormatDateLocaleShortString(new Date(props.completedDate))
+                        )
+                    }
+                </span>
             </span>
         </div>
     </div>
diff --git a/src-ts/tools/learn/learn-lib/course-outline/collapsible-item/CollapsibleItem.tsx b/src-ts/tools/learn/learn-lib/course-outline/collapsible-item/CollapsibleItem.tsx
index 66a1dde65..f252a12b7 100644
--- a/src-ts/tools/learn/learn-lib/course-outline/collapsible-item/CollapsibleItem.tsx
+++ b/src-ts/tools/learn/learn-lib/course-outline/collapsible-item/CollapsibleItem.tsx
@@ -18,7 +18,7 @@ interface CollapsibleItemProps {
     active?: string
     duration: LearnModule['meta']['estimatedCompletionTime']
     isAssessment: boolean
-    itemId?: (item: any) => string
+    itemId?: (item: CollapsibleListItem) => string
     items: Array<CollapsibleListItem>
     lessonsCount: number
     moduleKey: string
@@ -30,52 +30,67 @@ interface CollapsibleItemProps {
 }
 
 const CollapsibleItem: FC<CollapsibleItemProps> = (props: CollapsibleItemProps) => {
-    const [isOpen, setIsOpen]: [boolean, Dispatch<SetStateAction<boolean>>] = useState<boolean>(false)
+    const [isOpen, setIsOpen]: [
+        boolean,
+        Dispatch<SetStateAction<boolean>>
+    ] = useState<boolean>(false)
 
     const toggle: () => void = useCallback(() => {
         setIsOpen(open => !open)
     }, [])
 
-    const progress: LearnModuleProgress | undefined = useMemo(() => props.progress?.find(m => m.module === props.moduleKey), [props.progress, props.moduleKey])
+    const progress: LearnModuleProgress | undefined = useMemo(() => (
+        props.progress?.find(m => m.module === props.moduleKey)
+    ), [props.progress, props.moduleKey])
 
-    const isCompleted: boolean = useMemo(() => !!progress && progress.lessonCount === progress?.completedLessons.length, [progress])
+    const isCompleted: boolean = useMemo(() => (
+        !!progress && progress.lessonCount === progress?.completedLessons.length
+    ), [progress])
 
-    const isPartial: boolean = useMemo(() => !!progress && !!progress.completedLessons.length, [progress])
+    const isPartial: boolean = useMemo(() => (
+        !!progress && !!progress.completedLessons.length
+    ), [progress])
 
     const isItemCompleted: (key: string) => boolean = (key: string) => (
         !!progress?.completedLessons.find(l => l.dashedName === key)
     )
 
-    const stepLabel: (item: any, isActive: boolean, stepCount: string, label?: string) => ReactNode
-    = (item: any, isActive: boolean, stepCount: string, label?: string) => (
-        <StepIcon
-            index={stepCount}
-            completed={isItemCompleted(item.dashedName)}
-            active={isActive}
-            label={label}
-        />
-    )
-
-    const renderListItem: (item: any) => ReactNode = (item: any) => {
-        const isActive: boolean = props.itemId?.(item) === props.active
-        const stepCount: string = item.dashedName.match(/^step-(\d+)$/i)?.[1]
-        const label: ReactNode = stepLabel(item, isActive, stepCount, !stepCount && item.title)
-        const key: string = props.itemId?.(item) ?? item.title
-
-        return (
-            <li
-                key={key}
-                className={classNames(styles['item-wrap'], !stepCount && 'full-width')}
-                onClick={() => props.onItemClick(item)}
-            >
-                {props.path ? (
-                    <Link className={styles['item-wrap']} to={props.path(item)}>
-                        {label}
-                    </Link>
-                ) : label}
-            </li>
+    const stepLabel: (
+        item: CollapsibleListItem,
+        isActive: boolean,
+        stepCount?: string,
+        label?: string
+    ) => ReactNode
+        = (item: CollapsibleListItem, isActive: boolean, stepCount?: string, label?: string) => (
+            <StepIcon
+                index={stepCount}
+                completed={isItemCompleted(item.dashedName)}
+                active={isActive}
+                label={label}
+            />
         )
-    }
+
+    const renderListItem: (item: CollapsibleListItem) => ReactNode
+        = (item: CollapsibleListItem) => {
+            const isActive: boolean = props.itemId?.(item) === props.active
+            const stepCount: string | undefined = item.dashedName.match(/^step-(\d+)$/i)?.[1]
+            const label: ReactNode = stepLabel(item, isActive, stepCount, !stepCount && item.title)
+            const key: string = props.itemId?.(item) ?? item.title
+
+            return (
+                <li
+                    key={key}
+                    className={classNames(styles['item-wrap'], !stepCount && 'full-width')}
+                    onClick={() => props.onItemClick(item)}
+                >
+                    {props.path ? (
+                        <Link className={styles['item-wrap']} to={props.path(item)}>
+                            {label}
+                        </Link>
+                    ) : label}
+                </li>
+            )
+        }
 
     return (
         <div className={classNames(styles.wrap, isOpen ? 'is-open' : 'collapsed')}>
diff --git a/src-ts/tools/learn/learn-lib/course-outline/status-icon/StatusIcon.tsx b/src-ts/tools/learn/learn-lib/course-outline/status-icon/StatusIcon.tsx
index d1c2fee91..bc4dc7ef3 100755
--- a/src-ts/tools/learn/learn-lib/course-outline/status-icon/StatusIcon.tsx
+++ b/src-ts/tools/learn/learn-lib/course-outline/status-icon/StatusIcon.tsx
@@ -18,13 +18,17 @@ const StatusIcon: FC<StatusIconProps> = (props: StatusIconProps) => {
         props.partial && 'partial',
     )
 
-    const icon: ReactNode = useMemo(() => (
-        props.completed
-            ? <IconSolid.CheckCircleIcon />
-            : props.partial
-                ? <IconOutline.ClockIcon />
-                : <IconOutline.DotsCircleHorizontalIcon />
-    ), [props.completed, props.partial])
+    const icon: ReactNode = useMemo(() => {
+        if (props.completed) {
+            return <IconSolid.CheckCircleIcon />
+        }
+
+        if (props.partial) {
+            return <IconOutline.ClockIcon />
+        }
+
+        return <IconOutline.DotsCircleHorizontalIcon />
+    }, [props.completed, props.partial])
 
     return (
         <div className={classes}>
diff --git a/src-ts/tools/learn/learn-lib/course-outline/step-icon/StepIcon.tsx b/src-ts/tools/learn/learn-lib/course-outline/step-icon/StepIcon.tsx
index 1a861c0a2..74c0551f8 100755
--- a/src-ts/tools/learn/learn-lib/course-outline/step-icon/StepIcon.tsx
+++ b/src-ts/tools/learn/learn-lib/course-outline/step-icon/StepIcon.tsx
@@ -8,7 +8,7 @@ import styles from './StepIcon.module.scss'
 interface StepIconProps {
     active?: boolean
     completed?: boolean
-    index: string
+    index?: string
     label?: string
 }
 
diff --git a/src-ts/tools/learn/learn-lib/courses-provider/courses.provider.tsx b/src-ts/tools/learn/learn-lib/courses-provider/courses.provider.tsx
index 808bc6053..f33622e57 100644
--- a/src-ts/tools/learn/learn-lib/courses-provider/courses.provider.tsx
+++ b/src-ts/tools/learn/learn-lib/courses-provider/courses.provider.tsx
@@ -1,3 +1,4 @@
+import { noop } from 'lodash'
 import { Dispatch, SetStateAction, useEffect, useState } from 'react'
 
 import { courseGetAsync } from './courses-functions'
@@ -24,7 +25,7 @@ export function useCourses(provider: string, certification?: string): CoursesPro
                 loading: false,
                 ready: false,
             }))
-            return
+            return noop
         }
 
         setState(prevState => ({
diff --git a/src-ts/tools/learn/learn-lib/functions/learn-xhr.functions.ts b/src-ts/tools/learn/learn-lib/functions/learn-xhr.functions.ts
index e9ab61dc7..e77a3ebbe 100644
--- a/src-ts/tools/learn/learn-lib/functions/learn-xhr.functions.ts
+++ b/src-ts/tools/learn/learn-lib/functions/learn-xhr.functions.ts
@@ -2,7 +2,7 @@ import { AxiosInstance, AxiosRequestConfig } from 'axios'
 
 import { xhrCreateInstance, xhrGetAsync, xhrPostAsync, xhrPutAsync } from '../../../../lib'
 
-import { create as learnCreate } from './learn.factory'
+import { create as learnCreate, LearnResponseModel } from './learn.factory'
 
 const learnXhrInstance: AxiosInstance = xhrCreateInstance()
 
@@ -10,12 +10,12 @@ const learnXhrInstance: AxiosInstance = xhrCreateInstance()
 learnXhrInstance.interceptors.response
     .use(response => {
 
-        if (response.data?.hasOwnProperty('createdAt')) {
+        if (Object.prototype.hasOwnProperty.call(response.data, 'createdAt')) {
             response.data = learnCreate(response.data)
 
         } else if (response.data?.constructor?.name === 'Array') {
             response.data = response.data
-                .map((item: any) => learnCreate(item))
+                .map(<T extends LearnResponseModel>(item: T) => learnCreate(item))
         }
 
         return response
@@ -25,10 +25,18 @@ export async function getAsync<T>(url: string): Promise<T> {
     return xhrGetAsync(url, learnXhrInstance)
 }
 
-export async function postAsync<T, R>(url: string, data: T, config?: AxiosRequestConfig<T>): Promise<R> {
+export async function postAsync<T, R>(
+    url: string,
+    data: T,
+    config?: AxiosRequestConfig<T>,
+): Promise<R> {
     return xhrPostAsync(url, data, config, learnXhrInstance)
 }
 
-export async function putAsync<T, R>(url: string, data: T, config?: AxiosRequestConfig<T>): Promise<R> {
+export async function putAsync<T, R>(
+    url: string,
+    data: T,
+    config?: AxiosRequestConfig<T>,
+): Promise<R> {
     return xhrPutAsync(url, data, config, learnXhrInstance)
 }
diff --git a/src-ts/tools/learn/learn-lib/functions/learn.factory.ts b/src-ts/tools/learn/learn-lib/functions/learn.factory.ts
index e7122f84b..1fac21de2 100644
--- a/src-ts/tools/learn/learn-lib/functions/learn.factory.ts
+++ b/src-ts/tools/learn/learn-lib/functions/learn.factory.ts
@@ -1,4 +1,6 @@
-interface LearnResponseModel {
+import { set } from 'lodash'
+
+export interface LearnResponseModel {
     createdAt?: string | Date
     publishedAt?: string | Date
     updatedAt?: string | Date
@@ -7,15 +9,15 @@ interface LearnResponseModel {
 export function create<T extends LearnResponseModel>(item: T): T {
 
     if (typeof item?.createdAt === 'string') {
-        item.createdAt = new Date(item.createdAt)
+        set(item, 'createdAt', new Date(item.createdAt))
     }
 
     if (typeof item?.updatedAt === 'string') {
-        item.updatedAt = new Date(item.updatedAt)
+        set(item, 'updatedAt', new Date(item.updatedAt))
     }
 
     if (typeof item?.publishedAt === 'string') {
-        item.publishedAt = new Date(item.publishedAt)
+        set(item, 'publishedAt', new Date(item.publishedAt))
     }
 
     return item
diff --git a/src-ts/tools/learn/learn-lib/lesson-provider/lesson.provider.tsx b/src-ts/tools/learn/learn-lib/lesson-provider/lesson.provider.tsx
index 0562d3091..6e025db03 100644
--- a/src-ts/tools/learn/learn-lib/lesson-provider/lesson.provider.tsx
+++ b/src-ts/tools/learn/learn-lib/lesson-provider/lesson.provider.tsx
@@ -1,3 +1,4 @@
+import { get, noop } from 'lodash'
 import { Dispatch, SetStateAction, useEffect, useState } from 'react'
 
 import { courseGetAsync } from '../courses-provider'
@@ -12,10 +13,14 @@ export function useLessonProvider(
     module?: string,
     lesson?: string,
 ): LessonProviderData {
-    const [state, setState]: [LessonProviderData, Dispatch<SetStateAction<LessonProviderData>>] = useState<LessonProviderData>({
-        loading: false,
-        ready: false,
-    })
+    const [state, setState]: [
+        LessonProviderData,
+        Dispatch<SetStateAction<LessonProviderData>>
+    ]
+        = useState<LessonProviderData>({
+            loading: false,
+            ready: false,
+        })
 
     useEffect(() => {
         let mounted: boolean = true
@@ -27,7 +32,7 @@ export function useLessonProvider(
                 loading: false,
                 ready: false,
             }))
-            return
+            return noop
         }
 
         setState(prevState => ({
@@ -42,8 +47,10 @@ export function useLessonProvider(
                     return
                 }
 
-                const moduleData: LearnModule | undefined = courseData?.modules.find(m => m.key === module)
-                const lessonData: LearnLesson | undefined = moduleData?.lessons.find(l => l.dashedName === lesson)
+                const moduleData: LearnModule | undefined
+                    = courseData?.modules.find(m => m.key === module)
+                const lessonData: LearnLesson | undefined
+                    = moduleData?.lessons.find(l => l.dashedName === lesson)
 
                 const lessonUrl: string = [
                     'learn',
@@ -57,10 +64,10 @@ export function useLessonProvider(
                     lesson: lessonData && {
                         ...lessonData,
                         course: {
-                            certification: courseData?.certification ?? '',
-                            certificationId: courseData?.certificationId ?? '',
-                            id: courseData?.id ?? '',
-                            title: courseData?.title ?? '',
+                            certification: get(courseData, 'certification', ''),
+                            certificationId: get(courseData, 'certificationId', ''),
+                            id: get(courseData, 'id', ''),
+                            title: get(courseData, 'title', ''),
                         },
                         lessonUrl,
                         module: {
diff --git a/src-ts/tools/learn/learn-lib/my-course-card/completed/Completed.tsx b/src-ts/tools/learn/learn-lib/my-course-card/completed/Completed.tsx
index 6bdccd3b1..6813bc99d 100644
--- a/src-ts/tools/learn/learn-lib/my-course-card/completed/Completed.tsx
+++ b/src-ts/tools/learn/learn-lib/my-course-card/completed/Completed.tsx
@@ -8,7 +8,7 @@ import { getCertificatePath, getCoursePath } from '../../../learn.routes'
 import styles from './Completed.module.scss'
 
 interface CompletedProps {
-    certification: LearnCertification
+    certification?: LearnCertification
     completed: string
 }
 
@@ -38,13 +38,23 @@ const Completed: FC<CompletedProps> = (props: CompletedProps) => {
                     size='xs'
                     buttonStyle='secondary'
                     label='View Course'
-                    route={getCoursePath(props.certification.providerName, props.certification.certification)}
+                    route={
+                        getCoursePath(
+                            props.certification.providerName,
+                            props.certification.certification,
+                        )
+                    }
                 />
                 <Button
                     size='xs'
                     buttonStyle='secondary'
                     label='View certificate'
-                    route={getCertificatePath(props.certification.providerName, props.certification.certification)}
+                    route={
+                        getCertificatePath(
+                            props.certification.providerName,
+                            props.certification.certification,
+                        )
+                    }
                 />
             </div>
         </div>
diff --git a/src-ts/tools/learn/learn-lib/resource-provider-provider/resource-provider.provider.tsx b/src-ts/tools/learn/learn-lib/resource-provider-provider/resource-provider.provider.tsx
index 9a37d388f..f0aa86518 100755
--- a/src-ts/tools/learn/learn-lib/resource-provider-provider/resource-provider.provider.tsx
+++ b/src-ts/tools/learn/learn-lib/resource-provider-provider/resource-provider.provider.tsx
@@ -4,10 +4,14 @@ import { ResourceProviderData } from './resource-provider-data.model'
 import { getResourceProvidersAsync } from './resource-provider-functions/resource-provider.store'
 
 export function useResourceProvider(providerName?: string): ResourceProviderData {
-    const [state, setState]: [ResourceProviderData, Dispatch<SetStateAction<ResourceProviderData>>] = useState<ResourceProviderData>({
-        loading: false,
-        ready: false,
-    })
+    const [state, setState]: [
+        ResourceProviderData,
+        Dispatch<SetStateAction<ResourceProviderData>>
+    ]
+        = useState<ResourceProviderData>({
+            loading: false,
+            ready: false,
+        })
 
     useEffect(() => {
         if (!providerName) {
diff --git a/src-ts/tools/learn/learn-lib/user-certifications-provider/user-certification-progress.provider.tsx b/src-ts/tools/learn/learn-lib/user-certifications-provider/user-certification-progress.provider.tsx
index 7cfacb903..0ad6ee18f 100644
--- a/src-ts/tools/learn/learn-lib/user-certifications-provider/user-certification-progress.provider.tsx
+++ b/src-ts/tools/learn/learn-lib/user-certifications-provider/user-certification-progress.provider.tsx
@@ -3,13 +3,18 @@ import { Dispatch, MutableRefObject, SetStateAction, useCallback, useEffect, use
 import { UserCertificationProgressProviderData } from './user-certification-progress-provider-data.model'
 import { LearnUserCertificationProgress, userCertificationProgressGetAsync } from './user-certifications-functions'
 
-export function useUserCertificationProgress(userId?: number, provider?: string, certification?: string):
-    UserCertificationProgressProviderData {
+export function useUserCertificationProgress(
+    userId?: number,
+    provider?: string,
+    certification?: string,
+): UserCertificationProgressProviderData {
+
     const callCounter: MutableRefObject<number> = useRef(0)
 
     function setCertificateProgress(progress: LearnUserCertificationProgress): void {
+        // eslint-disable-next-line no-use-before-define
         setState(prevState => ({ ...prevState, certificationProgress: progress }))
-        callCounter.current++
+        callCounter.current += 1
     }
 
     const fetchProgress: () => void = useCallback(() => {
@@ -17,7 +22,8 @@ export function useUserCertificationProgress(userId?: number, provider?: string,
             return
         }
 
-        const currentCallCounter: number = ++callCounter.current
+        callCounter.current += 1
+        const currentCallCounter: number = callCounter.current
 
         userCertificationProgressGetAsync(userId, provider, certification)
             .then(myCertifications => {
@@ -28,17 +34,22 @@ export function useUserCertificationProgress(userId?: number, provider?: string,
                     return
                 }
 
+                // eslint-disable-next-line no-use-before-define
                 setState(prevState => ({
                     ...prevState,
-                    certificationProgress: myCertifications.find(c => c.certification === certification),
+                    certificationProgress: (
+                        myCertifications.find(c => c.certification === certification)
+                    ),
                     loading: false,
                     ready: true,
                 }))
             })
     }, [certification, provider, userId])
 
-    const [state, setState]:
-        [UserCertificationProgressProviderData, Dispatch<SetStateAction<UserCertificationProgressProviderData>>]
+    const [state, setState]: [
+        UserCertificationProgressProviderData,
+        Dispatch<SetStateAction<UserCertificationProgressProviderData>>
+    ]
         = useState<UserCertificationProgressProviderData>({
             certificationProgress: undefined,
             loading: false,
diff --git a/src-ts/tools/learn/learn-lib/user-certifications-provider/user-certifications-functions/user-certification-progress.store.ts b/src-ts/tools/learn/learn-lib/user-certifications-provider/user-certifications-functions/user-certification-progress.store.ts
index 2d46fec56..9b9ebbf9e 100755
--- a/src-ts/tools/learn/learn-lib/user-certifications-provider/user-certifications-functions/user-certification-progress.store.ts
+++ b/src-ts/tools/learn/learn-lib/user-certifications-provider/user-certifications-functions/user-certification-progress.store.ts
@@ -7,6 +7,8 @@ import { UserCertificationUpdateProgressActions } from './user-certification-upd
 
 const certProgressPath: string = 'certification-progresses'
 
+type GenericDataObject = { [key: string]: string | GenericDataObject }
+
 export function completeCourse(
     certificationProgressId: string,
     certification: string,
@@ -15,7 +17,7 @@ export function completeCourse(
 ): Promise<LearnUserCertificationProgress> {
 
     // construct the certificate params
-    const certificateAlternateParams: { [key: string]: string } = LearnConfig.CERT_ALT_PARAMS
+    const certificateAlternateParams: GenericDataObject = LearnConfig.CERT_ALT_PARAMS
     const certificateElement: string = `[${LearnConfig.CERT_ELEMENT_SELECTOR.attribute}=${LearnConfig.CERT_ELEMENT_SELECTOR.value}]`
     const certificateUrl: string = getUserCertificateUrl(provider, certification, handle)
 
@@ -30,7 +32,8 @@ export function completeCourse(
     )
 }
 
-export function getAsync(userId: number, provider?: string, certification?: string): Promise<Array<LearnUserCertificationProgress>> {
+export function getAsync(userId: number, provider?: string, certification?: string):
+    Promise<Array<LearnUserCertificationProgress>> {
 
     const params: string = [
         `?userId=${userId}`,
@@ -45,7 +48,12 @@ export function getAsync(userId: number, provider?: string, certification?: stri
     return learnXhrGetAsync<Array<LearnUserCertificationProgress>>(url)
 }
 
-export function startAsync(userId: number, certificationId: string, courseId: string, data: any): Promise<LearnUserCertificationProgress> {
+export function startAsync(
+    userId: number,
+    certificationId: string,
+    courseId: string,
+    data: GenericDataObject,
+): Promise<LearnUserCertificationProgress> {
 
     const url: string = learnUrlGet(certProgressPath, `${userId}`, certificationId, courseId)
     return learnXhrPostAsync<{}, LearnUserCertificationProgress>(url, {}, { params: data })
@@ -54,7 +62,7 @@ export function startAsync(userId: number, certificationId: string, courseId: st
 export function updateAsync(
     certificationProgressId: string,
     action: UserCertificationUpdateProgressActions,
-    data: any,
+    data: GenericDataObject,
 ): Promise<LearnUserCertificationProgress> {
 
     const url: string = learnUrlGet(certProgressPath, certificationProgressId, action)
diff --git a/src-ts/tools/learn/learn-lib/user-certifications-provider/user-certifications.provider.tsx b/src-ts/tools/learn/learn-lib/user-certifications-provider/user-certifications.provider.tsx
index 5f1f12a74..9c0d270c4 100644
--- a/src-ts/tools/learn/learn-lib/user-certifications-provider/user-certifications.provider.tsx
+++ b/src-ts/tools/learn/learn-lib/user-certifications-provider/user-certifications.provider.tsx
@@ -1,3 +1,4 @@
+import { noop } from 'lodash'
 import { Dispatch, SetStateAction, useContext, useEffect, useState } from 'react'
 
 import { errorHandle, profileContext, ProfileContextData } from '../../../../lib'
@@ -17,7 +18,10 @@ const defaultProviderData: UserCertificationsProviderData = {
 export function useUserCertifications(): UserCertificationsProviderData {
 
     const profileContextData: ProfileContextData = useContext<ProfileContextData>(profileContext)
-    const [state, setState]: [UserCertificationsProviderData, Dispatch<SetStateAction<UserCertificationsProviderData>>]
+    const [state, setState]: [
+        UserCertificationsProviderData,
+        Dispatch<SetStateAction<UserCertificationsProviderData>>
+    ]
         = useState<UserCertificationsProviderData>(defaultProviderData)
 
     useEffect(() => {
@@ -41,7 +45,7 @@ export function useUserCertifications(): UserCertificationsProviderData {
                 }))
             }
 
-            return
+            return noop
         }
 
         userCertificationProgressGetAsync(userId)
@@ -69,7 +73,7 @@ export function useUserCertifications(): UserCertificationsProviderData {
                     ready: true,
                 }))
             })
-            .catch((err: any) => {
+            .catch((err: Error) => {
                 errorHandle(err, 'There was an error getting your course progress.')
                 setState(prevState => ({
                     ...prevState,
diff --git a/src-ts/tools/learn/learn-lib/user-completed-certifications-provider/user-completed-certifications.provider.tsx b/src-ts/tools/learn/learn-lib/user-completed-certifications-provider/user-completed-certifications.provider.tsx
index 45c812d48..b9c88e855 100644
--- a/src-ts/tools/learn/learn-lib/user-completed-certifications-provider/user-completed-certifications.provider.tsx
+++ b/src-ts/tools/learn/learn-lib/user-completed-certifications-provider/user-completed-certifications.provider.tsx
@@ -1,13 +1,20 @@
+import { noop } from 'lodash'
 import { Dispatch, SetStateAction, useEffect, useState } from 'react'
 
 import { LearnUserCompletedCertification, userCompletedCertificationGetAsync } from './user-completed-certifications-functions'
 import { UserCompletedCertificationsProviderData } from './user-completed-certifications-provider-data.model'
 
-export function useUserCompletedCertifications(userId?: number, provider?: string, certification?: string):
+export function useUserCompletedCertifications(
+    userId?: number,
+    provider?: string,
+    certification?: string,
+):
     UserCompletedCertificationsProviderData {
 
-    const [state, setState]:
-        [UserCompletedCertificationsProviderData, Dispatch<SetStateAction<UserCompletedCertificationsProviderData>>]
+    const [state, setState]: [
+        UserCompletedCertificationsProviderData,
+        Dispatch<SetStateAction<UserCompletedCertificationsProviderData>>
+    ]
         = useState<UserCompletedCertificationsProviderData>({
             certifications: [],
             loading: false,
@@ -23,7 +30,7 @@ export function useUserCompletedCertifications(userId?: number, provider?: strin
         }))
 
         if (!userId) {
-            return
+            return noop
         }
 
         userCompletedCertificationGetAsync(userId)
@@ -36,8 +43,10 @@ export function useUserCompletedCertifications(userId?: number, provider?: strin
                 let certifications: Array<LearnUserCompletedCertification> = completedCertifications
 
                 if (provider || certification) {
-                    certifications = completedCertifications.filter(c => (!provider || c.provider === provider)
-                        && (!certification || c.certification === certification))
+                    certifications = completedCertifications.filter(c => (
+                        (!provider || c.provider === provider)
+                        && (!certification || c.certification === certification)
+                    ))
                 }
 
                 setState(prevState => ({
diff --git a/src-ts/tools/learn/learn-lib/wave-hero/WaveHero.tsx b/src-ts/tools/learn/learn-lib/wave-hero/WaveHero.tsx
index 1ba945333..51b6ca8af 100755
--- a/src-ts/tools/learn/learn-lib/wave-hero/WaveHero.tsx
+++ b/src-ts/tools/learn/learn-lib/wave-hero/WaveHero.tsx
@@ -4,7 +4,7 @@ import classNames from 'classnames'
 import styles from './WaveHero.module.scss'
 
 interface WaveHeroProps {
-    children?: ReactNode
+    children?: JSX.Element|Array<JSX.Element>
     text: string
     theme?: 'light'
     title: ReactNode
diff --git a/src-ts/tools/learn/learn.routes.tsx b/src-ts/tools/learn/learn.routes.tsx
index 03d379b7e..e0627a75e 100644
--- a/src-ts/tools/learn/learn.routes.tsx
+++ b/src-ts/tools/learn/learn.routes.tsx
@@ -22,6 +22,9 @@ export enum LEARN_PATHS {
     startCourseRouteFlag = 'start-course',
 }
 
+export const rootRoute: string = LEARN_PATHS.root
+export const absoluteRootRoute: string = `${window.location.origin}${LEARN_PATHS.root}`
+
 export function getAuthenticateAndStartCourseRoute(): string {
     return `${authUrlLogin()}${encodeURIComponent(`?${LEARN_PATHS.startCourseRouteFlag}`)}`
 }
@@ -58,11 +61,20 @@ export function getLessonPathFromModule(
     return `${getCoursePath(provider, certification)}/${module}/${lesson}`
 }
 
-export function getUserCertificateSsr(provider: string, certification: string, handle: string, title: string): string {
+export function getUserCertificateSsr(
+    provider: string,
+    certification: string,
+    handle: string,
+    title: string,
+): string {
     return `${LearnConfig.CERT_DOMAIN}/${handle}/${provider}/${certification}/${encodeURI(title)}`
 }
 
-export function getUserCertificateUrl(provider: string, certification: string, handle: string): string {
+export function getUserCertificateUrl(
+    provider: string,
+    certification: string,
+    handle: string,
+): string {
     return `${window.location.origin}${getCoursePath(provider, certification)}/${handle}${LEARN_PATHS.certificate}`
 }
 
@@ -70,9 +82,6 @@ export function getViewStyleParamKey(): string {
     return Object.keys(LearnConfig.CERT_ALT_PARAMS)[0]
 }
 
-export const rootRoute: string = LEARN_PATHS.root
-export const absoluteRootRoute: string = `${window.location.origin}${LEARN_PATHS.root}`
-
 export const learnRoutes: Array<PlatformRoute> = [
     {
         children: [
diff --git a/src-ts/tools/learn/my-learning/MyLearning.tsx b/src-ts/tools/learn/my-learning/MyLearning.tsx
index bef214b7a..d055b396e 100755
--- a/src-ts/tools/learn/my-learning/MyLearning.tsx
+++ b/src-ts/tools/learn/my-learning/MyLearning.tsx
@@ -1,3 +1,4 @@
+import { set } from 'lodash'
 import { Dispatch, FC, ReactNode, SetStateAction, useContext, useMemo, useState } from 'react'
 
 import { Breadcrumb, BreadcrumbItemModel, ContentLayout, LoadingSpinner, Portal, profileContext, ProfileContextData } from '../../../lib'
@@ -25,15 +26,23 @@ interface CertificatesByIdType {
 const MyLearning: FC<{}> = () => {
 
     const { profile, initialized: profileReady }: ProfileContextData = useContext(profileContext)
-    const { completed, inProgress, ready: coursesReady }: UserCertificationsProviderData = useUserCertifications()
-    const { certifications, ready: certificatesReady }: AllCertificationsProviderData = useAllCertifications()
-    const [activeTab, setActiveTab]: [MyTabsViews|undefined, Dispatch<SetStateAction<MyTabsViews|undefined>>] = useState()
+
+    const { completed, inProgress, ready: coursesReady }: UserCertificationsProviderData
+        = useUserCertifications()
+
+    const { certifications, ready: certificatesReady }: AllCertificationsProviderData
+        = useAllCertifications()
+
+    const [activeTab, setActiveTab]: [
+        MyTabsViews|undefined,
+        Dispatch<SetStateAction<MyTabsViews|undefined>>
+    ] = useState()
 
     const ready: boolean = profileReady && coursesReady && certificatesReady
 
     const certificatesById: CertificatesByIdType = useMemo(() => (
         certifications.reduce((certifs, certificate) => {
-            certifs[certificate.id] = certificate
+            set(certifs, [certificate.id], certificate)
             return certifs
         }, {} as unknown as CertificatesByIdType)
     ), [certifications])
diff --git a/src-ts/tools/learn/my-learning/my-tabs-navbar/MyTabsNavbar.tsx b/src-ts/tools/learn/my-learning/my-tabs-navbar/MyTabsNavbar.tsx
index 7e0d138e3..684190deb 100644
--- a/src-ts/tools/learn/my-learning/my-tabs-navbar/MyTabsNavbar.tsx
+++ b/src-ts/tools/learn/my-learning/my-tabs-navbar/MyTabsNavbar.tsx
@@ -12,9 +12,8 @@ interface MyTabsNavbarProps {
 }
 
 const MyTabsNavbar: FC<MyTabsNavbarProps> = (props: MyTabsNavbarProps) => {
-    const [activeTab, setActiveTab]: [MyTabsViews, Dispatch<SetStateAction<MyTabsViews>>] = useState<MyTabsViews>(
-        MyTabsViews.inProgress,
-    )
+    const [activeTab, setActiveTab]: [MyTabsViews, Dispatch<SetStateAction<MyTabsViews>>]
+        = useState<MyTabsViews>(MyTabsViews.inProgress)
 
     const tabs: ReadonlyArray<TabsNavItem> = useMemo(() => getMyTabsNavbarTabs(
         props.completed,
diff --git a/src-ts/tools/learn/welcome/available-courses-list/AvailableCoursesList.tsx b/src-ts/tools/learn/welcome/available-courses-list/AvailableCoursesList.tsx
index 590e0b8b9..c039fb976 100644
--- a/src-ts/tools/learn/welcome/available-courses-list/AvailableCoursesList.tsx
+++ b/src-ts/tools/learn/welcome/available-courses-list/AvailableCoursesList.tsx
@@ -1,5 +1,5 @@
 import { Dictionary, groupBy, identity, orderBy } from 'lodash'
-import { Dispatch, FC, Fragment, SetStateAction, useMemo } from 'react'
+import { Dispatch, FC, Fragment, ReactNode, SetStateAction, useMemo } from 'react'
 import classNames from 'classnames'
 
 import { InputSelect, useLocalStorage } from '../../../../lib'
@@ -34,7 +34,7 @@ const AvailableCoursesList: FC<AvailableCoursesListProps> = (props: AvailableCou
         label: string,
         value: string,
     }> = useMemo(() => [
-        { label: 'All Categories', value: '', orderIndex: -1 },
+        { label: 'All Categories', orderIndex: -1, value: '' },
         ...Object.keys(certsByCategory).sort().map(c => ({
             label: c,
             value: c,
@@ -42,12 +42,38 @@ const AvailableCoursesList: FC<AvailableCoursesListProps> = (props: AvailableCou
     ], [certsByCategory])
 
     // create and sort the certificates groups
-    const certificationsGroups: Array<string> = useMemo(() => orderBy(Object.keys(certsByCategory), [
-        c => (PRIORITY_CATEGORIES.includes(c) ? -1 : 1),
-        identity,
-    ], ['asc', 'asc']), [certsByCategory])
+    const certificationsGroups: Array<string> = useMemo(() => orderBy(
+        Object.keys(certsByCategory),
+        [
+            c => (PRIORITY_CATEGORIES.includes(c) ? -1 : 1),
+            identity,
+        ],
+        ['asc', 'asc'],
+    ), [certsByCategory])
 
-    const certificationsCount: number = (certsByCategory[selectedCategory] ?? props.certifications).length
+    const certificationsCount: number = (
+        (certsByCategory[selectedCategory] ?? props.certifications).length
+    )
+
+    const renderCertificationGroup = (category: string): ReactNode => (
+        <Fragment key={category}>
+            <h4 className={classNames('details', styles['courses-group-title'])}>
+                {category}
+            </h4>
+
+            <div className={styles['courses-list']}>
+                {certsByCategory[category]
+                    .map(certification => (
+                        <CoursesCard
+                            certification={certification}
+                            key={certification.key}
+                            userCompletedCertifications={props.userCompletedCertifications}
+                            userInProgressCertifications={props.userInProgressCertifications}
+                        />
+                    ))}
+            </div>
+        </Fragment>
+    )
 
     return (
         <div className={styles.wrap}>
@@ -70,24 +96,9 @@ const AvailableCoursesList: FC<AvailableCoursesListProps> = (props: AvailableCou
                 </div>
             </div>
 
-            {certificationsGroups.map(category => (!selectedCategory || selectedCategory === category) && (
-                <Fragment key={category}>
-                    <h4 className={classNames('details', styles['courses-group-title'])}>
-                        {category}
-                    </h4>
-
-                    <div className={styles['courses-list']}>
-                        {certsByCategory[category]
-                            .map(certification => (
-                                <CoursesCard
-                                    certification={certification}
-                                    key={certification.key}
-                                    userCompletedCertifications={props.userCompletedCertifications}
-                                    userInProgressCertifications={props.userInProgressCertifications}
-                                />
-                            ))}
-                    </div>
-                </Fragment>
+            {certificationsGroups.map(category => (
+                (!selectedCategory || selectedCategory === category)
+                && renderCertificationGroup(category)
             ))}
         </div>
     )
diff --git a/src-ts/tools/learn/welcome/courses-card/CoursesCard.tsx b/src-ts/tools/learn/welcome/courses-card/CoursesCard.tsx
index 8d18eb744..0f1364e81 100644
--- a/src-ts/tools/learn/welcome/courses-card/CoursesCard.tsx
+++ b/src-ts/tools/learn/welcome/courses-card/CoursesCard.tsx
@@ -52,7 +52,8 @@ const CoursesCard: FC<CoursesCardProps> = (props: CoursesCardProps) => {
             ))
 
         } else if (!inProgress) {
-            // if there is no in-progress lesson for the course, Get Started by going to the course details
+            // if there is no in-progress lesson for the course,
+            // Get Started by going to the course details
             setButtonLabel('Get Started')
             setLink(getCoursePath(
                 props.certification.providerName,
@@ -60,7 +61,8 @@ const CoursesCard: FC<CoursesCardProps> = (props: CoursesCardProps) => {
             ))
 
         } else {
-            // otherwise this course is in-progress, so Resume the course at the next lesson
+            // otherwise this course is in-progress,
+            // so Resume the course at the next lesson
             setButtonStyle('secondary')
             setButtonLabel('Resume')
             setLink(getLessonPathFromCurrentLesson(
diff --git a/src-ts/tools/learn/welcome/progress-block/ProgressBlock.tsx b/src-ts/tools/learn/welcome/progress-block/ProgressBlock.tsx
index 5d996b15b..c4ab318b1 100644
--- a/src-ts/tools/learn/welcome/progress-block/ProgressBlock.tsx
+++ b/src-ts/tools/learn/welcome/progress-block/ProgressBlock.tsx
@@ -23,7 +23,9 @@ const ProgressBlock: FC<ProgressBlockProps> = (props: ProgressBlockProps) => {
         return <></>
     }
 
-    const isStarted: boolean = !!props.userInProgressCertifications.length || !!props.userCompletedCertifications.length
+    const isStarted: boolean = (
+        !!props.userInProgressCertifications.length || !!props.userCompletedCertifications.length
+    )
 
     return (
         <div className={styles.wrap}>
diff --git a/src-ts/tools/learn/welcome/progress-block/cards-slider/CardsSlider.tsx b/src-ts/tools/learn/welcome/progress-block/cards-slider/CardsSlider.tsx
index f60a0fa09..c92794050 100644
--- a/src-ts/tools/learn/welcome/progress-block/cards-slider/CardsSlider.tsx
+++ b/src-ts/tools/learn/welcome/progress-block/cards-slider/CardsSlider.tsx
@@ -11,29 +11,33 @@ interface CardsSliderProps {
 const CardsSlider: FC<CardsSliderProps> = (props: CardsSliderProps) => {
     const [activeSlide, setActiveSlide]: [number, Dispatch<SetStateAction<number>>] = useState(0)
 
-    const wrapSlides: (children: Array<JSX.Element>) => Array<JSX.Element> = (children: Array<JSX.Element>) => Children.map<ReactNode, ReactNode>(children, (child, index) => (
-        <div
-            className={
-                classNames(
-                    styles.slide,
-                    activeSlide === index && 'active',
-                    activeSlide > index && 'is-prev',
-                    activeSlide < index && 'is-next',
-                )
-            }
-        >
-            {child}
-        </div>
-    )) as Array<JSX.Element>
+    const renderSlides: (children: Array<JSX.Element>) => Array<JSX.Element>
+        = (children: Array<JSX.Element>) => (
+            Children.map<ReactNode, ReactNode>(children, (child, index) => (
+                <div
+                    className={
+                        classNames(
+                            styles.slide,
+                            activeSlide === index && 'active',
+                            activeSlide > index && 'is-prev',
+                            activeSlide < index && 'is-next',
+                        )
+                    }
+                >
+                    {child}
+                </div>
+            )) as Array<JSX.Element>
+        )
 
     return (
         <div className={styles.wrap}>
             <div className={styles['slides-wrap']}>
-                {wrapSlides(props.children)}
+                {renderSlides(props.children)}
             </div>
             <div className={styles['nav-wrap']}>
                 {fill(Array(props.children.length), '').map((_, i) => (
                     <span
+                        // eslint-disable-next-line react/no-array-index-key
                         key={i}
                         className={classNames(styles['nav-dot'], activeSlide === i && 'active')}
                         onClick={() => setActiveSlide(i)}
diff --git a/src-ts/tools/learn/welcome/progress-block/progress-action/ProgressAction.tsx b/src-ts/tools/learn/welcome/progress-block/progress-action/ProgressAction.tsx
index b38a247dc..f7a7089ab 100644
--- a/src-ts/tools/learn/welcome/progress-block/progress-action/ProgressAction.tsx
+++ b/src-ts/tools/learn/welcome/progress-block/progress-action/ProgressAction.tsx
@@ -1,4 +1,4 @@
-import { orderBy } from 'lodash'
+import { orderBy, set } from 'lodash'
 import { FC, ReactNode, useMemo } from 'react'
 
 import { Button } from '../../../../../lib'
@@ -30,12 +30,6 @@ const USER_PROGRESS_MAX_SLIDES_COUNT: number = 8
 
 const ProgressAction: FC<ProgressActionProps> = (props: ProgressActionProps) => {
 
-    const {
-        allCertifications,
-        userCompletedCertifications: myCompletedCertifications,
-        userInProgressCertifications: myInProgressCertifications,
-    }: ProgressActionProps = props
-
     const allMyLearningsLink: ReactNode = (
         <span className={styles['title-link']}>
             <Button
@@ -47,16 +41,16 @@ const ProgressAction: FC<ProgressActionProps> = (props: ProgressActionProps) =>
     )
 
     const certificationsById: { [key: string]: LearnCertification } = useMemo(() => (
-        allCertifications
+        props.allCertifications
             .reduce((certifs, certificate) => {
-                certifs[certificate.id] = certificate
+                set(certifs, [certificate.id], certificate)
                 return certifs
             }, {} as unknown as { [key: string]: LearnCertification })
-    ), [allCertifications])
+    ), [props.allCertifications])
 
     const recentlyUpdatedCertifications: Array<LearnUserCertificationProgress> = orderBy([
-        ...myCompletedCertifications,
-        ...myInProgressCertifications,
+        ...props.userCompletedCertifications,
+        ...props.userInProgressCertifications,
     ], 'updatedAt', 'desc').slice(0, USER_PROGRESS_MAX_SLIDES_COUNT)
 
     function renderInProgress(courseToDisplay: UserCertificationInProgress): JSX.Element {

From 5d4be786203f07c724ac483ad749b8233d1f0b6d Mon Sep 17 00:00:00 2001
From: Brooke <brooke.souza@topcoder.com>
Date: Fri, 11 Nov 2022 11:26:16 -0800
Subject: [PATCH 3/8] TCA-499 #comment This commit adds line breaks before
 chained methods #time 1h

---
 src-ts/.eslintrc.js                           |  6 +++
 .../ContactSupportForm.tsx                    |  3 +-
 .../form-groups/form-card-set/FormCardSet.tsx |  5 ++-
 src-ts/lib/page-footer/PageFooter.tsx         |  3 +-
 src-ts/lib/route-provider/router.utils.ts     |  3 +-
 .../MarkdownDoc/markdownRenderer/renderer.tsx | 30 +++++++------
 .../MarkdownDoc/markdownRenderer/util.ts      |  7 ++-
 .../CardSection/CardSection.tsx               |  3 +-
 .../MemberAwaredAtRenderer.tsx                |  5 ++-
 .../badge-detail/badge-details.functions.ts   |  3 +-
 .../certificate-view/CertificateView.tsx      |  3 +-
 .../learn/free-code-camp/FreeCodeCamp.tsx     |  7 ++-
 .../lesson-provider/lesson.provider.tsx       |  3 +-
 .../resource-provider.provider.tsx            | 17 ++++----
 .../tab-content-layout/TabContentLayout.tsx   | 10 +++--
 .../AvailableCoursesList.tsx                  | 10 +++--
 .../cards-slider/CardsSlider.tsx              | 15 ++++---
 .../progress-action/ProgressAction.tsx        |  3 +-
 .../work-solutions-list/WorkSolutionsList.tsx |  3 +-
 .../work-factory/work.factory.ts              | 43 +++++++++++++------
 .../bug-hunt/BugHuntIntakeForm.tsx            |  6 ++-
 21 files changed, 121 insertions(+), 67 deletions(-)

diff --git a/src-ts/.eslintrc.js b/src-ts/.eslintrc.js
index fc05be142..6fe44caae 100644
--- a/src-ts/.eslintrc.js
+++ b/src-ts/.eslintrc.js
@@ -83,6 +83,12 @@ module.exports = {
         'jsx-a11y/tabindex-no-positive': [
             'warn'
         ],
+        'newline-per-chained-call': [
+            'error',
+            {
+                ignoreChainWithDepth: 1,
+            }
+        ],
         'no-extra-boolean-cast': 'off',
         'no-null/no-null': 'error',
         'no-plusplus': [
diff --git a/src-ts/lib/contact-support-form/ContactSupportForm.tsx b/src-ts/lib/contact-support-form/ContactSupportForm.tsx
index 7f63a0625..57af39fb9 100644
--- a/src-ts/lib/contact-support-form/ContactSupportForm.tsx
+++ b/src-ts/lib/contact-support-form/ContactSupportForm.tsx
@@ -56,7 +56,8 @@ const ContactSupportForm: FC<ContactSupportFormProps> = (props: ContactSupportFo
         return contactSupportSubmitRequestAsync(request)
             .then(() => {
                 setSaveOnSuccess(true)
-            }).finally(() => setLoading(false))
+            })
+            .finally(() => setLoading(false))
     }, [])
 
     const emailElement: JSX.Element | undefined = !!profile?.email
diff --git a/src-ts/lib/form/form-groups/form-card-set/FormCardSet.tsx b/src-ts/lib/form/form-groups/form-card-set/FormCardSet.tsx
index 59c247986..4f87d118b 100644
--- a/src-ts/lib/form/form-groups/form-card-set/FormCardSet.tsx
+++ b/src-ts/lib/form/form-groups/form-card-set/FormCardSet.tsx
@@ -27,7 +27,10 @@ const FormCardSet: React.FC<FormCardSetProps> = (props: FormCardSetProps) => {
             return <></>
         }
 
-        const iconName: string = `${icon.split('-').map((chunk: string) => chunk.charAt(0).toUpperCase() + chunk.slice(1)).join('')}Icon`
+        const iconName: string = `${icon.split('-')
+            .map((chunk: string) => chunk.charAt(0)
+                .toUpperCase() + chunk.slice(1))
+            .join('')}Icon`
         const IconComponent: React.FC<SVGProps<SVGSVGElement>> = IconOutline[iconName as keyof typeof IconOutline]
         return <IconComponent className={styles['card-row-icon']} />
     }
diff --git a/src-ts/lib/page-footer/PageFooter.tsx b/src-ts/lib/page-footer/PageFooter.tsx
index 78e270145..845593322 100644
--- a/src-ts/lib/page-footer/PageFooter.tsx
+++ b/src-ts/lib/page-footer/PageFooter.tsx
@@ -48,7 +48,8 @@ const PageFooter: FC<{}> = () => {
                     <div>
                         <span>
                             ©
-                            {(new Date()).getFullYear()}
+                            {(new Date())
+                                .getFullYear()}
                             {' '}
                             Topcoder
                         </span>
diff --git a/src-ts/lib/route-provider/router.utils.ts b/src-ts/lib/route-provider/router.utils.ts
index 1c2ee3ef9..a5d0bef9b 100644
--- a/src-ts/lib/route-provider/router.utils.ts
+++ b/src-ts/lib/route-provider/router.utils.ts
@@ -14,5 +14,6 @@ export type LazyLoadType = (
  * (while react's `lazy` method only allows to import default exports)
  */
 export const lazyLoad: LazyLoadType = (moduleImport: () => Promise<any>, namedExport: string = 'default') => (
-    lazy(() => moduleImport().then(m => ({ default: get(m, namedExport) })))
+    lazy(() => moduleImport()
+        .then(m => ({ default: get(m, namedExport) })))
 )
diff --git a/src-ts/tools/dev-center/dev-center-lib/MarkdownDoc/markdownRenderer/renderer.tsx b/src-ts/tools/dev-center/dev-center-lib/MarkdownDoc/markdownRenderer/renderer.tsx
index d69a69afe..aa85ee22e 100644
--- a/src-ts/tools/dev-center/dev-center-lib/MarkdownDoc/markdownRenderer/renderer.tsx
+++ b/src-ts/tools/dev-center/dev-center-lib/MarkdownDoc/markdownRenderer/renderer.tsx
@@ -80,17 +80,18 @@ export class Renderer implements MarkdownRenderer {
         const children: ReturnType<typeof this.groupBy> = this.groupBy(
             nodes,
             options,
-        ).map(node => {
-            if (Array.isArray(node)) {
-                return (
-                    <MarkdownAccordion>
-                        {React.Children.map(node, child => child)}
-                    </MarkdownAccordion>
-                )
-            }
+        )
+            .map(node => {
+                if (Array.isArray(node)) {
+                    return (
+                        <MarkdownAccordion>
+                            {React.Children.map(node, child => child)}
+                        </MarkdownAccordion>
+                    )
+                }
 
-            return node
-        })
+                return node
+            })
 
         return (
             <div className={styles['markdown-doc']}>
@@ -287,7 +288,8 @@ export class Renderer implements MarkdownRenderer {
             const h: string = marked.parser([token], parserOptions)
             const level: number = token.depth
             const title: string = removeLineBreak(stripTag(h, `h${level}`))
-            const headingId: string = extractId(h, `h${level}`, index).trim()
+            const headingId: string = extractId(h, `h${level}`, index)
+                .trim()
 
             options.toc.push({
                 headingId,
@@ -351,12 +353,14 @@ export class Renderer implements MarkdownRenderer {
         const tag: string = extractTag(html)
         if (tag) {
             const isParagraphTag: boolean = tag === MarkdownParagraphTag.p
-            const isHeaderTag: boolean = Object.values(MarkdownHeaderTag).indexOf(tag as MarkdownHeaderTag) !== -1
+            const isHeaderTag: boolean = Object.values(MarkdownHeaderTag)
+                .indexOf(tag as MarkdownHeaderTag) !== -1
             if (isParagraphTag || isHeaderTag) {
                 let id: string | undefined
                 if (isHeaderTag) {
                     token = token as marked.Tokens.Heading
-                    id = extractId(html, `h${token.depth}`, index).trim()
+                    id = extractId(html, `h${token.depth}`, index)
+                        .trim()
                 }
 
                 return React.createElement(tag, {
diff --git a/src-ts/tools/dev-center/dev-center-lib/MarkdownDoc/markdownRenderer/util.ts b/src-ts/tools/dev-center/dev-center-lib/MarkdownDoc/markdownRenderer/util.ts
index 46de0a097..5481c8a3e 100644
--- a/src-ts/tools/dev-center/dev-center-lib/MarkdownDoc/markdownRenderer/util.ts
+++ b/src-ts/tools/dev-center/dev-center-lib/MarkdownDoc/markdownRenderer/util.ts
@@ -30,8 +30,11 @@ export function renderMarkdown(
         const matchStr: string = matches ? matches[0] : ''
         return matchStr
             ? {
-                s: fromStr.replace(matchStr, '').trimStart(),
-                title: matchStr.replace(/^#/, '').replace(/`/g, '').trim(),
+                s: fromStr.replace(matchStr, '')
+                    .trimStart(),
+                title: matchStr.replace(/^#/, '')
+                    .replace(/`/g, '')
+                    .trim(),
             }
             : { title, s }
     }
diff --git a/src-ts/tools/dev-center/dev-center-pages/community-app/landing-page/dev-center-articles-section/CardSection/CardSection.tsx b/src-ts/tools/dev-center/dev-center-pages/community-app/landing-page/dev-center-articles-section/CardSection/CardSection.tsx
index 5dc47a7d2..46d76f405 100644
--- a/src-ts/tools/dev-center/dev-center-pages/community-app/landing-page/dev-center-articles-section/CardSection/CardSection.tsx
+++ b/src-ts/tools/dev-center/dev-center-pages/community-app/landing-page/dev-center-articles-section/CardSection/CardSection.tsx
@@ -33,7 +33,8 @@ const CardSection: FC = () => {
                         return blog
                 }
             }),
-        ).then(arr => setArticles(arr))
+        )
+            .then(arr => setArticles(arr))
     }, [])
 
     const articleStyles: Array<any> = [
diff --git a/src-ts/tools/gamification-admin/pages/badge-detail/AwardedMembersTab/awarded-members-table/member-awardedAt-renderer/MemberAwaredAtRenderer.tsx b/src-ts/tools/gamification-admin/pages/badge-detail/AwardedMembersTab/awarded-members-table/member-awardedAt-renderer/MemberAwaredAtRenderer.tsx
index 952ba3263..7d80d3cf8 100644
--- a/src-ts/tools/gamification-admin/pages/badge-detail/AwardedMembersTab/awarded-members-table/member-awardedAt-renderer/MemberAwaredAtRenderer.tsx
+++ b/src-ts/tools/gamification-admin/pages/badge-detail/AwardedMembersTab/awarded-members-table/member-awardedAt-renderer/MemberAwaredAtRenderer.tsx
@@ -12,7 +12,10 @@ const MemberAwaredAtRenderer = (memberAward: MemberBadgeAward): JSX.Element => {
     }
 
     return (
-        <div className={styles.memberAwardedAt}>{new Date(memberAward.awarded_at).toLocaleString(undefined, dateFormat)}</div>
+        <div className={styles.memberAwardedAt}>
+            {new Date(memberAward.awarded_at)
+                .toLocaleString(undefined, dateFormat)}
+        </div>
     )
 }
 
diff --git a/src-ts/tools/gamification-admin/pages/badge-detail/badge-details.functions.ts b/src-ts/tools/gamification-admin/pages/badge-detail/badge-details.functions.ts
index d86f98b8f..e979ad0f3 100644
--- a/src-ts/tools/gamification-admin/pages/badge-detail/badge-details.functions.ts
+++ b/src-ts/tools/gamification-admin/pages/badge-detail/badge-details.functions.ts
@@ -13,7 +13,8 @@ export async function submitRequestAsync(request: UpdateBadgeRequest): Promise<G
 export function generateCSV(input: Array<Array<string | number>>): string {
     input.unshift(GamificationConfig.CSV_HEADER)
 
-    return input.map(row => row.join(',')).join('\n')
+    return input.map(row => row.join(','))
+        .join('\n')
 }
 
 export async function manualAssignRequestAsync(csv: string): Promise<any> {
diff --git a/src-ts/tools/learn/course-certificate/certificate-view/CertificateView.tsx b/src-ts/tools/learn/course-certificate/certificate-view/CertificateView.tsx
index 4961984bc..4efc34c4c 100644
--- a/src-ts/tools/learn/course-certificate/certificate-view/CertificateView.tsx
+++ b/src-ts/tools/learn/course-certificate/certificate-view/CertificateView.tsx
@@ -47,7 +47,8 @@ const CertificateView: FC<CertificateViewProps> = (props: CertificateViewProps)
     const certificateWrapRef: MutableRefObject<HTMLElement | any> = useRef()
 
     const userName: string = useMemo(() => (
-        [props.profile.firstName, props.profile.lastName].filter(Boolean).join(' ')
+        [props.profile.firstName, props.profile.lastName].filter(Boolean)
+            .join(' ')
         || props.profile.handle
     ), [props.profile.firstName, props.profile.handle, props.profile.lastName])
 
diff --git a/src-ts/tools/learn/free-code-camp/FreeCodeCamp.tsx b/src-ts/tools/learn/free-code-camp/FreeCodeCamp.tsx
index 2606437ad..732f491fd 100644
--- a/src-ts/tools/learn/free-code-camp/FreeCodeCamp.tsx
+++ b/src-ts/tools/learn/free-code-camp/FreeCodeCamp.tsx
@@ -157,7 +157,9 @@ const FreeCodeCamp: FC<{}> = () => {
 
     function handleFccLessonReady(lessonPath: string): void {
 
-        const [nLessonPath, modulePath, coursePath]: Array<string> = lessonPath.replace(/\/$/, '').split('/').reverse()
+        const [nLessonPath, modulePath, coursePath]: Array<string> = lessonPath.replace(/\/$/, '')
+            .split('/')
+            .reverse()
         updatePath(nLessonPath, modulePath, coursePath)
 
         const currentLesson: { [key: string]: string } = {
@@ -206,7 +208,8 @@ const FreeCodeCamp: FC<{}> = () => {
                 certificateProgress.id,
                 UserCertificationUpdateProgressActions.completeLesson,
                 currentLesson,
-            ).then(setCertificateProgress)
+            )
+                .then(setCertificateProgress)
         }
     }
 
diff --git a/src-ts/tools/learn/learn-lib/lesson-provider/lesson.provider.tsx b/src-ts/tools/learn/learn-lib/lesson-provider/lesson.provider.tsx
index 6e025db03..2c34a0960 100644
--- a/src-ts/tools/learn/learn-lib/lesson-provider/lesson.provider.tsx
+++ b/src-ts/tools/learn/learn-lib/lesson-provider/lesson.provider.tsx
@@ -57,7 +57,8 @@ export function useLessonProvider(
                     courseData?.key ?? course,
                     module,
                     lesson,
-                ].filter(Boolean).join('/')
+                ].filter(Boolean)
+                    .join('/')
 
                 setState(prevState => ({
                     ...prevState,
diff --git a/src-ts/tools/learn/learn-lib/resource-provider-provider/resource-provider.provider.tsx b/src-ts/tools/learn/learn-lib/resource-provider-provider/resource-provider.provider.tsx
index f0aa86518..3ee354b97 100755
--- a/src-ts/tools/learn/learn-lib/resource-provider-provider/resource-provider.provider.tsx
+++ b/src-ts/tools/learn/learn-lib/resource-provider-provider/resource-provider.provider.tsx
@@ -29,14 +29,15 @@ export function useResourceProvider(providerName?: string): ResourceProviderData
             loading: true,
         }))
 
-        getResourceProvidersAsync().then(providers => {
-            setState(prevState => ({
-                ...prevState,
-                loading: false,
-                provider: providers?.find(p => p.name === providerName),
-                ready: true,
-            }))
-        })
+        getResourceProvidersAsync()
+            .then(providers => {
+                setState(prevState => ({
+                    ...prevState,
+                    loading: false,
+                    provider: providers?.find(p => p.name === providerName),
+                    ready: true,
+                }))
+            })
     }, [providerName])
 
     return state
diff --git a/src-ts/tools/learn/my-learning/tab-content-layout/TabContentLayout.tsx b/src-ts/tools/learn/my-learning/tab-content-layout/TabContentLayout.tsx
index 1ce9bc74d..7ef58b15c 100644
--- a/src-ts/tools/learn/my-learning/tab-content-layout/TabContentLayout.tsx
+++ b/src-ts/tools/learn/my-learning/tab-content-layout/TabContentLayout.tsx
@@ -37,10 +37,12 @@ const TabContentLayout: FC<TabContentLayoutProps> = (props: TabContentLayoutProp
         const certsByCategory: Dictionary<Array<LearnCertification>> = groupBy(props.certifications, 'category')
         return [
             { label: 'All Categories', value: '' },
-            ...Object.keys(certsByCategory).sort().map(c => ({
-                label: c,
-                value: c,
-            })),
+            ...Object.keys(certsByCategory)
+                .sort()
+                .map(c => ({
+                    label: c,
+                    value: c,
+                })),
         ]
     }, [props.certifications])
 
diff --git a/src-ts/tools/learn/welcome/available-courses-list/AvailableCoursesList.tsx b/src-ts/tools/learn/welcome/available-courses-list/AvailableCoursesList.tsx
index c039fb976..0880424e3 100644
--- a/src-ts/tools/learn/welcome/available-courses-list/AvailableCoursesList.tsx
+++ b/src-ts/tools/learn/welcome/available-courses-list/AvailableCoursesList.tsx
@@ -35,10 +35,12 @@ const AvailableCoursesList: FC<AvailableCoursesListProps> = (props: AvailableCou
         value: string,
     }> = useMemo(() => [
         { label: 'All Categories', orderIndex: -1, value: '' },
-        ...Object.keys(certsByCategory).sort().map(c => ({
-            label: c,
-            value: c,
-        })),
+        ...Object.keys(certsByCategory)
+            .sort()
+            .map(c => ({
+                label: c,
+                value: c,
+            })),
     ], [certsByCategory])
 
     // create and sort the certificates groups
diff --git a/src-ts/tools/learn/welcome/progress-block/cards-slider/CardsSlider.tsx b/src-ts/tools/learn/welcome/progress-block/cards-slider/CardsSlider.tsx
index c92794050..7b4c9a55b 100644
--- a/src-ts/tools/learn/welcome/progress-block/cards-slider/CardsSlider.tsx
+++ b/src-ts/tools/learn/welcome/progress-block/cards-slider/CardsSlider.tsx
@@ -35,14 +35,15 @@ const CardsSlider: FC<CardsSliderProps> = (props: CardsSliderProps) => {
                 {renderSlides(props.children)}
             </div>
             <div className={styles['nav-wrap']}>
-                {fill(Array(props.children.length), '').map((_, i) => (
-                    <span
+                {fill(Array(props.children.length), '')
+                    .map((_, i) => (
+                        <span
                         // eslint-disable-next-line react/no-array-index-key
-                        key={i}
-                        className={classNames(styles['nav-dot'], activeSlide === i && 'active')}
-                        onClick={() => setActiveSlide(i)}
-                    />
-                ))}
+                            key={i}
+                            className={classNames(styles['nav-dot'], activeSlide === i && 'active')}
+                            onClick={() => setActiveSlide(i)}
+                        />
+                    ))}
             </div>
         </div>
     )
diff --git a/src-ts/tools/learn/welcome/progress-block/progress-action/ProgressAction.tsx b/src-ts/tools/learn/welcome/progress-block/progress-action/ProgressAction.tsx
index f7a7089ab..505411c46 100644
--- a/src-ts/tools/learn/welcome/progress-block/progress-action/ProgressAction.tsx
+++ b/src-ts/tools/learn/welcome/progress-block/progress-action/ProgressAction.tsx
@@ -51,7 +51,8 @@ const ProgressAction: FC<ProgressActionProps> = (props: ProgressActionProps) =>
     const recentlyUpdatedCertifications: Array<LearnUserCertificationProgress> = orderBy([
         ...props.userCompletedCertifications,
         ...props.userInProgressCertifications,
-    ], 'updatedAt', 'desc').slice(0, USER_PROGRESS_MAX_SLIDES_COUNT)
+    ], 'updatedAt', 'desc')
+        .slice(0, USER_PROGRESS_MAX_SLIDES_COUNT)
 
     function renderInProgress(courseToDisplay: UserCertificationInProgress): JSX.Element {
         return (
diff --git a/src-ts/tools/work/work-detail-solutions/work-solutions-list/WorkSolutionsList.tsx b/src-ts/tools/work/work-detail-solutions/work-solutions-list/WorkSolutionsList.tsx
index 6f4aa2ad6..9e7f051c6 100644
--- a/src-ts/tools/work/work-detail-solutions/work-solutions-list/WorkSolutionsList.tsx
+++ b/src-ts/tools/work/work-detail-solutions/work-solutions-list/WorkSolutionsList.tsx
@@ -20,7 +20,8 @@ const WorkSolutionsList: FC<WorkSolutionsListProps> = (props: WorkSolutionsListP
             <div className={styles['solutions-not-available']}>
                 YOUR SOLUTIONS WILL BE AVAILABLE FOR DOWNLOAD ON:
                 <br />
-                {moment(props.work.solutionsReadyDate).format('MM/DD/YY')}
+                {moment(props.work.solutionsReadyDate)
+                    .format('MM/DD/YY')}
             </div>
         )
     }
diff --git a/src-ts/tools/work/work-lib/work-provider/work-functions/work-factory/work.factory.ts b/src-ts/tools/work/work-lib/work-provider/work-functions/work-factory/work.factory.ts
index b6087a6ed..2ec0526ba 100644
--- a/src-ts/tools/work/work-lib/work-provider/work-functions/work-factory/work.factory.ts
+++ b/src-ts/tools/work/work-lib/work-provider/work-functions/work-factory/work.factory.ts
@@ -146,12 +146,13 @@ export function buildUpdateRequest(workTypeConfig: WorkTypeConfig, challenge: Ch
         },
     ]
 
-    Object.keys(formData).forEach(key => {
-        intakeMetadata.push({
-            name: ChallengeMetadataName[key as keyof typeof ChallengeMetadataName],
-            value: formData[key] || '',
+    Object.keys(formData)
+        .forEach(key => {
+            intakeMetadata.push({
+                name: ChallengeMetadataName[key as keyof typeof ChallengeMetadataName],
+                value: formData[key] || '',
+            })
         })
-    })
     // ---- End Build Metadata ---- //
 
     // --- Build the Markdown string that gets displayed in Work Manager app and others --- //
@@ -433,7 +434,8 @@ function checkFormDataOptionEmpty(detail: any): boolean {
         || (typeof detail === 'string' && detail.trim().length === 0)
         || (Array.isArray(detail) && detail.length === 0)
         || (typeof detail === 'object'
-            && Object.values(detail).filter((val: any) => val && val.trim().length !== 0)
+            && Object.values(detail)
+                .filter((val: any) => val && val.trim().length !== 0)
                 .length === 0)
     )
 }
@@ -446,7 +448,9 @@ function findOpenPhase(challenge: Challenge): ChallengePhase | undefined {
 
     // sort the phases descending by start date
     const sortedPhases: Array<ChallengePhase> = challenge.phases
-        .sort((a, b) => new Date(b.actualStartDate).getTime() - new Date(a.actualStartDate).getTime())
+        .sort((a, b) => new Date(b.actualStartDate)
+            .getTime() - new Date(a.actualStartDate)
+            .getTime())
 
     const now: Date = new Date()
     // if we have an open phase, just use that
@@ -624,7 +628,8 @@ function getProgressStepDateEnd(challenge: Challenge, phases: Array<string>): Da
         return undefined
     }
 
-    if (phase.isOpen || moment(phase.scheduledStartDate).isAfter()) {
+    if (phase.isOpen || moment(phase.scheduledStartDate)
+        .isAfter()) {
         return new Date(phase.scheduledEndDate)
     }
 
@@ -638,7 +643,8 @@ function getProgressStepDateStart(challenge: Challenge, phases: Array<string>):
         return undefined
     }
 
-    if (!phase.isOpen || moment(phase.scheduledStartDate).isAfter()) {
+    if (!phase.isOpen || moment(phase.scheduledStartDate)
+        .isAfter()) {
         return new Date(phase.scheduledStartDate)
     }
 
@@ -651,21 +657,30 @@ function getSolutionsReadyDate(challenge: Challenge): Date | undefined {
 
 function getStartDate(): string {
     let daysToAdd: number = 1
-    switch (moment(new Date()).weekday()) {
-        case moment().day('Friday').weekday():
+    switch (moment(new Date())
+        .weekday()) {
+        case moment()
+            .day('Friday')
+            .weekday():
             daysToAdd = 3
             break
-        case moment().day('Saturday').weekday():
+        case moment()
+            .day('Saturday')
+            .weekday():
             daysToAdd = 2
             break
-        case moment().day('Sunday').weekday():
+        case moment()
+            .day('Sunday')
+            .weekday():
             daysToAdd = 1
             break
         default:
             daysToAdd = 1
     }
 
-    return moment().add(daysToAdd, 'days').format()
+    return moment()
+        .add(daysToAdd, 'days')
+        .format()
 }
 
 function getSubmittedDate(challenge: Challenge): Date {
diff --git a/src-ts/tools/work/work-self-service/intake-forms/bug-hunt/BugHuntIntakeForm.tsx b/src-ts/tools/work/work-self-service/intake-forms/bug-hunt/BugHuntIntakeForm.tsx
index 7ceff9680..758e40723 100644
--- a/src-ts/tools/work/work-self-service/intake-forms/bug-hunt/BugHuntIntakeForm.tsx
+++ b/src-ts/tools/work/work-self-service/intake-forms/bug-hunt/BugHuntIntakeForm.tsx
@@ -115,7 +115,8 @@ const BugHuntIntakeForm: React.FC = () => {
         }
 
         setLoading(true)
-        getAndSetWork().finally(() => setLoading(false))
+        getAndSetWork()
+            .finally(() => setLoading(false))
     }, [
         isLoggedIn,
         workId,
@@ -173,7 +174,8 @@ const BugHuntIntakeForm: React.FC = () => {
         }
 
         setLoading(true)
-        return workUpdateAsync(WorkType.bugHunt, challenge, val).finally(() => setLoading(false))
+        return workUpdateAsync(WorkType.bugHunt, challenge, val)
+            .finally(() => setLoading(false))
     }
 
     const handleSaveSuccess: () => void = () => {

From 58c027d324c1bd41d459eba51a637558cc9ca4a7 Mon Sep 17 00:00:00 2001
From: Brooke <brooke.souza@topcoder.com>
Date: Fri, 11 Nov 2022 14:55:36 -0800
Subject: [PATCH 4/8] TCA-499 fix param reassignment

---
 src-ts/.eslintrc.js                           | 6 ++++++
 src-ts/tools/learn/my-learning/MyLearning.tsx | 1 -
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/src-ts/.eslintrc.js b/src-ts/.eslintrc.js
index 8fa8cf12d..8e5f85158 100644
--- a/src-ts/.eslintrc.js
+++ b/src-ts/.eslintrc.js
@@ -89,6 +89,12 @@ module.exports = {
         ],
         'no-extra-boolean-cast': 'off',
         'no-null/no-null': 'error',
+        'no-param-reassign': [
+            'error',
+            {
+                props: false
+            }
+        ],
         'no-plusplus': [
             'error',
             {
diff --git a/src-ts/tools/learn/my-learning/MyLearning.tsx b/src-ts/tools/learn/my-learning/MyLearning.tsx
index 9639b4db3..132961678 100755
--- a/src-ts/tools/learn/my-learning/MyLearning.tsx
+++ b/src-ts/tools/learn/my-learning/MyLearning.tsx
@@ -42,7 +42,6 @@ const MyLearning: FC<{}> = () => {
 
     const certificatesById: CertificatesByIdType = useMemo(() => (
         certifications.reduce((certifs, certificate) => {
-            // eslint-disable-next-line no-param-reassign
             certifs[certificate.id] = certificate
             return certifs
         }, {} as unknown as CertificatesByIdType)

From 7d9ef5e14d51b11cef86fe3e04342d203ec96a02 Mon Sep 17 00:00:00 2001
From: Brooke <brooke.souza@topcoder.com>
Date: Fri, 11 Nov 2022 15:07:20 -0800
Subject: [PATCH 5/8] TCA-499 auto fixes

---
 .../base-modal/use-fetch-modal-content.tsx    |  5 ++--
 .../all-certifications.provider.tsx           | 13 ++++----
 .../courses-provider/courses.provider.tsx     |  4 +--
 .../lesson-provider/lesson.provider.tsx       |  4 ++-
 .../resource-provider.provider.tsx            |  4 +--
 .../user-certification-progress.provider.tsx  |  6 ++--
 .../user-certifications.provider.tsx          | 30 ++++++++++++-------
 ...user-completed-certifications.provider.tsx | 11 ++++---
 .../learn/learn-lib/learn-swr/LearnSwr.tsx    | 27 ++++++++---------
 .../learn-lib/learn-swr/use-swr-cache.tsx     |  7 +++--
 .../intake-forms/review/Review.tsx            |  1 +
 11 files changed, 61 insertions(+), 51 deletions(-)

diff --git a/src-ts/lib/modals/base-modal/use-fetch-modal-content.tsx b/src-ts/lib/modals/base-modal/use-fetch-modal-content.tsx
index 035904cb0..d0c4d5e8a 100644
--- a/src-ts/lib/modals/base-modal/use-fetch-modal-content.tsx
+++ b/src-ts/lib/modals/base-modal/use-fetch-modal-content.tsx
@@ -1,4 +1,4 @@
-import {Dispatch, SetStateAction, useEffect, useState} from 'react'
+import { Dispatch, SetStateAction, useEffect, useState } from 'react'
 
 import { xhrGetAsync } from '../../functions'
 
@@ -15,7 +15,8 @@ export function useFetchModalContent(contentUrl?: string, enabled?: boolean): Mo
         }
 
         if (!content) {
-            xhrGetAsync<string>(contentUrl).then(setContent)
+            xhrGetAsync<string>(contentUrl)
+                .then(setContent)
         }
     }, [contentUrl, content, enabled])
 
diff --git a/src-ts/tools/learn/learn-lib/data-providers/all-certifications-provider/all-certifications.provider.tsx b/src-ts/tools/learn/learn-lib/data-providers/all-certifications-provider/all-certifications.provider.tsx
index 7eb1f8ea2..69644786d 100644
--- a/src-ts/tools/learn/learn-lib/data-providers/all-certifications-provider/all-certifications.provider.tsx
+++ b/src-ts/tools/learn/learn-lib/data-providers/all-certifications-provider/all-certifications.provider.tsx
@@ -1,3 +1,4 @@
+/* eslint-disable default-param-last */
 import useSWR, { SWRConfiguration, SWRResponse } from 'swr'
 
 import { learnUrlGet } from '../../functions'
@@ -11,16 +12,16 @@ interface CertificationsAllProviderOptions {
 
 export function useGetAllCertifications(
     providerName: string = 'freeCodeCamp',
-    options?: CertificationsAllProviderOptions
+    options?: CertificationsAllProviderOptions,
 ): AllCertificationsProviderData {
 
     const url: string = learnUrlGet(
         'certifications',
-        `?providerName=${providerName}`
+        `?providerName=${providerName}`,
     )
     const swrCacheConfig: SWRConfiguration = useSwrCache(url)
 
-    const {data, error}: SWRResponse = useSWR(url, {
+    const { data, error }: SWRResponse = useSWR(url, {
         ...swrCacheConfig,
         isPaused: () => options?.enabled === false,
     })
@@ -36,16 +37,16 @@ export function useGetAllCertifications(
 export function useGetCertification(
     providerName: string = 'freeCodeCamp',
     certificationId: string,
-    options?: CertificationsAllProviderOptions
+    options?: CertificationsAllProviderOptions,
 ): AllCertificationsProviderData {
 
     const url: string = learnUrlGet(
         'certifications',
         certificationId,
-        `?providerName=${providerName}`
+        `?providerName=${providerName}`,
     )
 
-    const {data, error}: SWRResponse = useSWR(url, {
+    const { data, error }: SWRResponse = useSWR(url, {
         isPaused: () => options?.enabled === false,
     })
     return {
diff --git a/src-ts/tools/learn/learn-lib/data-providers/courses-provider/courses.provider.tsx b/src-ts/tools/learn/learn-lib/data-providers/courses-provider/courses.provider.tsx
index 304b53e96..af4a5e52d 100644
--- a/src-ts/tools/learn/learn-lib/data-providers/courses-provider/courses.provider.tsx
+++ b/src-ts/tools/learn/learn-lib/data-providers/courses-provider/courses.provider.tsx
@@ -9,7 +9,7 @@ import { LearnCourse } from './learn-course.model'
 
 export function useGetCourses(
     provider: string,
-    certification?: string
+    certification?: string,
 ): CoursesProviderData {
 
     const params: string = [
@@ -22,7 +22,7 @@ export function useGetCourses(
     const url: string = learnUrlGet('courses', `?${params}`)
     const swrCacheConfig: SWRConfiguration = useSwrCache(url)
 
-    const {data, error}: SWRResponse<ReadonlyArray<LearnCourse>> = useSWR(url, swrCacheConfig)
+    const { data, error }: SWRResponse<ReadonlyArray<LearnCourse>> = useSWR(url, swrCacheConfig)
 
     return {
         course: get(data, [0]),
diff --git a/src-ts/tools/learn/learn-lib/data-providers/lesson-provider/lesson.provider.tsx b/src-ts/tools/learn/learn-lib/data-providers/lesson-provider/lesson.provider.tsx
index ed1f00879..ee1b20128 100644
--- a/src-ts/tools/learn/learn-lib/data-providers/lesson-provider/lesson.provider.tsx
+++ b/src-ts/tools/learn/learn-lib/data-providers/lesson-provider/lesson.provider.tsx
@@ -21,7 +21,9 @@ export function useGetLesson(
         courseData?.key ?? course,
         module,
         lesson,
-    ].filter(Boolean).join('/')
+    ]
+        .filter(Boolean)
+        .join('/')
 
     return {
         lesson: !lessonData ? undefined : {
diff --git a/src-ts/tools/learn/learn-lib/data-providers/resource-provider-provider/resource-provider.provider.tsx b/src-ts/tools/learn/learn-lib/data-providers/resource-provider-provider/resource-provider.provider.tsx
index a100e0ffc..e3de332bc 100644
--- a/src-ts/tools/learn/learn-lib/data-providers/resource-provider-provider/resource-provider.provider.tsx
+++ b/src-ts/tools/learn/learn-lib/data-providers/resource-provider-provider/resource-provider.provider.tsx
@@ -12,11 +12,11 @@ export function useGetResourceProvider(providerName?: string): ResourceProviderD
     const url: string = learnUrlGet('providers')
     const swrCacheConfig: SWRConfiguration = useSwrCache(url)
 
-    const {data, error}: SWRResponse<ReadonlyArray<ResourceProvider>> = useSWR(url, swrCacheConfig)
+    const { data, error }: SWRResponse<ReadonlyArray<ResourceProvider>> = useSWR(url, swrCacheConfig)
 
     return {
         loading: !data && !error,
-        provider: find(data, {name: providerName}),
+        provider: find(data, { name: providerName }),
         ready: !!data || !!error,
     }
 }
diff --git a/src-ts/tools/learn/learn-lib/data-providers/user-certifications-provider/user-certification-progress.provider.tsx b/src-ts/tools/learn/learn-lib/data-providers/user-certifications-provider/user-certification-progress.provider.tsx
index 949505428..7bffd5039 100644
--- a/src-ts/tools/learn/learn-lib/data-providers/user-certifications-provider/user-certification-progress.provider.tsx
+++ b/src-ts/tools/learn/learn-lib/data-providers/user-certifications-provider/user-certification-progress.provider.tsx
@@ -9,7 +9,7 @@ import { LearnUserCertificationProgress } from './user-certifications-functions'
 export function useGetUserCertificationProgress(
     userId?: number,
     provider?: string,
-    certification?: string
+    certification?: string,
 ):
     UserCertificationProgressProviderData {
 
@@ -28,10 +28,10 @@ export function useGetUserCertificationProgress(
     })
 
     return {
-        certificationProgress: find(data, {certification}),
+        certificationProgress: find(data, { certification }),
         loading: !!userId && !data && !error,
         ready: !userId || data || error,
         refetch: () => mutate(),
-        setCertificateProgress: (progress) => mutate([progress]),
+        setCertificateProgress: progress => mutate([progress]),
     }
 }
diff --git a/src-ts/tools/learn/learn-lib/data-providers/user-certifications-provider/user-certifications.provider.tsx b/src-ts/tools/learn/learn-lib/data-providers/user-certifications-provider/user-certifications.provider.tsx
index 529f22aa6..f71451d03 100644
--- a/src-ts/tools/learn/learn-lib/data-providers/user-certifications-provider/user-certifications.provider.tsx
+++ b/src-ts/tools/learn/learn-lib/data-providers/user-certifications-provider/user-certifications.provider.tsx
@@ -29,17 +29,25 @@ export function useGetUserCertifications(
     })
     const loading: boolean = !data && !error
 
-    const completed: ReadonlyArray<UserCertificationCompleted> = useMemo(() => data
-        ?.filter(c => c.status === UserCertificationProgressStatus.completed)
-        .map(c => c as UserCertificationCompleted)
-        .sort((a, b) => new Date(b.updatedAt).getTime() - new Date(a.updatedAt).getTime()) ?? []
-    , [data])
-
-    const inProgress: ReadonlyArray<UserCertificationInProgress> = useMemo(() => data
-        ?.filter(c => c.status === UserCertificationProgressStatus.inProgress)
-        .map(c => c as UserCertificationInProgress)
-        .sort((a, b) => new Date(b.updatedAt).getTime() - new Date(a.updatedAt).getTime()) ?? []
-    , [data])
+    const completed: ReadonlyArray<UserCertificationCompleted> = useMemo(
+        () => data
+            ?.filter(c => c.status === UserCertificationProgressStatus.completed)
+            .map(c => c as UserCertificationCompleted)
+            .sort((a, b) => new Date(b.updatedAt)
+                .getTime() - new Date(a.updatedAt)
+                .getTime()) ?? [],
+        [data],
+    )
+
+    const inProgress: ReadonlyArray<UserCertificationInProgress> = useMemo(
+        () => data
+            ?.filter(c => c.status === UserCertificationProgressStatus.inProgress)
+            .map(c => c as UserCertificationInProgress)
+            .sort((a, b) => new Date(b.updatedAt)
+                .getTime() - new Date(a.updatedAt)
+                .getTime()) ?? [],
+        [data],
+    )
 
     if (error) {
         errorHandle(error, 'There was an error getting your course progress.')
diff --git a/src-ts/tools/learn/learn-lib/data-providers/user-completed-certifications-provider/user-completed-certifications.provider.tsx b/src-ts/tools/learn/learn-lib/data-providers/user-completed-certifications-provider/user-completed-certifications.provider.tsx
index 7a44f8ddb..5e56ea7cf 100644
--- a/src-ts/tools/learn/learn-lib/data-providers/user-completed-certifications-provider/user-completed-certifications.provider.tsx
+++ b/src-ts/tools/learn/learn-lib/data-providers/user-completed-certifications-provider/user-completed-certifications.provider.tsx
@@ -8,20 +8,19 @@ import { UserCompletedCertificationsProviderData } from './user-completed-certif
 export function useGetUserCompletedCertifications(
     userId?: number,
     provider?: string,
-    certification?: string
+    certification?: string,
 ): UserCompletedCertificationsProviderData {
 
     const url: string = learnUrlGet('completed-certifications', `${userId}`)
 
-    const {data, error}: SWRResponse<ReadonlyArray<LearnUserCompletedCertification>> = useSWR(url)
+    const { data, error }: SWRResponse<ReadonlyArray<LearnUserCompletedCertification>> = useSWR(url)
 
     let certifications: ReadonlyArray<LearnUserCompletedCertification> = data ?? []
 
     if (provider || certification) {
-        certifications = certifications.filter((c) => {
-            return (!provider || c.provider === provider) &&
-            (!certification || c.certification === certification)
-        })
+        certifications = certifications
+            .filter(c => (!provider || c.provider === provider)
+                && (!certification || c.certification === certification))
     }
 
     return {
diff --git a/src-ts/tools/learn/learn-lib/learn-swr/LearnSwr.tsx b/src-ts/tools/learn/learn-lib/learn-swr/LearnSwr.tsx
index 532fdd52a..847de317b 100644
--- a/src-ts/tools/learn/learn-lib/learn-swr/LearnSwr.tsx
+++ b/src-ts/tools/learn/learn-lib/learn-swr/LearnSwr.tsx
@@ -7,20 +7,17 @@ interface LearnSwrProps {
     children: ReactNode
 }
 
-const LearnSwr: FC<LearnSwrProps> = (props: LearnSwrProps) => {
-
-    return (
-        <SWRConfig
-            value={{
-                fetcher: (resource) => learnXhrGetAsync(resource),
-                refreshInterval: 0,
-                revalidateOnFocus: false,
-                revalidateOnMount: true,
-            }}
-        >
-            {props.children}
-        </SWRConfig>
-    )
-}
+const LearnSwr: FC<LearnSwrProps> = (props: LearnSwrProps) => (
+    <SWRConfig
+        value={{
+            fetcher: resource => learnXhrGetAsync(resource),
+            refreshInterval: 0,
+            revalidateOnFocus: false,
+            revalidateOnMount: true,
+        }}
+    >
+        {props.children}
+    </SWRConfig>
+)
 
 export default LearnSwr
diff --git a/src-ts/tools/learn/learn-lib/learn-swr/use-swr-cache.tsx b/src-ts/tools/learn/learn-lib/learn-swr/use-swr-cache.tsx
index 2e13c599e..67701fb1a 100644
--- a/src-ts/tools/learn/learn-lib/learn-swr/use-swr-cache.tsx
+++ b/src-ts/tools/learn/learn-lib/learn-swr/use-swr-cache.tsx
@@ -10,9 +10,10 @@ if (typeof window !== 'undefined') {
 
     // parse the loaded data, and load it into swr's in-memory cache
     if (cacheMap) {
-        Object.entries(cacheMap).forEach(([key, data]) => {
-            mutate(key, data, {revalidate: false})
-        })
+        Object.entries(cacheMap)
+            .forEach(([key, data]) => {
+                mutate(key, data, { revalidate: false })
+            })
     }
 }
 
diff --git a/src-ts/tools/work/work-self-service/intake-forms/review/Review.tsx b/src-ts/tools/work/work-self-service/intake-forms/review/Review.tsx
index 9de62f10a..26cb7aab0 100644
--- a/src-ts/tools/work/work-self-service/intake-forms/review/Review.tsx
+++ b/src-ts/tools/work/work-self-service/intake-forms/review/Review.tsx
@@ -283,6 +283,7 @@ const output: () => JSX.Element = () => {
             apiVersion: EnvironmentConfig.STRIPE.API_VERSION,
         })
     }
+
     return (
         <Elements stripe={stripePromise as Promise<Stripe>}>
             <Review />

From 21f4512418257361d99027e4b3363fa49a58fd46 Mon Sep 17 00:00:00 2001
From: Vasilica Olariu <olariu.vasilica@gmail.com>
Date: Mon, 14 Nov 2022 11:16:02 +0200
Subject: [PATCH 6/8] PR feedback

---
 src-ts/tools/learn/learn-lib/functions/learn.factory.ts     | 6 +++---
 .../progress-block/progress-action/ProgressAction.tsx       | 2 +-
 src-ts/utils/settings/account/Account.tsx                   | 5 +++--
 3 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/src-ts/tools/learn/learn-lib/functions/learn.factory.ts b/src-ts/tools/learn/learn-lib/functions/learn.factory.ts
index 1fac21de2..af7a62a7a 100644
--- a/src-ts/tools/learn/learn-lib/functions/learn.factory.ts
+++ b/src-ts/tools/learn/learn-lib/functions/learn.factory.ts
@@ -9,15 +9,15 @@ export interface LearnResponseModel {
 export function create<T extends LearnResponseModel>(item: T): T {
 
     if (typeof item?.createdAt === 'string') {
-        set(item, 'createdAt', new Date(item.createdAt))
+        item.createdAt = new Date(item.createdAt)
     }
 
     if (typeof item?.updatedAt === 'string') {
-        set(item, 'updatedAt', new Date(item.updatedAt))
+        item.updatedAt = new Date(item.updatedAt)
     }
 
     if (typeof item?.publishedAt === 'string') {
-        set(item, 'publishedAt', new Date(item.publishedAt))
+        item.publishedAt = new Date(item.publishedAt)
     }
 
     return item
diff --git a/src-ts/tools/learn/welcome/progress-block/progress-action/ProgressAction.tsx b/src-ts/tools/learn/welcome/progress-block/progress-action/ProgressAction.tsx
index 505411c46..00e702a81 100644
--- a/src-ts/tools/learn/welcome/progress-block/progress-action/ProgressAction.tsx
+++ b/src-ts/tools/learn/welcome/progress-block/progress-action/ProgressAction.tsx
@@ -43,7 +43,7 @@ const ProgressAction: FC<ProgressActionProps> = (props: ProgressActionProps) =>
     const certificationsById: { [key: string]: LearnCertification } = useMemo(() => (
         props.allCertifications
             .reduce((certifs, certificate) => {
-                set(certifs, [certificate.id], certificate)
+                certifs[certificate.id] = certificate
                 return certifs
             }, {} as unknown as { [key: string]: LearnCertification })
     ), [props.allCertifications])
diff --git a/src-ts/utils/settings/account/Account.tsx b/src-ts/utils/settings/account/Account.tsx
index 248731e5e..bc04d6d75 100644
--- a/src-ts/utils/settings/account/Account.tsx
+++ b/src-ts/utils/settings/account/Account.tsx
@@ -1,3 +1,4 @@
+/* eslint-disable jsx-a11y/tabindex-no-positive */
 import { Dispatch, FC, SetStateAction, useCallback, useContext, useState } from 'react'
 import Modal from 'react-responsive-modal'
 
@@ -70,7 +71,7 @@ const Account: FC<{}> = () => {
                 <Button
                     label='edit name'
                     onClick={toggleEditName}
-                    tabIndex={-1}
+                    tabIndex={1}
                     buttonStyle='secondary'
                 />
             </Card>
@@ -93,7 +94,7 @@ const Account: FC<{}> = () => {
                 <Button
                     label='change password'
                     onClick={toggleChangePassword}
-                    tabIndex={-1}
+                    tabIndex={2}
                     buttonStyle='secondary'
                 />
             </Card>

From 8e084d1946b97b9a3de57e529c7e46b62b07a0fd Mon Sep 17 00:00:00 2001
From: Brooke <brooke.souza@topcoder.com>
Date: Mon, 14 Nov 2022 09:34:09 -0800
Subject: [PATCH 7/8] TCA-499 clean up

---
 .../welcome/progress-block/progress-action/ProgressAction.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src-ts/tools/learn/welcome/progress-block/progress-action/ProgressAction.tsx b/src-ts/tools/learn/welcome/progress-block/progress-action/ProgressAction.tsx
index f7a7089ab..abf5ef4ca 100644
--- a/src-ts/tools/learn/welcome/progress-block/progress-action/ProgressAction.tsx
+++ b/src-ts/tools/learn/welcome/progress-block/progress-action/ProgressAction.tsx
@@ -1,4 +1,4 @@
-import { orderBy, set } from 'lodash'
+import { orderBy } from 'lodash'
 import { FC, ReactNode, useMemo } from 'react'
 
 import { Button } from '../../../../../lib'
@@ -43,7 +43,7 @@ const ProgressAction: FC<ProgressActionProps> = (props: ProgressActionProps) =>
     const certificationsById: { [key: string]: LearnCertification } = useMemo(() => (
         props.allCertifications
             .reduce((certifs, certificate) => {
-                set(certifs, [certificate.id], certificate)
+                certifs[certificate.id] = certificate
                 return certifs
             }, {} as unknown as { [key: string]: LearnCertification })
     ), [props.allCertifications])

From afc60107c750ca5d6e649f553ba44897870dab98 Mon Sep 17 00:00:00 2001
From: Brooke <brooke.souza@topcoder.com>
Date: Mon, 14 Nov 2022 10:08:11 -0800
Subject: [PATCH 8/8] TCA-499 clean up

---
 src-ts/tools/learn/learn-lib/functions/learn.factory.ts | 2 --
 1 file changed, 2 deletions(-)

diff --git a/src-ts/tools/learn/learn-lib/functions/learn.factory.ts b/src-ts/tools/learn/learn-lib/functions/learn.factory.ts
index af7a62a7a..33e433774 100644
--- a/src-ts/tools/learn/learn-lib/functions/learn.factory.ts
+++ b/src-ts/tools/learn/learn-lib/functions/learn.factory.ts
@@ -1,5 +1,3 @@
-import { set } from 'lodash'
-
 export interface LearnResponseModel {
     createdAt?: string | Date
     publishedAt?: string | Date