mirror of
https://github.com/reduxjs/redux-devtools.git
synced 2024-11-13 05:06:50 +03:00
Add JUMP_TO_STATE action for slider-like monitors
This commit is contained in:
parent
60b9451993
commit
be4014bd62
|
@ -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 };
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
@ -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,
|
||||||
|
|
Loading…
Reference in New Issue
Block a user