reduxjs/redux-devtools
1
1
Fork 0
mirror of https://github.com/reduxjs/redux-devtools.git synced 2024-11-22 09:36:43 +03:00
Code Issues Packages Projects Releases Wiki Activity

Add JUMP_TO_STATE action for slider-like monitors

Browse Source
This commit is contained in:
Dan Abramov 2015-07-15 01:43:09 +03:00
parent 60b9451993
commit be4014bd62
2 changed files with 26 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
src/devTools.js
View File

@ -4,17 +4,14 @@ const ActionTypes = {
ROLLBACK: 'ROLLBACK', ROLLBACK: 'ROLLBACK',
COMMIT: 'COMMIT', COMMIT: 'COMMIT',
SWEEP: 'SWEEP', SWEEP: 'SWEEP',
TOGGLE_ACTION: 'TOGGLE_ACTION' TOGGLE_ACTION: 'TOGGLE_ACTION',
JUMP_TO_STATE: 'JUMP_TO_STATE'
}; };
const INIT_ACTION = { const INIT_ACTION = {
type: '@@INIT' type: '@@INIT'
}; };
function last(arr) {
return arr[arr.length - 1];
}
function toggle(obj, key) { function toggle(obj, key) {
const clone = { ...obj }; const clone = { ...obj };
if (clone[key]) { if (clone[key]) {
@ -84,7 +81,8 @@ function liftReducer(reducer, initialState) {
const initialLiftedState = { const initialLiftedState = {
committedState: initialState, committedState: initialState,
stagedActions: [INIT_ACTION], stagedActions: [INIT_ACTION],
skippedActions: {} skippedActions: {},
currentStateIndex: 0
}; };
/** /**
@ -95,7 +93,8 @@ function liftReducer(reducer, initialState) {
committedState, committedState,
stagedActions, stagedActions,
skippedActions, skippedActions,
computedStates computedStates,
currentStateIndex
} = liftedState; } = liftedState;
switch (liftedAction.type) { switch (liftedAction.type) {
@ -103,26 +102,35 @@ function liftReducer(reducer, initialState) {
committedState = initialState; committedState = initialState;
stagedActions = [INIT_ACTION]; stagedActions = [INIT_ACTION];
skippedActions = {}; skippedActions = {};
currentStateIndex = 0;
break; break;
case ActionTypes.COMMIT: case ActionTypes.COMMIT:
committedState = last(computedStates).state; committedState = computedStates[currentStateIndex].state;
stagedActions = [INIT_ACTION]; stagedActions = [INIT_ACTION];
skippedActions = {}; skippedActions = {};
currentStateIndex = 0;
break; break;
case ActionTypes.ROLLBACK: case ActionTypes.ROLLBACK:
stagedActions = [INIT_ACTION]; stagedActions = [INIT_ACTION];
skippedActions = {}; skippedActions = {};
currentStateIndex = 0;
break; break;
case ActionTypes.TOGGLE_ACTION: case ActionTypes.TOGGLE_ACTION:
const { index } = liftedAction; skippedActions = toggle(skippedActions, liftedAction.index);
skippedActions = toggle(skippedActions, index); break;
case ActionTypes.JUMP_TO_STATE:
currentStateIndex = liftedAction.index;
break; break;
case ActionTypes.SWEEP: case ActionTypes.SWEEP:
stagedActions = stagedActions.filter((_, i) => !skippedActions[i]); stagedActions = stagedActions.filter((_, i) => !skippedActions[i]);
skippedActions = {}; skippedActions = {};
currentStateIndex = Math.max(currentStateIndex, stagedActions.length - 1);
break; break;
case ActionTypes.PERFORM_ACTION: case ActionTypes.PERFORM_ACTION:
const { action } = liftedAction; const { action } = liftedAction;
if (currentStateIndex === stagedActions.length - 1) {
currentStateIndex++;
}
stagedActions = [...stagedActions, action]; stagedActions = [...stagedActions, action];
break; break;
default: default:
@ -140,7 +148,8 @@ function liftReducer(reducer, initialState) {
committedState, committedState,
stagedActions, stagedActions,
skippedActions, skippedActions,
computedStates computedStates,
currentStateIndex
}; };
}; };
} }
@ -157,8 +166,8 @@ function liftAction(action) {
* Unlifts the DevTools state to the app state. * Unlifts the DevTools state to the app state.
*/ */
function unliftState(liftedState) { function unliftState(liftedState) {
const { computedStates } = liftedState; const { computedStates, currentStateIndex } = liftedState;
const { state } = last(computedStates); const { state } = computedStates[currentStateIndex];
return state; return state;
} }
@ -197,6 +206,9 @@ export const ActionCreators = {
}, },
toggleAction(index) { toggleAction(index) {
return { type: ActionTypes.TOGGLE_ACTION, index }; return { type: ActionTypes.TOGGLE_ACTION, index };
},
jumpToState(index) {
return { type: ActionTypes.JUMP_TO_STATE, index };
} }
}; };

1
src/react/LogMonitor.js
View File

@ -4,6 +4,7 @@ import LogMonitorEntry from './LogMonitorEntry';
export default class LogMonitor { export default class LogMonitor {
static propTypes = { static propTypes = {
computedStates: PropTypes.array.isRequired, computedStates: PropTypes.array.isRequired,
currentStateIndex: PropTypes.number.isRequired,
stagedActions: PropTypes.array.isRequired, stagedActions: PropTypes.array.isRequired,
skippedActions: PropTypes.object.isRequired, skippedActions: PropTypes.object.isRequired,
reset: PropTypes.func.isRequired, reset: PropTypes.func.isRequired,