Browse Source

[ADD] state management

Gogs 7 years ago
parent
commit
6a714bd2b0

+ 5 - 0
package.json

@@ -3,13 +3,18 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
+    "axios": "^0.18.0",
+    "history": "^4.7.2",
     "material-ui": "^1.0.0-beta.36",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
     "react-helmet": "^5.2.0",
+    "react-redux": "^5.0.7",
     "react-router": "^4.2.0",
     "react-router-dom": "^4.2.2",
+    "react-router-redux": "^5.0.0-alpha.9",
     "react-scripts": "1.1.1",
+    "redux": "^3.7.2",
     "typeface-roboto": "^0.0.54"
   },
   "scripts": {

+ 37 - 0
src/actions/index.js

@@ -0,0 +1,37 @@
+import axios from 'axios'
+import { CONTAINERS } from '../constants/ResourceNames'
+import { REQUEST_OK, REQUEST_KO } from '../constants/ActionTypes'
+
+/**
+ * 
+ * @param {*} resource 
+ */
+export const get = (resource) => dispatch => {
+    return axios.get(`/api/v1${resource}`).then(response => console.log(response))
+}
+
+/**
+ * 
+ * @param {*} resource 
+ * @param {*} payload 
+ */
+export const ok = (resource, payload) => {
+    return {
+        type: REQUEST_OK,
+        resource,
+        payload
+    }
+}
+
+/**
+ * 
+ * @param {*} resource 
+ * @param {*} payload 
+ */
+export const ko = (resource, payload) => {
+    return {
+        type: REQUEST_KO,
+        resource,
+        payload
+    }
+}

+ 8 - 4
src/components/App.js

@@ -1,7 +1,9 @@
 import React, { Component } from 'react'
 import { MuiThemeProvider, createMuiTheme } from 'material-ui/styles'
 import Reboot from 'material-ui/Reboot'
-import { BrowserRouter as Router } from 'react-router-dom'
+import { Provider } from 'react-redux'
+import { ConnectedRouter } from 'react-router-redux'
+import { store, history } from '../reducers'
 import Routes from '../components/common/Routes'
 
 class App extends Component {
@@ -20,9 +22,11 @@ class App extends Component {
         return (
             <MuiThemeProvider theme={theme}>
                 <Reboot />
-                <Router>
-                    <Routes />
-                </Router>
+                <Provider store={store}>
+                    <ConnectedRouter history={history}>
+                        <Routes />
+                    </ConnectedRouter>
+                </Provider>
             </MuiThemeProvider>
         )
     }

+ 24 - 0
src/constants/ActionTypes.js

@@ -0,0 +1,24 @@
+/**
+ * Request get signal
+ */
+export const REQUEST_GET = 'request_get'
+
+/**
+ * Request post signal
+ */
+export const REQUEST_POST = 'request_post'
+
+/**
+ * Request wait signal
+ */
+export const REQUEST_WAIT = 'request_wait'
+
+/**
+ * Request response ok signal
+ */
+export const REQUEST_OK = 'request_ok'
+
+/**
+ * Request error signal
+ */
+export const REQUEST_KO = 'request_ko'

+ 1 - 0
src/constants/ResourceNames.js

@@ -0,0 +1 @@
+export const CONTAINERS = '/container/all/'

+ 19 - 0
src/reducers/containers.js

@@ -0,0 +1,19 @@
+import { CONTAINERS } from '../constants/ResourceNames'
+import { REQUEST_GET } from '../constants/ActionTypes';
+
+/**
+ * 
+ * @param {*} state 
+ * @param {*} action 
+ */
+export const containers = (state = [], action) => {
+    if (action.resource !== CONTAINERS) {
+        return state
+    }
+
+    if (action.type === REQUEST_GET) {
+        return action.payload
+    }
+
+    return state
+}

+ 21 - 0
src/reducers/index.js

@@ -0,0 +1,21 @@
+import { createStore, combineReducers, applyMiddleware } from 'redux'
+import { routerReducer, routerMiddleware } from 'react-router-redux'
+import createBrowserHistory from 'history/createBrowserHistory'
+
+import { containers } from './containers'
+
+const history = createBrowserHistory()
+
+const rootReducer = combineReducers({
+    containers,
+    router: routerReducer
+})
+
+const RouterMiddleware = routerMiddleware(history)
+
+const store = createStore(rootReducer, applyMiddleware(RouterMiddleware))
+
+export {
+    history,
+    store
+}

+ 48 - 3
yarn.lock

@@ -362,6 +362,13 @@ aws4@^1.2.1, aws4@^1.6.0:
   version "1.6.0"
   resolved "https://registry.yarnpkg.com/aws4/-/aws4-1.6.0.tgz#83ef5ca860b2b32e4a0deedee8c771b9db57471e"
 
+axios@^0.18.0:
+  version "0.18.0"
+  resolved "https://registry.yarnpkg.com/axios/-/axios-0.18.0.tgz#32d53e4851efdc0a11993b6cd000789d70c05102"
+  dependencies:
+    follow-redirects "^1.3.0"
+    is-buffer "^1.1.5"
+
 axobject-query@^0.1.0:
   version "0.1.0"
   resolved "https://registry.yarnpkg.com/axobject-query/-/axobject-query-0.1.0.tgz#62f59dbc59c9f9242759ca349960e7a2fe3c36c0"
@@ -2833,6 +2840,12 @@ flatten@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/flatten/-/flatten-1.0.2.tgz#dae46a9d78fbe25292258cc1e780a41d95c03782"
 
+follow-redirects@^1.3.0:
+  version "1.4.1"
+  resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.4.1.tgz#d8120f4518190f55aac65bb6fc7b85fcd666d6aa"
+  dependencies:
+    debug "^3.1.0"
+
 for-in@^1.0.1, for-in@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/for-in/-/for-in-1.0.2.tgz#81068d295a8142ec0ac726c6e2200c30fb6d5e80"
@@ -3479,7 +3492,7 @@ interpret@^1.0.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/interpret/-/interpret-1.1.0.tgz#7ed1b1410c6a0e0f78cf95d3b8440c63f78b8614"
 
-invariant@^2.2.1, invariant@^2.2.2:
+invariant@^2.0.0, invariant@^2.2.1, invariant@^2.2.2:
   version "2.2.3"
   resolved "https://registry.yarnpkg.com/invariant/-/invariant-2.2.3.tgz#1a827dfde7dcbd7c323f0ca826be8fa7c5e9d688"
   dependencies:
@@ -4402,6 +4415,10 @@ locate-path@^2.0.0:
     p-locate "^2.0.0"
     path-exists "^3.0.0"
 
+lodash-es@^4.17.5, lodash-es@^4.2.1:
+  version "4.17.6"
+  resolved "https://registry.yarnpkg.com/lodash-es/-/lodash-es-4.17.6.tgz#b90209ca7627de7cadd5212dff8b77c607aec8b0"
+
 lodash._reinterpolate@~3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz#0ccf2d89166af03b3663c796538b75ac6e114d9d"
@@ -4439,7 +4456,7 @@ lodash.uniq@^4.5.0:
   version "4.5.0"
   resolved "https://registry.yarnpkg.com/lodash.uniq/-/lodash.uniq-4.5.0.tgz#d0225373aeb652adc1bc82e4945339a842754773"
 
-"lodash@>=3.5 <5", lodash@^4.14.0, lodash@^4.15.0, lodash@^4.17.2, lodash@^4.17.3, lodash@^4.17.4, lodash@^4.2.0, lodash@^4.3.0:
+"lodash@>=3.5 <5", lodash@^4.14.0, lodash@^4.15.0, lodash@^4.17.2, lodash@^4.17.3, lodash@^4.17.4, lodash@^4.17.5, lodash@^4.2.0, lodash@^4.2.1, lodash@^4.3.0:
   version "4.17.5"
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.5.tgz#99a92d65c0272debe8c96b6057bc8fbfa3bed511"
 
@@ -5810,6 +5827,17 @@ react-popper@^0.8.0:
     popper.js "^1.12.9"
     prop-types "^15.6.0"
 
+react-redux@^5.0.7:
+  version "5.0.7"
+  resolved "https://registry.yarnpkg.com/react-redux/-/react-redux-5.0.7.tgz#0dc1076d9afb4670f993ffaef44b8f8c1155a4c8"
+  dependencies:
+    hoist-non-react-statics "^2.5.0"
+    invariant "^2.0.0"
+    lodash "^4.17.5"
+    lodash-es "^4.17.5"
+    loose-envify "^1.1.0"
+    prop-types "^15.6.0"
+
 react-router-dom@^4.2.2:
   version "4.2.2"
   resolved "https://registry.yarnpkg.com/react-router-dom/-/react-router-dom-4.2.2.tgz#c8a81df3adc58bba8a76782e946cbd4eae649b8d"
@@ -5821,6 +5849,14 @@ react-router-dom@^4.2.2:
     react-router "^4.2.0"
     warning "^3.0.0"
 
+react-router-redux@^5.0.0-alpha.9:
+  version "5.0.0-alpha.9"
+  resolved "https://registry.yarnpkg.com/react-router-redux/-/react-router-redux-5.0.0-alpha.9.tgz#825431516e0e6f1fd93b8807f6bd595e23ec3d10"
+  dependencies:
+    history "^4.7.2"
+    prop-types "^15.6.0"
+    react-router "^4.2.0"
+
 react-router@^4.2.0:
   version "4.2.0"
   resolved "https://registry.yarnpkg.com/react-router/-/react-router-4.2.0.tgz#61f7b3e3770daeb24062dae3eedef1b054155986"
@@ -6009,6 +6045,15 @@ reduce-function-call@^1.0.1:
   dependencies:
     balanced-match "^0.4.2"
 
+redux@^3.7.2:
+  version "3.7.2"
+  resolved "https://registry.yarnpkg.com/redux/-/redux-3.7.2.tgz#06b73123215901d25d065be342eb026bc1c8537b"
+  dependencies:
+    lodash "^4.2.1"
+    lodash-es "^4.2.1"
+    loose-envify "^1.1.0"
+    symbol-observable "^1.0.3"
+
 regenerate@^1.2.1:
   version "1.3.3"
   resolved "https://registry.yarnpkg.com/regenerate/-/regenerate-1.3.3.tgz#0c336d3980553d755c39b586ae3b20aa49c82b7f"
@@ -6816,7 +6861,7 @@ sw-toolbox@^3.4.0:
     path-to-regexp "^1.0.1"
     serviceworker-cache-polyfill "^4.0.0"
 
-symbol-observable@^1.0.4, symbol-observable@^1.1.0:
+symbol-observable@^1.0.3, symbol-observable@^1.0.4, symbol-observable@^1.1.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/symbol-observable/-/symbol-observable-1.2.0.tgz#c22688aed4eab3cdc2dfeacbb561660560a00804"