Merge branch 'hotfix/fix_directory'

ReseauEntourage · Jan 30, 2024 · 9717577 · 9717577
2 parents 8d2e2d7 + 637f5db
commit 9717577
Show file tree

Hide file tree

Showing 9 changed files with 79 additions and 120 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "linkedout-front",
-  "version": "2.13.1",
+  "version": "2.13.2",
   "description": "",
   "main": "index.js",
   "engines": {

diff --git a/...mponents/backoffice/parametres/ParametresLayout/ParametresHelpCard/ParametresHelpCard.tsx b/...mponents/backoffice/parametres/ParametresLayout/ParametresHelpCard/ParametresHelpCard.tsx
@@ -1,8 +1,9 @@
-import React, { useEffect, useState } from 'react';
+import React from 'react';
 import PlaceholderIllu from 'assets/icons/illu-coeur-mains-ouvertes.svg';
-import { useHelpField, helpFields } from '../../useUpdateProfile';
+import { helpFields, useHelpField } from '../../useUpdateProfile';
 import { ParametresPlaceholder } from '../ParametresPlaceholder';
 import { ProfileHelpList } from 'src/components/backoffice/profile/ProfileHelpInformationCard/ProfileHelpList';
+import { useContextualRole } from 'src/components/backoffice/useContextualRole';
 import { openModal } from 'src/components/modals/Modal';
 import { Card } from 'src/components/utils';
 import { ParametresHelpCardTitles } from 'src/constants/helps';
@@ -30,16 +31,13 @@ export const ParametresHelpCard = () => {
 
   const helpField = useHelpField(user.role);
 
-  const [contextualRole, setContextualRole] = useState(role);
-  useEffect(() => {
-    setContextualRole(role === 'Candidat externe' ? 'Candidat' : role);
-  }, [role]);
+  const { contextualRole } = useContextualRole(role);
 
   const openHelpEditModal = () => {
     openModal(
       <ParametresHelpModal
         role={contextualRole}
-        title={ParametresHelpCardTitles.modal[contextualRole.toLowerCase()]}
+        title={ParametresHelpCardTitles.modal[contextualRole]}
       />
     );
   };
@@ -48,7 +46,7 @@ export const ParametresHelpCard = () => {
 
   return (
     <Card
-      title={ParametresHelpCardTitles.card[contextualRole.toLowerCase()]}
+      title={ParametresHelpCardTitles.card[contextualRole]}
       editCallback={openHelpEditModal}
       isMobileClosable
       dataTestId="parametres-help-card"

diff --git a/...arametres/ParametresLayout/ParametresHelpCard/ParametresHelpModal/ParametresHelpModal.tsx b/...arametres/ParametresLayout/ParametresHelpCard/ParametresHelpModal/ParametresHelpModal.tsx
@@ -50,7 +50,7 @@ export const ParametresHelpModal = ({
             ? tempProfile[helpField]?.map(({ name }) => name)
             : []
         }
-        options={ParametresHelpCardContents[role.toLowerCase()].map(
+        options={ParametresHelpCardContents[role].map(
           ({ value, title: titleH6, description, icon }) => ({
             value,
             component: (

diff --git a/src/components/backoffice/profile/ProfileHelpInformationCard/ProfileHelpInformationCard.tsx b/src/components/backoffice/profile/ProfileHelpInformationCard/ProfileHelpInformationCard.tsx
@@ -3,16 +3,24 @@ import PlaceholderIllu from 'assets/icons/illu-coeur-mains-ouvertes.svg';
 import { ProfilePlaceHolder } from '../ProfilePlaceholder';
 import { useSelectedProfile } from '../useSelectedProfile';
 import { useHelpField } from 'src/components/backoffice/parametres/useUpdateProfile';
+import { useContextualRole } from 'src/components/backoffice/useContextualRole';
 import { Card } from 'src/components/utils';
-import { CANDIDATE_USER_ROLES } from 'src/constants/users';
+import { CANDIDATE_USER_ROLES, USER_ROLES } from 'src/constants/users';
 import { isRoleIncluded } from 'src/utils';
 import { ProfileHelpList } from './ProfileHelpList';
 
 export const ProfileHelpInformationCard = () => {
   const { selectedProfile } = useSelectedProfile();
+
   const helpField = useHelpField(selectedProfile?.role);
 
+  const { contextualRole } = useContextualRole(
+    // TODO remove check because selectedProfile always exists
+    selectedProfile ? selectedProfile.role : USER_ROLES.CANDIDATE
+  );
+
   if (!selectedProfile || !helpField) return null;
+
   return (
     <Card
       title={
@@ -24,7 +32,7 @@ export const ProfileHelpInformationCard = () => {
       {selectedProfile[helpField].length > 0 ? (
         <ProfileHelpList
           helpList={selectedProfile[helpField]}
-          role={selectedProfile.role}
+          role={contextualRole}
         />
       ) : (
         <ProfilePlaceHolder

diff --git a/...ponents/backoffice/profile/ProfileHelpInformationCard/ProfileHelpList/ProfileHelpList.tsx b/...ponents/backoffice/profile/ProfileHelpInformationCard/ProfileHelpList/ProfileHelpList.tsx
@@ -1,32 +1,31 @@
 import React from 'react';
 import { HelpNames } from 'src/api/types';
+import { ParametresHelpCardContents } from 'src/constants/helps';
+import { USER_ROLES } from 'src/constants/users';
 import {
   StyledHelpList,
   StyledHelpListImgContainer,
 } from './ProfileHelpList.styles';
-import { PARAMETRES_HELP_CARD_CONTENTS } from './ProfileHelpList.utils';
 
 interface ProfileHelpListProps {
   helpList: { name: HelpNames }[];
-  role: string;
+  role: typeof USER_ROLES.CANDIDATE | typeof USER_ROLES.COACH;
 }
 
 export const ProfileHelpList = ({ helpList, role }: ProfileHelpListProps) => {
   return (
     <StyledHelpList data-testid="parametres-help-list">
-      {PARAMETRES_HELP_CARD_CONTENTS[role.toLowerCase()].map(
-        ({ icon, title, value }, index) => {
-          if (!helpList.some((help) => help.name === value)) {
-            return null;
-          }
-          return (
-            <li key={index}>
-              <StyledHelpListImgContainer>{icon}</StyledHelpListImgContainer>
-              {title}
-            </li>
-          );
+      {ParametresHelpCardContents[role].map(({ icon, title, value }, index) => {
+        if (!helpList.some((help) => help.name === value)) {
+          return null;
         }
-      )}
+        return (
+          <li key={index}>
+            <StyledHelpListImgContainer>{icon}</StyledHelpListImgContainer>
+            {title}
+          </li>
+        );
+      })}
     </StyledHelpList>
   );
 };
diff --git a/...s/backoffice/profile/ProfileHelpInformationCard/ProfileHelpList/ProfileHelpList.utils.tsx b/...s/backoffice/profile/ProfileHelpInformationCard/ProfileHelpList/ProfileHelpList.utils.tsx
diff --git a/src/components/backoffice/useContextualRole.ts b/src/components/backoffice/useContextualRole.ts
@@ -0,0 +1,25 @@
+import { useEffect, useState } from 'react';
+import {
+  CANDIDATE_USER_ROLES,
+  USER_ROLES,
+  UserRole,
+} from 'src/constants/users';
+import { isRoleIncluded } from 'src/utils';
+
+export function useContextualRole(role: UserRole) {
+  const [contextualRole, setContextualRole] = useState<
+    typeof USER_ROLES.CANDIDATE | typeof USER_ROLES.COACH
+  >(USER_ROLES.CANDIDATE);
+
+  useEffect(() => {
+    setContextualRole(
+      isRoleIncluded(CANDIDATE_USER_ROLES, role)
+        ? USER_ROLES.CANDIDATE
+        : USER_ROLES.COACH
+    );
+  }, [role]);
+
+  return {
+    contextualRole,
+  };
+}
diff --git a/src/components/utils/Inputs/SelectList/SelectList.stories.tsx b/src/components/utils/Inputs/SelectList/SelectList.stories.tsx
@@ -4,6 +4,7 @@ import { StyledHelpModalSelectOption } from 'src/components/backoffice/parametre
 import { Card } from 'src/components/utils/Card';
 import { H6 } from 'src/components/utils/Headings';
 import { ParametresHelpCardContents } from 'src/constants/helps';
+import { USER_ROLES } from 'src/constants/users';
 import { SelectList as SelectListComponent } from './SelectList';
 
 const meta = {
@@ -23,7 +24,7 @@ const meta = {
   args: {
     id: 'select-list-stories',
     onChange: () => {},
-    options: ParametresHelpCardContents.candidat.map(
+    options: ParametresHelpCardContents[USER_ROLES.CANDIDATE].map(
       ({ value, title, description, icon }) => ({
         value,
         component: (

diff --git a/src/constants/helps.tsx b/src/constants/helps.tsx
@@ -5,6 +5,7 @@ import MaletteIllu from 'assets/icons/illu-malette.svg';
 import TipsIllu from 'assets/icons/illu-poignee-de-main.svg';
 import RSIllu from 'assets/icons/illu-reseaux-sociaux.svg';
 import { HelpNames } from 'src/api/types';
+import { USER_ROLES } from './users';
 import { FilterConstant } from './utils';
 
 export const ProfileCardHelps: (FilterConstant<HelpNames> & {
@@ -36,21 +37,32 @@ export const ProfileCardHelps: (FilterConstant<HelpNames> & {
     label: 'Partage',
   },
 ];
-export const ParametresHelpCardTitles = {
+export const ParametresHelpCardTitles: {
+  [K in 'card' | 'modal']: {
+    [R in typeof USER_ROLES.CANDIDATE | typeof USER_ROLES.COACH]: string;
+  };
+} = {
   card: {
-    coach: 'Vos propositions de coup de pouce',
-    candidat: "Vos demandes d'aide",
+    [USER_ROLES.COACH]: 'Vos propositions de coup de pouce',
+    [USER_ROLES.CANDIDATE]: "Vos demandes d'aide",
   },
   modal: {
-    coach:
+    [USER_ROLES.COACH]:
       'Sélectionnez les coups de pouce que vous souhaitez apporter aux candidats',
-    candidat:
+    [USER_ROLES.CANDIDATE]:
       'Sélectionnez les coups de pouce que vous souhaitez avoir auprès des coachs',
   },
 } as const;
 
-export const ParametresHelpCardContents = {
-  candidat: [
+export const ParametresHelpCardContents: {
+  [K in typeof USER_ROLES.CANDIDATE | typeof USER_ROLES.COACH]: {
+    icon: React.ReactNode;
+    value: string;
+    title: string;
+    description: string;
+  }[];
+} = {
+  [USER_ROLES.CANDIDATE]: [
     {
       icon: <TipsIllu />,
       value: 'tips',
@@ -87,7 +99,7 @@ export const ParametresHelpCardContents = {
         "Multipliez vos opportunités professionnelles en vous connectant avec des professionnels qui peuvent vous soutenir et vous ouvrir des portes sur le marché de l'emploi.",
     },
   ],
-  coach: [
+  [USER_ROLES.COACH]: [
     {
       icon: <TipsIllu />,
       value: 'tips',
@@ -125,4 +137,4 @@ export const ParametresHelpCardContents = {
         'Mettez en relation les candidats avec des contacts pertinents et intégez-les dans des réseaux qui peuvent favoriser leur insertion professionnelle.',
     },
   ],
-} as const;
+};