diff --git a/src/apps/onboarding/src/assets/images/back-green.svg b/src/apps/onboarding/src/assets/images/back-green.svg deleted file mode 100644 index c6d8e928e..000000000 --- a/src/apps/onboarding/src/assets/images/back-green.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - \ No newline at end of file diff --git a/src/apps/onboarding/src/assets/images/cheveron-down.svg b/src/apps/onboarding/src/assets/images/cheveron-down.svg deleted file mode 100644 index f6af4858a..000000000 --- a/src/apps/onboarding/src/assets/images/cheveron-down.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - \ No newline at end of file diff --git a/src/apps/onboarding/src/assets/images/edit.svg b/src/apps/onboarding/src/assets/images/edit.svg deleted file mode 100644 index e8aa0411d..000000000 --- a/src/apps/onboarding/src/assets/images/edit.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - \ No newline at end of file diff --git a/src/apps/onboarding/src/assets/images/trash.svg b/src/apps/onboarding/src/assets/images/trash.svg deleted file mode 100644 index 9687957df..000000000 --- a/src/apps/onboarding/src/assets/images/trash.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - \ No newline at end of file diff --git a/src/apps/onboarding/src/assets/images/x-icon.svg b/src/apps/onboarding/src/assets/images/x-icon.svg deleted file mode 100644 index 6d7f9b501..000000000 --- a/src/apps/onboarding/src/assets/images/x-icon.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/apps/onboarding/src/components/DateInput/index.tsx b/src/apps/onboarding/src/components/DateInput/index.tsx index e92f484d1..df6a40251 100644 --- a/src/apps/onboarding/src/components/DateInput/index.tsx +++ b/src/apps/onboarding/src/components/DateInput/index.tsx @@ -1,32 +1,28 @@ -/* eslint-disable ordered-imports/ordered-imports */ -/* eslint-disable react/jsx-no-bind */ -/* eslint-disable unicorn/no-null */ -/* eslint-disable max-len */ -/* eslint-disable react/destructuring-assignment */ /** * DateInput * * Date Input control. */ -import React, { FC, createRef, useState } from 'react' -import DatePicker from 'react-datepicker' import { Portal } from 'react-overlays' +import { createRef, FC, useState } from 'react' +import DatePicker from 'react-datepicker' import cn from 'classnames' import moment from 'moment' - import 'react-datepicker/dist/react-datepicker.css' +import { IconOutline } from '~/libs/ui' + import { ReactComponent as CalendarIcon } from '../../assets/images/calendar.svg' -import { ReactComponent as ArrowIcon } from '../../assets/images/cheveron-down.svg' + import styles from './styles.module.scss' interface CalendarContainerProps { children?: any } -const CalendarContainer: FC = ({ children }: CalendarContainerProps) => { +const CalendarContainer: FC = (props: CalendarContainerProps) => { const el: any = document.getElementById('calendar-portal') - return {children} + return {props.children} } interface DateInputProps { @@ -53,7 +49,9 @@ const DateInput: FC = (props: DateInputProps) => { )} >
calendarRef.current.setOpen(true)} + onClick={function openCalendar() { + calendarRef.current.setOpen(true) + }} className={cn(styles.icon, styles['icon-calendar'])} > @@ -65,15 +63,17 @@ const DateInput: FC = (props: DateInputProps) => { selected={props.value} onChange={props.onChange as any} onBlur={props.onBlur} - onCalendarClose={() => { + onCalendarClose={function closeCalendar() { setOpen(false) }} onFocus={props.onFocus} showYearDropdown dropdownMode='select' - onCalendarOpen={() => setOpen(true)} + onCalendarOpen={function openCalendar() { + setOpen(true) + }} maxDate={ - props.allowFutureDate ? null : moment() + props.allowFutureDate ? undefined : moment() .subtract(1, 'days') .toDate() } @@ -86,9 +86,11 @@ const DateInput: FC = (props: DateInputProps) => { styles['icon-arrow'], open ? styles['icon-arrow-open'] : '', )} - onClick={() => calendarRef.current.setOpen(true)} + onClick={function openCalendar() { + calendarRef.current.setOpen(true) + }} > - +
) diff --git a/src/apps/onboarding/src/components/FieldAvatar/index.tsx b/src/apps/onboarding/src/components/FieldAvatar/index.tsx index 194645f44..8d9f86df7 100644 --- a/src/apps/onboarding/src/components/FieldAvatar/index.tsx +++ b/src/apps/onboarding/src/components/FieldAvatar/index.tsx @@ -1,7 +1,3 @@ -/* eslint-disable ordered-imports/ordered-imports */ -/* eslint-disable react/jsx-no-bind */ -/* eslint-disable react/destructuring-assignment */ -/* eslint-disable unicorn/no-null */ /** * FieldAvatar * @@ -9,15 +5,15 @@ */ import { Dispatch, FC, SetStateAction, useEffect, useState } from 'react' import classNames from 'classnames' -import _ from 'lodash' import { Button, IconOutline } from '~/libs/ui' -import styles from './styles.module.scss' -import MemberInfo from '../../models/MemberInfo' import AvatarPlaceholder from '../../assets/images/avatar-placeholder.png' +import MemberInfo from '../../models/MemberInfo' import ModalUploadPhoto from '../modal-upload-photo' +import styles from './styles.module.scss' + interface FieldAvatarProps { className?: string memberInfo?: MemberInfo, @@ -25,19 +21,14 @@ interface FieldAvatarProps { updateMemberPhotoUrl: (photoUrl: string) => void } -const FieldAvatar: FC = ({ - className, - memberInfo, - setMemberPhotoUrl, - updateMemberPhotoUrl, -}: FieldAvatarProps) => { +const FieldAvatar: FC = (props: FieldAvatarProps) => { const [imgUrl, setImgUrl] = useState('') useEffect(() => { - if (memberInfo) { - setImgUrl(memberInfo.photoURL) + if (props.memberInfo) { + setImgUrl(props.memberInfo.photoURL) } /* eslint-disable react-hooks/exhaustive-deps */ - }, [memberInfo]) + }, [props.memberInfo]) const [isPhotoEditMode, setIsPhotoEditMode]: [boolean, Dispatch>] = useState(false) @@ -51,16 +42,20 @@ const FieldAvatar: FC = ({ async function handleRemovePhoto(): Promise { setIsSaving(true) try { - await updateMemberPhotoUrl('') + await props.updateMemberPhotoUrl('') } catch (error) { } setIsSaving(false) } + function showEditPhoto(): void { + setIsPhotoEditMode(true) + } + return (

Photo

@@ -90,8 +85,8 @@ const FieldAvatar: FC = ({ secondary iconToLeft icon={IconOutline.UploadIcon} - disabled={!memberInfo || isSaving} - onClick={() => setIsPhotoEditMode(true)} + disabled={!props.memberInfo || isSaving} + onClick={showEditPhoto} className='mt-16' > change @@ -101,11 +96,8 @@ const FieldAvatar: FC = ({ secondary iconToLeft icon={IconOutline.TrashIcon} - disabled={!memberInfo || isSaving} - onClick={() => { - handleRemovePhoto() - .then(_.noop) - }} + disabled={!props.memberInfo || isSaving} + onClick={handleRemovePhoto} className='mt-16' > delete @@ -117,8 +109,8 @@ const FieldAvatar: FC = ({ secondary iconToLeft icon={IconOutline.UploadIcon} - disabled={!memberInfo} - onClick={() => setIsPhotoEditMode(true)} + disabled={!props.memberInfo} + onClick={showEditPhoto} className='mt-16' > add image @@ -128,11 +120,11 @@ const FieldAvatar: FC = ({
{ - isPhotoEditMode && memberInfo && ( + isPhotoEditMode && props.memberInfo && ( ) } diff --git a/src/apps/onboarding/src/components/FormField/index.tsx b/src/apps/onboarding/src/components/FormField/index.tsx index 41057793f..64ead7b7f 100644 --- a/src/apps/onboarding/src/components/FormField/index.tsx +++ b/src/apps/onboarding/src/components/FormField/index.tsx @@ -1,7 +1,3 @@ -/* eslint-disable ordered-imports/ordered-imports */ -/* eslint-disable react/jsx-no-bind */ -/* eslint-disable react/destructuring-assignment */ -/* eslint-disable unicorn/no-null */ /** * FormField * @@ -21,13 +17,15 @@ interface FormFieldProps { error?: string } -const FormField: FC = ({ - children, - className, - label, - ...props -}: FormFieldProps) => { - const handleClick: any = (e: any) => { +const FormField: FC = (componentProps: FormFieldProps) => { + const { + children, + className, + label, + ...props + }: FormFieldProps = componentProps + + function handleClick(e: any): void { // focus on input label click const inputElement: any = e.target.closest('.form-field') .querySelector('input') @@ -45,7 +43,7 @@ const FormField: FC = ({ {children}
- {props.error ? () : null} + {props.error ? () : undefined} {props.error}
diff --git a/src/apps/onboarding/src/components/InputTextAutoSave/index.tsx b/src/apps/onboarding/src/components/InputTextAutoSave/index.tsx index 89c348eb1..bb98db09b 100644 --- a/src/apps/onboarding/src/components/InputTextAutoSave/index.tsx +++ b/src/apps/onboarding/src/components/InputTextAutoSave/index.tsx @@ -1,13 +1,10 @@ -/* eslint-disable ordered-imports/ordered-imports */ -/* eslint-disable react/jsx-no-bind */ -/* eslint-disable react/destructuring-assignment */ -/* eslint-disable unicorn/no-null */ /** * InputTextAutoSave * * A Form Field Is a wrapper for input to add the label to it */ -import React, { FC, useEffect, useState } from 'react' +import { FC, FocusEvent, useEffect, useState } from 'react' + import { InputText, InputValue } from '~/libs/ui' import { InputTextTypes } from '~/libs/ui/lib/components/form/form-groups/form-input/input-text/InputText' @@ -40,10 +37,12 @@ const InputTextAutoSave: FC = (props: InputTextProps) => { { + onChange={function onChange(event: FocusEvent) { setValue(event.target.value) }} - onBlur={() => props.onChange(`${value}`)} + onBlur={function onBlur() { + props.onChange(`${value}`) + }} /> ) } diff --git a/src/apps/onboarding/src/components/InputTextareaAutoSave/index.tsx b/src/apps/onboarding/src/components/InputTextareaAutoSave/index.tsx index 425abd003..6e162560b 100644 --- a/src/apps/onboarding/src/components/InputTextareaAutoSave/index.tsx +++ b/src/apps/onboarding/src/components/InputTextareaAutoSave/index.tsx @@ -1,13 +1,10 @@ -/* eslint-disable ordered-imports/ordered-imports */ -/* eslint-disable react/jsx-no-bind */ -/* eslint-disable react/destructuring-assignment */ -/* eslint-disable unicorn/no-null */ /** * InputTextareaAutoSave * * A Form Field Is a wrapper for input to add the label to it */ -import React, { FC, useEffect, useState } from 'react' +import { FC, FocusEvent, useEffect, useState } from 'react' + import { InputTextarea } from '~/libs/ui' export interface InputTextareaProps { @@ -35,10 +32,12 @@ const InputTextareaAutoSave: FC = (props: InputTextareaProps { + onChange={function onChange(event: FocusEvent) { setValue(event.target.value) }} - onBlur={() => props.onChange(`${value}`)} + onBlur={function onBlur() { + props.onChange(`${value}`) + }} /> ) } diff --git a/src/apps/onboarding/src/components/card-item/index.tsx b/src/apps/onboarding/src/components/card-item/index.tsx index 993d85b4c..757f67f18 100644 --- a/src/apps/onboarding/src/components/card-item/index.tsx +++ b/src/apps/onboarding/src/components/card-item/index.tsx @@ -1,11 +1,9 @@ -/* eslint-disable ordered-imports/ordered-imports */ -/* eslint-disable react/jsx-no-bind */ import React, { FC } from 'react' import classNames from 'classnames' +import { IconOutline } from '~/libs/ui' + import styles from './styles.module.scss' -import IconEdit from '../../assets/images/edit.svg' -import IconTrash from '../../assets/images/trash.svg' interface CardItemProps { title: string @@ -30,7 +28,7 @@ export const CardItem: FC = (props: CardItemProps) => ( disabled={props.disabled} className={styles.btn} > - + diff --git a/src/apps/onboarding/src/components/card-item/styles.module.scss b/src/apps/onboarding/src/components/card-item/styles.module.scss index 77acdf163..ebc49a55e 100644 --- a/src/apps/onboarding/src/components/card-item/styles.module.scss +++ b/src/apps/onboarding/src/components/card-item/styles.module.scss @@ -34,6 +34,7 @@ .btn { flex-shrink: 0; + color: $turq-160; &:disabled { opacity: 0.2; diff --git a/src/apps/onboarding/src/components/modal-add-education/index.tsx b/src/apps/onboarding/src/components/modal-add-education/index.tsx index 2465ba4b9..5b7cc5bb2 100644 --- a/src/apps/onboarding/src/components/modal-add-education/index.tsx +++ b/src/apps/onboarding/src/components/modal-add-education/index.tsx @@ -1,17 +1,15 @@ -/* eslint-disable ordered-imports/ordered-imports */ -/* eslint-disable react/jsx-no-bind */ -/* eslint-disable sort-keys */ -import { FC, useEffect, useState } from 'react' +import { FC, FocusEvent, useEffect, useState } from 'react' +import _ from 'lodash' import classNames from 'classnames' import moment from 'moment' -import _ from 'lodash' import { BaseModal, Button, InputText } from '~/libs/ui' -import styles from './styles.module.scss' +import DateInput from '../DateInput' import EducationInfo, { emptyEducationInfo } from '../../models/EducationInfo' import FormField from '../FormField' -import DateInput from '../DateInput' + +import styles from './styles.module.scss' interface ModalAddEducationProps { onClose?: () => void @@ -74,7 +72,7 @@ const ModalAddEducation: FC = (props: ModalAddEducationP primary size='lg' label='save' - onClick={() => { + onClick={function onClick() { if (validateField()) { const endDate: Date | undefined = educationInfo.endDate const endDateString: string = endDate ? moment(endDate) @@ -110,7 +108,7 @@ const ModalAddEducation: FC = (props: ModalAddEducationP name='collegeName' label='College or University *' value={educationInfo.collegeName} - onChange={event => { + onChange={function onChange(event: FocusEvent) { setEducationInfo({ ...educationInfo, collegeName: event.target.value, @@ -128,10 +126,12 @@ const ModalAddEducation: FC = (props: ModalAddEducationP name='major' label='Degree *' value={educationInfo.major} - onChange={event => setEducationInfo({ - ...educationInfo, - major: event.target.value, - })} + onChange={function onChange(event: FocusEvent) { + setEducationInfo({ + ...educationInfo, + major: event.target.value, + }) + }} placeholder='Enter degree' tabIndex={0} type='text' @@ -151,7 +151,7 @@ const ModalAddEducation: FC = (props: ModalAddEducationP > { + onChange={function onChange(v: Date | null) { setEducationInfo({ ...educationInfo, startDate: v || undefined, @@ -170,7 +170,7 @@ const ModalAddEducation: FC = (props: ModalAddEducationP > { + onChange={function onChange(v: Date | null) { setEducationInfo({ ...educationInfo, endDate: v || undefined, diff --git a/src/apps/onboarding/src/components/modal-add-work/index.tsx b/src/apps/onboarding/src/components/modal-add-work/index.tsx index ce89d2822..ba722e322 100644 --- a/src/apps/onboarding/src/components/modal-add-work/index.tsx +++ b/src/apps/onboarding/src/components/modal-add-work/index.tsx @@ -1,19 +1,17 @@ -/* eslint-disable ordered-imports/ordered-imports */ -/* eslint-disable react/jsx-no-bind */ -/* eslint-disable sort-keys */ import { FC, useEffect, useState } from 'react' -import classNames from 'classnames' import _ from 'lodash' +import classNames from 'classnames' import moment from 'moment' import { BaseModal, Button, InputSelect, InputText } from '~/libs/ui' import { FormInputCheckbox } from '~/apps/self-service/src/components/form-elements' -import styles from './styles.module.scss' -import WorkInfo, { emptyWorkInfo } from '../../models/WorkInfo' import { INDUSTRIES_OPTIONS } from '../../config' -import FormField from '../FormField' import DateInput from '../DateInput' +import FormField from '../FormField' +import WorkInfo, { emptyWorkInfo } from '../../models/WorkInfo' + +import styles from './styles.module.scss' const FormInputCheckboxMiddleware: any = FormInputCheckbox as any @@ -26,8 +24,8 @@ interface ModalAddWorkProps { const industryOptions: any = _.sortBy(INDUSTRIES_OPTIONS) .map(v => ({ - value: v, label: v, + value: v, })) const ModalAddWork: FC = (props: ModalAddWorkProps) => { @@ -84,7 +82,7 @@ const ModalAddWork: FC = (props: ModalAddWorkProps) => { primary size='lg' label='save' - onClick={() => { + onClick={function onClick() { if (validateField()) { const endDate: Date | undefined = workInfo.endDate let endDateString: string = endDate ? moment(endDate) @@ -123,7 +121,7 @@ const ModalAddWork: FC = (props: ModalAddWorkProps) => { name='company' label='Company *' value={workInfo.company} - onChange={event => { + onChange={function onChange(event: any) { setWorkInfo({ ...workInfo, company: event.target.value, @@ -141,10 +139,12 @@ const ModalAddWork: FC = (props: ModalAddWorkProps) => { name='position' label='Position *' value={workInfo.position} - onChange={event => setWorkInfo({ - ...workInfo, - position: event.target.value, - })} + onChange={function onChange(event: any) { + setWorkInfo({ + ...workInfo, + position: event.target.value, + }) + }} placeholder='Enter position' tabIndex={0} type='text' @@ -156,10 +156,12 @@ const ModalAddWork: FC = (props: ModalAddWorkProps) => { setWorkInfo({ - ...workInfo, - industry: event.target.value, - })} + onChange={function onChange(event: any) { + setWorkInfo({ + ...workInfo, + industry: event.target.value, + }) + }} name='industry' label='Industry' placeholder='Select industry' @@ -170,10 +172,12 @@ const ModalAddWork: FC = (props: ModalAddWorkProps) => { name='location' label='Location' value={workInfo.city} - onChange={event => setWorkInfo({ - ...workInfo, - city: event.target.value, - })} + onChange={function onChange(event: any) { + setWorkInfo({ + ...workInfo, + city: event.target.value, + }) + }} placeholder='Enter city, country' tabIndex={0} type='text' @@ -191,7 +195,7 @@ const ModalAddWork: FC = (props: ModalAddWorkProps) => { > { + onChange={function onChange(v: any) { setWorkInfo({ ...workInfo, startDate: v || undefined, @@ -211,7 +215,7 @@ const ModalAddWork: FC = (props: ModalAddWorkProps) => { { + onChange={function onChange(v: any) { setWorkInfo({ ...workInfo, endDate: v || undefined, @@ -228,7 +232,7 @@ const ModalAddWork: FC = (props: ModalAddWorkProps) => { label='I am currently working in this role' checked={workInfo.currentlyWorking} inline - onChange={(e: any) => { + onChange={function onChange(e: any) { setWorkInfo({ ...workInfo, currentlyWorking: e.target.checked, diff --git a/src/apps/onboarding/src/components/modal-upload-photo/index.tsx b/src/apps/onboarding/src/components/modal-upload-photo/index.tsx index 07c20ad2c..27494dbce 100644 --- a/src/apps/onboarding/src/components/modal-upload-photo/index.tsx +++ b/src/apps/onboarding/src/components/modal-upload-photo/index.tsx @@ -1,18 +1,15 @@ -/* eslint-disable ordered-imports/ordered-imports */ -/* eslint-disable react/jsx-no-bind */ -/* eslint-disable sort-keys */ -/* eslint-disable unicorn/no-null */ import { Dispatch, FC, SetStateAction, useCallback, useEffect, useState } from 'react' -import classNames from 'classnames' -import _ from 'lodash' import { DropzoneState, useDropzone } from 'react-dropzone' +import _ from 'lodash' +import classNames from 'classnames' import { BaseModal, Button } from '~/libs/ui' import { updateMemberPhotoAsync } from '~/libs/core' -import styles from './styles.module.scss' import MemberInfo from '../../models/MemberInfo' +import styles from './styles.module.scss' + interface ModalUploadPhotoProps { onClose?: () => void memberInfo?: MemberInfo @@ -33,11 +30,11 @@ const ModalUploadPhoto: FC = (props: ModalUploadPhotoProp getRootProps, getInputProps, }: DropzoneState = useDropzone({ - multiple: false, accept: 'image/jpg, image/jpeg, image/png', - minSize: 1, - maxSize: 2097152, disabled: isSaving, + maxSize: 2097152, + minSize: 1, + multiple: false, onDrop, }) @@ -80,10 +77,7 @@ const ModalUploadPhoto: FC = (props: ModalUploadPhotoProp size='lg' label='save profile picture' disabled={!props.memberInfo || isSaving || !myFiles.length} - onClick={() => { - handleModifyPhotoSave() - .then(_.noop) - }} + onClick={handleModifyPhotoSave} /> )} @@ -106,13 +100,14 @@ const ModalUploadPhoto: FC = (props: ModalUploadPhotoProp BROWSE - ) : null} + ) : undefined} + {(!isSaving && imgUrl) ? (
- ) : null} + ) : undefined} {isSaving ? (
@@ -121,7 +116,7 @@ const ModalUploadPhoto: FC = (props: ModalUploadPhotoProp
- ) : null} + ) : undefined}
Add a photo that you would like to share to the customers and community members. diff --git a/src/apps/onboarding/src/components/progress-bar/index.tsx b/src/apps/onboarding/src/components/progress-bar/index.tsx index ed6c5e90f..71cb6c627 100644 --- a/src/apps/onboarding/src/components/progress-bar/index.tsx +++ b/src/apps/onboarding/src/components/progress-bar/index.tsx @@ -1,6 +1,4 @@ -/* eslint-disable ordered-imports/ordered-imports */ -/* eslint-disable react/jsx-no-bind */ -import React, { FC, useMemo } from 'react' +import { FC, useMemo } from 'react' import classNames from 'classnames' import styles from './styles.module.scss' diff --git a/src/apps/onboarding/src/config/index.ts b/src/apps/onboarding/src/config/index.ts index 1a5dd87f2..7df974e16 100644 --- a/src/apps/onboarding/src/config/index.ts +++ b/src/apps/onboarding/src/config/index.ts @@ -1,4 +1,3 @@ -/* eslint-disable sort-keys */ export const ACTIONS: { MEMBER: { GET_MEMBER: string; @@ -14,14 +13,14 @@ export const ACTIONS: { } = { MEMBER: { GET_MEMBER: 'GET_MEMBER', - UPDATE_MEMBER_PHOTO_URL: 'UPDATE_MEMBER_PHOTO_URL', - SET_WORKS: 'SET_WORKS', - SET_EDUCATIONS: 'SET_EDUCATIONS', - SET_PERSONALIZATION: 'SET_PERSONALIZATION', SET_ADDRESS: 'SET_ADDRESS', SET_CONNECT_INFO: 'SET_CONNECT_INFO', - SET_LOADING_MEMBER_TRAITS: 'SET_LOADING_MEMBER_TRAITS', + SET_EDUCATIONS: 'SET_EDUCATIONS', SET_LOADING_MEMBER_INFO: 'SET_LOADING_MEMBER_INFO', + SET_LOADING_MEMBER_TRAITS: 'SET_LOADING_MEMBER_TRAITS', + SET_PERSONALIZATION: 'SET_PERSONALIZATION', + SET_WORKS: 'SET_WORKS', + UPDATE_MEMBER_PHOTO_URL: 'UPDATE_MEMBER_PHOTO_URL', }, } diff --git a/src/apps/onboarding/src/hooks/useAutoSavePersonalization.ts b/src/apps/onboarding/src/hooks/useAutoSavePersonalization.ts index 77fbe0320..5a807b350 100644 --- a/src/apps/onboarding/src/hooks/useAutoSavePersonalization.ts +++ b/src/apps/onboarding/src/hooks/useAutoSavePersonalization.ts @@ -1,33 +1,29 @@ -/* eslint-disable ordered-imports/ordered-imports */ -/* eslint-disable react/jsx-no-bind */ -/* eslint-disable unicorn/no-null */ -/* eslint-disable sort-keys */ import { Dispatch, MutableRefObject, SetStateAction, useEffect, useState } from 'react' import _ from 'lodash' import PersonalizationInfo from '../models/PersonalizationInfo' export interface useAutoSavePersonalizationType { - personalizationInfo: PersonalizationInfo | null + personalizationInfo: PersonalizationInfo | undefined loading: boolean - setPersonalizationInfo: Dispatch> + setPersonalizationInfo: Dispatch> } type useAutoSavePersonalizationFunctionType = ( - reduxPersonalization: PersonalizationInfo | null, + reduxPersonalization: PersonalizationInfo | undefined, updateMemberPersonalizations: (infos: PersonalizationInfo[]) => void, createMemberPersonalizations: (infos: PersonalizationInfo[]) => void, shouldSavingData: MutableRefObject, ) => useAutoSavePersonalizationType export const useAutoSavePersonalization: useAutoSavePersonalizationFunctionType = ( - reduxPersonalization: PersonalizationInfo | null, + reduxPersonalization: PersonalizationInfo | undefined, updateMemberPersonalizations: (infos: PersonalizationInfo[]) => void, createMemberPersonalizations: (infos: PersonalizationInfo[]) => void, shouldSavingData: MutableRefObject, ) => { const [loading, setLoading] = useState(false) - const [personalizationInfo, setPersonalizationInfo] = useState(null) + const [personalizationInfo, setPersonalizationInfo] = useState(undefined) const saveData: any = async () => { if (!personalizationInfo) { @@ -74,8 +70,8 @@ export const useAutoSavePersonalization: useAutoSavePersonalizationFunctionType }, [loading]) return { + loading, personalizationInfo, setPersonalizationInfo, - loading, } } diff --git a/src/apps/onboarding/src/models/ConnectInfo.ts b/src/apps/onboarding/src/models/ConnectInfo.ts index e7f80beec..3fb5f0db4 100644 --- a/src/apps/onboarding/src/models/ConnectInfo.ts +++ b/src/apps/onboarding/src/models/ConnectInfo.ts @@ -1,4 +1,3 @@ -/* eslint-disable sort-keys */ export default interface ConnectInfo { country: string phoneNumber: string diff --git a/src/apps/onboarding/src/models/EducationInfo.ts b/src/apps/onboarding/src/models/EducationInfo.ts index 5f4b74b6a..172d332b2 100644 --- a/src/apps/onboarding/src/models/EducationInfo.ts +++ b/src/apps/onboarding/src/models/EducationInfo.ts @@ -1,4 +1,3 @@ -/* eslint-disable sort-keys */ export default interface EducationInfo { collegeName: string major: string @@ -10,9 +9,9 @@ export default interface EducationInfo { export const emptyEducationInfo: () => EducationInfo = () => ({ collegeName: '', - major: '', dateDescription: '', - startDate: undefined, endDate: undefined, id: 0, + major: '', + startDate: undefined, }) diff --git a/src/apps/onboarding/src/models/MemberAddress.ts b/src/apps/onboarding/src/models/MemberAddress.ts index 4c5eb8ba4..35d72c860 100644 --- a/src/apps/onboarding/src/models/MemberAddress.ts +++ b/src/apps/onboarding/src/models/MemberAddress.ts @@ -1,4 +1,3 @@ -/* eslint-disable sort-keys */ export default interface MemberAddress { streetAddr1: string streetAddr2: string @@ -8,9 +7,9 @@ export default interface MemberAddress { } export const emptyMemberAddress: () => MemberAddress = () => ({ - streetAddr1: '', - streetAddr2: '', city: '', stateCode: '', + streetAddr1: '', + streetAddr2: '', zip: '', }) diff --git a/src/apps/onboarding/src/models/MemberInfo.ts b/src/apps/onboarding/src/models/MemberInfo.ts index ff524419b..5e623e4ce 100644 --- a/src/apps/onboarding/src/models/MemberInfo.ts +++ b/src/apps/onboarding/src/models/MemberInfo.ts @@ -1,6 +1,6 @@ -/* eslint-disable ordered-imports/ordered-imports */ -import { MemberMaxRating, MemberEmsiSkill } from '~/apps/talent-search/src/lib/models' +import { MemberEmsiSkill, MemberMaxRating } from '~/apps/talent-search/src/lib/models' import { MemberStats } from '~/libs/core' + import MemberAddress from './MemberAddress' export default interface MemberInfo { diff --git a/src/apps/onboarding/src/models/PersonalizationInfo.ts b/src/apps/onboarding/src/models/PersonalizationInfo.ts index c6eeff553..e23a7752f 100644 --- a/src/apps/onboarding/src/models/PersonalizationInfo.ts +++ b/src/apps/onboarding/src/models/PersonalizationInfo.ts @@ -1,4 +1,3 @@ -/* eslint-disable sort-keys */ export default interface PersonalizationInfo { referAs?: string profileSelfTitle?: string @@ -7,8 +6,8 @@ export default interface PersonalizationInfo { } export const emptyPersonalizationInfo: () => PersonalizationInfo = () => ({ - referAs: '', + availableForGigs: true, profileSelfTitle: '', + referAs: '', shortBio: '', - availableForGigs: true, }) diff --git a/src/apps/onboarding/src/models/SelectOption.ts b/src/apps/onboarding/src/models/SelectOption.ts index b1d94d69a..473f70dfd 100644 --- a/src/apps/onboarding/src/models/SelectOption.ts +++ b/src/apps/onboarding/src/models/SelectOption.ts @@ -1,4 +1,3 @@ -/* eslint-disable sort-keys */ export default interface SelectOption { label: string key: string diff --git a/src/apps/onboarding/src/models/WorkInfo.ts b/src/apps/onboarding/src/models/WorkInfo.ts index 709c34cfe..87669e989 100644 --- a/src/apps/onboarding/src/models/WorkInfo.ts +++ b/src/apps/onboarding/src/models/WorkInfo.ts @@ -1,4 +1,3 @@ -/* eslint-disable sort-keys */ export default interface WorkInfo { company?: string position?: string @@ -12,13 +11,13 @@ export default interface WorkInfo { } export const emptyWorkInfo: () => WorkInfo = () => ({ - company: '', - position: '', - industry: '', city: '', - startDate: undefined, + company: '', + currentlyWorking: false, dateDescription: '', endDate: undefined, - currentlyWorking: false, id: 0, + industry: '', + position: '', + startDate: undefined, }) diff --git a/src/apps/onboarding/src/pages/account-details/index.tsx b/src/apps/onboarding/src/pages/account-details/index.tsx index f98e87d9d..7b3fcb2f9 100644 --- a/src/apps/onboarding/src/pages/account-details/index.tsx +++ b/src/apps/onboarding/src/pages/account-details/index.tsx @@ -1,39 +1,34 @@ -/* eslint-disable ordered-imports/ordered-imports */ -/* eslint-disable react/jsx-no-bind */ -/* eslint-disable unicorn/no-null */ -/* eslint-disable sort-keys */ import { useNavigate } from 'react-router-dom' import { connect } from 'react-redux' import { FC, MutableRefObject, useEffect, useRef, useState } from 'react' import _ from 'lodash' import classNames from 'classnames' -import { Button, InputSelect, PageDivider } from '~/libs/ui' +import { Button, IconOutline, InputSelect, PageDivider } from '~/libs/ui' import { getCountryLookup } from '~/libs/core/lib/profile/profile-functions/profile-store/profile-xhr.store' import { EnvironmentConfig } from '~/config' import { Member } from '~/apps/talent-search/src/lib/models' import { ProgressBar } from '../../components/progress-bar' - -import styles from './styles.module.scss' -import InputTextAutoSave from '../../components/InputTextAutoSave' import { validatePhonenumber } from '../../utils/validation' import { createMemberConnectInfos, updateMemberConnectInfos, updateMemberHomeAddresss, } from '../../redux/actions/member' -import MemberAddress, { emptyMemberAddress } from '../../models/MemberAddress' import ConnectInfo, { emptyConnectInfo } from '../../models/ConnectInfo' -import { ReactComponent as IconBackGreen } from '../../assets/images/back-green.svg' +import InputTextAutoSave from '../../components/InputTextAutoSave' +import MemberAddress, { emptyMemberAddress } from '../../models/MemberAddress' + +import styles from './styles.module.scss' const blankMemberAddress: MemberAddress = emptyMemberAddress() const blankConnectInfo: ConnectInfo = emptyConnectInfo() const PageAccountDetailsContent: FC<{ - reduxAddress: MemberAddress | null - reduxConnectInfo: ConnectInfo | null - reduxMemberInfo: Member | null + reduxAddress: MemberAddress | undefined + reduxConnectInfo: ConnectInfo | undefined + reduxMemberInfo: Member | undefined updateMemberConnectInfos: (infos: ConnectInfo[]) => void createMemberConnectInfos: (infos: ConnectInfo[]) => void updateMemberHomeAddresss: (infos: MemberAddress[]) => void @@ -43,8 +38,8 @@ const PageAccountDetailsContent: FC<{ const navigate: any = useNavigate() const [loadingAddress, setLoadingAddress] = useState(false) const [loadingConnectInfo, setLoadingConnectInfo] = useState(false) - const [memberAddress, setMemberAddress] = useState(null) - const [connectInfo, setConnectInfo] = useState(null) + const [memberAddress, setMemberAddress] = useState(undefined) + const [connectInfo, setConnectInfo] = useState(undefined) const [formErrors, setFormErrors] = useState({}) const [countryOptions, setCountryOptions] = useState<{ label: string @@ -153,8 +148,8 @@ const PageAccountDetailsContent: FC<{ if (results) { setCountryOptions(_.sortBy(results, 'country') .map((country: any) => ({ - value: country.country, label: country.country, + value: country.country, }))) } }) @@ -192,7 +187,7 @@ const PageAccountDetailsContent: FC<{ name='streetAddr1' label='Address 1' value={memberAddress?.streetAddr1 || ''} - onChange={event => { + onChange={function (event?: string) { setMemberAddress({ ...(memberAddress || blankMemberAddress), streetAddr1: event || '', @@ -207,7 +202,7 @@ const PageAccountDetailsContent: FC<{ name='streetAddr2' label='Address 2' value={memberAddress?.streetAddr2 || ''} - onChange={event => { + onChange={function (event?: string) { setMemberAddress({ ...(memberAddress || blankMemberAddress), streetAddr2: event || '', @@ -226,7 +221,7 @@ const PageAccountDetailsContent: FC<{ name='city' label='City' value={memberAddress?.city || ''} - onChange={event => { + onChange={function (event?: string) { setMemberAddress({ ...(memberAddress || blankMemberAddress), city: event || '', @@ -245,7 +240,7 @@ const PageAccountDetailsContent: FC<{ name='stateCode' label='State / Province' value={memberAddress?.stateCode || ''} - onChange={event => { + onChange={function (event?: string) { setMemberAddress({ ...(memberAddress || blankMemberAddress), stateCode: event || '', @@ -265,7 +260,7 @@ const PageAccountDetailsContent: FC<{ name='zip' label='Zip / Postal Code' value={memberAddress?.zip || ''} - onChange={event => { + onChange={function (event?: string) { setMemberAddress({ ...(memberAddress || blankMemberAddress), zip: event || '', @@ -282,7 +277,7 @@ const PageAccountDetailsContent: FC<{ { + onChange={function (event: any) { setConnectInfo({ ...(connectInfo || blankConnectInfo), country: event.target.value, @@ -304,7 +299,7 @@ const PageAccountDetailsContent: FC<{ name='phoneNumber' label='Phone Number' value={connectInfo?.phoneNumber || ''} - onChange={event => { + onChange={function (event?: string) { setConnectInfo({ ...(connectInfo || blankConnectInfo), phoneNumber: event || '', @@ -330,9 +325,9 @@ const PageAccountDetailsContent: FC<{ size='lg' secondary iconToLeft - icon={IconBackGreen} + icon={IconOutline.ChevronLeftIcon} disabled={!_.isEmpty(formErrors)} - onClick={() => { + onClick={function onPrevious() { if (loadingAddress || loadingConnectInfo) { shouldNavigateTo.current = '../personalization' } else { @@ -345,7 +340,7 @@ const PageAccountDetailsContent: FC<{ primary iconToLeft disabled={!_.isEmpty(formErrors) || !props.reduxMemberInfo} - onClick={() => { + onClick={function onNext() { if (loadingAddress || loadingConnectInfo) { shouldNavigateTo.current = `${EnvironmentConfig.USER_PROFILE_URL}/${props.reduxMemberInfo?.handle}` @@ -381,9 +376,9 @@ const mapStateToProps: any = (state: any) => { } const mapDispatchToProps: any = { - updateMemberHomeAddresss, - updateMemberConnectInfos, createMemberConnectInfos, + updateMemberConnectInfos, + updateMemberHomeAddresss, } export const PageAccountDetails: any = connect(mapStateToProps, mapDispatchToProps)(PageAccountDetailsContent) diff --git a/src/apps/onboarding/src/pages/educations/index.tsx b/src/apps/onboarding/src/pages/educations/index.tsx index 98eaf54e4..c7a95e45c 100644 --- a/src/apps/onboarding/src/pages/educations/index.tsx +++ b/src/apps/onboarding/src/pages/educations/index.tsx @@ -1,31 +1,28 @@ -/* eslint-disable ordered-imports/ordered-imports */ -/* eslint-disable react/jsx-no-bind */ -/* eslint-disable unicorn/no-null */ import { FC, useEffect, useState } from 'react' import { useNavigate } from 'react-router-dom' -import classNames from 'classnames' -import _ from 'lodash' import { connect } from 'react-redux' +import _ from 'lodash' +import classNames from 'classnames' -import { Button, PageDivider } from '~/libs/ui' +import { Button, IconOutline, PageDivider } from '~/libs/ui' +import { createMemberEducations, updateMemberEducations } from '../../redux/actions/member' import { ProgressBar } from '../../components/progress-bar' -import styles from './styles.module.scss' +import CardItem from '../../components/card-item' import EducationInfo from '../../models/EducationInfo' import ModalAddEducation from '../../components/modal-add-education' -import { updateMemberEducations, createMemberEducations } from '../../redux/actions/member' -import { ReactComponent as IconBackGreen } from '../../assets/images/back-green.svg' -import CardItem from '../../components/card-item' + +import styles from './styles.module.scss' export const PageEducationsContent: FC<{ - reduxEducations: EducationInfo[] | null + reduxEducations: EducationInfo[] | undefined updateMemberEducations: (educations: EducationInfo[]) => void createMemberEducations: (educations: EducationInfo[]) => void loadingMemberTraits: boolean }> = props => { const navigate: any = useNavigate() - const [editingEducation, setEditingEducation] = useState(null) - const [educations, setEducations] = useState(null) + const [editingEducation, setEditingEducation] = useState(undefined) + const [educations, setEducations] = useState(undefined) const [educationId, setEducationId] = useState(10) const [showAddEducationModal, setShowAddEducationModal] = useState(false) const [loading, setLoading] = useState(false) @@ -78,21 +75,25 @@ export const PageEducationsContent: FC<{ title={education.major || ''} subTitle={education.collegeName || ''} description={education.dateDescription || ''} - onEdit={() => { + onEdit={function onEdit() { setEditingEducation(education) setShowAddEducationModal(true) }} - onDelete={() => setEducations(_.filter(educations, w => w.id !== education.id))} + onDelete={function onDelete() { + setEducations(_.filter(educations, w => w.id !== education.id)) + }} /> ))}
- ) : null} + ) : undefined} @@ -127,22 +132,22 @@ export const PageEducationsContent: FC<{ {showAddEducationModal ? ( { + onClose={function onClose() { setShowAddEducationModal(false) - setEditingEducation(null) + setEditingEducation(undefined) }} - onAdd={newEducation => { + onAdd={function onAdd(newEducation: EducationInfo) { setEducations([...(educations || []), { ...newEducation, id: educationId + 1, }]) setEducationId(educationId + 1) }} - onEdit={editEducation => { + onEdit={function onEdit(editEducation: EducationInfo) { setEducations((educations || []).map(w => (w.id !== editEducation.id ? w : editEducation))) }} /> - ) : null} + ) : undefined} ) } diff --git a/src/apps/onboarding/src/pages/onboarding/index.tsx b/src/apps/onboarding/src/pages/onboarding/index.tsx index 7b6319c37..3b61e9d42 100644 --- a/src/apps/onboarding/src/pages/onboarding/index.tsx +++ b/src/apps/onboarding/src/pages/onboarding/index.tsx @@ -1,6 +1,3 @@ -/* eslint-disable ordered-imports/ordered-imports */ -/* eslint-disable react/jsx-no-bind */ -/* eslint-disable unicorn/no-null */ import { FC, useContext, useEffect } from 'react' import { Outlet, Routes } from 'react-router-dom' import { connect, Provider } from 'react-redux' @@ -14,12 +11,13 @@ import { onboardRouteId } from '../../onboarding.routes' import { fetchMemberInfo, fetchMemberTraits } from '../../redux/actions/member' import store from '../../redux/store' import '../../styles/global/_index.scss' + import styles from './styles.module.scss' const OnboardingContent: FC<{ fetchMemberInfo: () => void fetchMemberTraits: () => void - reduxMemberInfo: Member | null + reduxMemberInfo: Member | undefined }> = props => { const { getChildRoutes }: RouterContextData = useContext(routerContext) useEffect(() => { diff --git a/src/apps/onboarding/src/pages/open-to-work/index.tsx b/src/apps/onboarding/src/pages/open-to-work/index.tsx index 20f3cbff3..899e235e3 100644 --- a/src/apps/onboarding/src/pages/open-to-work/index.tsx +++ b/src/apps/onboarding/src/pages/open-to-work/index.tsx @@ -1,28 +1,24 @@ -/* eslint-disable ordered-imports/ordered-imports */ -/* eslint-disable react/jsx-no-bind */ -/* eslint-disable unicorn/no-null */ import { useNavigate } from 'react-router-dom' import { FC, MutableRefObject, useEffect, useMemo, useRef } from 'react' -import classNames from 'classnames' import { connect } from 'react-redux' +import classNames from 'classnames' -import { Button, PageDivider } from '~/libs/ui' +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 styles from './styles.module.scss' -import PersonalizationInfo, { emptyPersonalizationInfo } from '../../models/PersonalizationInfo' -import { createMemberPersonalizations, updateMemberPersonalizations } from '../../redux/actions/member' -import { useAutoSavePersonalization, useAutoSavePersonalizationType } from '../../hooks/useAutoSavePersonalization' -import { ReactComponent as IconBackGreen } from '../../assets/images/back-green.svg' const FormInputCheckboxMiddleware: any = FormInputCheckbox as any const blankPersonalizationInfo: PersonalizationInfo = emptyPersonalizationInfo() export const PageOpenToWorkContent: FC<{ - reduxPersonalization: PersonalizationInfo | null + reduxPersonalization: PersonalizationInfo | undefined updateMemberPersonalizations: (infos: PersonalizationInfo[]) => void createMemberPersonalizations: (infos: PersonalizationInfo[]) => void loadingMemberTraits: boolean @@ -90,7 +86,7 @@ export const PageOpenToWorkContent: FC<{ label='Yes, I’m open to work' checked={availableForGigsValue} inline - onChange={(e: any) => { + onChange={function onChange(e: any) { setPersonalizationInfo({ ...(personalizationInfo || blankPersonalizationInfo), availableForGigs: e.target.checked, @@ -114,8 +110,8 @@ export const PageOpenToWorkContent: FC<{ secondary iconToLeft disabled={loading} - icon={IconBackGreen} - onClick={() => { + icon={IconOutline.ChevronLeftIcon} + onClick={function previousPage() { checkToNavigateNextPage('../skills') }} /> @@ -124,7 +120,7 @@ export const PageOpenToWorkContent: FC<{ primary iconToLeft disabled={loading} - onClick={() => { + onClick={function nextPage() { checkToNavigateNextPage('../works') }} > diff --git a/src/apps/onboarding/src/pages/personalization/index.tsx b/src/apps/onboarding/src/pages/personalization/index.tsx index 9663a016a..b55de90e8 100644 --- a/src/apps/onboarding/src/pages/personalization/index.tsx +++ b/src/apps/onboarding/src/pages/personalization/index.tsx @@ -1,36 +1,32 @@ -/* eslint-disable ordered-imports/ordered-imports */ -/* eslint-disable react/jsx-no-bind */ -/* eslint-disable unicorn/no-null */ -/* eslint-disable sort-keys */ import { useNavigate } from 'react-router-dom' import { connect } from 'react-redux' import { FC, MutableRefObject, useEffect, useRef } from 'react' import classNames from 'classnames' -import { Button, PageDivider } from '~/libs/ui' +import { Button, IconOutline, PageDivider } from '~/libs/ui' import { EnvironmentConfig } from '~/config' +import { useAutoSavePersonalization, useAutoSavePersonalizationType } from '../../hooks/useAutoSavePersonalization' import { ProgressBar } from '../../components/progress-bar' -import styles from './styles.module.scss' -import FieldAvatar from '../../components/FieldAvatar' -import InputTextAutoSave from '../../components/InputTextAutoSave' -import PersonalizationInfo, { emptyPersonalizationInfo } from '../../models/PersonalizationInfo' -import InputTextareaAutoSave from '../../components/InputTextareaAutoSave' import { createMemberPersonalizations, setMemberPhotoUrl, updateMemberPersonalizations, updateMemberPhotoUrl, } from '../../redux/actions/member' +import FieldAvatar from '../../components/FieldAvatar' +import InputTextAutoSave from '../../components/InputTextAutoSave' +import InputTextareaAutoSave from '../../components/InputTextareaAutoSave' import MemberInfo from '../../models/MemberInfo' -import { useAutoSavePersonalization, useAutoSavePersonalizationType } from '../../hooks/useAutoSavePersonalization' -import { ReactComponent as IconBackGreen } from '../../assets/images/back-green.svg' +import PersonalizationInfo, { emptyPersonalizationInfo } from '../../models/PersonalizationInfo' + +import styles from './styles.module.scss' const blankPersonalizationInfo: PersonalizationInfo = emptyPersonalizationInfo() const PagePersonalizationContent: FC<{ memberInfo?: MemberInfo, - reduxPersonalization: PersonalizationInfo | null + reduxPersonalization: PersonalizationInfo | undefined updateMemberPersonalizations: (infos: PersonalizationInfo[]) => void createMemberPersonalizations: (infos: PersonalizationInfo[]) => void setMemberPhotoUrl: (photoUrl: string) => void @@ -81,7 +77,7 @@ const PagePersonalizationContent: FC<{ name='title' label='Bio Title' value={personalizationInfo?.profileSelfTitle || ''} - onChange={value => { + onChange={function onChange(value: string | undefined) { setPersonalizationInfo({ ...(personalizationInfo || blankPersonalizationInfo), profileSelfTitle: value || '', @@ -98,7 +94,7 @@ const PagePersonalizationContent: FC<{ name='shortBio' label='Bio' value={personalizationInfo?.shortBio || ''} - onChange={value => { + onChange={function onChange(value: string | undefined) { setPersonalizationInfo({ ...(personalizationInfo || blankPersonalizationInfo), shortBio: value || '', @@ -121,8 +117,8 @@ const PagePersonalizationContent: FC<{ size='lg' secondary iconToLeft - icon={IconBackGreen} - onClick={() => { + icon={IconOutline.ChevronLeftIcon} + onClick={function previousPage() { if (loading) { shouldNavigateTo.current = '../educations' } else { @@ -134,7 +130,7 @@ const PagePersonalizationContent: FC<{ size='lg' primary iconToLeft - onClick={() => { + onClick={function nextPage() { if (loading) { shouldNavigateTo.current = `${EnvironmentConfig.USER_PROFILE_URL}/${props.memberInfo?.handle}` @@ -159,16 +155,16 @@ const mapStateToProps: any = (state: any) => { }: any = state.member return { - memberInfo, loadingMemberTraits, + memberInfo, reduxPersonalization: personalization, } } const mapDispatchToProps: any = { createMemberPersonalizations, - updateMemberPersonalizations, setMemberPhotoUrl, + updateMemberPersonalizations, updateMemberPhotoUrl, } diff --git a/src/apps/onboarding/src/pages/skills/index.tsx b/src/apps/onboarding/src/pages/skills/index.tsx index cfda82bc2..8d931d7b3 100644 --- a/src/apps/onboarding/src/pages/skills/index.tsx +++ b/src/apps/onboarding/src/pages/skills/index.tsx @@ -1,10 +1,7 @@ -/* eslint-disable ordered-imports/ordered-imports */ -/* eslint-disable react/jsx-no-bind */ -/* eslint-disable unicorn/no-null */ import { useNavigate } from 'react-router-dom' import { FC, useState } from 'react' -import classNames from 'classnames' import { connect } from 'react-redux' +import classNames from 'classnames' import { Button, PageDivider } from '~/libs/ui' import { Member } from '~/apps/talent-search/src/lib/models' @@ -15,13 +12,13 @@ import { ProgressBar } from '../../components/progress-bar' import styles from './styles.module.scss' export const PageSkillsContent: FC<{ - reduxMemberInfo: Member | null + reduxMemberInfo: Member | undefined }> = props => { const navigate: any = useNavigate() const [loading, setLoading] = useState(false) const { formInput: emsiFormInput, saveSkills: saveEmsiSkills }: MemberSkillEditor = useMemberSkillEditor() - const saveSkills = async (): Promise => { + async function saveSkills(): Promise { setLoading(true) try { await saveEmsiSkills() diff --git a/src/apps/onboarding/src/pages/start/index.tsx b/src/apps/onboarding/src/pages/start/index.tsx index 1c6043e02..6ab589cca 100644 --- a/src/apps/onboarding/src/pages/start/index.tsx +++ b/src/apps/onboarding/src/pages/start/index.tsx @@ -1,10 +1,11 @@ -/* eslint-disable ordered-imports/ordered-imports */ -/* eslint-disable react/jsx-no-bind */ import { FC } from 'react' -import { Button, PageDivider } from '~/libs/ui' import { useNavigate } from 'react-router-dom' import classNames from 'classnames' + +import { Button, PageDivider } from '~/libs/ui' + import { ProgressBar } from '../../components/progress-bar' + import styles from './styles.module.scss' export const PageStart: FC<{}> = () => { @@ -44,7 +45,9 @@ export const PageStart: FC<{}> = () => { size='lg' secondary iconToLeft - onClick={() => navigate('../skills')} + onClick={function nextPage() { + navigate('../skills') + }} > enter my info @@ -64,7 +67,9 @@ export const PageStart: FC<{}> = () => { size='lg' primary iconToLeft - onClick={() => navigate('../skills')} + onClick={function nextPage() { + navigate('../skills') + }} > next diff --git a/src/apps/onboarding/src/pages/works/index.tsx b/src/apps/onboarding/src/pages/works/index.tsx index 2cb5cb950..7c2ffd213 100644 --- a/src/apps/onboarding/src/pages/works/index.tsx +++ b/src/apps/onboarding/src/pages/works/index.tsx @@ -1,31 +1,28 @@ -/* eslint-disable ordered-imports/ordered-imports */ -/* eslint-disable react/jsx-no-bind */ -/* eslint-disable unicorn/no-null */ import { FC, useEffect, useState } from 'react' import { connect } from 'react-redux' import { useNavigate } from 'react-router-dom' -import classNames from 'classnames' import _ from 'lodash' +import classNames from 'classnames' -import { Button, PageDivider } from '~/libs/ui' +import { Button, IconOutline, PageDivider } from '~/libs/ui' -import { ProgressBar } from '../../components/progress-bar' -import styles from './styles.module.scss' -import WorkInfo from '../../models/WorkInfo' -import ModalAddWork from '../../components/modal-add-work' -import { ReactComponent as IconBackGreen } from '../../assets/images/back-green.svg' import { createMemberWorks, updateMemberWorks } from '../../redux/actions/member' +import { ProgressBar } from '../../components/progress-bar' import CardItem from '../../components/card-item' +import ModalAddWork from '../../components/modal-add-work' +import WorkInfo from '../../models/WorkInfo' + +import styles from './styles.module.scss' export const PageWorksContent: FC<{ - reduxWorks: WorkInfo[] | null + reduxWorks: WorkInfo[] | undefined updateMemberWorks: (works: WorkInfo[]) => void createMemberWorks: (works: WorkInfo[]) => void loadingMemberTraits: boolean }> = props => { const navigate: any = useNavigate() - const [editingWork, setEditingWork] = useState(null) - const [works, setWorks] = useState(null) + const [editingWork, setEditingWork] = useState(undefined) + const [works, setWorks] = useState(undefined) const [workId, setWorkId] = useState(10) const [showAddWorkModal, setShowAddWorkModal] = useState(false) const [loading, setLoading] = useState(false) @@ -79,21 +76,25 @@ export const PageWorksContent: FC<{ title={work.position || ''} subTitle={work.city || ''} description={work.dateDescription || ''} - onEdit={() => { + onEdit={function onEdit() { setEditingWork(work) setShowAddWorkModal(true) }} - onDelete={() => setWorks(_.filter(works, w => w.id !== work.id))} + onDelete={function onDelete() { + setWorks(_.filter(works, w => w.id !== work.id)) + }} /> ))} - ) : null} + ) : undefined} @@ -130,24 +135,24 @@ export const PageWorksContent: FC<{ {showAddWorkModal ? ( { + onClose={function onClose() { setShowAddWorkModal(false) - setEditingWork(null) + setEditingWork(undefined) }} - onAdd={newWork => { + onAdd={function onAdd(newWork: WorkInfo) { setWorks([...(works || []), { ...newWork, id: workId + 1, }]) setWorkId(workId + 1) }} - onEdit={editWork => { + onEdit={function onEdit(editWork: WorkInfo) { setWorks( (works || []).map(w => (w.id !== editWork.id ? w : editWork)), ) }} /> - ) : null} + ) : undefined} ) } diff --git a/src/apps/onboarding/src/redux/actions/member.ts b/src/apps/onboarding/src/redux/actions/member.ts index 61077b5c7..2965a59d0 100644 --- a/src/apps/onboarding/src/redux/actions/member.ts +++ b/src/apps/onboarding/src/redux/actions/member.ts @@ -1,12 +1,8 @@ -/* eslint-disable ordered-imports/ordered-imports */ -/* eslint-disable react/jsx-no-bind */ -/* eslint-disable sort-keys */ -/* eslint-disable unicorn/no-null */ -import moment from 'moment' import _ from 'lodash' +import moment from 'moment' -import { getAsync as getAsyncToken } from '~/libs/core/lib/auth/token-functions/token.functions' import { TokenModel } from '~/libs/core' +import { getAsync as getAsyncToken } from '~/libs/core/lib/auth/token-functions/token.functions' import { createMemberTraits, updateMemberTraits, @@ -14,55 +10,55 @@ import { import { ACTIONS } from '../../config' import { getMemberInfo, getMemberTraits, putMemberInfo } from '../../services/members' -import WorkInfo from '../../models/WorkInfo' +import ConnectInfo from '../../models/ConnectInfo' import EducationInfo from '../../models/EducationInfo' -import PersonalizationInfo from '../../models/PersonalizationInfo' import MemberAddress from '../../models/MemberAddress' import MemberInfo from '../../models/MemberInfo' -import ConnectInfo from '../../models/ConnectInfo' +import PersonalizationInfo from '../../models/PersonalizationInfo' +import WorkInfo from '../../models/WorkInfo' export const updateMemberInfo: any = (memberInfo: MemberInfo) => ({ - type: ACTIONS.MEMBER.GET_MEMBER, payload: memberInfo, + type: ACTIONS.MEMBER.GET_MEMBER, }) export const updateWorks: any = (works: WorkInfo[]) => ({ - type: ACTIONS.MEMBER.SET_WORKS, payload: works, + type: ACTIONS.MEMBER.SET_WORKS, }) export const updateEducations: any = (educations: EducationInfo[]) => ({ - type: ACTIONS.MEMBER.SET_EDUCATIONS, payload: educations, + type: ACTIONS.MEMBER.SET_EDUCATIONS, }) export const updatePersonalization: any = (personalization: PersonalizationInfo) => ({ - type: ACTIONS.MEMBER.SET_PERSONALIZATION, payload: personalization, + type: ACTIONS.MEMBER.SET_PERSONALIZATION, }) export const updateConnectInfo: any = (connectInfo: ConnectInfo) => ({ - type: ACTIONS.MEMBER.SET_CONNECT_INFO, payload: connectInfo, + type: ACTIONS.MEMBER.SET_CONNECT_INFO, }) export const updateAddress: any = (address: MemberAddress) => ({ - type: ACTIONS.MEMBER.SET_ADDRESS, payload: address, + type: ACTIONS.MEMBER.SET_ADDRESS, }) export const updateLoadingMemberTraits: any = (loading: boolean) => ({ - type: ACTIONS.MEMBER.SET_LOADING_MEMBER_TRAITS, payload: loading, + type: ACTIONS.MEMBER.SET_LOADING_MEMBER_TRAITS, }) export const updateLoadingMemberInfo: any = (loading: boolean) => ({ - type: ACTIONS.MEMBER.SET_LOADING_MEMBER_INFO, payload: loading, + type: ACTIONS.MEMBER.SET_LOADING_MEMBER_INFO, }) export const fetchMemberInfo: any = () => async (dispatch: any) => { let tokenInfo: TokenModel - let memberInfo: MemberInfo | null = null + let memberInfo: MemberInfo | undefined dispatch(updateLoadingMemberInfo(true)) try { tokenInfo = await getAsyncToken() @@ -77,10 +73,10 @@ export const fetchMemberInfo: any = () => async (dispatch: any) => { if (memberInfo.addresses) { const addresses: MemberAddress[] = memberInfo.addresses.map(address => ({ ...address, - streetAddr1: address.streetAddr1, - streetAddr2: address.streetAddr2, city: address.city, stateCode: address.stateCode, + streetAddr1: address.streetAddr1, + streetAddr2: address.streetAddr2, zip: address.zip, })) const matchAddress: MemberAddress = _.find(addresses, { type: 'HOME' }) as MemberAddress @@ -126,15 +122,15 @@ export const fetchMemberTraits: any = () => async (dispatch: any) => { startDate || endDate ) ? `${startDateString}${endDateString}` : '' return ({ - company: j.company, - position: j.position, - industry: j.industry, city: j.cityTown, - startDate, - endDate, + company: j.company, currentlyWorking: j.working, dateDescription, + endDate, id: index + 1, + industry: j.industry, + position: j.position, + startDate, }) }) dispatch(updateWorks(works)) @@ -163,11 +159,11 @@ export const fetchMemberTraits: any = () => async (dispatch: any) => { ) ? `${startDateString}${endDateString}` : '' return ({ collegeName: e.schoolCollegeName, - major: e.major, - startDate, - endDate, dateDescription, + endDate, id: index + 1, + major: e.major, + startDate, }) }) dispatch(updateEducations(educations)) @@ -180,10 +176,10 @@ export const fetchMemberTraits: any = () => async (dispatch: any) => { if (personalizationExpValue) { const personalizations: PersonalizationInfo[] = personalizationExpValue.map((e: any) => ({ ...e, - referAs: e.referAs, + availableForGigs: e.availableForGigs, profileSelfTitle: e.profileSelfTitle, + referAs: e.referAs, shortBio: e.shortBio, - availableForGigs: e.availableForGigs, })) dispatch(updatePersonalization(personalizations[0])) } @@ -214,10 +210,10 @@ const createWorksPayloadData: any = (works: WorkInfo[]) => { currentlyWorking, }: any = work return { + cityTown: city, company, industry, position, - cityTown: city, timePeriodFrom: startDate ? startDate.toISOString() : '', timePeriodTo: endDate ? endDate.toISOString() : '', working: currentlyWorking, @@ -269,8 +265,8 @@ const createEducationsPayloadData: any = (educations: EducationInfo[]) => { endDate, }: any = education return { - schoolCollegeName: collegeName, major, + schoolCollegeName: collegeName, timePeriodFrom: startDate ? startDate.toISOString() : '', timePeriodTo: endDate ? endDate.toISOString() : '', } @@ -322,10 +318,10 @@ const createPersonalizationsPayloadData: any = (personalizations: Personalizatio }: any = personalization return { ...personalization, - referAs, + availableForGigs, profileSelfTitle, + referAs, shortBio, - availableForGigs, } }) @@ -415,8 +411,8 @@ export const createMemberConnectInfos: any = (connectInfos: ConnectInfo[]) => as } export const setMemberPhotoUrl: any = (photoUrl: string) => ({ - type: ACTIONS.MEMBER.UPDATE_MEMBER_PHOTO_URL, payload: photoUrl, + type: ACTIONS.MEMBER.UPDATE_MEMBER_PHOTO_URL, }) export const updateMemberHomeAddresss: any = (addresses: MemberAddress[]) => async (dispatch: any) => { @@ -425,12 +421,12 @@ export const updateMemberHomeAddresss: any = (addresses: MemberAddress[]) => asy await putMemberInfo(tokenInfo.handle || '', { addresses: addresses.map(address => ({ ...address, - streetAddr1: address.streetAddr1, - streetAddr2: address.streetAddr2, city: address.city, stateCode: address.stateCode, - zip: address.zip, + streetAddr1: address.streetAddr1, + streetAddr2: address.streetAddr2, type: 'HOME', + zip: address.zip, })), }) dispatch(updateAddress(addresses[0])) diff --git a/src/apps/onboarding/src/redux/reducers/member.ts b/src/apps/onboarding/src/redux/reducers/member.ts index 2cb28dc3f..630389a23 100644 --- a/src/apps/onboarding/src/redux/reducers/member.ts +++ b/src/apps/onboarding/src/redux/reducers/member.ts @@ -1,13 +1,11 @@ -/* eslint-disable ordered-imports/ordered-imports */ -/* eslint-disable react/jsx-no-bind */ -/* eslint-disable default-param-last */ import { Member } from '~/apps/talent-search/src/lib/models' + import { ACTIONS } from '../../config' -import WorkInfo from '../../models/WorkInfo' +import ConnectInfo from '../../models/ConnectInfo' import EducationInfo from '../../models/EducationInfo' -import PersonalizationInfo from '../../models/PersonalizationInfo' import MemberAddress from '../../models/MemberAddress' -import ConnectInfo from '../../models/ConnectInfo' +import PersonalizationInfo from '../../models/PersonalizationInfo' +import WorkInfo from '../../models/WorkInfo' const initialState: { memberInfo?: Member @@ -21,7 +19,13 @@ const initialState: { } = { } -const memberReducer: any = (state = initialState, action: { type: any; payload: any; }) => { +const memberReducer: any = ( + state = initialState, + action: { type: any; payload: any; } = { + payload: undefined, + type: '', + }, +) => { switch (action.type) { case ACTIONS.MEMBER.GET_MEMBER: return { diff --git a/src/apps/onboarding/src/redux/store.ts b/src/apps/onboarding/src/redux/store.ts index d87a843fb..742c7b3e7 100644 --- a/src/apps/onboarding/src/redux/store.ts +++ b/src/apps/onboarding/src/redux/store.ts @@ -1,13 +1,10 @@ -/* eslint-disable ordered-imports/ordered-imports */ -/* eslint-disable react/jsx-no-bind */ -/* eslint-disable global-require */ -/* eslint-disable @typescript-eslint/no-var-requires */ /** * Configure Redux Store */ import { applyMiddleware, compose, createStore } from 'redux' import { createPromise } from 'redux-promise-middleware' import thunk from 'redux-thunk' + import rootReducer from './reducers' const middlewares: any = [ @@ -20,6 +17,7 @@ const middlewares: any = [ // enable Redux Logger in in DEV environment if (process.env.APPMODE !== 'production') { + /* eslint-disable-next-line global-require, @typescript-eslint/no-var-requires */ const { createLogger }: any = require('redux-logger') const logger: any = createLogger() diff --git a/src/apps/onboarding/src/services/members.ts b/src/apps/onboarding/src/services/members.ts index 8c3bf26b1..74356b83a 100644 --- a/src/apps/onboarding/src/services/members.ts +++ b/src/apps/onboarding/src/services/members.ts @@ -1,6 +1,6 @@ -/* eslint-disable ordered-imports/ordered-imports */ import { getAsync, putAsync } from '~/libs/core/lib/xhr/xhr-functions/xhr.functions' import { profile } from '~/libs/core/lib/profile/profile-functions/profile-store/profile-endpoint.config' + import MemberInfo from '../models/MemberInfo' export async function getMemberInfo(handle: string): Promise {