From 296356722a0c019afff0a0de42a2ff0576d87de6 Mon Sep 17 00:00:00 2001 From: Edwin J Date: Sun, 19 Feb 2023 22:59:01 -0800 Subject: [PATCH 1/5] renamed getPinInfo to dispatchGetPinInfo in RequestDetail.jsx to improve readability --- client/components/Map/RequestDetail.jsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/client/components/Map/RequestDetail.jsx b/client/components/Map/RequestDetail.jsx index 271d6db12..fcac0e88a 100644 --- a/client/components/Map/RequestDetail.jsx +++ b/client/components/Map/RequestDetail.jsx @@ -52,10 +52,10 @@ const styles = theme => ({ class RequestDetail extends React.Component { componentDidUpdate(prev) { - const { requestId, pinsInfo, getPinInfo } = this.props; + const { requestId, pinsInfo, dispatchGetPinInfo } = this.props; if (requestId === prev.requestId) return; - if (requestId && !pinsInfo[requestId]) getPinInfo(requestId); + if (requestId && !pinsInfo[requestId]) dispatchGetPinInfo(requestId); } renderDaysOpen = days => { @@ -210,7 +210,7 @@ const mapStateToProps = state => ({ }); const mapDispatchToProps = dispatch => ({ - getPinInfo: srnumber => dispatch(getPinInfoRequest(srnumber)), + dispatchGetPinInfo: srnumber => dispatch(getPinInfoRequest(srnumber)), }); export default connect(mapStateToProps, mapDispatchToProps)(withStyles(styles)(RequestDetail)); @@ -220,7 +220,7 @@ RequestDetail.propTypes = { pinsInfo: PropTypes.shape({}), requestTypes: PropTypes.arrayOf(PropTypes.shape({})), agencies: PropTypes.arrayOf(PropTypes.shape({})), - getPinInfo: PropTypes.func.isRequired, + dispatchGetPinInfo: PropTypes.func.isRequired, }; RequestDetail.defaultProps = { From a168343dbec237514bfc4180e2080a1f19b208c9 Mon Sep 17 00:00:00 2001 From: Edwin J Date: Sun, 19 Feb 2023 23:06:14 -0800 Subject: [PATCH 2/5] renamed updateTypesFilter to dispatchUpdateTypesFilter in main/TypeSelector/index.js to improve readability --- client/components/main/Desktop/TypeSelector/index.js | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/client/components/main/Desktop/TypeSelector/index.js b/client/components/main/Desktop/TypeSelector/index.js index 33ab98ee3..07c0bbeb3 100644 --- a/client/components/main/Desktop/TypeSelector/index.js +++ b/client/components/main/Desktop/TypeSelector/index.js @@ -34,7 +34,7 @@ const formStyles = makeStyles(() => ({ const RequestTypeSelector = ({ requestTypes, - updateTypesFilter, + dispatchUpdateTypesFilter, selectedTypes, }) => { const [leftCol, setLeftCol] = useState(); @@ -65,7 +65,7 @@ const RequestTypeSelector = ({ function updateAll(isSelected) { requestTypes.forEach(type => { if (selectedTypes[type.typeId] !== isSelected) { - updateTypesFilter(type.typeId); + dispatchUpdateTypesFilter(type.typeId); } }); } @@ -128,7 +128,7 @@ const RequestTypeSelector = ({ padding: '0 0 0 9px', }} checked={selectedTypes[type.typeId]} - onChange={() => updateTypesFilter(type.typeId)} + onChange={() => dispatchUpdateTypesFilter(type.typeId)} /> )} label={type.typeName} @@ -155,7 +155,7 @@ const RequestTypeSelector = ({ padding: '0 2px 0 9px', }} checked={selectedTypes[type.typeId]} - onChange={() => updateTypesFilter(type.typeId)} + onChange={() => dispatchUpdateTypesFilter(type.typeId)} /> )} label={type.typeName} @@ -176,7 +176,7 @@ const mapStateToProps = state => ({ }); const mapDispatchToProps = dispatch => ({ - updateTypesFilter: type => dispatch(updateRequestTypes(type)), + dispatchUpdateTypesFilter: type => dispatch(updateRequestTypes(type)), }); export default connect( @@ -186,7 +186,7 @@ export default connect( RequestTypeSelector.propTypes = { requestTypes: PropTypes.arrayOf(PropTypes.shape({})), - updateTypesFilter: PropTypes.func.isRequired, + dispatchUpdateTypesFilter: PropTypes.func.isRequired, selectedTypes: PropTypes.shape({}).isRequired, }; From 0ee14686a61c4a65b9b7777f2f64b35f6111d89d Mon Sep 17 00:00:00 2001 From: Edwin J Date: Sun, 19 Feb 2023 23:10:11 -0800 Subject: [PATCH 3/5] changed default isToggled to true in main/TypeSelector/index.js to fix small bug requiring Select/Deselect All to be clicked twice initially to toggle --- client/components/main/Desktop/TypeSelector/index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/client/components/main/Desktop/TypeSelector/index.js b/client/components/main/Desktop/TypeSelector/index.js index 07c0bbeb3..a103a63fe 100644 --- a/client/components/main/Desktop/TypeSelector/index.js +++ b/client/components/main/Desktop/TypeSelector/index.js @@ -39,7 +39,7 @@ const RequestTypeSelector = ({ }) => { const [leftCol, setLeftCol] = useState(); const [rightCol, setRightCol] = useState(); - const [isToggled, toggle] = useToggle(false); + const [isToggled, toggle] = useToggle(true); // FormControlLabel related classes. const formClasses = formStyles(); From 1b70089b64c2431e77970921172c9d9fb9284eb9 Mon Sep 17 00:00:00 2001 From: Edwin J Date: Sun, 19 Feb 2023 23:58:04 -0800 Subject: [PATCH 4/5] in redux/tempTypes.js, changed typeId back to match the typeId returned from server API and added orderId property to each tempType object to allow tempTypes to be sorted according to UI specifications. I perform a sort by orderId in TypeSelector/index.js useEffect --- .../main/Desktop/TypeSelector/index.js | 7 ++-- client/redux/tempTypes.js | 35 +++++++++++++------ 2 files changed, 29 insertions(+), 13 deletions(-) diff --git a/client/components/main/Desktop/TypeSelector/index.js b/client/components/main/Desktop/TypeSelector/index.js index a103a63fe..abca9e9fd 100644 --- a/client/components/main/Desktop/TypeSelector/index.js +++ b/client/components/main/Desktop/TypeSelector/index.js @@ -49,9 +49,10 @@ const RequestTypeSelector = ({ useEffect(() => { if (requestTypes) { - const mid = Math.ceil(requestTypes.length / 2); - const left = requestTypes.slice(0, mid); - const right = requestTypes.slice(-mid); + const sortedRequestTypes = requestTypes.sort((a, b) => a.orderId - b.orderId); + const mid = Math.ceil(sortedRequestTypes.length / 2); + const left = sortedRequestTypes.slice(0, mid); + const right = sortedRequestTypes.slice(-mid); setLeftCol(left); setRightCol(right); } diff --git a/client/redux/tempTypes.js b/client/redux/tempTypes.js index d0c9da924..57e6abb06 100644 --- a/client/redux/tempTypes.js +++ b/client/redux/tempTypes.js @@ -4,9 +4,13 @@ import colors from '@theme/colors' +// For tempTypes below: +// 'orderId' is used to order items in main/TypeSelector/index.js. +// 'typeId' is the actual request ID value from server API. const tempTypes = [ - { - "typeId": 1, + { + "orderId": 1, + "typeId": 3, "typeName": "Animal Remains", "agencyId": 2, "agencyName": "Sanitation Bureau", @@ -14,7 +18,8 @@ const tempTypes = [ "description": "Dead animal located on the streets or outside of residences" }, { - "typeId": 2, + "orderId": 2, + "typeId": 4, "typeName": "Bulky Items", "agencyId": 2, "agencyName": "Sanitation Bureau", @@ -22,7 +27,8 @@ const tempTypes = [ "description": "Chairs, desks, mattress and more..." }, { - "typeId": 3, + "orderId": 3, + "typeId": 5, "typeName": "Electronic Waste", "agencyId": 2, "agencyName": "Sanitation Bureau", @@ -30,7 +36,8 @@ const tempTypes = [ "description": "Computers, microwaves, laptops and more..." }, { - "typeId": 4, + "orderId": 4, + "typeId": 1, "typeName": "Graffiti", "agencyId": 4, "agencyName": "Office of Community Beautification", @@ -38,7 +45,8 @@ const tempTypes = [ "description": "Graffiti on walls/bulidings, unpainted concrete surfaces or metal posts" }, { - "typeId": 5, + "orderId": 5, + "typeId": 2, "typeName": "Homeless Encampment", "agencyId": 2, "agencyName": "Sanitation Bureau", @@ -46,6 +54,7 @@ const tempTypes = [ "description": "Encampments impacting right-of-way or maintenance of clean and sanitary public areas" }, { + "orderId": 6, "typeId": 6, "typeName": "Illegal Dumping", "agencyId": 2, @@ -54,6 +63,7 @@ const tempTypes = [ "description": "Disposing of garbage, waste and other matter on public or private property" }, { + "orderId": 7, "typeId": 7, "typeName": "Metal Appliances", "agencyId": 2, @@ -62,7 +72,8 @@ const tempTypes = [ "description": "Air conditioners, dryers, refrigerator and more..." }, { - "typeId": 8, + "orderId": 8, + "typeId": 9, "typeName": "Multiple Streetlights", "agencyId": 1, "agencyName": "Street Lighting Bureau", @@ -70,7 +81,8 @@ const tempTypes = [ "description": "Multiple poles knocked down, streetlight outages on wooden power poles, or malfunctioning traffic signals" }, { - "typeId": 9, + "orderId": 9, + "typeId": 8, "typeName": "Single Streetlight", "agencyId": 1, "agencyName": "Street Lighting Bureau", @@ -78,6 +90,7 @@ const tempTypes = [ "description": "Pole knocked down, streetlight outage on a wooden power pole, or malfunctioning traffic signal" }, { + "orderId": 10, "typeId": 10, "typeName": "Water Waste", "agencyId": 1, @@ -86,7 +99,8 @@ const tempTypes = [ "description": "Water runoff, over-watering, incorrect water days, or any other water waste " }, { - "typeId": 11, + "orderId": 11, + "typeId": 12, "typeName": "Feedback", "agencyId": 0, "agencyName": null, @@ -94,7 +108,8 @@ const tempTypes = [ "description": "Either follow up on other issues or something that doesn't fit into the other types" }, { - "typeId": 12, + "orderId": 12, + "typeId": 11, "typeName": "Other", "agencyId": 0, "agencyName": null, From 86201b8dd3675c51d794e5a5235f0ed634487992 Mon Sep 17 00:00:00 2001 From: Edwin J Date: Mon, 20 Feb 2023 00:13:29 -0800 Subject: [PATCH 5/5] removed console.log --- client/components/main/Desktop/CouncilSelector/index.js | 1 - 1 file changed, 1 deletion(-) diff --git a/client/components/main/Desktop/CouncilSelector/index.js b/client/components/main/Desktop/CouncilSelector/index.js index 8b96b26de..ca072379d 100644 --- a/client/components/main/Desktop/CouncilSelector/index.js +++ b/client/components/main/Desktop/CouncilSelector/index.js @@ -35,7 +35,6 @@ const CouncilSelector = ({ const classes = useStyles(); useEffect(() => { - console.log('CouncilSelector: ', { councils }); dispatchUpdateUnselectedCouncils(councils); }, [councils, dispatchUpdateUnselectedCouncils]);