import React, { Fragment } from 'react';

import { useSelector } from 'react-redux';

import { MapState } from '../../store/map';

const CurrentLocation: React.FC<{}> = () => {
  const scale = useSelector(
    (state: { map: MapState }) => state.map.whiteboard.scale
  );
  const CurrentLocationState = useSelector(
    (state: { map: MapState }) => state.map.currentLocation
  );

  return (
    <circle
      cx={CurrentLocationState.whiteboard.x}
      cy={CurrentLocationState.whiteboard.y}
      r={10 / scale}
      fill='green'
      opacity='50%'
    ></circle>
  );
};

export default CurrentLocation;