front: editor: move save button to action bar

front/public/locales/en/translation.json

@@ -228,16 +228,18 @@
           "confirm-delete-entity": "Are you sure you want to remove the buffer stop?",
           "delete-entity": "Delete the buffer stop",
           "new-entity": "Create a new buffer stop",
-          "reset-entity": "Reset data"
+          "reset-entity": "Reset data",
+          "save-entity": "Save the buffer stop"
         },
         "label": "Buffer stop tool"
       },
       "catenary-edition": {
         "actions": {
           "confirm-delete-catenary": "Are you sure you want to remove the catenary?",
+          "delete-catenary": "Delete the catenary",
           "new-catenary": "Create a new catenary",
           "reset-catenary": "Cancel the current modifications",
-          "delete-catenary": "Delete the catenary"
+          "save-catenary": "Save the catenary"
         },
         "help": {
           "init": "Click on a track section to link it to the catenary",
@@ -248,16 +250,15 @@
         "catenaries": "Electrification",
         "catenary-default": "Default catenary",
         "label": "Catenary tool",
-        "save-existing-catenary": "Save modifications",
-        "save-new-catenary": "Save the new catenary",
         "voltage": "{{voltage}}V"
       },
       "detector-edition": {
         "actions": {
           "confirm-delete-entity": "Are you sure you want to remove the detector?",
           "delete-entity": "Delete the detector",
           "new-entity": "Create a new detector",
-          "reset-entity": "Reset data"
+          "reset-entity": "Reset data",
+          "save-entity": "Save the detector"
         },
         "label": "Detector tool"
       },
@@ -377,16 +378,18 @@
           "confirm-delete-entity": "Are you sure you want to remove the signal?",
           "delete-entity": "Delete the signal",
           "new-entity": "Create a new signal",
-          "reset-entity": "Reset data"
+          "reset-entity": "Reset data",
+          "save-entity": "Save the signal"
         },
         "label": "Signal tool"
       },
       "speed-edition": {
         "actions": {
           "confirm-delete-speed-section": "Are you sure you want to remove the speed limit?",
+          "delete-speed-section": "Delete the speed limit",
           "new-speed-section": "Create a new speed limit",
           "reset-speed-section": "Cancel the current modifications",
-          "delete-speed-section": "Delete the speed limit"
+          "save-speed-section": "Save the speed limit"
         },
         "add-new-speed-limit": "Add new speed limit",
         "add-sign": "Add a sign from {{signType}} type",
@@ -410,8 +413,6 @@
         "sign-value": "Speed",
         "signs-section-list": "Section signs list",
         "remove-track-range": "Click to detatch from:",
-        "save-existing-speed-section": "Save modifications",
-        "save-new-speed-section": "Save the new speed limit",
         "speed-limits": "Speed limits",
         "toggle-psl": "Permanent speed limit",
         "toggle-psl-help": "Click on a track section first to be able to activate this option"
@@ -422,7 +423,8 @@
           "delete-switch": "Delete the switch",
           "new-switch": "Create a new switch",
           "pick-track": "Track selection tool on the map",
-          "pick-track-cancel": "Undo line selection"
+          "pick-track-cancel": "Undo line selection",
+          "save-switch": "Save the switch"
         },
         "endpoint": "Endpoint:",
         "help": {
@@ -444,7 +446,8 @@
           "mode-add-point": "Add a point",
           "mode-delete-point": "Delete points",
           "mode-move-point": "Move points",
-          "toggle-anchoring": "Toggle anchoring on/off"
+          "toggle-anchoring": "Toggle anchoring on/off",
+          "save-line": "Save the line"
         },
         "help": {
           "add-anchor-point": "Click to add a point at the end of the track section. Click on the track to add an intermediate point.",

front/public/locales/fr/translation.json

@@ -228,16 +228,18 @@
           "confirm-delete-entity": "Êtes-vous sûr(e) de vouloir supprimer le heurtoir ?",
           "delete-entity": "Supprimer le heurtoir",
           "new-entity": "Créer un nouveau heurtoir",
-          "reset-entity": "Réinitialiser les données"
+          "reset-entity": "Réinitialiser les données",
+          "save-entity": "Sauvegarder le heurtoir"
         },
         "label": "Outil \"Heurtoir\""
       },
       "catenary-edition": {
         "actions": {
           "confirm-delete-catenary": "Êtes-vous sûr(e) de vouloir supprimer l'électrification ?",
+          "delete-catenary": "Supprimer l'électrification",
           "new-catenary": "Créer une nouvelle électrification",
           "reset-catenary": "Annuler les modifications en cours",
-          "delete-catenary": "Supprimer l'électrification"
+          "save-catenary": "Sauvegarder l'électrification"
         },
         "help": {
           "init": "Cliquez sur un tronçon d'itinéraire pour l'associer à l'électrification",
@@ -248,16 +250,15 @@
         "catenaries": "Électrification",
         "catenary-default": "Électrification par défaut",
         "label": "Outil \"Électrification\"",
-        "save-existing-catenary": "Sauvegarder les modifications",
-        "save-new-catenary": "Sauvegarder la nouvelle électrification",
         "voltage": "{{voltage}}V"
       },
       "detector-edition": {
         "actions": {
           "confirm-delete-entity": "Êtes-vous sûr(e) de vouloir supprimer le détecteur ?",
           "delete-entity": "Supprimer le détecteur",
           "new-entity": "Créer un nouveau détecteur",
-          "reset-entity": "Réinitialiser les données"
+          "reset-entity": "Réinitialiser les données",
+          "save-entity": "Sauvegarder le détecteur"
         },
         "label": "Outil \"Détecteur\""
       },
@@ -377,16 +378,18 @@
           "confirm-delete-entity": "Êtes-vous sûr(e) de vouloir supprimer le signal ?",
           "delete-entity": "Supprimer le signal",
           "new-entity": "Créer un nouveau signal",
-          "reset-entity": "Réinitialiser les données"
+          "reset-entity": "Réinitialiser les données",
+          "save-entity": "Sauvegarder le signal"
         },
         "label": "Outil \"Signal\""
       },
       "speed-edition": {
         "actions": {
           "confirm-delete-speed-section": "Êtes-vous sûr(e) de vouloir supprimer la vitesse limite ?",
+          "delete-speed-section": "Supprimer la vitesse limite",
           "new-speed-section": "Créer une nouvelle vitesse limite",
           "reset-speed-section": "Annuler les modifications en cours",
-          "delete-speed-section": "Supprimer la vitesse limite"
+          "save-speed-section": "Sauvegarder la vitesse limite"
         },
         "add-new-speed-limit": "Ajouter une nouvelle limitation",
         "add-sign": "Ajouter un panneau de type {{signType}}",
@@ -410,8 +413,6 @@
         "sign-value": "Vitesse",
         "signs-section-list": "Liste des panneaux de la section",
         "remove-track-range": "Cliquer pour détacher de :",
-        "save-existing-speed-section": "Sauvegarder les modifications",
-        "save-new-speed-section": "Sauvegarder la nouvelle limite de vitesse",
         "speed-limits": "Limitations de vitesses",
         "toggle-psl": "Limite permanente de vitesse",
         "toggle-psl-help": "Cliquez d'abord sur un tronçon d'itinéraire pour pouvoir activer cette option"
@@ -422,7 +423,8 @@
           "delete-switch": "Supprimer l'aiguillage",
           "new-switch": "Créer un nouvel aiguillage",
           "pick-track": "Outil de sélection d'une ligne sur la carte",
-          "pick-track-cancel": "Annuler la sélection d'une ligne"
+          "pick-track-cancel": "Annuler la sélection d'une ligne",
+          "save-switch": "Sauvegarder l'aiguillage"
         },
         "endpoint": "Extrémité :",
         "help": {
@@ -444,7 +446,8 @@
           "mode-add-point": "Ajouter un point",
           "mode-delete-point": "Supprimer des points",
           "mode-move-point": "Déplacer les points",
-          "toggle-anchoring": "Activer / désactiver l'ancrage automatique"
+          "toggle-anchoring": "Activer / désactiver l'ancrage automatique",
+          "save-line": "Sauvegarder la ligne"
         },
         "help": {
           "add-anchor-point": "Cliquez pour ajouter un point au bout de la section de ligne. Cliquez sur la ligne pour ajouter un point intermédiaire.",

front/src/applications/editor/Editor.tsx

@@ -15,6 +15,7 @@ import { loadDataModel, selectLayers, updateTotalsIssue } from 'reducers/editor'
 import { updateInfraID } from 'reducers/osrdconf';
 import { updateViewport, Viewport } from 'reducers/map';
 import { getInfraID } from 'reducers/osrdconf/selectors';
+import { getIsLoading } from 'reducers/main/mainSelector';
 import useKeyboardShortcuts from 'utils/hooks/useKeyboardShortcuts';
 import MapSearch from 'common/Map/Search/MapSearch';
 import Tipped from './components/Tipped';
@@ -44,6 +45,7 @@ const Editor: FC = () => {
   const mapRef = useRef<MapRef>(null);
   const { urlInfra } = useParams();
   const infraID = useSelector(getInfraID);
+  const isLoading = useSelector(getIsLoading);
   const editorState = useSelector((state: { editor: EditorState }) => state.editor);
   const switchTypes = useSwitchTypes(infraID);
   const { register } = useKeyboardShortcuts();
@@ -58,6 +60,8 @@ const Editor: FC = () => {
     setRenderingFingerprint(Date.now());
   }, [setRenderingFingerprint]);
 
+  const [isFormSubmited, setIsFormSubmited] = useState(false);
+
   const switchTool = useCallback(
     ({ toolType, toolState }: switchProps) => {
       const tool = TOOLS[toolType];
@@ -128,13 +132,27 @@ const Editor: FC = () => {
       dispatch,
       editorState,
       infraID,
+      isLoading,
+      isFormSubmited,
+      setIsFormSubmited,
       switchTypes,
       mapState: {
         viewport,
         mapStyle,
       },
     }),
-    [context, dispatch, editorState, mapStyle, infraID, switchTypes, viewport]
+    [
+      context,
+      dispatch,
+      editorState,
+      mapStyle,
+      infraID,
+      switchTypes,
+      viewport,
+      isLoading,
+      isFormSubmited,
+      setIsFormSubmited,
+    ]
   );
 
   const actionsGroups = useMemo(

front/src/applications/editor/Map.tsx

@@ -23,9 +23,9 @@ import Hillshade from 'common/Map/Layers/Hillshade';
 import PlatformsLayer from 'common/Map/Layers/Platforms';
 import { useMapBlankStyle } from 'common/Map/Layers/blankStyle';
 import IGN_BD_ORTHO from 'common/Map/Layers/IGN_BD_ORTHO';
+import { Viewport } from 'reducers/map';
 import { getInfraID } from 'reducers/osrdconf/selectors';
 import { getShowOSM, getTerrain3DExaggeration } from 'reducers/map/selectors';
-import { Viewport } from 'reducers/map';
 import { getMapMouseEventNearestFeature } from 'utils/mapHelper';
 import { InfraError } from './components/InfraErrors/types';
 import EditorContext from './context';

front/src/applications/editor/tools/editorContextTypes.ts

@@ -48,6 +48,9 @@ export interface ExtendedEditorContextType<S> extends EditorContextType<S> {
   mapState: MapState;
   infraID: number | undefined;
   switchTypes: SwitchType[] | undefined;
+  isLoading?: boolean;
+  isFormSubmited?: boolean;
+  setIsFormSubmited?: (isSubmit: boolean) => void;
 }
 
 export type ReadOnlyEditorContextType<S> = Omit<

front/src/applications/editor/tools/pointEdition/components.tsx

@@ -1,5 +1,5 @@
 import { Map } from 'maplibre-gl';
-import React, { ComponentType, FC, useContext, useEffect, useMemo, useState } from 'react';
+import React, { ComponentType, FC, useContext, useEffect, useMemo, useRef, useState } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 import { Popup } from 'react-map-gl/maplibre';
 import { useTranslation } from 'react-i18next';
@@ -39,7 +39,6 @@ import {
 import { getEditRouteState } from 'applications/editor/tools/routeEdition/utils';
 import TOOL_TYPES from 'applications/editor/tools/toolTypes';
 import { EditoastType } from 'applications/editor/tools/types';
-import { getIsLoading } from 'reducers/main/mainSelector';
 import length from '@turf/length';
 import { CustomFlagSignalCheckbox } from './CustomFlagSignalCheckbox';
 import { PointEditionState } from './types';
@@ -199,10 +198,11 @@ export const PointEditionLeftPanel: FC<{ type: EditoastType }> = <Entity extends
   const dispatch = useDispatch();
   const { t } = useTranslation();
   const infraID = useSelector(getInfraID);
-  const isLoading = useSelector(getIsLoading);
-  const { state, setState } = useContext(EditorContext) as ExtendedEditorContextType<
-    PointEditionState<Entity>
-  >;
+  const { state, setState, isFormSubmited, setIsFormSubmited } = useContext(
+    EditorContext
+  ) as ExtendedEditorContextType<PointEditionState<Entity>>;
+  const submitBtnRef = useRef<HTMLButtonElement>(null);
+
   const isWayPoint = type === 'BufferStop' || type === 'Detector';
   const isNew = state.entity.properties.id === NEW_ENTITY_ID;
 
@@ -212,6 +212,16 @@ export const PointEditionLeftPanel: FC<{ type: EditoastType }> = <Entity extends
     | { type: 'ready'; id: string; track: TrackSectionEntity }
   >({ type: 'idle' });
 
+  // Hack to be able to launch the submit event from the rjsf form by using
+  // the toolbar button instead of the form one.
+  // See /~https://github.com/rjsf-team/react-jsonschema-form/issues/500
+  useEffect(() => {
+    if (isFormSubmited && setIsFormSubmited && submitBtnRef.current) {
+      submitBtnRef.current.click();
+      setIsFormSubmited(false);
+    }
+  }, [isFormSubmited]);
+
   useEffect(() => {
     const firstLoading = trackState.type === 'idle';
     const trackId = state.entity.properties.track as string | undefined;
@@ -343,12 +353,9 @@ export const PointEditionLeftPanel: FC<{ type: EditoastType }> = <Entity extends
           });
         }}
       >
-        <div className="text-right">
-          <button
-            type="submit"
-            className="btn btn-primary"
-            disabled={!state.entity.properties?.track || !state.entity.geometry || isLoading}
-          >
+        <div>
+          {/* We don't want to see the button but just be able to click on it */}
+          <button type="submit" ref={submitBtnRef} style={{ display: 'none' }}>
             {t('common.save')}
           </button>
         </div>

front/src/applications/editor/tools/pointEdition/tool-factory.tsx

@@ -1,12 +1,12 @@
 import React, { ComponentType } from 'react';
 import { cloneDeep, isEqual, omit } from 'lodash';
-import { Feature, LineString, Point } from 'geojson';
-import { BiReset } from 'react-icons/bi';
-import { AiOutlinePlus } from 'react-icons/ai';
-import { GoTrash } from 'react-icons/go';
 import { IconType } from 'react-icons';
-import nearestPointOnLine from '@turf/nearest-point-on-line';
+import { BiReset } from 'react-icons/bi';
+import { AiFillSave } from 'react-icons/ai';
+import { GoPlusCircle, GoTrash } from 'react-icons/go';
 import { Map } from 'maplibre-gl';
+import { Feature, LineString, Point } from 'geojson';
+import nearestPointOnLine from '@turf/nearest-point-on-line';
 
 import { save } from 'reducers/editor';
 import { ConfirmModal } from 'common/BootstrapSNCF/ModalSNCF';
@@ -18,14 +18,14 @@ import {
   SignalEntity,
   TrackSectionEntity,
 } from 'types';
+import { getNearestPoint } from 'utils/mapHelper';
 import { LAYER_TO_EDITOAST_DICT, LayerType } from '../types';
-import { getNearestPoint } from '../../../../utils/mapHelper';
-import { getPointEditionLeftPanel, POINT_LAYER_ID, PointEditionMessages } from './components';
-import { PointEditionState } from './types';
-import { getEntity } from '../../data/api';
 import { Tool } from '../editorContextTypes';
+import { getEntity } from '../../data/api';
+import { PointEditionState } from './types';
 import { DEFAULT_COMMON_TOOL_STATE } from '../commonToolState';
 import { approximateDistanceWithEditoastData } from '../utils';
+import { getPointEditionLeftPanel, POINT_LAYER_ID, PointEditionMessages } from './components';
 
 type EditorPoint = BufferStopEntity | DetectorEntity | SignalEntity;
 interface PointEditionToolParams<T extends EditorPoint> {
@@ -77,11 +77,16 @@ function getPointEditionTool<T extends EditorPoint>({
     actions: [
       [
         {
-          id: 'new-entity',
-          icon: AiOutlinePlus,
-          labelTranslationKey: `Editor.tools.${id}-edition.actions.new-entity`,
-          onClick({ setState }) {
-            setState(getInitialState());
+          id: 'save-entity',
+          icon: AiFillSave,
+          labelTranslationKey: `Editor.tools.${id}-edition.actions.save-entity`,
+          isDisabled({ isLoading, state }) {
+            return !state.entity.properties?.track || !state.entity.geometry || isLoading || false;
+          },
+          async onClick({ setIsFormSubmited }) {
+            if (setIsFormSubmited) {
+              setIsFormSubmited(true);
+            }
           },
         },
         {
@@ -98,6 +103,16 @@ function getPointEditionTool<T extends EditorPoint>({
           },
         },
       ],
+      [
+        {
+          id: 'new-entity',
+          icon: GoPlusCircle,
+          labelTranslationKey: `Editor.tools.${id}-edition.actions.new-entity`,
+          onClick({ setState }) {
+            setState(getInitialState());
+          },
+        },
+      ],
       [
         {
           id: 'delete-entity',