diff --git a/frontend/src/component/feature/feature-list-item-component.jsx b/frontend/src/component/feature/feature-list-item-component.jsx index 8edd528ca7..eb11829b3b 100644 --- a/frontend/src/component/feature/feature-list-item-component.jsx +++ b/frontend/src/component/feature/feature-list-item-component.jsx @@ -8,7 +8,7 @@ import styles from './feature.scss'; const Feature = ({ feature, - onFeatureClick, + toggleFeature, settings, metricsLastHour = { yes: 0, no: 0, isFallback: true }, metricsLastMinute = { yes: 0, no: 0, isFallback: true }, @@ -39,7 +39,7 @@ const Feature = ({ - onFeatureClick(feature)} checked={enabled} /> + toggleFeature(name)} checked={enabled} /> @@ -58,7 +58,7 @@ const Feature = ({ Feature.propTypes = { feature: PropTypes.object, - onFeatureClick: PropTypes.func, + toggleFeature: PropTypes.func, }; export default Feature; diff --git a/frontend/src/component/feature/form-add-container.jsx b/frontend/src/component/feature/form-add-container.jsx index 4bf589dce1..eb6277e3e1 100644 --- a/frontend/src/component/feature/form-add-container.jsx +++ b/frontend/src/component/feature/form-add-container.jsx @@ -19,6 +19,11 @@ const prepare = (methods, dispatch) => { methods.onSubmit = (input) => ( (e) => { e.preventDefault(); + + input.strategies.forEach((s) => { + delete s.id; + }); + createFeatureToggles(input)(dispatch) .then(() => methods.clear()) .then(() => hashHistory.push(`/features/edit/${input.name}`)); diff --git a/frontend/src/component/feature/form-edit-container.jsx b/frontend/src/component/feature/form-edit-container.jsx index f19d36c67a..95315a0451 100644 --- a/frontend/src/component/feature/form-edit-container.jsx +++ b/frontend/src/component/feature/form-edit-container.jsx @@ -29,6 +29,10 @@ const prepare = (methods, dispatch) => { methods.onSubmit = (input) => ( (e) => { e.preventDefault(); + + input.strategies.forEach((s) => { + delete s.id; + }); // TODO: should add error handling requestUpdateFeatureToggle(input)(dispatch) .then(() => methods.clear()) diff --git a/frontend/src/component/feature/list-component.jsx b/frontend/src/component/feature/list-component.jsx index 991f9e4d80..c7d923db9f 100644 --- a/frontend/src/component/feature/list-component.jsx +++ b/frontend/src/component/feature/list-component.jsx @@ -9,7 +9,7 @@ export default class FeatureListComponent extends React.PureComponent { static propTypes () { return { - onFeatureClick: PropTypes.func.isRequired, + toggleFeature: PropTypes.func.isRequired, features: PropTypes.array.isRequired, featureMetrics: PropTypes.object.isRequired, fetchFeatureToggles: PropTypes.func.isRequired, @@ -46,7 +46,7 @@ export default class FeatureListComponent extends React.PureComponent { } render () { - const { features, onFeatureClick, featureMetrics, settings } = this.props; + const { features, toggleFeature, featureMetrics, settings } = this.props; return (
@@ -103,7 +103,7 @@ export default class FeatureListComponent extends React.PureComponent { metricsLastHour={featureMetrics.lastHour[feature.name]} metricsLastMinute={featureMetrics.lastMinute[feature.name]} feature={feature} - onFeatureClick={onFeatureClick}/> + toggleFeature={toggleFeature}/> )}
diff --git a/frontend/src/component/feature/list-container.jsx b/frontend/src/component/feature/list-container.jsx index ec8ccbd799..625dec856a 100644 --- a/frontend/src/component/feature/list-container.jsx +++ b/frontend/src/component/feature/list-container.jsx @@ -70,7 +70,7 @@ const mapStateToProps = (state) => { }; const mapDispatchToProps = { - onFeatureClick: toggleFeature, + toggleFeature, fetchFeatureToggles, fetchFeatureMetrics, updateSetting: updateSettingForGroup('feature'), diff --git a/frontend/src/component/feature/view-component.jsx b/frontend/src/component/feature/view-component.jsx index 2e3ece9b55..f4cf481c4d 100644 --- a/frontend/src/component/feature/view-component.jsx +++ b/frontend/src/component/feature/view-component.jsx @@ -92,7 +92,7 @@ export default class ViewFeatureToggleComponent extends React.Component { return (

- toggleFeature(featureToggle)} /> + toggleFeature(featureToggle.name)} /> {featureToggle.name} {featureToggle.enabled ? 'is enabled' : 'is disabled'} diff --git a/frontend/src/data/feature-api.js b/frontend/src/data/feature-api.js index cd6b06edf6..8be11f6d28 100644 --- a/frontend/src/data/feature-api.js +++ b/frontend/src/data/feature-api.js @@ -50,6 +50,15 @@ function update (featureToggle) { .then(throwIfNotSuccess); } +function toggle (name) { + return fetch(`${URI}/${name}/toggle`, { + method: 'POST', + headers, + credentials: 'include', + }) + .then(throwIfNotSuccess); +} + function remove (featureToggleName) { return fetch(`${URI}/${featureToggleName}`, { method: 'DELETE', @@ -62,5 +71,6 @@ module.exports = { create, validate, update, + toggle, remove, }; diff --git a/frontend/src/store/feature-actions.js b/frontend/src/store/feature-actions.js index c21304f8b7..6c0fbcb046 100644 --- a/frontend/src/store/feature-actions.js +++ b/frontend/src/store/feature-actions.js @@ -15,11 +15,10 @@ export const ERROR_CREATING_FEATURE_TOGGLE = 'ERROR_CREATING_FEATURE_TOGGLE'; export const ERROR_UPDATE_FEATURE_TOGGLE = 'ERROR_UPDATE_FEATURE_TOGGLE'; export const ERROR_REMOVE_FEATURE_TOGGLE = 'ERROR_REMOVE_FEATURE_TOGGLE'; -export function toggleFeature (featureToggle) { - debug('Toggle feature toggle ', featureToggle); +export function toggleFeature (name) { + debug('Toggle feature toggle ', name); return dispatch => { - const newValue = Object.assign({}, featureToggle, { enabled: !featureToggle.enabled }); - dispatch(requestUpdateFeatureToggle(newValue)); + dispatch(requestToggleFeatureToggle(name)); }; }; @@ -68,6 +67,16 @@ export function createFeatureToggles (featureToggle) { }; } +export function requestToggleFeatureToggle (name) { + return dispatch => { + dispatch({ type: START_UPDATE_FEATURE_TOGGLE }); + + return api.toggle(name) + .then(() => dispatch({ type: TOGGLE_FEATURE_TOGGLE, name })) + .catch(dispatchAndThrow(dispatch, ERROR_UPDATE_FEATURE_TOGGLE)); + }; +} + export function requestUpdateFeatureToggle (featureToggle) { return dispatch => { dispatch({ type: START_UPDATE_FEATURE_TOGGLE }); diff --git a/frontend/src/store/feature-store.js b/frontend/src/store/feature-store.js index ef17ff6663..e3a4f4850e 100644 --- a/frontend/src/store/feature-store.js +++ b/frontend/src/store/feature-store.js @@ -7,6 +7,7 @@ import { RECEIVE_FEATURE_TOGGLES, UPDATE_FEATURE_TOGGLE, REMOVE_FEATURE_TOGGLE, + TOGGLE_FEATURE_TOGGLE, } from './feature-actions'; @@ -18,6 +19,15 @@ const features = (state = new List([]), action) => { case REMOVE_FEATURE_TOGGLE: debug(REMOVE_FEATURE_TOGGLE, action); return state.filter(toggle => toggle.get('name') !== action.featureToggleName); + case TOGGLE_FEATURE_TOGGLE: + debug(TOGGLE_FEATURE_TOGGLE, action); + return state.map(toggle => { + if (toggle.get('name') === action.name) { + return toggle.set('enabled', !toggle.get('enabled')); + } else { + return toggle; + } + }); case UPDATE_FEATURE_TOGGLE: debug(UPDATE_FEATURE_TOGGLE, action); return state.map(toggle => {