import React from "react";
import { map } from "../../mapContext";
import { providerMap } from "../../providerMap";
import MarkerNearSpace from "../../components/MarkerNearSpace";
import { tipOptions } from "../../utils/config";
import * as L from "leaflet";

@providerMap({ className: "single-points-map", mapConfig: { scrollWheelZoom: false } })
@map
class SinglePointMap extends React.Component {
  constructor(props) {
    super(props);
    this.marker = null;
  }
  componentWillUnmount() {
    this.marker = null;
  }
  createCallback = marker => {
    const { point } = this.props;
    this.marker = marker;
    // bug [8242] " || point.cameraName", modify by zhangyu 2020.4.14
    this.marker.bindTooltip(point.deviceName || point.cameraName, { ...tipOptions, offset: L.point(0, -45) });
  };
  render() {
    const { point } = this.props;
    return <MarkerNearSpace point={point} isNearSpace={true} createCallback={this.createCallback} />;
  }
}

export default SinglePointMap;
