better change handling on map change

This commit is contained in:
Fedor Katurov 2020-01-14 12:38:11 +07:00
parent d8b51e0b1a
commit a06326fb1c
4 changed files with 36 additions and 20 deletions

View file

@ -18,6 +18,11 @@ export const mapSetRoute = (route: IMapReducer['route']) => ({
route, route,
}); });
export const mapSetStickers = (stickers: IStickerDump[]) => ({
type: MAP_ACTIONS.SET_STICKERS,
stickers,
});
export const mapSetSticker = (index: number, sticker: IStickerDump) => ({ export const mapSetSticker = (index: number, sticker: IStickerDump) => ({
type: MAP_ACTIONS.SET_STICKER, type: MAP_ACTIONS.SET_STICKER,
index, index,

View file

@ -14,6 +14,7 @@ export const MAP_ACTIONS = {
ADD_STICKER: `${P}-ADD_STICKER`, ADD_STICKER: `${P}-ADD_STICKER`,
SET_STICKER: `${P}-SET_STICKER`, SET_STICKER: `${P}-SET_STICKER`,
SET_STICKERS: `${P}-SET_STICKERS`,
DROP_STICKER: `${P}-DROP_STICKER`, DROP_STICKER: `${P}-DROP_STICKER`,
MAP_CLICKED: `${P}-MAP_CLICKED` MAP_CLICKED: `${P}-MAP_CLICKED`

View file

@ -13,6 +13,7 @@ import {
mapSetPublic, mapSetPublic,
mapSetLogo, mapSetLogo,
mapSetAddressOrigin, mapSetAddressOrigin,
mapSetStickers,
} from './actions'; } from './actions';
const setMap = (state: IMapReducer, { map }: ReturnType<typeof mapSet>): IMapReducer => ({ const setMap = (state: IMapReducer, { map }: ReturnType<typeof mapSet>): IMapReducer => ({
@ -33,6 +34,14 @@ const setRoute = (state: IMapReducer, { route }: ReturnType<typeof mapSetRoute>)
route, route,
}); });
const setStickers = (
state: IMapReducer,
{ stickers }: ReturnType<typeof mapSetStickers>
): IMapReducer => ({
...state,
stickers,
});
const setSticker = ( const setSticker = (
state: IMapReducer, state: IMapReducer,
{ sticker, index }: ReturnType<typeof mapSetSticker> { sticker, index }: ReturnType<typeof mapSetSticker>
@ -97,6 +106,7 @@ export const MAP_HANDLERS = {
[MAP_ACTIONS.SET_PROVIDER]: setProvider, [MAP_ACTIONS.SET_PROVIDER]: setProvider,
[MAP_ACTIONS.SET_ROUTE]: setRoute, [MAP_ACTIONS.SET_ROUTE]: setRoute,
[MAP_ACTIONS.SET_STICKER]: setSticker, [MAP_ACTIONS.SET_STICKER]: setSticker,
[MAP_ACTIONS.SET_STICKERS]: setStickers,
[MAP_ACTIONS.DROP_STICKER]: dropSticker, [MAP_ACTIONS.DROP_STICKER]: dropSticker,
[MAP_ACTIONS.ADD_STICKER]: addSticker, [MAP_ACTIONS.ADD_STICKER]: addSticker,
[MAP_ACTIONS.SET_TITLE]: setTitle, [MAP_ACTIONS.SET_TITLE]: setTitle,

View file

@ -16,6 +16,8 @@ import {
mapSet, mapSet,
mapSetTitle, mapSetTitle,
mapSetAddressOrigin, mapSetAddressOrigin,
mapSetRoute,
mapSetStickers,
} from './actions'; } from './actions';
import { selectUser, selectUserUser } from '~/redux/user/selectors'; import { selectUser, selectUserUser } from '~/redux/user/selectors';
import { MODES } from '~/constants/modes'; import { MODES } from '~/constants/modes';
@ -32,7 +34,7 @@ import {
import { pushLoaderState, getUrlData, pushPath } from '~/utils/history'; import { pushLoaderState, getUrlData, pushPath } from '~/utils/history';
import { getStoredMap, postMap } from '~/utils/api'; import { getStoredMap, postMap } from '~/utils/api';
import { Unwrap } from '~/utils/middleware'; import { Unwrap } from '~/utils/middleware';
import { selectMap, selectMapProvider } from './selectors'; import { selectMap, selectMapProvider, selectMapRoute, selectMapStickers } from './selectors';
import { TIPS } from '~/constants/tips'; import { TIPS } from '~/constants/tips';
import { delay } from 'redux-saga'; import { delay } from 'redux-saga';
import { setReadySaga } from '../editor/sagas'; import { setReadySaga } from '../editor/sagas';
@ -169,29 +171,26 @@ function* startEditingSaga() {
} }
function* clearPolySaga() { function* clearPolySaga() {
yield put( const route: ReturnType<typeof selectMapRoute> = yield select(selectMapRoute)
mapSet({ if (!route.length) return;
route: [], yield put(mapSetRoute([]));
})
);
} }
function* clearStickersSaga() { function* clearStickersSaga() {
yield put( const stickers: ReturnType<typeof selectMapStickers> = yield select(selectMapStickers)
mapSet({ if (!stickers.length) return;
stickers: [], yield put(mapSetStickers([]));
})
);
} }
function* clearAllSaga() { function* clearAllSaga() {
const route: ReturnType<typeof selectMapRoute> = yield select(selectMapRoute)
const stickers: ReturnType<typeof selectMapStickers> = yield select(selectMapStickers)
if (!stickers.length && !route.length) return;
yield put(editorSetChanged(false)); yield put(editorSetChanged(false));
yield put( yield put(mapSetRoute([]));
mapSet({ yield put(mapSetStickers([]));
route: [],
stickers: [],
})
);
} }
function* clearSaga({ type }) { function* clearSaga({ type }) {
@ -321,15 +320,16 @@ function* setChanged() {
} }
export function* mapSaga() { export function* mapSaga() {
yield takeEvery([MAP_ACTIONS.SET_ROUTE, MAP_ACTIONS.SET_STICKER], setChanged); yield takeEvery(
[MAP_ACTIONS.SET_ROUTE, MAP_ACTIONS.SET_STICKER, MAP_ACTIONS.SET_STICKERS],
setChanged
);
// TODO: setChanged on set route, logo, provider, stickers
yield takeEvery(EDITOR_ACTIONS.START_EDITING, startEditingSaga); yield takeEvery(EDITOR_ACTIONS.START_EDITING, startEditingSaga);
yield takeEvery(EDITOR_ACTIONS.SET_ACTIVE_STICKER, setActiveStickerSaga); yield takeEvery(EDITOR_ACTIONS.SET_ACTIVE_STICKER, setActiveStickerSaga);
yield takeEvery(MAP_ACTIONS.MAP_CLICKED, onMapClick); yield takeEvery(MAP_ACTIONS.MAP_CLICKED, onMapClick);
yield takeEvery(MAP_ACTIONS.SET_TITLE, setTitleSaga); yield takeEvery(MAP_ACTIONS.SET_TITLE, setTitleSaga);
yield takeLatest(EDITOR_ACTIONS.SEND_SAVE_REQUEST, sendSaveRequestSaga); yield takeLatest(EDITOR_ACTIONS.SEND_SAVE_REQUEST, sendSaveRequestSaga);
// yield takeLatest(EDITOR_ACTIONS.SET_SAVE_SUCCESS, setSaveSuccessSaga);
yield takeEvery( yield takeEvery(
[ [