-
Notifications
You must be signed in to change notification settings - Fork 481
/
summary.jsx
121 lines (108 loc) · 3.07 KB
/
summary.jsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
/**
* Application Dashboard summary view.
* Route: /summary
*/
import PropTypes from 'prop-types';
import React from 'react';
import {connect} from 'react-redux';
import SummaryTable from './summary_table';
import {Row, Col} from 'react-bootstrap';
import RegionalPartnerDropdown, {
RegionalPartnerPropType
} from '../components/regional_partner_dropdown';
import ApplicantSearch from './applicant_search';
import AdminNavigationButtons from './admin_navigation_buttons';
import Spinner from '../components/spinner';
import $ from 'jquery';
export class Summary extends React.Component {
static propTypes = {
regionalPartnerFilter: RegionalPartnerPropType.isRequired,
showRegionalPartnerDropdown: PropTypes.bool,
isWorkshopAdmin: PropTypes.bool
};
constructor(props) {
super(props);
this.state = {
loading: true,
applications: null
};
}
UNSAFE_componentWillReceiveProps(nextProps) {
if (this.props.regionalPartnerFilter !== nextProps.regionalPartnerFilter) {
this.load(nextProps.regionalPartnerFilter);
}
}
UNSAFE_componentWillMount() {
this.load(this.props.regionalPartnerFilter);
}
componentWillUnmount() {
this.abortLoad();
}
abortLoad() {
if (this.loadRequest) {
this.loadRequest.abort();
}
}
load(regionalPartnerFilter) {
this.abortLoad();
this.setState({loading: true});
let url = '/api/v1/pd/applications';
if (this.props.showRegionalPartnerDropdown) {
url += `?${$.param({
regional_partner_value: regionalPartnerFilter.value
})}`;
}
this.loadRequest = $.ajax({
method: 'GET',
url,
dataType: 'json'
}).done(data => {
this.setState({
loading: false,
applications: data
});
});
}
render() {
if (this.state.loading) {
return <Spinner />;
}
return (
<div>
<ApplicantSearch />
{this.props.isWorkshopAdmin && <AdminNavigationButtons />}
{this.props.showRegionalPartnerDropdown && <RegionalPartnerDropdown />}
<h1>{this.props.regionalPartnerFilter.label}</h1>
<Row>
<Col sm={6}>
<SummaryTable
id="summary-csd-teachers"
caption="CS Discoveries Teachers"
data={this.state.applications['csd_teachers']}
path="csd_teachers"
applicationType="teacher"
/>
</Col>
<Col sm={6}>
<SummaryTable
id="summary-csp-teachers"
caption="CS Principles Teachers"
data={this.state.applications['csp_teachers']}
path="csp_teachers"
applicationType="teacher"
/>
</Col>
</Row>
</div>
);
}
}
export default connect(state => {
const isWorkshopAdmin = state.applicationDashboard.permissions.workshopAdmin;
return {
regionalPartnerFilter: state.regionalPartners.regionalPartnerFilter,
isWorkshopAdmin,
showRegionalPartnerDropdown:
isWorkshopAdmin || state.regionalPartners.regionalPartners.length > 1
};
})(Summary);