WIP client applications

frontend/src/component/application/application-list-component.js

@@ -0,0 +1,24 @@
+import React, { Component } from 'react';
+
+class ClientStrategies extends Component {
+
+    componentDidMount () {
+        this.props.fetchApplications();
+    }
+
+    render () {
+        if (!this.props.applications) {
+            return null;
+        }
+        const source = this.props.applications.map(item => item.appName).join(', ');
+
+        return (
+            <div>
+                {source}
+            </div>
+        );
+    }
+}
+
+
+export default ClientStrategies;

frontend/src/component/application/application-list-container.js

@@ -0,0 +1,9 @@
+import { connect } from 'react-redux';
+import ApplicationList from './application-list-component';
+import { fetchApplications } from '../../store/application/actions';
+
+const mapStateToProps = (state) => ({ applications: state.applications.toJS() });
+
+const StrategiesContainer = connect(mapStateToProps, { fetchApplications })(ApplicationList);
+
+export default StrategiesContainer;

frontend/src/component/nav.jsx

@@ -22,9 +22,8 @@ export default class UnleashNav extends Component {
                     <ListDivider />
 
                     <ListSubHeader caption="Clients" />
-                    {createListItem('/metrics', 'Client metrics')}
+                    {createListItem('/applications', 'Client applications')}
                     {createListItem('/client-strategies', 'Client strategies')}
-                    {createListItem('/client-instances', 'Client instances')}
 
                     <ListDivider />
 

frontend/src/data/applications-api.js

@@ -0,0 +1,13 @@
+import { throwIfNotSuccess, headers } from './helper';
+
+const URI = '/api/client/applications';
+
+function fetchAll () {
+    return fetch(URI, { headers })
+        .then(throwIfNotSuccess)
+        .then(response => response.json());
+}
+
+module.exports = {
+    fetchAll,
+};

frontend/src/index.jsx

@@ -17,9 +17,8 @@ import CreateStrategies from './page/strategies/create';
 import HistoryPage from './page/history';
 import HistoryTogglePage from './page/history/toggle';
 import Archive from './page/archive';
-import Metrics from './page/metrics';
+import Applications from './page/applications';
 import ClientStrategies from './page/client-strategies';
-import ClientInstances from './page/client-instances';
 
 const unleashStore = createStore(
     store,
@@ -41,9 +40,8 @@ ReactDOM.render(
                 <Route path="/history" component={HistoryPage} />
                 <Route path="/history/:toggleName" component={HistoryTogglePage} />
                 <Route path="/archive" component={Archive} />
-                <Route path="/metrics" component={Metrics} />
+                <Route path="/applications" component={Applications} />
                 <Route path="/client-strategies" component={ClientStrategies} />
-                <Route path="/client-instances" component={ClientInstances} />
             </Route>
         </Router>
     </Provider>, document.getElementById('app'));

frontend/src/page/applications/index.js

@@ -0,0 +1,6 @@
+import React from 'react';
+import ApplicationListConmponent from '../../component/application/application-list-container';
+
+const render = () => <ApplicationListConmponent />;
+
+export default render;

frontend/src/store/application/actions.js

@@ -0,0 +1,20 @@
+import api from '../../data/applications-api';
+
+export const RECEIVE_APPLICATINS = 'RECEIVE_APPLICATINS';
+export const ERROR_RECEIVE_APPLICATINS = 'ERROR_RECEIVE_APPLICATINS';
+
+const recieveApplications = (json) => ({
+    type: RECEIVE_APPLICATINS,
+    value: json,
+});
+
+const errorReceiveApplications = (statusCode) => ({
+    type: ERROR_RECEIVE_APPLICATINS,
+    statusCode,
+});
+
+export function fetchApplications () {
+    return dispatch => api.fetchAll()
+        .then(json => dispatch(recieveApplications(json)))
+        .catch(error => dispatch(errorReceiveApplications(error)));
+}

frontend/src/store/application/index.js

@@ -0,0 +1,17 @@
+import { fromJS } from 'immutable';
+import { RECEIVE_APPLICATINS } from './actions';
+
+function getInitState () {
+    return fromJS([]);
+}
+
+const store = (state = getInitState(), action) => {
+    switch (action.type) {
+        case RECEIVE_APPLICATINS:
+            return fromJS(action.value.applications);
+        default:
+            return state;
+    }
+};
+
+export default store;

frontend/src/store/index.js

@@ -11,6 +11,7 @@ import clientStrategies from './client-strategy-store';
 import clientInstances from './client-instance-store';
 import settings from './settings';
 import user from './user';
+import applications from './application';
 
 const unleashStore = combineReducers({
     features,
@@ -25,6 +26,7 @@ const unleashStore = combineReducers({
     clientInstances,
     settings,
     user,
+    applications,
 });
 
 export default unleashStore;