stickers stops dragging

This commit is contained in:
Fedor Katurov 2019-12-30 15:07:59 +07:00
parent fca52df9f5
commit 58eefd5670
10 changed files with 388 additions and 175 deletions

View file

@ -2,15 +2,18 @@ import { Map as MapInterface, map } from "leaflet";
import * as React from "react";
import { createPortal } from "react-dom";
import { MapContext } from "$utils/context.ts";
import { TileLayer } from "$containers/map/TileLayer";
import { Route } from "$containers/map/Route";
import { selectMapProvider, selectMapRoute } from "$redux/map/selectors";
import { selectMapProvider, selectMapRoute, selectMapStickers } from "$redux/map/selectors";
import { connect } from "react-redux";
import * as MAP_ACTIONS from "$redux/map/actions";
import { Route } from "$containers/map/Route";
import { TileLayer } from "$containers/map/TileLayer";
import { Stickers } from "$containers/map/Stickers";
const mapStateToProps = state => ({
provider: selectMapProvider(state),
route: selectMapRoute(state)
route: selectMapRoute(state),
stickers: selectMapStickers(state),
});
const mapDispatchToProps = {
@ -21,7 +24,7 @@ type IProps = React.HTMLAttributes<HTMLDivElement> &
ReturnType<typeof mapStateToProps> &
typeof mapDispatchToProps & {};
const MapUnconnected: React.FC<IProps> = ({ provider, route, mapSetRoute }) => {
const MapUnconnected: React.FC<IProps> = ({ provider, route, mapSetRoute, stickers }) => {
const ref = React.useRef(null);
const [maps, setMaps] = React.useState<MapInterface>(null);
@ -31,12 +34,13 @@ const MapUnconnected: React.FC<IProps> = ({ provider, route, mapSetRoute }) => {
setMaps(map(ref.current).setView([55.0153275, 82.9071235], 13));
}, [ref]);
// console.log('RERENDER!');
return createPortal(
<div ref={ref}>
<MapContext.Provider value={maps}>
<TileLayer provider={provider} />
<Route route={route} mapSetRoute={mapSetRoute} is_editing />
</MapContext.Provider>
<TileLayer provider={provider} map={maps} />
<Route route={route} mapSetRoute={mapSetRoute} map={maps} is_editing />
<Stickers stickers={stickers} map={maps} is_editing />
</div>,
document.getElementById("canvas")
);