Confirm navigation when it would discard unsaved changes

- New state field: `state.entryDraft.hasChanged`, initialized to
  `false`.

- `state.entryDraft.hasChanged` set to `true` in `entryDraft` reducer
  for `DRAFT_CHANGE_FIELD`.

- `EntryPage` adds a `listenBefore` listener to `history` on
  `componentDidMount` that checks `this.props.entryDraft.hasChanged`
  and, if that is true, asks the user to confirm the navigation.

- `EntryPage` removes its listener on `componentWillUnmount`.
This commit is contained in:
Benaiah Mischenko
2017-03-15 10:47:03 -07:00
parent e7dc2c4e84
commit a88b2d6c9f
3 changed files with 27 additions and 2 deletions

View File

@ -2,7 +2,13 @@ import { Map, List, fromJS } from 'immutable';
import * as actions from '../../actions/entries';
import reducer from '../entryDraft';
let initialState = Map({ entry: Map(), mediaFiles: List(), fieldsMetaData: Map(), fieldsErrors: Map() });
let initialState = Map({
entry: Map(),
mediaFiles: List(),
fieldsMetaData: Map(),
fieldsErrors: Map(),
hasChanged: false,
});
const entry = {
collection: 'posts',
@ -31,6 +37,7 @@ describe('entryDraft reducer', () => {
mediaFiles: [],
fieldsMetaData: Map(),
fieldsErrors: Map(),
hasChanged: false,
})
);
});
@ -52,6 +59,7 @@ describe('entryDraft reducer', () => {
mediaFiles: [],
fieldsMetaData: Map(),
fieldsErrors: Map(),
hasChanged: false,
})
);
});
@ -77,6 +85,7 @@ describe('entryDraft reducer', () => {
raw: 'updated',
},
mediaFiles: [],
hasChanged: true,
}));
});
});

View File

@ -19,7 +19,13 @@ import {
REMOVE_ASSET,
} from '../actions/media';
const initialState = Map({ entry: Map(), mediaFiles: List(), fieldsMetaData: Map(), fieldsErrors: Map() });
const initialState = Map({
entry: Map(),
mediaFiles: List(),
fieldsMetaData: Map(),
fieldsErrors: Map(),
hasChanged: false,
});
const entryDraftReducer = (state = Map(), action) => {
switch (action.type) {
@ -47,6 +53,7 @@ const entryDraftReducer = (state = Map(), action) => {
return state.withMutations((state) => {
state.setIn(['entry', 'data', action.payload.field], action.payload.value);
state.mergeIn(['fieldsMetaData'], fromJS(action.payload.metadata));
state.set('hasChanged', true);
});
case DRAFT_VALIDATION_ERRORS: