front: display electrical profile set name in scenario

Author: clarani

front/src/applications/operationalStudies/components/Scenario/ScenarioDescription.tsx

@@ -1,9 +1,13 @@
-import { useEffect, useRef, useState } from 'react';
+import { useEffect, useMemo, useRef, useState } from 'react';
 
 import { Blocked, ChevronLeft, Pencil, X } from '@osrd-project/ui-icons';
 import { useTranslation } from 'react-i18next';
 
-import type { InfraWithState, ScenarioResponse } from 'common/api/osrdEditoastApi';
+import {
+  osrdEditoastApi,
+  type InfraWithState,
+  type ScenarioResponse,
+} from 'common/api/osrdEditoastApi';
 import { useModal } from 'common/BootstrapSNCF/ModalSNCF';
 import AddAndEditScenarioModal from 'modules/scenario/components/AddOrEditScenarioModal';
 import useOutsideClick from 'utils/hooks/useOutsideClick';
@@ -30,6 +34,15 @@ const ScenarioDescription = ({
   const collapsedDescriptionRef = useRef<HTMLDivElement | null>(null);
   const [isTooLongDescription, setIsTooLongDescription] = useState<boolean>(false);
 
+  const { data: electricalProfileSets } =
+    osrdEditoastApi.endpoints.getElectricalProfileSet.useQuery();
+
+  const electricalProfileSet = useMemo(
+    () =>
+      electricalProfileSets?.find((profile) => profile.id === scenario.electrical_profile_set_id),
+    [electricalProfileSets]
+  );
+
   const toggleDescription = () => {
     setIsOpenedDescription(!isOpenedDescription);
   };
@@ -115,7 +128,7 @@ const ScenarioDescription = ({
       </div>
       <div className="scenario-details-electrical-profile-set">
         {scenario.electrical_profile_set_id
-          ? scenario.electrical_profile_set_id
+          ? electricalProfileSet?.name || ''
           : t('noElectricalProfileSet')}
       </div>