diff --git a/lib/strategyApi.js b/lib/strategyApi.js index 4f5e365f9f..83b8bfae57 100644 --- a/lib/strategyApi.js +++ b/lib/strategyApi.js @@ -2,7 +2,7 @@ var strategies = [ {name: "default"}, { name: "activeForUsers", - configurationTemplate: { + parametersTemplate: { userNames: "String" } } @@ -17,7 +17,7 @@ function byName(name) { module.exports = function (app) { app.get('/strategies', function (req, res) { - res.json({features: strategies}); + res.json({strategies: strategies}); }); app.get('/strategies/:name', function (req, res) { diff --git a/public/js/app.jsx b/public/js/app.jsx index cd8a0dae76..2799a26b55 100644 --- a/public/js/app.jsx +++ b/public/js/app.jsx @@ -1,7 +1,31 @@ var React = require('react'); +var TabView = require('./components/TabView'); +var Menu = require('./components/Menu'); var Unleash = require('./components/Unleash'); +var Strategy = require('./components/strategy/StrategyComponent'); + +var tabPanes = [ + { + name: "Feature Toggles", + content: new Unleash({pollInterval: 5000}) + }, + { + name: "Strategies", + content: new Strategy({}) + } + + +]; React.render( - , +
+ +
+
+ +
+
+
+ , document.getElementById('content') ); \ No newline at end of file diff --git a/public/js/components/FeatureList.jsx b/public/js/components/FeatureList.jsx index a942569b7e..b7ff973982 100644 --- a/public/js/components/FeatureList.jsx +++ b/public/js/components/FeatureList.jsx @@ -27,28 +27,21 @@ var FeatureList = React.createClass({ }.bind(this)); return ( -
-
-
-
-
-
-

Features

-
+
+
+
+

Features

+
-
- -
-
- -
- - {featureNodes} -
+
+ +
-
+ +
+ {featureNodes}
- ); + ); } }); diff --git a/public/js/components/TabView.jsx b/public/js/components/TabView.jsx new file mode 100644 index 0000000000..687949699d --- /dev/null +++ b/public/js/components/TabView.jsx @@ -0,0 +1,48 @@ +var React = require('react'); + +var TabView = React.createClass({ + getDefaultProps: function() { + return {tabPanes: []}; + }, + + getInitialState: function() { + return {activeTab: this.props.tabPanes[0]}; + }, + + handleChangeTab: function(tabPane) { + this.setState({activeTab: tabPane}); + }, + + render: function() { + var tabNodes = this.props.tabPanes.map(function (tabPane) { + return ( +
  • + {tabPane.name} + +
  • + ); + }.bind(this)); + + return ( +
    +
      + {tabNodes} +
    +
    +
    +
    +
    +
    + {this.state.activeTab.content} +
    +
    +
    +
    +
    +
    + ); + } +}); + +module.exports = TabView; \ No newline at end of file diff --git a/public/js/components/Unleash.jsx b/public/js/components/Unleash.jsx index 0cbda23627..acd8a8d5fd 100644 --- a/public/js/components/Unleash.jsx +++ b/public/js/components/Unleash.jsx @@ -1,6 +1,5 @@ var React = require('react'); var Timer = require('../utils/Timer'); -var Menu = require('./Menu'); var ErrorMessages = require('./ErrorMessages'); var FeatureList = require('./FeatureList'); var FeatureStore = require('../stores/FeatureStore'); @@ -116,17 +115,16 @@ var Unleash = React.createClass({ render: function() { return (
    - - - + +
    ); } diff --git a/public/js/components/strategy/StrategyComponent.jsx b/public/js/components/strategy/StrategyComponent.jsx new file mode 100644 index 0000000000..9ed0893a0b --- /dev/null +++ b/public/js/components/strategy/StrategyComponent.jsx @@ -0,0 +1,28 @@ +var React = require('react'), + strategyStore = require('../../stores/StrategyStore'); + +var StrategyComponent = React.createClass({ + getInitialState: function() { + return { + createView: false, + strategies: [] + }; + }, + + componentDidMount: function () { + strategyStore.getStrategies().then(function(res) { + this.setState({strategies: res.strategies}); + }.bind(this)); + }, + + render: function() { + return ( +
    +

    Strategies

    + {JSON.stringify(this.state.strategies)} +
    + ); + } +}); + +module.exports = StrategyComponent; \ No newline at end of file diff --git a/public/js/components/strategy/StrategyList.jsx b/public/js/components/strategy/StrategyList.jsx new file mode 100644 index 0000000000..e69de29bb2 diff --git a/public/js/stores/StrategyStore.js b/public/js/stores/StrategyStore.js new file mode 100644 index 0000000000..e28febca7c --- /dev/null +++ b/public/js/stores/StrategyStore.js @@ -0,0 +1,26 @@ +var reqwest = require('reqwest'); + +TYPE = 'json'; +CONTENT_TYPE = 'application/json'; + +var StrategyStore = { + createStrategy: function (strategy) { + return reqwest({ + url: 'strategies', + method: 'post', + type: TYPE, + contentType: CONTENT_TYPE, + data: JSON.stringify(strategy) + }); + }, + + getStrategies: function () { + return reqwest({ + url: 'strategies', + method: 'get', + type: TYPE + }); + } +}; + +module.exports = StrategyStore;