diff --git a/frontend/src/component/feature/form/form-update-feature-container.jsx b/frontend/src/component/feature/form/form-update-feature-container.jsx
index 58c755487e..f4b0f08637 100644
--- a/frontend/src/component/feature/form/form-update-feature-container.jsx
+++ b/frontend/src/component/feature/form/form-update-feature-container.jsx
@@ -45,7 +45,7 @@ const prepare = (methods, dispatch) => {
methods.onCancel = evt => {
evt.preventDefault();
methods.clear();
- window.history.back();
+ hashHistory.push(`/features`);
};
methods.addStrategy = v => {
diff --git a/frontend/src/component/feature/form/form-view-feature-component.jsx b/frontend/src/component/feature/form/form-view-feature-component.jsx
new file mode 100644
index 0000000000..bdcaab61e2
--- /dev/null
+++ b/frontend/src/component/feature/form/form-view-feature-component.jsx
@@ -0,0 +1,42 @@
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+import StrategiesSection from './strategies-section-container';
+import { Button, Icon } from 'react-mdl';
+
+class ViewFeatureComponent extends Component {
+ // static displayName = `UpdateFeatureComponent-{getDisplayName(Component)}`;
+ componentWillMount() {
+ // TODO unwind this stuff
+ if (this.props.initCallRequired === true) {
+ this.props.init(this.props.input);
+ }
+ }
+
+ render() {
+ const { input, onCancel } = this.props;
+
+ const {
+ name, // eslint-disable-line
+ } = input;
+ const configuredStrategies = input.strategies || [];
+
+ return (
+
+ );
+ }
+}
+
+ViewFeatureComponent.propTypes = {
+ input: PropTypes.object,
+ onCancel: PropTypes.func.isRequired,
+ initCallRequired: PropTypes.bool,
+ init: PropTypes.func,
+};
+
+export default ViewFeatureComponent;
diff --git a/frontend/src/component/feature/form/form-view-feature-container.jsx b/frontend/src/component/feature/form/form-view-feature-container.jsx
new file mode 100644
index 0000000000..3ed8e9605b
--- /dev/null
+++ b/frontend/src/component/feature/form/form-view-feature-container.jsx
@@ -0,0 +1,40 @@
+import { connect } from 'react-redux';
+import { createMapper, createActions } from '../../input-helpers';
+import ViewFeatureToggleComponent from './form-view-feature-component';
+import { hashHistory } from 'react-router';
+
+const ID = 'view-feature-toggle';
+function getId(props) {
+ return [ID, props.featureToggle.name];
+}
+// TODO: need to scope to the active featureToggle
+// best is to emulate the "input-storage"?
+const mapStateToProps = createMapper({
+ id: getId,
+ getDefault: (state, ownProps) => {
+ ownProps.featureToggle.strategies.forEach((strategy, index) => {
+ strategy.id = Math.round(Math.random() * 1000000 * (1 + index));
+ });
+ return ownProps.featureToggle;
+ },
+ prepare: props => {
+ props.editmode = true;
+ return props;
+ },
+});
+
+const prepare = methods => {
+ methods.onCancel = evt => {
+ evt.preventDefault();
+ methods.clear();
+ hashHistory.push(`/archive`);
+ };
+ return methods;
+};
+
+const actions = createActions({
+ id: getId,
+ prepare,
+});
+
+export default connect(mapStateToProps, actions)(ViewFeatureToggleComponent);
diff --git a/frontend/src/component/feature/form/strategies-add.jsx b/frontend/src/component/feature/form/strategies-add.jsx
index aac8731fb5..429022e2cf 100644
--- a/frontend/src/component/feature/form/strategies-add.jsx
+++ b/frontend/src/component/feature/form/strategies-add.jsx
@@ -5,7 +5,7 @@ import { Menu, MenuItem, IconButton } from 'react-mdl';
class AddStrategy extends React.Component {
static propTypes = {
strategies: PropTypes.array.isRequired,
- addStrategy: PropTypes.func.isRequired,
+ addStrategy: PropTypes.func,
fetchStrategies: PropTypes.func.isRequired,
};
diff --git a/frontend/src/component/feature/form/strategies-list.jsx b/frontend/src/component/feature/form/strategies-list.jsx
index 26a3eecc34..b6f8936c2c 100644
--- a/frontend/src/component/feature/form/strategies-list.jsx
+++ b/frontend/src/component/feature/form/strategies-list.jsx
@@ -9,9 +9,9 @@ class StrategiesList extends React.Component {
static propTypes = {
strategies: PropTypes.array.isRequired,
configuredStrategies: PropTypes.array.isRequired,
- updateStrategy: PropTypes.func.isRequired,
- removeStrategy: PropTypes.func.isRequired,
- moveStrategy: PropTypes.func.isRequired,
+ updateStrategy: PropTypes.func,
+ removeStrategy: PropTypes.func,
+ moveStrategy: PropTypes.func,
};
render() {
@@ -27,8 +27,8 @@ class StrategiesList extends React.Component {
key={strategy.id}
strategy={strategy}
moveStrategy={moveStrategy}
- removeStrategy={removeStrategy.bind(null, i)}
- updateStrategy={updateStrategy.bind(null, i)}
+ removeStrategy={removeStrategy ? removeStrategy.bind(null, i) : null}
+ updateStrategy={updateStrategy ? updateStrategy.bind(null, i) : null}
strategyDefinition={strategies.find(s => s.name === strategy.name)}
/>
));
diff --git a/frontend/src/component/feature/form/strategies-section.jsx b/frontend/src/component/feature/form/strategies-section.jsx
index e580fc9006..6a2a305098 100644
--- a/frontend/src/component/feature/form/strategies-section.jsx
+++ b/frontend/src/component/feature/form/strategies-section.jsx
@@ -8,9 +8,9 @@ import { HeaderTitle } from '../../common';
class StrategiesSectionComponent extends React.Component {
static propTypes = {
strategies: PropTypes.array.isRequired,
- addStrategy: PropTypes.func.isRequired,
- removeStrategy: PropTypes.func.isRequired,
- updateStrategy: PropTypes.func.isRequired,
+ addStrategy: PropTypes.func,
+ removeStrategy: PropTypes.func,
+ updateStrategy: PropTypes.func,
fetchStrategies: PropTypes.func.isRequired,
};
diff --git a/frontend/src/component/feature/form/strategy-configure.jsx b/frontend/src/component/feature/form/strategy-configure.jsx
index 8311121b0e..6853a8d81c 100644
--- a/frontend/src/component/feature/form/strategy-configure.jsx
+++ b/frontend/src/component/feature/form/strategy-configure.jsx
@@ -47,9 +47,9 @@ class StrategyConfigure extends React.Component {
static propTypes = {
strategy: PropTypes.object.isRequired,
strategyDefinition: PropTypes.object.isRequired,
- updateStrategy: PropTypes.func.isRequired,
- removeStrategy: PropTypes.func.isRequired,
- moveStrategy: PropTypes.func.isRequired,
+ updateStrategy: PropTypes.func,
+ removeStrategy: PropTypes.func,
+ moveStrategy: PropTypes.func,
isDragging: PropTypes.bool.isRequired,
connectDragPreview: PropTypes.func.isRequired,
connectDragSource: PropTypes.func.isRequired,
@@ -170,7 +170,11 @@ class StrategyConfigure extends React.Component {
-
+ {this.props.removeStrategy ? (
+
+ ) : (
+
+ )}
{connectDragSource(
diff --git a/frontend/src/component/feature/view-component.jsx b/frontend/src/component/feature/view-component.jsx
index 06f4b250e6..6650761240 100644
--- a/frontend/src/component/feature/view-component.jsx
+++ b/frontend/src/component/feature/view-component.jsx
@@ -6,6 +6,7 @@ import { hashHistory, Link } from 'react-router';
import HistoryComponent from '../history/history-list-toggle-container';
import MetricComponent from './metric-container';
import EditFeatureToggle from './form/form-update-feature-container';
+import ViewFeatureToggle from './form/form-view-feature-container';
import { styles as commonStyles } from '../common';
const TABS = {
@@ -49,7 +50,10 @@ export default class ViewFeatureToggleComponent extends React.Component {
if (TABS[activeTab] === TABS.history) {
return ;
} else if (TABS[activeTab] === TABS.strategies) {
- return
+ if (this.isFeatureView) {
+ return
+ }
+ return
} else {
return ;