From 74acf4a2ccc7c7d17b8cc7cb63df0ba5ec21ef97 Mon Sep 17 00:00:00 2001
From: Tomasz Knapik <hi@tmkn.org>
Date: Tue, 15 Jan 2019 13:30:17 +0000
Subject: [PATCH] Add dotenv and update reducer structure
---
.../src/app/src/SubmissionsByRoundApp.js | 23 ++++++++++++--
opentech/static_src/src/app/src/api/utils.js | 2 +-
.../app/src/components/DetailView/index.js | 5 ++--
.../src/containers/GroupByStatusDetailView.js | 30 ++-----------------
.../src/app/src/redux/reducers/submissions.js | 13 +++++---
.../app/src/redux/selectors/submissions.js | 11 +++++--
.../static_src/src/app/webpack.base.config.js | 4 ++-
.../static_src/src/app/webpack.dev.config.js | 4 +++
package-lock.json | 19 ++++++++++++
package.json | 1 +
10 files changed, 71 insertions(+), 41 deletions(-)
diff --git a/opentech/static_src/src/app/src/SubmissionsByRoundApp.js b/opentech/static_src/src/app/src/SubmissionsByRoundApp.js
index c5dac11a5..d3ccafd76 100644
--- a/opentech/static_src/src/app/src/SubmissionsByRoundApp.js
+++ b/opentech/static_src/src/app/src/SubmissionsByRoundApp.js
@@ -1,13 +1,20 @@
import React from 'react';
import PropTypes from 'prop-types';
-import { hot } from 'react-hot-loader'
-import Switcher from '@components/Switcher'
+import { hot } from 'react-hot-loader';
+import { connect } from 'react-redux'
+
+import Switcher from '@components/Switcher';
import GroupByStatusDetailView from '@containers/GroupByStatusDetailView';
+import { setCurrentSubmissionRound } from '@actions/submissions';
class SubmissionsByRoundApp extends React.Component {
state = { detailOpened: false };
+ componentDidMount() {
+ this.props.setSubmissionRound(this.props.roundId);
+ }
+
openDetail = () => {
this.setState(state => ({
style: { ...state.style, display: 'none' } ,
@@ -43,7 +50,17 @@ class SubmissionsByRoundApp extends React.Component {
SubmissionsByRoundApp.propTypes = {
roundId: PropTypes.number,
+ setSubmissionRound: PropTypes.func,
};
+const mapDispatchToProps = dispatch => {
+ return {
+ setSubmissionRound: id => {
+ dispatch(setCurrentSubmissionRound(id));
+ },
+ }
+};
-export default hot(module)(SubmissionsByRoundApp);
+export default hot(module)(
+ connect(null, mapDispatchToProps)(SubmissionsByRoundApp)
+);
diff --git a/opentech/static_src/src/app/src/api/utils.js b/opentech/static_src/src/app/src/api/utils.js
index e1cde3fa2..fc3bd047b 100644
--- a/opentech/static_src/src/app/src/api/utils.js
+++ b/opentech/static_src/src/app/src/api/utils.js
@@ -1,5 +1,5 @@
const getBaseUrl = () => {
- return 'http://apply.localhost:8000/';
+ return process.env.API_BASE_URL;
};
export async function apiFetch(path, method = 'GET', params, options) {
diff --git a/opentech/static_src/src/app/src/components/DetailView/index.js b/opentech/static_src/src/app/src/components/DetailView/index.js
index e735e079b..41935c9ba 100644
--- a/opentech/static_src/src/app/src/components/DetailView/index.js
+++ b/opentech/static_src/src/app/src/components/DetailView/index.js
@@ -1,17 +1,18 @@
import React from 'react';
import PropTypes from 'prop-types';
+
+import DisplayPanel from '@components/DisplayPanel';
import './style.scss';
const DetailView = ({ listing, display }) => (
<div className="detail-view">
{listing}
- {display}
+ <DisplayPanel />
</div>
);
DetailView.propTypes = {
listing: PropTypes.node.isRequired,
- display: PropTypes.node.isRequired,
};
export default DetailView;
diff --git a/opentech/static_src/src/app/src/containers/GroupByStatusDetailView.js b/opentech/static_src/src/app/src/containers/GroupByStatusDetailView.js
index c790f32b1..4f2c88ec7 100644
--- a/opentech/static_src/src/app/src/containers/GroupByStatusDetailView.js
+++ b/opentech/static_src/src/app/src/containers/GroupByStatusDetailView.js
@@ -1,38 +1,14 @@
import React from 'react';
import PropTypes from 'prop-types';
-import { connect } from 'react-redux'
-import DisplayPanel from '@components/DisplayPanel';
import DetailView from '@components/DetailView';
import ByStatusListing from '@containers/ByStatusListing';
-import { setCurrentSubmissionRound } from '@actions/submissions';
-
-class GroupByStatusDetailView extends React.Component {
- componentWillMount() {
- this.props.setSubmissionRound(this.props.roundId);
- }
+export default class GroupByStatusDetailView extends React.Component {
render() {
- const passProps = {
- listing: <ByStatusListing />,
- display: <DisplayPanel />,
- };
+ const listing = <ByStatusListing />;
return (
- <DetailView {...passProps} />
+ <DetailView listing={listing} />
);
}
}
-
-GroupByStatusDetailView.propTypes = {
- roundId: PropTypes.number,
-};
-
-const mapDispatchToProps = dispatch => {
- return {
- setSubmissionRound: id => {
- dispatch(setCurrentSubmissionRound(id));
- },
- }
-};
-
-export default connect(null, mapDispatchToProps)(GroupByStatusDetailView);
diff --git a/opentech/static_src/src/app/src/redux/reducers/submissions.js b/opentech/static_src/src/app/src/redux/reducers/submissions.js
index 3497bf910..12f8869ae 100644
--- a/opentech/static_src/src/app/src/redux/reducers/submissions.js
+++ b/opentech/static_src/src/app/src/redux/reducers/submissions.js
@@ -7,6 +7,7 @@ import {
const initialState = {
currentRound: null,
+ items: {},
itemsByRound: {},
itemsByRoundLoadingError: false,
itemsByRoundLoading: false,
@@ -20,14 +21,18 @@ export default function submissions(state = initialState, action) {
currentRound: action.id,
};
case UPDATE_SUBMISSIONS_BY_ROUND:
- const newData = {};
- newData[action.roundId] = action.data.results;
-
return {
...state,
+ items: {
+ ...state.items,
+ ...action.data.results.reduce((newItems, v) => {
+ newItems[v.id] = v;
+ return newItems;
+ }, {}),
+ },
itemsByRound: {
...state.itemsByRound,
- ...newData,
+ [action.roundId]: action.data.results.map(v => v.id),
},
itemsByRoundLoading: false,
itemsByRoundLoadingError: false,
diff --git a/opentech/static_src/src/app/src/redux/selectors/submissions.js b/opentech/static_src/src/app/src/redux/selectors/submissions.js
index fa17eda2f..892da24e1 100644
--- a/opentech/static_src/src/app/src/redux/selectors/submissions.js
+++ b/opentech/static_src/src/app/src/redux/selectors/submissions.js
@@ -1,12 +1,17 @@
import { createSelector } from 'reselect';
-const getSubmissionsByRound = state => state.submissions.itemsByRound;
+const getSubmissions = state => state.submissions.items;
+
+const getSubmissionIDsByRound = state => state.submissions.itemsByRound;
const getCurrentRound = state => state.submissions.currentRound;
+
const getCurrentRoundSubmissions = createSelector(
- [ getSubmissionsByRound, getCurrentRound ],
- (submissionsByRound, currentRound) => submissionsByRound[currentRound] || []
+ [ getSubmissionIDsByRound, getCurrentRound , getSubmissions],
+ (submissionsByRound, currentRound, submissions) => {
+ return (submissionsByRound[currentRound] || []).map(v => submissions[v])
+ }
);
const getCurrentRoundSubmissionsByStatus = createSelector(
diff --git a/opentech/static_src/src/app/webpack.base.config.js b/opentech/static_src/src/app/webpack.base.config.js
index e330499c9..8d1aa48a5 100644
--- a/opentech/static_src/src/app/webpack.base.config.js
+++ b/opentech/static_src/src/app/webpack.base.config.js
@@ -1,4 +1,5 @@
var path = require('path');
+var Dotenv = require('dotenv-webpack');
module.exports = {
context: __dirname,
@@ -10,7 +11,8 @@ module.exports = {
},
plugins: [
- ], // add all common plugins here
+ new Dotenv(),
+ ],
module: {
rules: [
diff --git a/opentech/static_src/src/app/webpack.dev.config.js b/opentech/static_src/src/app/webpack.dev.config.js
index ca91ad2d1..35dd1193a 100644
--- a/opentech/static_src/src/app/webpack.dev.config.js
+++ b/opentech/static_src/src/app/webpack.dev.config.js
@@ -1,6 +1,7 @@
var path = require("path")
var webpack = require('webpack')
var BundleTracker = require('webpack-bundle-tracker')
+var Dotenv = require('dotenv-webpack');
var config = require('./webpack.base.config')
@@ -12,6 +13,9 @@ config.plugins = config.plugins.concat([
new webpack.HotModuleReplacementPlugin(),
new webpack.NoEmitOnErrorsPlugin(),
new BundleTracker({filename: './opentech/static_compiled/app/webpack-stats.json'}),
+ new Dotenv({
+ path: '.dev-env',
+ }),
])
// Add a loader for JSX files with react-hot enabled
diff --git a/package-lock.json b/package-lock.json
index 20f5a048a..f24c1d4de 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -3065,6 +3065,25 @@
"domelementtype": "1"
}
},
+ "dotenv": {
+ "version": "5.0.1",
+ "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-5.0.1.tgz",
+ "integrity": "sha512-4As8uPrjfwb7VXC+WnLCbXK7y+Ueb2B3zgNCePYfhxS1PYeaO1YTeplffTEcbfLhvFNGLAz90VvJs9yomG7bow=="
+ },
+ "dotenv-expand": {
+ "version": "4.2.0",
+ "resolved": "https://registry.npmjs.org/dotenv-expand/-/dotenv-expand-4.2.0.tgz",
+ "integrity": "sha1-3vHxyl1gWdJKdm5YeULCEQbOEnU="
+ },
+ "dotenv-webpack": {
+ "version": "1.6.0",
+ "resolved": "https://registry.npmjs.org/dotenv-webpack/-/dotenv-webpack-1.6.0.tgz",
+ "integrity": "sha512-jTbHXmcVw3KMVhTdgthYNLWWHRGtucrADpZWwVCdiP+pCvuWvxLcUadwEnmz8Wqv/d2UAJxJhp1jrxGlMYCetg==",
+ "requires": {
+ "dotenv": "^5.0.1",
+ "dotenv-expand": "^4.0.1"
+ }
+ },
"duplexer": {
"version": "0.1.1",
"resolved": "http://registry.npmjs.org/duplexer/-/duplexer-0.1.1.tgz",
diff --git a/package.json b/package.json
index d1dc670a2..abcc5c130 100644
--- a/package.json
+++ b/package.json
@@ -15,6 +15,7 @@
"@babel/polyfill": "^7.2.5",
"@svgr/webpack": "^4.1.0",
"del": "^3.0.0",
+ "dotenv-webpack": "^1.6.0",
"gulp": "^4.0.0",
"gulp-babel": "^8.0.0",
"gulp-clean-css": "^3.10.0",
--
GitLab