front: rolling-stock-editor: fix several bugs

- prevent the user from creating a rolling stock without name or effort curves - when creating a rolling stock, do not create any empty mode by default - prevent the user from deleting the standard comfort - update default curve when the first curve of each mode is edited - reset the traction mode when adding a new rolling stock
OpenRailAssociation · Sep 20, 2023 · ee04bf0 · ee04bf0
1 parent 2a5cbf4
commit ee04bf0
Show file tree

Hide file tree

Showing 11 changed files with 359 additions and 326 deletions.
diff --git a/front/public/locales/en/rollingstock.json b/front/public/locales/en/rollingstock.json
@@ -56,6 +56,9 @@
   "messages": {
     "success": "Group",
     "failure": "Operation failed",
+    "invalidForm": "Invalid form",
+    "missingName": "Please fill the name of the new rolling stock",
+    "missingEffortCurves": "Please fill in at least one effort-speed curve",
     "rollingStockAdded": "Rolling stock added",
     "rollingStockUpdated": "Rolling stock updated",
     "rollingStockDeleted": "Rolling stock deleted",

diff --git a/front/public/locales/fr/rollingstock.json b/front/public/locales/fr/rollingstock.json
@@ -57,6 +57,9 @@
   "messages": {
     "success": "Opération réussie",
     "failure": "Opération échouée",
+    "invalidForm": "Formulaire incomplet",
+    "missingName": "Veuillez renseigner un nom",
+    "missingEffortCurves": "Veuillez renseigner une courbe effort-vitesse",
     "rollingStockAdded": "Le matériel roulant a été ajouté.",
     "rollingStockUpdated": "Le matériel roulant a été mis à jour.",
     "rollingStockDeleted": "Le matériel roulant a été supprimé.",

diff --git a/front/src/applications/rollingStockEditor/views/RollingStockEditor.tsx b/front/src/applications/rollingStockEditor/views/RollingStockEditor.tsx
@@ -39,7 +39,7 @@ export default function RollingStockEditor({ rollingStocks }: RollingStockEditor
 
   const [openedRollingStockCardId, setOpenedRollingStockCardId] = useState<number>();
 
-  const { data: selectedRollingStock } = osrdEditoastApi.useGetRollingStockByIdQuery(
+  const { data: selectedRollingStock } = osrdEditoastApi.endpoints.getRollingStockById.useQuery(
     {
       id: openedRollingStockCardId as number,
     },
@@ -50,7 +50,7 @@ export default function RollingStockEditor({ rollingStocks }: RollingStockEditor
 
   const resetRollingstockCurvesParams = () => {
     dispatch(updateComfortLvl(STANDARD_COMFORT_LEVEL));
-    dispatch(updateTractionMode(''));
+    dispatch(updateTractionMode(null));
     dispatch(updateElectricalProfile(null));
     dispatch(updatePowerRestriction(null));
   };
@@ -171,6 +171,7 @@ export default function RollingStockEditor({ rollingStocks }: RollingStockEditor
             type="button"
             className="btn btn-primary mb-4"
             onClick={() => {
+              resetRollingstockCurvesParams();
               setIsAdding(true);
               setOpenedRollingStockCardId(undefined);
             }}

diff --git a/front/src/common/SelectorSNCF.tsx b/front/src/common/SelectorSNCF.tsx
@@ -1,5 +1,5 @@
 import { isNull } from 'lodash';
-import React, { useMemo } from 'react';
+import React from 'react';
 import { useTranslation } from 'react-i18next';
 import { MdArrowRight } from 'react-icons/md';
 import { getTranslationKey } from 'utils/strings';
@@ -13,6 +13,7 @@ export default function SelectorSNCF<T extends string | null, K extends string>(
   borderClass: string;
   title: K;
   itemsList: T[];
+  permanentItems?: T[];
   selectedItem?: T;
   hoveredItem?: string | null;
   onItemSelected?: (value: T) => void;
@@ -26,6 +27,7 @@ export default function SelectorSNCF<T extends string | null, K extends string>(
     borderClass,
     title,
     itemsList,
+    permanentItems,
     selectedItem,
     hoveredItem,
     onItemSelected,
@@ -43,39 +45,39 @@ export default function SelectorSNCF<T extends string | null, K extends string>(
       </div>
       <div className="d-flex align-items-center position-relative">
         <div className={cx(`${mainClass}-itemslist`, borderClass, 'overflow-auto', 'p-2')}>
-          {useMemo(
-            () =>
-              itemsList.map((item, index: number) => (
-                <div
-                  className={cx(`${mainClass}-item`, 'd-flex', 'mb-1', borderClass, {
-                    selected: item === selectedItem,
-                    hovered: item === hoveredItem && item !== null,
-                  })}
-                  role="button"
-                  tabIndex={0}
-                  onClick={() => {
-                    if (onItemSelected) onItemSelected(item);
-                  }}
-                  onMouseOver={() => {
-                    if (onItemHovered) onItemHovered(item);
-                  }}
-                  onFocus={() => {
-                    if (onItemHovered) onItemHovered(item);
-                  }}
-                  key={`selector-${title}-${index}`}
-                >
-                  <div className={`${mainClass}-item-name pt-1 pl-3`}>
-                    {!isNull(item)
-                      ? t(getTranslationKey(translationList, String(item)))
-                      : t('unspecified')}
-                  </div>
-                  {onItemRemoved && (
+          {itemsList.map(
+            (item, index: number) => (
+              <div
+                className={cx(`${mainClass}-item`, 'd-flex', 'mb-1', borderClass, {
+                  selected: item === selectedItem,
+                  hovered: item === hoveredItem && item !== null,
+                })}
+                role="button"
+                tabIndex={0}
+                onClick={() => {
+                  if (onItemSelected) onItemSelected(item);
+                }}
+                onMouseOver={() => {
+                  if (onItemHovered) onItemHovered(item);
+                }}
+                onFocus={() => {
+                  if (onItemHovered) onItemHovered(item);
+                }}
+                key={`selector-${title}-${index}`}
+              >
+                <div className={`${mainClass}-item-name pt-1 pl-3`}>
+                  {!isNull(item)
+                    ? t(getTranslationKey(translationList, String(item)))
+                    : t('unspecified')}
+                </div>
+                {((permanentItems && !permanentItems.includes(item)) || !permanentItems) &&
+                  onItemRemoved && (
                     <div className={`${mainClass}-trash-icon`}>
                       <FaTrash onClick={() => onItemRemoved(item, title)} />
                     </div>
                   )}
-                </div>
-              )),
+              </div>
+            ),
             [itemsList, selectedItem, hoveredItem]
           )}
         </div>

diff --git a/front/src/modules/rollingStock/components/rollingStockEditor/AddRollingstockParam.tsx b/front/src/modules/rollingStock/components/rollingStockEditor/AddRollingstockParam.tsx
@@ -11,11 +11,13 @@ export default function AddRollingstockParam({
   listName,
   allOptionsList,
   displayedLists,
+  disabled,
   updateDisplayedLists,
 }: {
   listName: string;
   allOptionsList: string[] | (string | null)[];
   displayedLists: RollingStockSelectorParams;
+  disabled?: boolean;
   updateDisplayedLists: (arg: string) => void;
 }) {
   const COMFORT_LEVELS_KEY: keyof RollingStockSelectorParams = 'comfortLevels';
@@ -48,14 +50,14 @@ export default function AddRollingstockParam({
       <button
         type="button"
         className={cx('rollingstock-selector-buttons', 'mb-2', {
-          disabled: (!optionsList || optionsList.length < 1) && listName !== 'tractionModes',
+          disabled: disabled || (optionsList.length < 1 && listName !== 'tractionModes'),
         })}
         onClick={() => setIsSelectVisible(true)}
       >
         <RiAddFill />
       </button>
       {isSelectVisible && (
-        <div className="rollingstock-editor-select">
+        <div className="selector-select">
           <SelectImprovedSNCF
             options={optionsList}
             onChange={(e) => {