The_Bois/MigratorProject-frontend
Archived
3
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Added a basic store, fleshing out for our use, including actions relevant to migationsTracker

Browse Source
This commit is contained in:
pepper 2021-01-19 19:09:09 -05:00
parent 271942ae7f
commit a3c380ffd1
5 changed files with 130 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

103
src/components/App.js
View File

@ -1,6 +1,10 @@
import React, { Component } from "react";
import { BrowserRouter as Router, Route, Switch } from "react-router-dom";
// Store
import { Provider } from "react-redux";
import store from "../redux/store";
// Routes
import Migrations from "./root/Pages/Migrations";
import GenericList from "./root/Pages/GenericList";
@ -11,46 +15,79 @@ import IDSingle from "./root/Pages/IDSingle";
import Home from "./root/Home";
import Navigation from "./root/Navigation";
// Main app component, react-router comes from here,
// and links to all of the sub pages
class App extends Component {
render() {
return (
<Router>
<div className="container-fluid">
<Provider store={store}>
<Router>
<Navigation />
<Switch>
<Route exact path="/" component={Home} />
<Route exact path="/book" component={Book} />
<Route exact path="/migrations" component={Migrations} />
<Route exact path="/reports" component={Reports} />
<Route path="/migrations/:migrationId" component={IDSingle} />
<Route exact path="/upcoming-migrations" render={(props) => (
<GenericList {...props} APILINK="/pending/" />
)} />
<Route exact path="/missed" render={(props) => (
<GenericList {...props} APILINK="/missed/" />
)} />
<Route exact path="/completed" render={(props) => (
<GenericList {...props} APILINK="/completed/" />
)} />
<Route exact path="/pending-terminations" render={(props) => (
<GenericList {...props} APILINK="/waitingterm/" />
)} />
<Route exact path="/all-terminations" render={(props) => (
<GenericList {...props} APILINK="/pendingterm/" />
)} />
<Route exact path="/historical-migrations" render={(props) => (
<GenericList {...props} APILINK="/all/" />
)} />
<Route exact path="/booked" render={(props) => (
<GenericList {...props} APILINK="/booked/" />
)} />
</Switch>
</div>
</Router>
<div className="row">
<div className="col s12 m4 13">
<div className="container-fluid">
<Switch>
<Route exact path="/" component={Home} />
<Route exact path="/book" component={Book} />
<Route exact path="/migrations" component={Migrations} />
<Route exact path="/reports" component={Reports} />
<Route path="/migrations/:migrationId" component={IDSingle} />
<Route
exact
path="/upcoming-migrations"
render={(props) => (
<GenericList {...props} APILINK="/pending/" />
)}
/>
<Route
exact
path="/missed"
render={(props) => (
<GenericList {...props} APILINK="/missed/" />
)}
/>
<Route
exact
path="/completed"
render={(props) => (
<GenericList {...props} APILINK="/completed/" />
)}
/>
<Route
exact
path="/pending-terminations"
render={(props) => (
<GenericList {...props} APILINK="/waitingterm/" />
)}
/>
<Route
exact
path="/all-terminations"
render={(props) => (
<GenericList {...props} APILINK="/pendingterm/" />
)}
/>
<Route
exact
path="/historical-migrations"
render={(props) => (
<GenericList {...props} APILINK="/all/" />
)}
/>
<Route
exact
path="/booked"
render={(props) => (
<GenericList {...props} APILINK="/booked/" />
)}
/>
</Switch>
</div>
</div>
</div>
</Router>
</Provider>
);
}
}

3
src/redux/constants/action-types.js Normal file
View File

@ -0,0 +1,3 @@
export const ADD_ARTICLE = "ADD_ARTICLE";
export const DATA_LOADED = "DATA_LOADED";
export const API_ERRORED = "API_ERRORED";

21
src/redux/middleware/index.js Normal file
View File

@ -0,0 +1,21 @@
import { ADD_ARTICLE } from "../constants/action-types";
const forbiddenWords = ["spam", "money"];
export function forbiddenWordsMiddleware({ dispatch }) {
return function (next) {
return function (action) {
// do your stuff
if (action.type === ADD_ARTICLE) {
const foundWord = forbiddenWords.filter((word) =>
action.payload.title.includes(word)
);
if (foundWord.length) {
return dispatch({ type: "FOUND_BAD_WORD" });
}
}
return next(action);
};
};
}

23
src/redux/reducers/index.js Normal file
View File

@ -0,0 +1,23 @@
import { ADD_ARTICLE, DATA_LOADED } from "../constants/action-types";
const initialState = {
articles: [],
remoteArticles: [],
};
function rootReducer(state = initialState, action) {
if (action.type === ADD_ARTICLE) {
return Object.assign({}, state, {
articles: state.articles.concat(action.payload),
});
}
if (action.type === DATA_LOADED) {
return Object.assign({}, state, {
remoteArticles: state.remoteArticles.concat(action.payload),
});
}
return state;
}
export default rootReducer;

13
src/redux/store/index.js Normal file
View File

@ -0,0 +1,13 @@
import { createStore, applyMiddleware, compose } from "redux";
import rootReducer from "../reducers";
import { forbiddenWordsMiddleware } from "../middleware";
import thunk from "redux-thunk";
const storeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
const store = createStore(
rootReducer,
storeEnhancers(applyMiddleware(forbiddenWordsMiddleware, thunk))
);
export default store;