diff --git a/packages/unleash-frontend-next/src/component/feature/ConfigureStrategy.jsx b/packages/unleash-frontend-next/src/component/feature/ConfigureStrategy.jsx
index 1c55c21951..ea142c95e9 100644
--- a/packages/unleash-frontend-next/src/component/feature/ConfigureStrategy.jsx
+++ b/packages/unleash-frontend-next/src/component/feature/ConfigureStrategy.jsx
@@ -75,8 +75,8 @@ class ConfigureStrategy extends React.Component {
{this.renderInputFields(selectedStrategy)}
-
-
+
+
);
}
diff --git a/packages/unleash-frontend-next/src/component/feature/ConfiguredStrategies.jsx b/packages/unleash-frontend-next/src/component/feature/ConfiguredStrategies.jsx
index 9c5d61073e..40c2067a20 100644
--- a/packages/unleash-frontend-next/src/component/feature/ConfiguredStrategies.jsx
+++ b/packages/unleash-frontend-next/src/component/feature/ConfiguredStrategies.jsx
@@ -1,5 +1,5 @@
import React, { PropTypes } from 'react';
-import { Chip } from 'react-toolbox';
+import { Avatar, Chip } from 'react-toolbox';
class ConfiguredStrategies extends React.Component {
static propTypes () {
@@ -10,9 +10,10 @@ class ConfiguredStrategies extends React.Component {
}
renderName (strategy) {
- const params = Object.keys(strategy.parameters)
- .map(param => `${param}='${strategy.parameters[param]}'`)
- .join(', ');
+ const parameters = strategy.parameters || {};
+ const params = Object.keys(parameters)
+ .map(param => `${param}="${strategy.parameters[param]}"`)
+ .join('; ');
return {strategy.name} ({params});
}
@@ -22,14 +23,16 @@ class ConfiguredStrategies extends React.Component {
removeStrategy(s)}>
+ onDeleteClick={() => removeStrategy(s)}
+ >
+
{this.renderName(s)}
));
return (
-
+
{strategies.length > 0 ? strategies :
No activation strategies added
}
-
+
);
}
}
diff --git a/packages/unleash-frontend-next/src/component/feature/Feature.jsx b/packages/unleash-frontend-next/src/component/feature/Feature.jsx
index 71c8051e76..1df9a21116 100644
--- a/packages/unleash-frontend-next/src/component/feature/Feature.jsx
+++ b/packages/unleash-frontend-next/src/component/feature/Feature.jsx
@@ -4,22 +4,27 @@ import React, { PropTypes } from 'react';
import { Switch, FontIcon } from 'react-toolbox';
import { Link } from 'react-router';
-const Feature = ({ onClick, name, enabled, strategies }) => (
+const Feature = ({ onClick, name, enabled, strategies, onFeatureRemove }) => (
|
- {name} |
+
+
+ {name}
+
+ |
{strategies.map(s => s.name).join(', ')} |
-
+
|
);
Feature.propTypes = {
onClick: PropTypes.func.isRequired,
+ onFeatureRemove: PropTypes.func.isRequired,
enabled: PropTypes.bool.isRequired,
strategies: PropTypes.array.isRequired,
name: PropTypes.string.isRequired,
diff --git a/packages/unleash-frontend-next/src/component/feature/FeatureList.jsx b/packages/unleash-frontend-next/src/component/feature/FeatureList.jsx
index dc35045d6e..636dc846e1 100644
--- a/packages/unleash-frontend-next/src/component/feature/FeatureList.jsx
+++ b/packages/unleash-frontend-next/src/component/feature/FeatureList.jsx
@@ -10,6 +10,7 @@ export default class FeatureList extends React.Component {
static propTypes () {
return {
onFeatureClick: PropTypes.func.isRequired,
+ onFeatureRemove: PropTypes.func.isRequired,
features: PropTypes.array.isRequired,
fetchFeatureToggles: PropTypes.array.isRequired,
};
@@ -21,10 +22,12 @@ export default class FeatureList extends React.Component {
render () {
const onFeatureClick = this.props.onFeatureClick;
+ const onFeatureRemove = this.props.onFeatureRemove;
const features = this.props.features.map(featureToggle =>
onFeatureClick(featureToggle)}
+ onFeatureRemove={() => onFeatureRemove(featureToggle.name)}
/>
);
diff --git a/packages/unleash-frontend-next/src/component/feature/FeatureListContainer.jsx b/packages/unleash-frontend-next/src/component/feature/FeatureListContainer.jsx
index 7344d56aa3..f30b4493ca 100644
--- a/packages/unleash-frontend-next/src/component/feature/FeatureListContainer.jsx
+++ b/packages/unleash-frontend-next/src/component/feature/FeatureListContainer.jsx
@@ -1,5 +1,5 @@
import { connect } from 'react-redux';
-import { toggleFeature, fetchFeatureToggles } from '../../store/feature-actions';
+import { toggleFeature, fetchFeatureToggles, removeFeatureToggle } from '../../store/feature-actions';
import FeatureList from './FeatureList';
const mapStateToProps = (state) => ({
@@ -9,6 +9,7 @@ const mapStateToProps = (state) => ({
const mapDispatchToProps = {
onFeatureClick: toggleFeature,
+ onFeatureRemove: removeFeatureToggle,
fetchFeatureToggles,
};
diff --git a/packages/unleash-frontend-next/src/page/features/edit.js b/packages/unleash-frontend-next/src/page/features/edit.js
index 2f024ff77d..2be257fa54 100644
--- a/packages/unleash-frontend-next/src/page/features/edit.js
+++ b/packages/unleash-frontend-next/src/page/features/edit.js
@@ -1,7 +1,13 @@
-import React, { Component } from 'react';
+import React, { Component, PropTypes } from 'react';
import EditFeatureToggle from '../../component/feature/EditFeatureToggle';
export default class Features extends Component {
+ static propTypes () {
+ return {
+ params: PropTypes.object.isRequired,
+ };
+ }
+
static contextTypes = {
router: React.PropTypes.object,
}
diff --git a/packages/unleash-frontend-next/src/store/feature-actions.js b/packages/unleash-frontend-next/src/store/feature-actions.js
index 6a4777d3b2..309e65cb0d 100644
--- a/packages/unleash-frontend-next/src/store/feature-actions.js
+++ b/packages/unleash-frontend-next/src/store/feature-actions.js
@@ -2,6 +2,7 @@ import api from './feature-api';
const debug = require('debug')('unleash:feature-actions');
export const ADD_FEATURE_TOGGLE = 'ADD_FEATURE_TOGGLE';
+export const REMOVE_FEATURE_TOGGLE = 'REMOVE_FEATURE_TOGGLE';
export const UPDATE_FEATURE_TOGGLE = 'UPDATE_FEATURE_TOGGLE';
export const TOGGLE_FEATURE_TOGGLE = 'TOGGLE_FEATURE_TOGGLE';
export const REQUEST_FEATURE_TOGGLES = 'REQUEST_FEATURE_TOGGLES';
@@ -11,6 +12,7 @@ export const RECEIVE_FEATURE_TOGGLES = 'RECEIVE_FEATURE_TOGGLES';
export const ERROR_RECEIVE_FEATURE_TOGGLES = 'ERROR_RECEIVE_FEATURE_TOGGLES';
export const ERROR_CREATING_FEATURE_TOGGLE = 'ERROR_CREATING_FEATURE_TOGGLE';
export const ERROR_UPDATING_FEATURE_TOGGLE = 'ERROR_UPDATING_FEATURE_TOGGLE';
+export const ERROR_REMOVE_FEATURE_TOGGLE = 'ERROR_REMOVE_FEATURE_TOGGLE';
function addFeatureToggle (featureToggle) {
return {
@@ -123,3 +125,10 @@ export function requestUpdateFeatureToggle (featureToggle) {
};
}
+export function removeFeatureToggle (featureToggleName) {
+ return dispatch => (api.remove(featureToggleName)
+ .then(() => dispatch({ type: REMOVE_FEATURE_TOGGLE, featureToggleName }))
+ .catch(error => dispatch({ type: ERROR_REMOVE_FEATURE_TOGGLE, featureToggleName, error }))
+ );
+}
+
diff --git a/packages/unleash-frontend-next/src/store/feature-api.js b/packages/unleash-frontend-next/src/store/feature-api.js
index 7d07aa2c6f..27f3de02eb 100644
--- a/packages/unleash-frontend-next/src/store/feature-api.js
+++ b/packages/unleash-frontend-next/src/store/feature-api.js
@@ -36,8 +36,15 @@ function update (featureToggle) {
}).then(throwIfNotSuccess);
}
+function remove (featureToggleName) {
+ return fetch(`${URI}/${featureToggleName}`, {
+ method: 'DELETE',
+ }).then(throwIfNotSuccess);
+}
+
module.exports = {
fetchAll,
create,
update,
+ remove,
};
diff --git a/packages/unleash-frontend-next/src/store/feature-store.js b/packages/unleash-frontend-next/src/store/feature-store.js
index 6e0e9c7992..ef17ff6663 100644
--- a/packages/unleash-frontend-next/src/store/feature-store.js
+++ b/packages/unleash-frontend-next/src/store/feature-store.js
@@ -6,6 +6,7 @@ import {
ADD_FEATURE_TOGGLE,
RECEIVE_FEATURE_TOGGLES,
UPDATE_FEATURE_TOGGLE,
+ REMOVE_FEATURE_TOGGLE,
} from './feature-actions';
@@ -14,6 +15,9 @@ const features = (state = new List([]), action) => {
case ADD_FEATURE_TOGGLE:
debug(ADD_FEATURE_TOGGLE, action);
return state.push(new $Map(action.featureToggle));
+ case REMOVE_FEATURE_TOGGLE:
+ debug(REMOVE_FEATURE_TOGGLE, action);
+ return state.filter(toggle => toggle.get('name') !== action.featureToggleName);
case UPDATE_FEATURE_TOGGLE:
debug(UPDATE_FEATURE_TOGGLE, action);
return state.map(toggle => {