modern/src/map/SelectedDeviceMap.js


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

import { useEffect } from 'react';
import { useSelector } from 'react-redux';

import { map } from './Map';

const SelectedDeviceMap = () => {
  const mapCenter = useSelector((state) => {
    if (state.devices.selectedId) {
      const position = state.positions.items[state.devices.selectedId] || null;
      if (position) {
        return [position.longitude, position.latitude];
      }
    }
    return null;
  });

  useEffect(() => {
    map.easeTo({ center: mapCenter });
  }, [mapCenter]);

  return null;
};

export default SelectedDeviceMap;