wrap edit toggle to make sure it is loaded in store before we enter edit-component

frontend/src/component/feature/form-edit-container.jsx

@@ -7,22 +7,13 @@ import FormComponent from './form';
 
 const ID = 'edit-feature-toggle';
 function getId (props) {
-    return [ID, props.featureToggleName];
+    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) => {
+    getDefault: (state, ownProps) => ownProps.featureToggle,
-        if (ownProps.featureToggleName) {
-            const match = state.features.findEntry((entry) => entry.get('name') === ownProps.featureToggleName);
-
-            if (match && match[1]) {
-                return match[1].toJS();
-            }
-        }
-        return {};
-    },
     prepare: (props) => {
         props.editmode = true;
         return props;

frontend/src/component/feature/form-edit-wrap.jsx

@@ -0,0 +1,41 @@
+import React, { PropTypes } from 'react';
+
+import { connect } from 'react-redux';
+import EditFeatureToggle from './form-edit-container.jsx';
+import { fetchFeatureToggles } from '../../store/feature-actions';
+
+class EditFeatureToggleWrapper extends React.Component {
+
+    static propTypes () {
+        return {
+            featureToggleName: PropTypes.string.isRequired,
+            features: PropTypes.array.isRequired,
+            fetchFeatureToggles: PropTypes.array.isRequired,
+        };
+    }
+
+    componentWillMount () {
+        if (this.props.features.length === 0) {
+            this.props.fetchFeatureToggles();
+        }
+    }
+
+    render () {
+        const { features, featureToggleName } = this.props;
+
+        const featureToggle = features.find(toggle => toggle.name === featureToggleName);
+
+        if (featureToggle) {
+            return <EditFeatureToggle featureToggle={featureToggle} />;
+        } else if (features.length === 0 ) {
+            return <span>Loading</span>;
+        } else  {
+            return <span>Could not find {this.props.featureToggleName}</span>;
+        }
+    }
+}
+
+
+export default connect((state) => ({
+    features: state.features.toJS(),
+}), { fetchFeatureToggles })(EditFeatureToggleWrapper);

frontend/src/page/features/edit.js

@@ -1,5 +1,5 @@
 import React, { Component, PropTypes } from 'react';
-import EditFeatureToggleForm from '../../component/feature/form-edit-container';
+import EditFeatureToggleForm from '../../component/feature/form-edit-wrap';
 
 export default class Features extends Component {
     static propTypes () {