fix(tp/con): misc fixes

apps/redi-connect/src/components/organisms/DeclineMentorshipButton.tsx

@@ -93,7 +93,9 @@ const DeclineMentorshipButton = ({
               name="ifDeclinedByMentor_chosenReasonForDecline"
               label=""
               items={formDeclineOptions}
-              {...formik}
+              menuPortalTarget={document.body}
+              menuPosition="fixed"
+              formik={formik}
             />
             {formik.values.ifDeclinedByMentor_chosenReasonForDecline ===
             'other' ? (

apps/redi-connect/src/components/organisms/EditableEducation.tsx

@@ -73,7 +73,7 @@ const EditableEducation = ({ profile, profileSaveStart }: any) => {
         name="mentee_highestEducationLevel"
         placeholder="Education Level"
         items={formEducationLevels}
-        {...formik}
+        formik={formik}
       />
     </Editable>
   )

apps/redi-connect/src/components/organisms/EditableLanguages.tsx

@@ -61,7 +61,7 @@ const EditableLanguages = ({ profile, profileSaveStart }: any) => {
         items={formLanguages}
         multiselect
         placeholder="Start typing and select languages"
-        {...formik}
+        formik={formik}
       />
     </Editable>
   )

apps/redi-connect/src/components/organisms/EditableMenteeCount.tsx

@@ -90,7 +90,7 @@ const EditableMenteeCount = ({ profile, profileSaveStart }: any) => {
         name="menteeCountCapacity"
         placeholder="Mentee count"
         items={formMenteeCountCapacityOptions}
-        {...formik}
+        formik={formik}
       />
       <Checkbox.Form
         name="optOutOfMenteesFromOtherRediLocation"

apps/redi-connect/src/components/organisms/EditableOccupation.tsx

@@ -155,7 +155,7 @@ const EditableOccupation = ({ profile, profileSaveStart }: any) => {
             name="mentee_occupationCategoryId"
             placeholder="Current Occupation"
             items={formMenteeOccupationCategories}
-            {...formik}
+            formik={formik}
           />
           {occupation === 'job' && (
             <>

apps/redi-connect/src/components/organisms/EditablePersonalDetail.tsx

@@ -66,7 +66,7 @@ const EditablePersonalDetail = ({ profile, profileSaveStart }: any) => {
         name="gender"
         placeholder="Prefer not to answer"
         items={formGenders}
-        {...formik}
+        formik={formik}
       />
 
       <FormDatePicker

apps/redi-connect/src/components/organisms/EditableRediClass.tsx

@@ -62,7 +62,7 @@ const EditableRediClass = ({ profile, profileSaveStart }: any) => {
         label="Which course are you taking at ReDI?"
         name="mentee_currentlyEnrolledInCourse"
         items={formCourses}
-        {...formik}
+        formik={formik}
       />
     </Editable>
   )

apps/redi-connect/src/components/organisms/modules/MSessions.tsx

@@ -163,7 +163,9 @@ const MSessions = ({
                 name="minuteDuration"
                 placeholder="Add the duration of the session"
                 items={formMentoringSessionDurationOptions}
-                {...formik}
+                menuPortalTarget={document.body}
+                menuPosition="fixed"
+                formik={formik}
               />
             </form>
           </Modal.Body>

apps/redi-connect/src/pages/front/signup/SignUp.tsx

@@ -199,7 +199,7 @@ export default function SignUp() {
                 name="mentee_currentlyEnrolledInCourse"
                 placeholder="Choose your ReDI Course"
                 items={formCourses}
-                {...formik}
+                formik={formik}
               />
             )}
 

apps/redi-talent-pool/src/components/organisms/company-profile-editables/EditableJobPostings.tsx

@@ -274,7 +274,7 @@ function ModalForm({
             label="Location (Federal State in Germany)"
             items={federalStatesOptions}
             placeholder="Select federal states"
-            {...formik}
+            formik={formik}
           />
           <Checkbox.Form
             name="isRemotePossible"
@@ -306,7 +306,7 @@ function ModalForm({
             label="Related positions*"
             name="relatesToPositions"
             items={formRelatedPositions}
-            {...formik}
+            formik={formik}
             multiselect
             placeholder="Start typing and select positions"
             closeMenuOnSelect={false}
@@ -315,16 +315,20 @@ function ModalForm({
             label="Ideal technical skills*"
             name="idealTechnicalSkills"
             items={formTopSkills}
-            {...formik}
+            formik={formik}
             multiselect
             placeholder="Start typing and select skills"
             closeMenuOnSelect={false}
+            menuPortalTarget={document.body}
+            menuPosition="fixed"
           />
           <FormSelect
             label="Employment type*"
             name="employmentType"
             items={formEmploymentType}
-            {...formik}
+            formik={formik}
+            menuPortalTarget={document.body}
+            menuPosition="fixed"
           />
           <FormInput
             name="languageRequirements"

apps/redi-talent-pool/src/components/organisms/jobseeker-profile-editables/EditableEducation.tsx

@@ -319,7 +319,7 @@ export function JobseekerFormSectionEducation({
                           name={`education[${index}].certificationType`}
                           label="The type of certification*"
                           items={formCertificationTypes}
-                          {...formik}
+                          formik={formik}
                         />
                         <FormInput
                           name={`education[${index}].institutionName`}
@@ -361,7 +361,9 @@ export function JobseekerFormSectionEducation({
                               name={`education[${index}].startDateMonth`}
                               label="Started in month*"
                               items={formMonthsOptions}
-                              {...formik}
+                              menuPortalTarget={document.body}
+                              menuPosition="fixed"
+                              formik={formik}
                             />
                           </Columns.Column>
                           <Columns.Column size={6}>
@@ -380,7 +382,9 @@ export function JobseekerFormSectionEducation({
                                 name={`education[${index}].endDateMonth`}
                                 label="Ended in month*"
                                 items={formMonthsOptions}
-                                {...formik}
+                                menuPortalTarget={document.body}
+                                menuPosition="fixed"
+                                formik={formik}
                               />
                             </Columns.Column>
                             <Columns.Column size={6}>

apps/redi-talent-pool/src/components/organisms/jobseeker-profile-editables/EditableImportantDetails.tsx

@@ -309,16 +309,20 @@ export function JobseekerFormSectionImportantDetails({
             label="What kind of employment are you looking for?*"
             name="desiredEmploymentType"
             items={formDesiredEmploymentType}
-            {...formik}
+            formik={formik}
             multiselect
             placeholder="Select desired employment types"
             closeMenuOnSelect={false}
+            menuPortalTarget={document.body}
+            menuPosition="fixed"
           />
           <FormSelect
             label="When are you available to start?*"
             name="availability"
             items={formAvailabilityOptions}
-            {...formik}
+            menuPortalTarget={document.body}
+            menuPosition="fixed"
+            formik={formik}
           />
           {formik.values.availability === 'date' ? (
             <FormDatePicker
@@ -337,7 +341,9 @@ export function JobseekerFormSectionImportantDetails({
             label="What is your immigration status?"
             name="immigrationStatus"
             items={formImmigrationStatusOptions}
-            {...formik}
+            menuPortalTarget={document.body}
+            menuPosition="fixed"
+            formik={formik}
           />
         </>
       )}

apps/redi-talent-pool/src/components/organisms/jobseeker-profile-editables/EditableLanguages.tsx

@@ -260,13 +260,17 @@ export function JobseekerFormSectionLanguages({
                           name={`workingLanguages[${index}].language`}
                           label="Language*"
                           items={formLanguages}
-                          {...formik}
+                          menuPortalTarget={document.body}
+                          menuPosition="fixed"
+                          formik={formik}
                         />
                         <FormSelect
                           name={`workingLanguages[${index}].proficiencyLevelId`}
                           label="Level of proficiency*"
                           items={formLanguageProficiencyLevels}
-                          {...formik}
+                          menuPortalTarget={document.body}
+                          menuPosition="fixed"
+                          formik={formik}
                         />
                       </FormDraggableAccordion>
                     </div>

apps/redi-talent-pool/src/components/organisms/jobseeker-profile-editables/EditableNamePhotoLocation.tsx

@@ -204,7 +204,9 @@ function ModalForm({
         name="federalState"
         label="Your place of residence (state)*"
         items={federalStatesOptions}
-        {...formik}
+        menuPortalTarget={document.body}
+        menuPosition="fixed"
+        formik={formik}
       />
       <Checkbox.Form
         name={`willingToRelocate`}

apps/redi-talent-pool/src/components/organisms/jobseeker-profile-editables/EditableOverview.tsx

@@ -161,17 +161,21 @@ export function JobseekerFormSectionOverview({
         label="Desired position* (pick 1-3)"
         name="desiredPositions"
         items={formDesiredPositions}
-        {...formik}
+        formik={formik}
         multiselect
         placeholder="Start typing and select positions"
         closeMenuOnSelect={false}
+        menuPortalTarget={document.body}
+        menuPosition="fixed"
       />
       {hideCurrentRediCourseField ? null : (
         <FormSelect
           label="Current ReDI course"
           name="currentlyEnrolledInCourse"
           items={formCourses}
-          {...formik}
+          menuPortalTarget={document.body}
+          menuPosition="fixed"
+          formik={formik}
         />
       )}
       <Button

apps/redi-talent-pool/src/components/organisms/jobseeker-profile-editables/EditableProfessionalExperience.tsx

@@ -356,7 +356,9 @@ export function JobseekerFormSectionProfessionalExperience({
                               name={`experience[${index}].startDateMonth`}
                               label="Started in month*"
                               items={formMonthsOptions}
-                              {...formik}
+                              menuPortalTarget={document.body}
+                              menuPosition="fixed"
+                              formik={formik}
                             />
                           </Columns.Column>
                           <Columns.Column size={6}>
@@ -375,7 +377,9 @@ export function JobseekerFormSectionProfessionalExperience({
                                 name={`experience[${index}].endDateMonth`}
                                 label="Ended in month*"
                                 items={formMonthsOptions}
-                                {...formik}
+                                menuPortalTarget={document.body}
+                                menuPosition="fixed"
+                                formik={formik}
                               />
                             </Columns.Column>
                             <Columns.Column size={6}>

apps/redi-talent-pool/src/components/organisms/jobseeker-profile-editables/EditableSummary.tsx

@@ -185,10 +185,12 @@ export function JobseekerFormSectionSummary({
         label="Your top technical skills (pick 1-5 skills)"
         name="topSkills"
         items={formTopSkills}
-        {...formik}
+        formik={formik}
         multiselect
         placeholder="Start typing and select skills"
         closeMenuOnSelect={false}
+        menuPortalTarget={document.body}
+        menuPosition="fixed"
       />
       <FormTextArea
         label="About you* (100-600 characters)"

apps/redi-talent-pool/src/pages/front/signup/SignUp.tsx

@@ -284,7 +284,7 @@ export default function SignUp() {
                 name="rediLocation"
                 placeholder="Choose your ReDI Location"
                 items={formRediLocations}
-                {...formik}
+                formik={formik}
               />
             )}
 
@@ -297,7 +297,7 @@ export default function SignUp() {
                 items={formCourses.filter(
                   (course) => course.location === formik.values.rediLocation
                 )}
-                {...formik}
+                formik={formik}
               />
             )}
 
@@ -326,7 +326,7 @@ export default function SignUp() {
                   name="howDidHearAboutRediKey"
                   placeholder="How did you first hear about ReDI Talent Pool?"
                   items={howDidHearAboutRediOptionsEntries}
-                  {...formik}
+                  formik={formik}
                 />
                 {formik.values.howDidHearAboutRediKey === 'other' ? (
                   <FormInput

apps/redi-talent-pool/src/services/api/api.tsx

@@ -222,10 +222,14 @@ export async function updateCurrentUserTpJobseekerProfile(
 
 export async function fetchAllCurrentUserTpJobseekerCv(): Promise<
   Array<Partial<TpJobseekerCv>>
-> {
+  > {
   const userId = getAccessTokenFromLocalStorage().userId
-  const resp = await http(`${API_URL}/redUsers/${userId}/tpJobseekerCv`)
-  return resp.data
+  return http(
+    `${API_URL}/redUsers/${userId}/tpJobseekerCv?filter=${JSON.stringify({
+      order: 'createdAt DESC',
+      limit: 0,
+    })}`)
+    .then((resp) => resp.data)
 }
 
 export async function fetchCurrentUserTpJobseekerCvById(
@@ -358,13 +362,12 @@ export async function fetchAllTpJobListingsUsingFilters({
 
 export async function fetchAllTpJobListings(): Promise<Array<TpJobListing>> {
   const userId = getAccessTokenFromLocalStorage().userId
-  const resp = await http(`${API_URL}/redUsers/${userId}/tpJobListings`)
-
-  // TODO: remove the `.filter()`. It
-  // was inserted temporarily for the "dummy" job listings we created for HR Summit
-  // 2021. Once the event is over, they can be removed from database completely.
-  // Reason for filter here is so companies don't see these dummy job listings.
-  return resp.data.filter((listing) => !listing.dummy)
+  return http(
+    `${API_URL}/redUsers/${userId}/tpJobListings?filter=${JSON.stringify({
+      order: 'createdAt DESC',
+      limit: 0,
+    })}`
+  ).then((resp) => resp.data)
 }
 
 export async function fetchOneTpJobListingOfCurrentUser(

libs/shared-atomic-design-components/src/lib/atoms/FormSelect.styles.ts

@@ -17,19 +17,19 @@ export const formSelectStyles = {
   }),
   dropdownIndicator: (provided: any, state: any) => ({
     ...provided,
-    color: state.isFocused ? '#ea5b29' : '#a0a0a0',
-    transform: state.menuIsOpen ? 'rotate(180deg)' : 'none',
+    transition: 'ease-in-out all 0.2s',
+    transform: state.selectProps.menuIsOpen ? 'rotate(180deg)' : 'none',
     svg: {
       margin: '0 0.1rem',
     },
   }),
   control: (provided: any, state: any) => ({
     ...provided,
-    borderColor: state.isFocused ? '#ea5b29' : '#a0a0a0',
+    borderColor: state.isFocused ? 'black' : '#A0A0A0',
     minHeight: '48px',
     boxShadow: 'inset 0 2px 6px rgba(178, 180, 181, 0.3)',
     '&:hover': {
-      borderColor: state.isFocused ? '#ea5b29' : '#f6b9a2',
+      borderColor: 'black'
     },
   }),
   multiValue: (provided: any) => ({