From 3284cfd6002f0dcb48b1334a221e8896939feef9 Mon Sep 17 00:00:00 2001
From: Tomasz Knapik <hi@tmkn.org>
Date: Mon, 14 Jan 2019 19:24:37 +0000
Subject: [PATCH] Add proptypes to listing
---
.../src/app/src/SubmissionsByRoundApp.js | 32 ++++++++++---------
.../src/app/src/components/Listing/index.js | 13 ++++++++
.../src/app/src/containers/ByStatusListing.js | 7 ++--
3 files changed, 34 insertions(+), 18 deletions(-)
diff --git a/opentech/static_src/src/app/src/SubmissionsByRoundApp.js b/opentech/static_src/src/app/src/SubmissionsByRoundApp.js
index 22b073181..c5dac11a5 100644
--- a/opentech/static_src/src/app/src/SubmissionsByRoundApp.js
+++ b/opentech/static_src/src/app/src/SubmissionsByRoundApp.js
@@ -6,32 +6,34 @@ import GroupByStatusDetailView from '@containers/GroupByStatusDetailView';
class SubmissionsByRoundApp extends React.Component {
- state = {
- detailOpen: false,
- };
+ state = { detailOpened: false };
- constructor(props) {
- super(props);
+ openDetail = () => {
+ this.setState(state => ({
+ style: { ...state.style, display: 'none' } ,
+ detailOpened: true,
+ }));
}
- detailOpen = (state) => {
- this.setState({ style: { display: 'none' } })
- this.setState({ detailOpen: true })
- }
-
- detailClose = () => {
- this.setState({ style: {} })
- this.setState({ detailOpen: false })
+ closeDetail = () => {
+ this.setState(state => {
+ const newStyle = { ...state.style };
+ delete newStyle.display;
+ return {
+ style: newStyle,
+ detailOpened: false,
+ };
+ });
}
render() {
return (
<>
- <Switcher selector='submissions-by-round-app-react-switcher' open={this.state.detailOpen} handleOpen={this.detailOpen} handleClose={this.detailClose} />
+ <Switcher selector='submissions-by-round-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.detailOpen &&
+ {this.state.detailOpened &&
<GroupByStatusDetailView roundId={this.props.roundId} />
}
</>
diff --git a/opentech/static_src/src/app/src/components/Listing/index.js b/opentech/static_src/src/app/src/components/Listing/index.js
index 1f993fbd5..5d91ac0c3 100644
--- a/opentech/static_src/src/app/src/components/Listing/index.js
+++ b/opentech/static_src/src/app/src/components/Listing/index.js
@@ -1,4 +1,6 @@
import React from 'react';
+import PropTypes from 'prop-types';
+
import ListingHeading from '@components/ListingHeading';
import ListingItem from '@components/ListingItem';
@@ -47,3 +49,14 @@ export default class Listing extends React.Component {
);
}
}
+
+Listing.propTypes = {
+ items: PropTypes.arrayOf(PropTypes.shape({
+ title: PropTypes.string,
+ id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+ subitems: PropTypes.arrayOf(PropTypes.shape({
+ title: PropTypes.string,
+ id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
+ })),
+ })),
+};
diff --git a/opentech/static_src/src/app/src/containers/ByStatusListing.js b/opentech/static_src/src/app/src/containers/ByStatusListing.js
index 27cba75db..6e4c26e68 100644
--- a/opentech/static_src/src/app/src/containers/ByStatusListing.js
+++ b/opentech/static_src/src/app/src/containers/ByStatusListing.js
@@ -32,9 +32,10 @@ class ByStatusListing extends React.Component {
return this.props.items.map(v => ({
id: v.id,
title: v.title,
- subitems: [
- ...v.submissions
- ]
+ subitems: v.submissions.map(v => ({
+ title: v.title,
+ id: v.id,
+ })),
}));
}
}
--
GitLab