From 73f8580ff691536d84a22de7a84866b46b78f184 Mon Sep 17 00:00:00 2001 From: Vasilica Olariu Date: Thu, 5 Mar 2026 12:09:32 +0200 Subject: [PATCH 1/2] PM-4182 #time 1h tweaks for open to work status --- .../src/pages/open-to-work/index.tsx | 2 +- .../OpenForGigs/OpenForGigs.tsx | 17 ++++++-- .../OpenForGigsModifyModal.tsx | 10 ++--- .../profile-header/ProfileHeader.tsx | 8 +++- .../lib/profile/modify-user-profile.model.ts | 2 +- .../ModifyOpenToWorkModal.module.scss | 13 ++++++ .../ModifyOpenToWorkModal.tsx | 42 ++++++++++++------- 7 files changed, 67 insertions(+), 27 deletions(-) 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 e528028dd..224721b30 100644 --- a/src/apps/onboarding/src/pages/open-to-work/index.tsx +++ b/src/apps/onboarding/src/pages/open-to-work/index.tsx @@ -116,7 +116,7 @@ export const PageOpenToWorkContent: FC = props => { try { const [, updatedTraits] = await Promise.all([ // profile flag - props.updateMemberOpenForWork(formValue.availableForGigs), + props.updateMemberOpenForWork(!!formValue.availableForGigs), // personalization trait updateOrCreateMemberTraitsAsync(props.profileHandle, [{ diff --git a/src/apps/profiles/src/member-profile/profile-header/OpenForGigs/OpenForGigs.tsx b/src/apps/profiles/src/member-profile/profile-header/OpenForGigs/OpenForGigs.tsx index be8e00dc5..0f1cf0b41 100644 --- a/src/apps/profiles/src/member-profile/profile-header/OpenForGigs/OpenForGigs.tsx +++ b/src/apps/profiles/src/member-profile/profile-header/OpenForGigs/OpenForGigs.tsx @@ -12,6 +12,7 @@ import styles from './OpenForGigs.module.scss' interface OpenForGigsProps { canEdit: boolean + isOpenToWork: boolean | null authProfile: UserProfile | undefined profile: UserProfile refreshProfile: (handle: string) => void @@ -27,7 +28,7 @@ const OpenForGigs: FC = (props: OpenForGigsProps) => { const [isEditMode, setIsEditMode]: [boolean, Dispatch>] = useState(false) - const openForWork = props.profile.availableForGigs + const openForWork = props.isOpenToWork useEffect(() => { if (props.authProfile && editMode === profileEditModes.openForWork) { @@ -53,9 +54,16 @@ const OpenForGigs: FC = (props: OpenForGigsProps) => { return props.canEdit || openForWork || props.isPrivilegedViewer ? (
-

- {openForWork ? 'open to work' : 'not open to work'} -

+ {openForWork === null ? ( +

+ Unknown +

+ ): ( +

+ {openForWork ? 'open to work' : 'not open to work'} +

+ )} + { props.canEdit && ( = (props: OpenForGigsProps) => { onClose={handleModifyOpenForWorkClose} onSave={handleModifyOpenForWorkSave} profile={props.profile} + openForWork={openForWork} memberPersonalizationTraits={props.memberPersonalizationTraits} mutatePersonalizationTraits={props.mutatePersonalizationTraits} /> diff --git a/src/apps/profiles/src/member-profile/profile-header/OpenForGigsModifyModal/OpenForGigsModifyModal.tsx b/src/apps/profiles/src/member-profile/profile-header/OpenForGigsModifyModal/OpenForGigsModifyModal.tsx index 3770ca2e8..be65bbbfb 100644 --- a/src/apps/profiles/src/member-profile/profile-header/OpenForGigsModifyModal/OpenForGigsModifyModal.tsx +++ b/src/apps/profiles/src/member-profile/profile-header/OpenForGigsModifyModal/OpenForGigsModifyModal.tsx @@ -22,6 +22,7 @@ interface OpenForGigsModifyModalProps { onClose: () => void onSave: () => void profile: UserProfile + openForWork: boolean | null memberPersonalizationTraits?: UserTrait[] mutatePersonalizationTraits: () => void } @@ -34,7 +35,7 @@ const OpenForGigsModifyModal: FC = (props: OpenForG const [formValue, setFormValue] = useState({ availability: undefined, - availableForGigs: !!props.profile.availableForGigs, + availableForGigs: props.openForWork, preferredRoles: [], }) @@ -56,12 +57,12 @@ const OpenForGigsModifyModal: FC = (props: OpenForG setFormValue(prev => ({ ...prev, availability: openToWorkItem?.availability, - availableForGigs: !!props.profile.availableForGigs, + availableForGigs: props.openForWork, preferredRoles: openToWorkItem?.preferredRoles ?? [], })) }, [ memberPersonalizationTraits, - props.profile.availableForGigs, + props.openForWork, ]) function handleFormChange(nextValue: OpenToWorkData): void { @@ -152,8 +153,7 @@ const OpenForGigsModifyModal: FC = (props: OpenForG >

- By selecting “Open to Work” our talent management team will know - that you are available for engagement opportunities. + By selecting “Open to Work” our customers will know that you are available for engagement opportunities.

diff --git a/src/apps/profiles/src/member-profile/profile-header/ProfileHeader.tsx b/src/apps/profiles/src/member-profile/profile-header/ProfileHeader.tsx index 2c1bc1cb0..3ef72293a 100644 --- a/src/apps/profiles/src/member-profile/profile-header/ProfileHeader.tsx +++ b/src/apps/profiles/src/member-profile/profile-header/ProfileHeader.tsx @@ -7,6 +7,7 @@ import moment from 'moment' import { NamesAndHandleAppearance, useMemberTraits, + useProfileCompleteness, UserProfile, UserRole, UserTrait, @@ -70,7 +71,7 @@ const ProfileHeader: FC = (props: ProfileHeaderProps) => { [state?.queriedSkills], ) - const activeTooltipText = canEdit ? `You have been active in the past 3 months. + const activeTooltipText = canEdit ? `You have been active in the past 3 months. (this information is visible to you only)` : `${props.profile.firstName} has been active in the past 3 months.` useEffect(() => { @@ -146,13 +147,15 @@ const ProfileHeader: FC = (props: ProfileHeaderProps) => { (item: UserTrait) => !!item?.openToWork, ) + const isOpenToWork = hasOpenToWork ? props.profile.availableForGigs : null + function renderOpenForWork(): JSX.Element { const showMyStatusLabel = canEdit const showAdminLabel = isPrivilegedViewer const content = (
- {showMyStatusLabel && My status:} + {showMyStatusLabel && Engagement status:} {showAdminLabel && ( @@ -169,6 +172,7 @@ const ProfileHeader: FC = (props: ProfileHeaderProps) => { isPrivilegedViewer={isPrivilegedViewer} memberPersonalizationTraits={memberPersonalizationTraits} mutatePersonalizationTraits={mutateTraits} + isOpenToWork={isOpenToWork} />
) diff --git a/src/libs/core/lib/profile/modify-user-profile.model.ts b/src/libs/core/lib/profile/modify-user-profile.model.ts index bd3aef1e5..508fffa65 100644 --- a/src/libs/core/lib/profile/modify-user-profile.model.ts +++ b/src/libs/core/lib/profile/modify-user-profile.model.ts @@ -8,7 +8,7 @@ export interface UpdateProfileRequest { streetAddr2?: string zip?: string }> - availableForGigs?: boolean, + availableForGigs?: boolean | null, competitionCountryCode?: string homeCountryCode?: string email?: string diff --git a/src/libs/shared/lib/components/modify-open-to-work-modal/ModifyOpenToWorkModal.module.scss b/src/libs/shared/lib/components/modify-open-to-work-modal/ModifyOpenToWorkModal.module.scss index 1fc86080e..f49ecfd84 100644 --- a/src/libs/shared/lib/components/modify-open-to-work-modal/ModifyOpenToWorkModal.module.scss +++ b/src/libs/shared/lib/components/modify-open-to-work-modal/ModifyOpenToWorkModal.module.scss @@ -22,3 +22,16 @@ } } } + +.radioGroup { + display: flex; + margin-bottom: $sp-6; + > * { + flex: 1; + } + + @include ltemd { + flex-direction: column; + gap: $sp-4; + } +} diff --git a/src/libs/shared/lib/components/modify-open-to-work-modal/ModifyOpenToWorkModal.tsx b/src/libs/shared/lib/components/modify-open-to-work-modal/ModifyOpenToWorkModal.tsx index 3c07480a0..cf109f6fa 100644 --- a/src/libs/shared/lib/components/modify-open-to-work-modal/ModifyOpenToWorkModal.tsx +++ b/src/libs/shared/lib/components/modify-open-to-work-modal/ModifyOpenToWorkModal.tsx @@ -1,13 +1,13 @@ import { ChangeEvent, FC, useCallback } from 'react' -import { InputMultiselect, InputMultiselectOption, InputSelect, InputText } from '~/libs/ui' +import { InputMultiselect, InputMultiselectOption, InputRadio, InputSelect } from '~/libs/ui' import styles from './ModifyOpenToWorkModal.module.scss' export type AvailabilityType = 'FULL_TIME' | 'PART_TIME' export interface OpenToWorkData { - availableForGigs: boolean + availableForGigs: boolean | null availability?: AvailabilityType preferredRoles?: string[] } @@ -57,10 +57,12 @@ export const validateOpenToWork = (value: OpenToWorkData): { [key: string]: stri } const OpenToWorkForm: FC = (props: OpenToWorkFormProps) => { - function toggleOpenForWork(): void { + function handleOpenForWorkChange(e: ChangeEvent): void { + const openForWork = e.target.value === 'true' + props.onChange({ ...props.value, - availableForGigs: !props.value.availableForGigs, + availableForGigs: openForWork, }) } @@ -96,20 +98,32 @@ const OpenToWorkForm: FC = (props: OpenToWorkFormProps) => return (
- +
+ + +
{props.value.availableForGigs && ( <> = (props: OpenToWorkFormProps) => Date: Thu, 5 Mar 2026 12:42:02 +0200 Subject: [PATCH 2/2] lint fix --- .../member-profile/profile-header/OpenForGigs/OpenForGigs.tsx | 2 +- .../OpenForGigsModifyModal/OpenForGigsModifyModal.tsx | 3 ++- .../src/member-profile/profile-header/ProfileHeader.tsx | 2 +- 3 files changed, 4 insertions(+), 3 deletions(-) diff --git a/src/apps/profiles/src/member-profile/profile-header/OpenForGigs/OpenForGigs.tsx b/src/apps/profiles/src/member-profile/profile-header/OpenForGigs/OpenForGigs.tsx index 0f1cf0b41..7e7db2ecc 100644 --- a/src/apps/profiles/src/member-profile/profile-header/OpenForGigs/OpenForGigs.tsx +++ b/src/apps/profiles/src/member-profile/profile-header/OpenForGigs/OpenForGigs.tsx @@ -58,7 +58,7 @@ const OpenForGigs: FC = (props: OpenForGigsProps) => {

Unknown

- ): ( + ) : (

{openForWork ? 'open to work' : 'not open to work'}

diff --git a/src/apps/profiles/src/member-profile/profile-header/OpenForGigsModifyModal/OpenForGigsModifyModal.tsx b/src/apps/profiles/src/member-profile/profile-header/OpenForGigsModifyModal/OpenForGigsModifyModal.tsx index be65bbbfb..5d56b5030 100644 --- a/src/apps/profiles/src/member-profile/profile-header/OpenForGigsModifyModal/OpenForGigsModifyModal.tsx +++ b/src/apps/profiles/src/member-profile/profile-header/OpenForGigsModifyModal/OpenForGigsModifyModal.tsx @@ -153,7 +153,8 @@ const OpenForGigsModifyModal: FC = (props: OpenForG >

- By selecting “Open to Work” our customers will know that you are available for engagement opportunities. + By selecting “Open to Work” our customers will know that + you are available for engagement opportunities.

diff --git a/src/apps/profiles/src/member-profile/profile-header/ProfileHeader.tsx b/src/apps/profiles/src/member-profile/profile-header/ProfileHeader.tsx index 3ef72293a..62b721b65 100644 --- a/src/apps/profiles/src/member-profile/profile-header/ProfileHeader.tsx +++ b/src/apps/profiles/src/member-profile/profile-header/ProfileHeader.tsx @@ -1,4 +1,5 @@ /* eslint-disable complexity */ +/* eslint-disable unicorn/no-null */ import { Dispatch, FC, SetStateAction, useEffect, useMemo, useState } from 'react' import { Location, useLocation, useSearchParams } from 'react-router-dom' import { KeyedMutator } from 'swr' @@ -7,7 +8,6 @@ import moment from 'moment' import { NamesAndHandleAppearance, useMemberTraits, - useProfileCompleteness, UserProfile, UserRole, UserTrait,