Merge pull request #704 from topcoder-platform/profiles-app

Profiles app -> dev

Author: kkartunov

src/apps/profiles/src/member-profile/about-me/ModifyAboutMeModal/ModifyAboutMeModal.module.scss

@@ -12,4 +12,8 @@
 
 .editForm {
     margin-top: $sp-4;
+
+    :global(.input-wrapper) {
+        margin-bottom: $sp-4;
+    }
 }

src/apps/profiles/src/member-profile/education-and-certifications/ModifyEducationModal/ModifyEducationModal.tsx

@@ -258,7 +258,7 @@ const ModifyEducationModal: FC<ModifyEducationModalProps> = (props: ModifyEducat
                         disabled={false}
                         error={formErrors.endDate}
                         dirty
-                        maxDate={new Date()}
+                        showMonthPicker={false}
                         showYearPicker
                         dateFormat='yyyy'
                     />

src/apps/profiles/src/member-profile/profile-header/ModifyMemberPhotoModal/ModifyMemberPhotoModal.tsx

@@ -21,8 +21,8 @@ const ModifyMemberPhotoModal: FC<ModifyMemberPhotoModalProps> = (props: ModifyMe
 
     const fileElRef: MutableRefObject<HTMLDivElement | any> = useRef()
 
-    const [fileSizeError, setFileSizeError]: [boolean, Dispatch<SetStateAction<boolean>>]
-        = useState<boolean>(false)
+    const [fileSelectError, setFileSelectError]: [string | undefined, Dispatch<SetStateAction<string | undefined>>]
+        = useState<string | undefined>()
 
     function handleModifyPhotoSave(): void {
         const formData: FormData = new FormData()
@@ -53,14 +53,19 @@ const ModifyMemberPhotoModal: FC<ModifyMemberPhotoModalProps> = (props: ModifyMe
 
         if (pickedFile) {
             if (pickedFile?.size < 2000000) { // max 2mb limit
+                if (pickedFile.type !== 'image/png' && pickedFile.type !== 'image/jpeg') {
+                    setFileSelectError('Please select a PNG or JPG image.')
+                    return
+                }
+
                 setFile(pickedFile)
-                setFileSizeError(false)
+                setFileSelectError(undefined)
             } else {
-                setFileSizeError(true)
+                setFileSelectError('Please select an image that is less than 2MB.')
             }
         } else {
             setFile(undefined)
-            setFileSizeError(false)
+            setFileSelectError(undefined)
         }
     }
 
@@ -105,8 +110,8 @@ const ModifyMemberPhotoModal: FC<ModifyMemberPhotoModalProps> = (props: ModifyMe
                         onClick={handleFilePickClick}
                     />
                     {
-                        fileSizeError && (
-                            <p>Please select an image that is less than 2MB.</p>
+                        fileSelectError && (
+                            <p>{fileSelectError}</p>
                         )
                     }
                 </form>

src/apps/profiles/src/member-profile/work-expirence/WorkExpirenceCard/WorkExpirenceCard.tsx

@@ -27,14 +27,14 @@ const WorkExpirenceCard: FC<WorkExpirenceCardProps> = (props: WorkExpirenceCardP
                 </p>
             </div>
             {
-                props.work.timePeriodFrom || props.work.timePeriodTo ? (
+                props.work.timePeriodFrom || props.work.timePeriodTo || props.work.working ? (
                     <div className={styles.workExpirenceCardHeaderRight}>
                         <p>
                             {props.work.timePeriodFrom ? moment(props.work.timePeriodFrom)
                                 .format('MM/YYYY') : ''}
-                            {props.work.timePeriodTo || props.work.currentlyWorking ? ' - ' : ''}
+                            {props.work.timePeriodFrom && (props.work.timePeriodTo || props.work.working) ? ' - ' : ''}
                             {props.work.timePeriodTo ? moment(props.work.timePeriodTo)
-                                .format('MM/YYYY') : (props.work.currentlyWorking ? 'Present' : '')}
+                                .format('MM/YYYY') : (props.work.working ? 'Present' : '')}
                         </p>
                     </div>
                 ) : undefined

src/apps/profiles/src/profiles.routes.tsx

@@ -18,6 +18,7 @@ export const profilesRoutes: ReadonlyArray<PlatformRoute> = [
     {
         children: [
             {
+                authRequired: true,
                 element: <ProfilesLandingPage />,
                 id: 'ProfilesLandingPage',
                 route: '',

src/libs/ui/lib/components/form/form-groups/form-input/input-date-picker/InputDatePicker.tsx

@@ -27,6 +27,7 @@ interface InputDatePickerProps {
     readonly minDate?: Date | null | undefined;
     readonly minTime?: Date | undefined;
     readonly placeholder?: string
+    readonly showMonthPicker?: boolean
     readonly showYearPicker?: boolean
     readonly tabIndex?: number
 }
@@ -63,16 +64,20 @@ const InputDatePicker: FC<InputDatePickerProps> = (props: InputDatePickerProps)
                     <IconOutline.ArrowCircleLeftIcon />
                 </button>
 
-                <select
-                    value={months[getMonth(date)]}
-                    onChange={({ target: { value } }: any) => changeMonth(months.indexOf(value))}
-                >
-                    {months.map(option => (
-                        <option key={option} value={option}>
-                            {option}
-                        </option>
-                    ))}
-                </select>
+                {
+                    props.showMonthPicker !== false && (
+                        <select
+                            value={months[getMonth(date)]}
+                            onChange={({ target: { value } }: any) => changeMonth(months.indexOf(value))}
+                        >
+                            {months.map(option => (
+                                <option key={option} value={option}>
+                                    {option}
+                                </option>
+                            ))}
+                        </select>
+                    )
+                }
 
                 <select
                     value={getYear(date)}