From ba25c57f556ec25e302b8c7a539b655ba82cf3e8 Mon Sep 17 00:00:00 2001 From: Adam Kendis Date: Thu, 11 Mar 2021 21:45:04 -0800 Subject: [PATCH 1/2] add agencies reducer and saga --- client/components/Map/RequestDetail.jsx | 17 ++++++++++------- client/redux/reducers/metadata.js | 12 ++++++++++++ client/redux/sagas/metadata.js | 5 +++++ 3 files changed, 27 insertions(+), 7 deletions(-) diff --git a/client/components/Map/RequestDetail.jsx b/client/components/Map/RequestDetail.jsx index 91c31e4d7..6ea7af8ea 100644 --- a/client/components/Map/RequestDetail.jsx +++ b/client/components/Map/RequestDetail.jsx @@ -78,6 +78,8 @@ class RequestDetail extends React.Component { councilName, typeName, typeId: requestTypeId, + // agencyId, + // agencyName, createdDate, closedDate, address, @@ -114,14 +116,12 @@ class RequestDetail extends React.Component { justify="space-between" alignItems="flex-start" > - - Service request: + Responsible agency: + + {/* {agencyName} */} - + Service request: + {srnumber} @@ -172,6 +172,7 @@ class RequestDetail extends React.Component { const mapStateToProps = state => ({ pinsInfo: state.data.pinsInfo, requestTypes: state.metadata.requestTypes, + agencies: state.metadata.agencies, }); const mapDispatchToProps = dispatch => ({ @@ -184,10 +185,12 @@ RequestDetail.propTypes = { requestId: PropTypes.number, pinsInfo: PropTypes.shape({}), requestTypes: PropTypes.arrayOf(PropTypes.shape({})).isRequired, + // agencies: PropTypes.arrayOf(PropTypes.shape({})), getPinInfo: PropTypes.func.isRequired, }; RequestDetail.defaultProps = { requestId: null, pinsInfo: {}, + // agencies: null, }; diff --git a/client/redux/reducers/metadata.js b/client/redux/reducers/metadata.js index 0e65e8a91..0c94975e5 100644 --- a/client/redux/reducers/metadata.js +++ b/client/redux/reducers/metadata.js @@ -5,6 +5,7 @@ export const types = { GET_REQUEST_TYPES_SUCCESS: 'GET_REQUEST_TYPES_SUCCESS', GET_COUNCILS_SUCCESS: 'GET_COUNCILS_SUCCESS', GET_REGIONS_SUCCESS: 'GET_REGIONS_SUCCESS', + GET_AGENCIES_SUCCESS: 'GET_AGENCIES_SUCCESS', GET_NC_GEOJSON_SUCCESS: 'GET_NC_GEOJSON_SUCCESS', }; @@ -37,6 +38,11 @@ export const getRegionsSuccess = response => ({ payload: response, }); +export const getAgenciesSuccess = response => ({ + type: types.GET_AGENCIES_SUCCESS, + payload: response, +}); + export const getNcGeojsonSuccess = response => ({ type: types.GET_NC_GEOJSON_SUCCESS, payload: response, @@ -52,6 +58,7 @@ const initialState = { requestTypes: [], councils: null, regions: null, + agencies: null, ncGeojson: null, }; @@ -77,6 +84,11 @@ export default (state = initialState, action) => { ...state, regions: action.payload, }; + case types.GET_AGENCIES_SUCCESS: + return { + ...state, + agencies: action.payload, + }; case types.GET_NC_GEOJSON_SUCCESS: return { ...state, diff --git a/client/redux/sagas/metadata.js b/client/redux/sagas/metadata.js index e0f4cf845..ef11d2e68 100644 --- a/client/redux/sagas/metadata.js +++ b/client/redux/sagas/metadata.js @@ -13,6 +13,7 @@ import { getCouncilsSuccess, getRegionsSuccess, getNcGeojsonSuccess, + getAgenciesSuccess, getMetadataFailure, } from '../reducers/metadata'; @@ -24,18 +25,21 @@ function* getMetadata() { requestTypes, councils, regions, + agencies, ncGeojson, ] = yield all([ call(axios.get, `${baseUrl}/status/api`), call(axios.get, `${baseUrl}/types`), call(axios.get, `${baseUrl}/councils`), call(axios.get, `${baseUrl}/regions`), + call(axios.get, `${baseUrl}/agencies`), call(axios.get, `${baseUrl}/geojson`), ]); const { data: statusMetadata } = metadata; const { data: typesMetadata } = requestTypes; const { data: councilsMetadata } = councils; const { data: regionsMetadata } = regions; + const { data: agenciesMetadata } = agencies; const { data: ncGeojsonMetadata } = ncGeojson; yield all([ @@ -43,6 +47,7 @@ function* getMetadata() { put(getRequestTypesSuccess(typesMetadata)), put(getCouncilsSuccess(councilsMetadata)), put(getRegionsSuccess(regionsMetadata)), + put(getAgenciesSuccess(agenciesMetadata)), put(getNcGeojsonSuccess(ncGeojsonMetadata)), ]); } catch (e) { From 8ba88a2154f4622550f37bcf9a56da5693fc9f5c Mon Sep 17 00:00:00 2001 From: Adam Kendis Date: Thu, 25 Mar 2021 13:03:29 -0700 Subject: [PATCH 2/2] Added agency link and source to RequestDetail --- client/components/Footer.jsx | 2 ++ client/components/Map/Map.jsx | 1 + client/components/Map/RequestDetail.jsx | 40 ++++++++++++++++++------- 3 files changed, 32 insertions(+), 11 deletions(-) diff --git a/client/components/Footer.jsx b/client/components/Footer.jsx index 3292ab49c..fc4de9125 100644 --- a/client/components/Footer.jsx +++ b/client/components/Footer.jsx @@ -10,6 +10,8 @@ import moment from 'moment'; const useStyles = makeStyles(theme => ({ footer: { + position: 'fixed', + bottom: 0, height: theme.footer.height, width: '100%', backgroundColor: theme.palette.primary.dark, diff --git a/client/components/Map/Map.jsx b/client/components/Map/Map.jsx index 4edcfcaa9..944b24323 100644 --- a/client/components/Map/Map.jsx +++ b/client/components/Map/Map.jsx @@ -53,6 +53,7 @@ const styles = theme => ({ display: 'none', }, '& .mapboxgl-popup-content': { + minWidth: 250, backgroundColor: theme.palette.primary.main, borderRadius: 5, padding: 10, diff --git a/client/components/Map/RequestDetail.jsx b/client/components/Map/RequestDetail.jsx index 6ea7af8ea..883e93313 100644 --- a/client/components/Map/RequestDetail.jsx +++ b/client/components/Map/RequestDetail.jsx @@ -8,6 +8,7 @@ import { getPinInfoRequest } from '@reducers/data'; import toTitleCase from '@utils/toTitleCase'; import Grid from '@material-ui/core/Grid'; import Divider from '@material-ui/core/Divider'; +import Link from '@material-ui/core/Link'; import FiberManualRecordIcon from '@material-ui/icons/FiberManualRecord'; import CircularProgress from '@material-ui/core/CircularProgress'; @@ -22,7 +23,7 @@ const styles = theme => ({ popupContent: { backgroundColor: theme.palette.primary.main, padding: '0 8', - minWidth: 215, + width: '100%', }, requestType: { ...theme.typography.h4, @@ -55,7 +56,7 @@ class RequestDetail extends React.Component { render() { const { - classes, requestId, pinsInfo, requestTypes, + classes, requestId, pinsInfo, requestTypes, agencies, } = this.props; if (!requestId) return null; @@ -78,13 +79,17 @@ class RequestDetail extends React.Component { councilName, typeName, typeId: requestTypeId, - // agencyId, - // agencyName, + agencyId: aId, + agencyName, + sourceName, createdDate, closedDate, address, } = pinsInfo[requestId]; + const { color } = requestTypes.find(({ typeId }) => typeId === requestTypeId); + const { website } = agencies.find(({ agencyId }) => agencyId === aId); + return (
typeId === requestTypeId).color, + color, fontSize: 16, }} /> @@ -116,10 +121,6 @@ class RequestDetail extends React.Component { justify="space-between" alignItems="flex-start" > - Responsible agency: - - {/* {agencyName} */} - Service request: {srnumber} @@ -163,6 +164,23 @@ class RequestDetail extends React.Component { ) } + Source: + + {sourceName} + + Agency: + + + {agencyName} + +
); @@ -185,12 +203,12 @@ RequestDetail.propTypes = { requestId: PropTypes.number, pinsInfo: PropTypes.shape({}), requestTypes: PropTypes.arrayOf(PropTypes.shape({})).isRequired, - // agencies: PropTypes.arrayOf(PropTypes.shape({})), + agencies: PropTypes.arrayOf(PropTypes.shape({})), getPinInfo: PropTypes.func.isRequired, }; RequestDetail.defaultProps = { requestId: null, pinsInfo: {}, - // agencies: null, + agencies: [], };