Use constants for AutoSaveIndicator savingState
This commit is contained in:
parent
7aa673a079
commit
594f1d47ed
|
@ -5,15 +5,20 @@ const {Alert} = require('react-bootstrap');
|
|||
const baseClassName = 'AutoSaveIndicator';
|
||||
const leaveClassName = `${baseClassName}-Leave`;
|
||||
|
||||
const SAVING_STATE_SAVING = 'saving';
|
||||
const SAVING_STATE_SAVED = 'saved';
|
||||
const SAVING_STATE_ERROR = 'error';
|
||||
const SAVING_STATE_DONE = 'done';
|
||||
|
||||
function getClassNameAndMessage(savingState, errorMessage) {
|
||||
switch (savingState) {
|
||||
case 'saving':
|
||||
case SAVING_STATE_SAVING:
|
||||
return {className: baseClassName, message: 'Saving...'};
|
||||
case 'saved':
|
||||
case SAVING_STATE_SAVED:
|
||||
return {className: baseClassName, message: 'Saved'};
|
||||
case 'error':
|
||||
case SAVING_STATE_ERROR:
|
||||
return {className: `${baseClassName}`, message: errorMessage};
|
||||
case 'done':
|
||||
case SAVING_STATE_DONE:
|
||||
return {className: `${baseClassName} ${leaveClassName}`, message: 'Saved'};
|
||||
default:
|
||||
return {className: `${baseClassName} ${leaveClassName}`, message: ''};
|
||||
|
@ -23,7 +28,6 @@ function getClassNameAndMessage(savingState, errorMessage) {
|
|||
function AutoSaveIndicator(props) {
|
||||
const {savingState, errorMessage, ...rest} = props;
|
||||
const {className, message} = getClassNameAndMessage(savingState, errorMessage);
|
||||
|
||||
return (
|
||||
<Alert
|
||||
className={className}
|
||||
|
@ -40,4 +44,11 @@ AutoSaveIndicator.propTypes = {
|
|||
errorMessage: PropTypes.string
|
||||
};
|
||||
|
||||
Object.assign(AutoSaveIndicator, {
|
||||
SAVING_STATE_SAVING,
|
||||
SAVING_STATE_SAVED,
|
||||
SAVING_STATE_ERROR,
|
||||
SAVING_STATE_DONE
|
||||
});
|
||||
|
||||
module.exports = AutoSaveIndicator;
|
||||
|
|
|
@ -46,8 +46,8 @@ const SettingsPage = createReactClass({
|
|||
initialState.showAddTeamForm = true;
|
||||
}
|
||||
initialState.savingState = {
|
||||
appOptions: 'done',
|
||||
servers: 'done'
|
||||
appOptions: AutoSaveIndicator.SAVING_STATE_DONE,
|
||||
servers: AutoSaveIndicator.SAVING_STATE_DONE
|
||||
};
|
||||
|
||||
return initialState;
|
||||
|
@ -82,14 +82,14 @@ const SettingsPage = createReactClass({
|
|||
console.error(err);
|
||||
}
|
||||
const savingState = Object.assign({}, this.state.savingState);
|
||||
savingState[configType] = err ? 'error' : 'saved';
|
||||
savingState[configType] = err ? AutoSaveIndicator.SAVING_STATE_ERROR : AutoSaveIndicator.SAVING_STATE_SAVED;
|
||||
this.setState({savingState});
|
||||
this.didSaveConfig(configType);
|
||||
});
|
||||
}, 500);
|
||||
}
|
||||
const savingState = Object.assign({}, this.state.savingState);
|
||||
savingState[configType] = 'saving';
|
||||
savingState[configType] = AutoSaveIndicator.SAVING_STATE_SAVING;
|
||||
this.setState({savingState});
|
||||
this.startSaveConfigImpl[configType]();
|
||||
},
|
||||
|
@ -101,7 +101,7 @@ const SettingsPage = createReactClass({
|
|||
if (!this.didSaveConfigImpl[configType]) {
|
||||
this.didSaveConfigImpl[configType] = debounce(() => {
|
||||
const savingState = Object.assign({}, this.state.savingState);
|
||||
savingState[configType] = 'done';
|
||||
savingState[configType] = AutoSaveIndicator.SAVING_STATE_DONE;
|
||||
this.setState({savingState});
|
||||
}, 2000);
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue