Merge branch 'dev' into CORE-96

Author: rakibansary

.circleci/config.yml

@@ -257,10 +257,6 @@ workflows:
                       branches:
                           only:
                               - dev
-                              - justin_fixes
-                              - talent_search_fixes
-                              - feature/standardized-skills
-                              - CORE-96
 
             - deployQa:
                   context: org-global

package.json

@@ -94,7 +94,7 @@
     "react-responsive-modal": "^6.2.0",
     "react-router-dom": "^6.4.2",
     "react-scripts": "5.0.1",
-    "react-select": "^5.5.0",
+    "react-select": "^5.8.0",
     "react-spinners": "^0.13.6",
     "react-stickynode": "^1.4.1",
     "react-toastify": "^9.0.8",

src/apps/onboarding/src/config/index.ts

@@ -1,17 +1,4 @@
-export const ACTIONS: {
-    MEMBER: {
-        GET_MEMBER: string;
-        UPDATE_MEMBER_PHOTO_URL: string;
-        SET_WORKS: string;
-        SET_EDUCATIONS: string;
-        SET_PERSONALIZATIONS: string;
-        SET_ADDRESS: string;
-        SET_CONNECT_INFO: string;
-        SET_DESCRIPTION: string;
-        SET_LOADING_MEMBER_TRAITS: string;
-        SET_LOADING_MEMBER_INFO: string;
-    };
-} = {
+export const ACTIONS = {
     MEMBER: {
         GET_MEMBER: 'GET_MEMBER',
         SET_ADDRESS: 'SET_ADDRESS',
@@ -20,6 +7,7 @@ export const ACTIONS: {
         SET_EDUCATIONS: 'SET_EDUCATIONS',
         SET_LOADING_MEMBER_INFO: 'SET_LOADING_MEMBER_INFO',
         SET_LOADING_MEMBER_TRAITS: 'SET_LOADING_MEMBER_TRAITS',
+        SET_OPEN_FOR_WORK: 'SET_OPEN_FOR_WORK',
         SET_PERSONALIZATIONS: 'SET_PERSONALIZATIONS',
         SET_WORKS: 'SET_WORKS',
         UPDATE_MEMBER_PHOTO_URL: 'UPDATE_MEMBER_PHOTO_URL',

src/apps/onboarding/src/models/MemberInfo.ts

@@ -15,6 +15,7 @@ export default interface MemberInfo {
     maxRating: MemberMaxRating
     skills: Array<UserSkill>
     stats: Array<MemberStats>
+    availableForGigs: boolean
     addresses?: MemberAddress[]
     country: string
     photoURL: string

src/apps/onboarding/src/models/PersonalizationInfo.ts

@@ -2,11 +2,9 @@ export default interface PersonalizationInfo {
     referAs?: string
     profileSelfTitle?: string
     shortBio?: string
-    availableForGigs?: boolean
 }
 
 export const emptyPersonalizationInfo: () => PersonalizationInfo = () => ({
-    availableForGigs: true,
     profileSelfTitle: '',
     referAs: '',
     shortBio: '',

src/apps/onboarding/src/pages/onboarding/index.tsx

@@ -5,6 +5,7 @@ import classNames from 'classnames'
 
 import { routerContext, RouterContextData } from '~/libs/core'
 import { Member } from '~/apps/talent-search/src/lib/models'
+import { SharedSwrConfig } from '~/libs/shared'
 import { EnvironmentConfig } from '~/config'
 
 import { onboardRouteId } from '../../onboarding.routes'
@@ -52,11 +53,13 @@ const OnboardingContent: FC<{
 }
 
 export const OnboardingWrapper: FC<{}> = () => (
-    <div className={classNames(styles.blockWrapper, 'd-flex flex-column align-items-center')}>
-        <Provider store={store}>
-            <OnboardingContent />
-        </Provider>
-    </div>
+    <SharedSwrConfig>
+        <div className={classNames(styles.blockWrapper, 'd-flex flex-column align-items-center')}>
+            <Provider store={store}>
+                <OnboardingContent />
+            </Provider>
+        </div>
+    </SharedSwrConfig>
 )
 
 export default OnboardingWrapper

src/apps/onboarding/src/pages/open-to-work/index.tsx

@@ -1,75 +1,51 @@
 import { useNavigate } from 'react-router-dom'
-import { FC, MutableRefObject, useEffect, useMemo, useRef } from 'react'
+import { FC, MutableRefObject, useEffect, useRef, useState } from 'react'
 import { connect } from 'react-redux'
+import { pick } from 'lodash'
 import classNames from 'classnames'
 
 import { Button, IconOutline, PageDivider } from '~/libs/ui'
 import { FormInputCheckbox } from '~/apps/self-service/src/components/form-elements'
 
-import { createMemberPersonalizations, updateMemberPersonalizations } from '../../redux/actions/member'
 import { ProgressBar } from '../../components/progress-bar'
-import { useAutoSavePersonalization, useAutoSavePersonalizationType } from '../../hooks/useAutoSavePersonalization'
-import PersonalizationInfo, { emptyPersonalizationInfo } from '../../models/PersonalizationInfo'
+import { updateMemberOpenForWork } from '../../redux/actions/member'
 
 import styles from './styles.module.scss'
 
 const FormInputCheckboxMiddleware: any = FormInputCheckbox as any
 
-const blankPersonalizationInfo: PersonalizationInfo = emptyPersonalizationInfo()
-
-interface PageOpenToWorkContentReduxProps {
-    reduxPersonalizations: PersonalizationInfo[] | undefined
-    loadingMemberTraits: boolean
-}
-
-interface PageOpenToWorkContentProps extends PageOpenToWorkContentReduxProps {
-    updateMemberPersonalizations: (infos: PersonalizationInfo[]) => void
-    createMemberPersonalizations: (infos: PersonalizationInfo[]) => void
+interface PageOpenToWorkContentProps {
+    availableForGigs: boolean
+    updateMemberOpenForWork: (isOpenForWork: boolean) => void
 }
 
 export const PageOpenToWorkContent: FC<PageOpenToWorkContentProps> = props => {
     const navigate: any = useNavigate()
 
+    const [loading, setLoading] = useState<boolean>(false)
+
     const shouldSavingData: MutableRefObject<boolean> = useRef<boolean>(false)
     const shouldNavigateTo: MutableRefObject<string> = useRef<string>('')
 
-    const {
-        loading,
-        personalizationInfo,
-        setPersonalizationInfo,
-    }: useAutoSavePersonalizationType = useAutoSavePersonalization(
-        props.reduxPersonalizations,
-        ['availableForGigs'],
-        props.updateMemberPersonalizations,
-        props.createMemberPersonalizations,
-        shouldSavingData,
-    )
-
-    const availableForGigsValue: boolean | undefined = useMemo(() => {
-        if (!personalizationInfo || personalizationInfo.availableForGigs === undefined) {
-            return blankPersonalizationInfo.availableForGigs
-        }
-
-        return personalizationInfo.availableForGigs
-    }, [personalizationInfo])
-
     useEffect(() => {
         if (!loading && !shouldSavingData.current && !!shouldNavigateTo.current) {
             navigate(shouldNavigateTo.current)
         }
         /* eslint-disable react-hooks/exhaustive-deps */
     }, [loading])
 
-    function checkToNavigateNextPage(pageUrl: string): void {
-        if (!personalizationInfo || personalizationInfo.availableForGigs === undefined) {
-            shouldNavigateTo.current = pageUrl
-            setPersonalizationInfo({
-                ...(personalizationInfo || {}),
-                availableForGigs: blankPersonalizationInfo.availableForGigs,
-            })
-        } else {
-            navigate(pageUrl)
-        }
+    function goToPreviousStep(): void {
+        navigate('../skills')
+    }
+
+    function goToNextStep(): void {
+        navigate('../works')
+    }
+
+    async function handleSaveAvailableForGigs(e: any): Promise<void> {
+        setLoading(true)
+        await props.updateMemberOpenForWork(e.target.checked)
+        setLoading(false)
     }
 
     return (
@@ -90,15 +66,10 @@ export const PageOpenToWorkContent: FC<PageOpenToWorkContentProps> = props => {
                     <div className='mt-26'>
                         <FormInputCheckboxMiddleware
                             label='Yes, I’m open to work'
-                            checked={availableForGigsValue}
+                            checked={props.availableForGigs}
                             inline
-                            onChange={function onChange(e: any) {
-                                setPersonalizationInfo({
-                                    ...(personalizationInfo || {}),
-                                    availableForGigs: e.target.checked,
-                                })
-                            }}
-                            disabled={props.loadingMemberTraits || loading}
+                            onChange={handleSaveAvailableForGigs}
+                            disabled={loading}
                         />
                     </div>
                 </div>
@@ -117,18 +88,14 @@ export const PageOpenToWorkContent: FC<PageOpenToWorkContentProps> = props => {
                     iconToLeft
                     disabled={loading}
                     icon={IconOutline.ChevronLeftIcon}
-                    onClick={function previousPage() {
-                        checkToNavigateNextPage('../skills')
-                    }}
+                    onClick={goToPreviousStep}
                 />
                 <Button
                     size='lg'
                     primary
                     iconToLeft
                     disabled={loading}
-                    onClick={function nextPage() {
-                        checkToNavigateNextPage('../works')
-                    }}
+                    onClick={goToNextStep}
                 >
                     next
                 </Button>
@@ -137,22 +104,10 @@ export const PageOpenToWorkContent: FC<PageOpenToWorkContentProps> = props => {
     )
 }
 
-const mapStateToProps: (state: any) => PageOpenToWorkContentReduxProps
-    = (state: any): PageOpenToWorkContentReduxProps => {
-        const {
-            loadingMemberTraits,
-            personalizations,
-        }: any = state.member
-
-        return {
-            loadingMemberTraits,
-            reduxPersonalizations: personalizations,
-        }
-    }
+const mapStateToProps: any = (state: any) => pick(state.member, 'availableForGigs')
 
 const mapDispatchToProps: any = {
-    createMemberPersonalizations,
-    updateMemberPersonalizations,
+    updateMemberOpenForWork,
 }
 
 export const PageOpenToWork: any = connect(mapStateToProps, mapDispatchToProps)(PageOpenToWorkContent)

src/apps/onboarding/src/redux/actions/member.ts

@@ -1,6 +1,6 @@
 import _ from 'lodash'
 
-import { TokenModel, UserTraitCategoryNames, UserTraitIds } from '~/libs/core'
+import { TokenModel, updateMemberProfileAsync, UserTraitCategoryNames, UserTraitIds } from '~/libs/core'
 import { getAsync as getAsyncToken } from '~/libs/core/lib/auth/token-functions/token.functions'
 import {
     createMemberTraits,
@@ -396,6 +396,11 @@ export const setMemberPhotoUrl: any = (photoUrl: string) => ({
     type: ACTIONS.MEMBER.UPDATE_MEMBER_PHOTO_URL,
 })
 
+export const setMemberOpenForWork: any = (isOpenForWork: boolean) => ({
+    payload: isOpenForWork,
+    type: ACTIONS.MEMBER.SET_OPEN_FOR_WORK,
+})
+
 export const updateMemberHomeAddresss: any = (addresses: MemberAddress[]) => async (dispatch: any) => {
     try {
         const tokenInfo: TokenModel = await getAsyncToken()
@@ -436,3 +441,16 @@ export const updateMemberPhotoUrl: any = (photoURL: string) => async (dispatch:
     } catch (error) {
     }
 }
+
+export const updateMemberOpenForWork: any = (isOpenForWork: boolean) => async (dispatch: any) => {
+    try {
+        const tokenInfo: TokenModel = await getAsyncToken()
+
+        await updateMemberProfileAsync(
+            tokenInfo.handle || '',
+            { availableForGigs: isOpenForWork },
+        )
+        dispatch(setMemberOpenForWork(isOpenForWork))
+    } catch (error) {
+    }
+}

src/apps/onboarding/src/redux/reducers/member.ts

@@ -1,3 +1,4 @@
+/* eslint-disable complexity */
 import _ from 'lodash'
 
 import { notifyUniNavi } from '~/apps/profiles/src/lib'
@@ -19,6 +20,7 @@ const initialState: {
     connectInfo?: ConnectInfo
     loadingMemberTraits?: boolean
     loadingMemberInfo?: boolean
+    availableForGigs?: boolean
 } = {
 }
 
@@ -35,6 +37,11 @@ const memberReducer: any = (
                 ...state,
                 memberInfo: action.payload,
             }
+        case ACTIONS.MEMBER.SET_OPEN_FOR_WORK:
+            return {
+                ...state,
+                availableForGigs: action.payload,
+            }
         case ACTIONS.MEMBER.SET_WORKS:
             return {
                 ...state,