front: map smooth animation configuration for pathfinding errors

Fix #8404 Signed-off-by: Benoit Simard <contact@bsimard.com>
OpenRailAssociation · Oct 22, 2024 · b375a45 · b375a45
1 parent 02e76f0
commit b375a45
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 3 deletions.
diff --git a/...rc/modules/pathfinding/components/IncompatibleConstraints/IncompatibleConstraintsList.tsx b/...rc/modules/pathfinding/components/IncompatibleConstraints/IncompatibleConstraintsList.tsx
@@ -2,6 +2,9 @@ import { useMemo } from 'react';
 
 import { debounce, sortBy } from 'lodash';
 import { useMap } from 'react-map-gl/maplibre';
+import { useSelector } from 'react-redux';
+
+import { getMap } from 'reducers/map/selectors';
 
 import IncompatibleConstraintItem from './IncompatibleConstraintsItem';
 import type { IncompatibleConstraintEnhanced } from './types';
@@ -21,6 +24,7 @@ const IncompatibleConstraintsList = ({
   onHover,
   onSelect,
 }: IncompatibleConstraintListProps) => {
+  const { smoothTravel } = useSelector(getMap);
   const map = useMap();
   const items = useMemo(() => sortBy(data, ['start', 'end']), [data]);
 
@@ -40,7 +44,7 @@ const IncompatibleConstraintsList = ({
             onClick={() => onSelect(item.id)}
             gotoMap={() => {
               if (!isSelected) onSelect(item.id);
-              map.current?.fitBounds(item.bbox);
+              map.current?.fitBounds(item.bbox, { animate: smoothTravel });
             }}
           />
         );

diff --git a/...odules/pathfinding/components/IncompatibleConstraints/IncompatibleConstraintsMapFocus.tsx b/...odules/pathfinding/components/IncompatibleConstraints/IncompatibleConstraintsMapFocus.tsx
@@ -5,21 +5,27 @@ import bbox from '@turf/bbox';
 import type { FeatureCollection, LineString } from '@turf/helpers';
 import { useTranslation } from 'react-i18next';
 import { useMap } from 'react-map-gl/maplibre';
+import { useSelector } from 'react-redux';
+
+import { getMap } from 'reducers/map/selectors';
 
 interface IncompatibleConstraintsMapFocusProps extends HTMLAttributes<unknown> {
   geojson?: FeatureCollection<LineString, unknown>;
 }
 
 const IncompatibleConstraintsMapFocus = (props: IncompatibleConstraintsMapFocusProps) => {
   const map = useMap();
+  const { smoothTravel } = useSelector(getMap);
   const { t } = useTranslation(['operationalStudies/manageTrainSchedule']);
   const { geojson, ...attrs } = props;
 
   const mapFocusOnPath = useCallback(() => {
     if (geojson) {
-      map.current?.fitBounds(bbox(geojson) as [number, number, number, number]);
+      map.current?.fitBounds(bbox(geojson) as [number, number, number, number], {
+        animate: smoothTravel,
+      });
     }
-  }, [map, geojson]);
+  }, [map, geojson, smoothTravel]);
 
   return (
     <button