1 files changed, 30 insertions, 0 deletions
diff --git a/modern/src/map/main/SelectedDeviceMap.js b/modern/src/map/main/SelectedDeviceMap.js
new file mode 100644
index 00000000..b5392b70
--- /dev/null
+++ b/modern/src/map/main/SelectedDeviceMap.js
@@ -0,0 +1,30 @@
+import { useEffect } from 'react';
+
+import { useSelector } from 'react-redux';
+import dimensions from '../../theme/dimensions';
+import { map } from '../core/Map';
+import { usePrevious } from '../../reactHelper';
+import usePersistedState from '../../common/usePersistedState';
+
+const SelectedDeviceMap = () => {
+  const selectedDeviceId = useSelector((state) => state.devices.selectedId);
+  const previousDeviceId = usePrevious(selectedDeviceId);
+
+  const position = useSelector((state) => state.positions.items[selectedDeviceId]);
+
+  const [mapFollow] = usePersistedState('mapFollow', false);
+
+  useEffect(() => {
+    if ((selectedDeviceId !== previousDeviceId || mapFollow) && position) {
+      map.easeTo({
+        center: [position.longitude, position.latitude],
+        zoom: Math.max(map.getZoom(), 10),
+        offset: [0, -dimensions.popupMapOffset / 2],
+      });
+    }
+  });
+
+  return null;
+};
+
+export default SelectedDeviceMap;