From 8dbb702857ac7f805aa94d7c7d242f6288449a5b Mon Sep 17 00:00:00 2001
From: Tomasz Knapik <hi@tmkn.org>
Date: Wed, 30 Jan 2019 15:02:25 +0000
Subject: [PATCH] Split out bundle for the submissions by status app
---
gulpfile.js | 11 ++--
.../templates/funds/submissions_by_round.html | 2 +-
.../funds/submissions_by_status.html | 2 +-
.../src/app/src/SubmissionsByStatusApp.js | 58 +++++++++++++++++++
.../{index.js => submissionsByRoundIndex.js} | 0
.../src/app/src/submissionsByStatusIndex.js | 18 ++++++
.../static_src/src/app/webpack.base.config.js | 8 ++-
7 files changed, 91 insertions(+), 8 deletions(-)
create mode 100644 opentech/static_src/src/app/src/SubmissionsByStatusApp.js
rename opentech/static_src/src/app/src/{index.js => submissionsByRoundIndex.js} (100%)
create mode 100644 opentech/static_src/src/app/src/submissionsByStatusIndex.js
diff --git a/gulpfile.js b/gulpfile.js
index c25abcae7..5164b8738 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -235,10 +235,13 @@ gulp.task('watch:static', function watch () {
gulp.task('watch:app', function watch (callback) {
var webpackOptions = webpackDev();
- webpackOptions.entry.unshift(
- `webpack-dev-server/client?http://localhost:${webpackOptions.devServer.port}/`,
- `webpack/hot/dev-server`
- );
+ webpackOptions.entry = Object.keys(webpackOptions.entry).reduce((acc, key) => {
+ acc[key] = [
+ `webpack-dev-server/client?http://localhost:${webpackOptions.devServer.port}/`,
+ 'webpack/hot/dev-server',
+ ].concat(webpackOptions.entry[key])
+ return acc;
+ }, {});
var serverOptions = Object.assign(
{}, webpackOptions.devServer, {
diff --git a/opentech/apply/funds/templates/funds/submissions_by_round.html b/opentech/apply/funds/templates/funds/submissions_by_round.html
index 2aee68595..5f4861595 100644
--- a/opentech/apply/funds/templates/funds/submissions_by_round.html
+++ b/opentech/apply/funds/templates/funds/submissions_by_round.html
@@ -21,6 +21,6 @@
{% endblock %}
</div>
</div>
-{% render_bundle 'main' %}
+{% render_bundle 'submissionsByRound' %}
{% endblock %}
diff --git a/opentech/apply/funds/templates/funds/submissions_by_status.html b/opentech/apply/funds/templates/funds/submissions_by_status.html
index 7d2780fd1..7b8f1a242 100644
--- a/opentech/apply/funds/templates/funds/submissions_by_status.html
+++ b/opentech/apply/funds/templates/funds/submissions_by_status.html
@@ -20,6 +20,6 @@
{% endblock %}
</div>
</div>
-{% render_bundle 'main' %}
+{% render_bundle 'submissionsByStatus' %}
{% endblock %}
diff --git a/opentech/static_src/src/app/src/SubmissionsByStatusApp.js b/opentech/static_src/src/app/src/SubmissionsByStatusApp.js
new file mode 100644
index 000000000..d2c153b1c
--- /dev/null
+++ b/opentech/static_src/src/app/src/SubmissionsByStatusApp.js
@@ -0,0 +1,58 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { hot } from 'react-hot-loader';
+import { connect } from 'react-redux'
+
+import Switcher from '@components/Switcher';
+
+
+class SubmissionsByStatusApp extends React.Component {
+ static propTypes = {
+ roundID: PropTypes.number,
+ setSubmissionRound: PropTypes.func,
+ pageContent: PropTypes.node.isRequired,
+ };
+
+
+ state = { detailOpened: false };
+
+ componentDidMount() {
+ }
+
+ openDetail = () => {
+ this.setState(state => ({
+ style: { ...state.style, display: 'none' } ,
+ detailOpened: true,
+ }));
+ }
+
+ closeDetail = () => {
+ this.setState(state => {
+ const newStyle = { ...state.style };
+ delete newStyle.display;
+ return {
+ style: newStyle,
+ detailOpened: false,
+ };
+ });
+ }
+
+ render() {
+ return (
+ <>
+ <Switcher selector='submissions-by-status-app-react-switcher' open={this.state.detailOpened} handleOpen={this.openDetail} handleClose={this.closeDetail} />
+
+ <div style={this.state.style} ref={this.setOriginalContentRef} dangerouslySetInnerHTML={{ __html: this.props.pageContent }} />
+
+ {this.state.detailOpened &&
+ //<GroupByStatusDetailView roundId={this.props.roundID} />
+ <p>Test</p>
+ }
+ </>
+ )
+ }
+}
+
+export default hot(module)(
+ connect(null, null)(SubmissionsByStatusApp)
+);
diff --git a/opentech/static_src/src/app/src/index.js b/opentech/static_src/src/app/src/submissionsByRoundIndex.js
similarity index 100%
rename from opentech/static_src/src/app/src/index.js
rename to opentech/static_src/src/app/src/submissionsByRoundIndex.js
diff --git a/opentech/static_src/src/app/src/submissionsByStatusIndex.js b/opentech/static_src/src/app/src/submissionsByStatusIndex.js
new file mode 100644
index 000000000..317ce8928
--- /dev/null
+++ b/opentech/static_src/src/app/src/submissionsByStatusIndex.js
@@ -0,0 +1,18 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+import { Provider } from 'react-redux';
+
+import SubmissionsByStatusApp from './SubmissionsByStatusApp';
+import createStore from '@redux/store';
+
+
+const container = document.getElementById('submissions-by-status-react-app');
+
+const store = createStore();
+
+ReactDOM.render(
+ <Provider store={store}>
+ <SubmissionsByStatusApp pageContent={container.innerHTML} />
+ </Provider>,
+ container
+);
diff --git a/opentech/static_src/src/app/webpack.base.config.js b/opentech/static_src/src/app/webpack.base.config.js
index 3c0f73b6b..0cdcd31ef 100644
--- a/opentech/static_src/src/app/webpack.base.config.js
+++ b/opentech/static_src/src/app/webpack.base.config.js
@@ -1,10 +1,14 @@
var path = require('path');
+var COMMON_ENTRY = ['@babel/polyfill', './src/datetime']
+
module.exports = {
context: __dirname,
- entry: ['@babel/polyfill', './src/datetime', './src/index'],
-
+ entry: {
+ submissionsByRound: COMMON_ENTRY.concat(['./src/submissionsByRoundIndex']),
+ submissionsByStatus: COMMON_ENTRY.concat(['./src/submissionsByStatusIndex']),
+ },
output: {
filename: '[name]-[hash].js'
},
--
GitLab