save: save dialog and sagas

This commit is contained in:
muerwre 2018-11-27 14:48:57 +07:00
parent b586663827
commit 8fcca6587e
10 changed files with 161 additions and 88 deletions

View file

@ -1,7 +1,7 @@
import { ACTIONS } from '$redux/user/constants';
export const setUser = user => ({ type: ACTIONS.SET_USER, user });
export const userLogout = user => ({ type: ACTIONS.USER_LOGOUT });
export const userLogout = () => ({ type: ACTIONS.USER_LOGOUT });
export const setEditing = editing => ({ type: ACTIONS.SET_EDITING, editing });
@ -24,3 +24,11 @@ export const clearPoly = () => ({ type: ACTIONS.CLEAR_POLY });
export const clearStickers = () => ({ type: ACTIONS.CLEAR_STICKERS });
export const clearAll = () => ({ type: ACTIONS.CLEAR_ALL });
export const clearCancel = () => ({ type: ACTIONS.CLEAR_CANCEL });
export const sendSaveRequest = payload => ({ type: ACTIONS.SEND_SAVE_REQUEST, ...payload });
export const cancelSaveRequest = () => ({ type: ACTIONS.CANCEL_SAVE_REQUEST });
export const setSaveSuccess = payload => ({ type: ACTIONS.SET_SAVE_SUCCESS, ...payload });
export const setSaveError = save_error => ({ type: ACTIONS.SET_SAVE_ERROR, save_error });
export const setSaveOverwrite = () => ({ type: ACTIONS.SET_SAVE_OVERWRITE });

View file

@ -22,4 +22,11 @@ export const ACTIONS = {
CLEAR_STICKERS: 'CLEAR_STICKERS',
CLEAR_ALL: 'CLEAR_ALL',
CLEAR_CANCEL: 'CLEAR_CANCEL',
SEND_SAVE_REQUEST: 'SEND_SAVE_REQUEST',
CANCEL_SAVE_REQUEST: 'CANCEL_SAVE_REQUEST',
SET_SAVE_SUCCESS: 'SET_SAVE_SUCCESS',
SET_SAVE_ERROR: 'SET_SAVE_ERROR',
SET_SAVE_OVERWRITE: 'SET_SAVE_OVERWRITE',
};

View file

@ -18,7 +18,9 @@ const setUser = (state, { user }) => ({
});
const setEditing = (state, { editing }) => ({ ...state, editing });
const setChanged = (state, { changed }) => ({ ...state, changed });
const setChanged = (state, { changed }) => ({
...state, changed, ...state, save_overwriting: false, save_finished: false, save_processing: false, save_error: '',
});
const setMode = (state, { mode }) => ({ ...state, mode });
const setDistance = (state, { distance }) => ({
...state,
@ -33,6 +35,17 @@ const setLogo = (state, { logo }) => ({ ...state, logo });
const setTitle = (state, { title }) => ({ ...state, title });
const setAddress = (state, { address }) => ({ ...state, address });
const sendSaveRequest = state => ({ ...state, save_processing: true, });
const setSaveError = (state, { save_error }) => ({
...state, save_error, save_finished: false, save_processing: false
});
const setSaveOverwrite = state => ({
...state, save_overwriting: true, save_finished: false, save_processing: false
});
const setSaveSuccess = (state, { save_error }) => ({
...state, save_overwriting: false, save_finished: true, save_processing: false, save_error
});
const HANDLERS = {
[ACTIONS.SET_USER]: setUser,
[ACTIONS.SET_EDITING]: setEditing,
@ -44,6 +57,11 @@ const HANDLERS = {
[ACTIONS.SET_LOGO]: setLogo,
[ACTIONS.SET_TITLE]: setTitle,
[ACTIONS.SET_ADDRESS]: setAddress,
[ACTIONS.SET_SAVE_ERROR]: setSaveError,
[ACTIONS.SET_SAVE_OVERWRITE]: setSaveOverwrite,
[ACTIONS.SET_SAVE_SUCCESS]: setSaveSuccess,
[ACTIONS.SEND_SAVE_REQUEST]: sendSaveRequest,
};
export const INITIAL_STATE = {
@ -58,6 +76,11 @@ export const INITIAL_STATE = {
title: 0,
address: '',
changed: false,
save_error: '',
save_finished: false,
save_overwriting: false,
save_processing: false,
};
export const userReducer = createReducer(INITIAL_STATE, HANDLERS);

View file

@ -1,12 +1,22 @@
import { REHYDRATE } from 'redux-persist';
import { takeLatest, select, call, put, takeEvery } from 'redux-saga/effects';
import { checkUserToken, getGuestToken, getStoredMap } from '$utils/api';
import { setActiveSticker, setChanged, setEditing, setMode, setUser } from '$redux/user/actions';
import { delay } from 'redux-saga';
import { takeLatest, select, call, put, takeEvery, race, take } from 'redux-saga/effects';
import { checkUserToken, getGuestToken, getStoredMap, postMap } from '$utils/api';
import {
setActiveSticker, setAddress,
setChanged,
setEditing,
setMode,
setSaveError,
setSaveOverwrite, setSaveSuccess, setTitle,
setUser
} from '$redux/user/actions';
import { getUrlData, pushPath } from '$utils/history';
import { editor } from '$modules/Editor';
import { ACTIONS } from '$redux/user/constants';
import { MODES } from '$constants/modes';
import { DEFAULT_USER } from '$constants/auth';
import { TIPS } from '$constants/tips';
const getUser = state => (state.user.user);
const getState = state => (state.user);
@ -172,6 +182,41 @@ function* clearSaga({ type }) {
yield put(setMode(MODES.NONE));
}
function* sendSaveRequestSaga({ title, address, force }) {
if (editor.isEmpty()) {
return yield put(setSaveError(TIPS.SAVE_EMPTY));
}
const { route, stickers } = editor.dumpData();
const { id, token } = yield select(getUser);
const { result, timeout, cancel } = yield race({
result: postMap({
id, token, route, stickers, title, force, address
}),
timeout: delay(10000),
cancel: take(ACTIONS.CANCEL_SAVE_REQUEST),
});
if (cancel) return yield put(setMode(MODES.NONE));
if (result && result.mode === 'overwriting') return yield put(setSaveOverwrite());
if (timeout || !result || !result.success || !result.address) return yield put(setSaveError(TIPS.SAVE_TIMED_OUT));
return yield put(setSaveSuccess({ address: result.address, save_error: TIPS.SAVE_SUCCESS, title }));
}
function* setSaveSuccessSaga({ address, title }) {
const { id } = yield select(getUser);
pushPath(`/${address}/edit`);
yield put(setTitle(title));
yield put(setAddress(address));
// yield editor.setAddress(address);
yield editor.owner = id;
return yield editor.setInitialData();
}
export function* userSaga() {
// ASYNCHRONOUS!!! :-)
@ -194,4 +239,6 @@ export function* userSaga() {
ACTIONS.CLEAR_CANCEL,
], clearSaga);
yield takeLatest(ACTIONS.SEND_SAVE_REQUEST, sendSaveRequestSaga);
yield takeLatest(ACTIONS.SET_SAVE_SUCCESS, setSaveSuccessSaga);
}