Skip to content

Commit

Permalink
chore: Centralize field values
Browse files Browse the repository at this point in the history
  • Loading branch information
@kevee
kevee committed Jan 5, 2021
1 parent 7cb6e14 commit 3dd19dc
Show file tree
Hide file tree
Showing 6 changed files with 90 additions and 156 deletions.
3 changes: 2 additions & 1 deletion src/components/common/table.module.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,8 @@
}

.header-label {
@include bold-type-size(200);
@include bold-type-size(100);
@include margin(8, bottom);
left: 0.5rem;
position: absolute;
bottom: 2.1rem;
Expand Down
24 changes: 9 additions & 15 deletions src/components/pages/data/hhs-facilities/facility-details.js
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import React from 'react'
import FieldValue from './field-value'
import facilityDetailsStyle from './facility-details.module.scss'
import SocialSharing from '~components/common/social-sharing'

Expand All @@ -14,21 +15,25 @@ const fields = [
},
{
title: 'Percent of adult inpatient beds occupied by all patients',
percent: true,
field: 'adult_inpatient_beds_occupancy_all',
value: value => (value === null ? 'N/A' : `${Math.round(value * 100)}%`),
},
{
title: 'Percent of adult ICU beds occupied by all patients',
percent: true,
field: 'adult_icu_beds_occupancy_all',
value: value => `${Math.round(value * 100)}%`,
},
{
title: 'Percent of adult inpatient beds occupied by COVID-19 patients',
percent: true,
field: 'adult_inpatient_beds_occupancy_covid',
value: value => `${Math.round(value * 100)}%`,
},
{
title: 'Percent of adult ICU beds occupied by COVID-19 patients',
percent: true,
field: 'adult_icu_beds_occupancy_covid',
value: value => `${Math.round(value * 100)}%`,
},
Expand Down Expand Up @@ -63,21 +68,10 @@ const FacilityDetails = ({ facility, hideSharing = false }) => (
<div key={key}>
<dt>{fields[key].title}</dt>
<dd>
{typeof facility[fields[key].field] !== 'undefined' ? (
<>
{facility[fields[key].field] < 0 ? (
<>between 0 and 4</>
) : (
<>
{fields[key].value
? fields[key].value(facility[fields[key].field])
: facility[fields[key].field]}
</>
)}
</>
) : (
<>N/A</>
)}
<FieldValue
field={facility[fields[key].field]}
percent={fields[key].percent}
/>
</dd>
</div>
))}
Expand Down
17 changes: 17 additions & 0 deletions src/components/pages/data/hhs-facilities/field-value.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
import React from 'react'

const FieldValue = ({ field, percent }) => {
if (typeof field === 'undefined') {
return <>N/A</>
}
if (field > 0) {
return (
<>{`${
percent ? `${Math.round(field * 100)}%` : Math.round(field * 10) / 10
}`}</>
)
}
return <>between 0 and 4{percent && <>%</>}</>
}

export default FieldValue
57 changes: 13 additions & 44 deletions src/components/pages/data/hhs-facilities/map/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ import { Row, Col } from '~components/common/grid'
import { Table, Th, Td } from '~components/common/table'
import FacilityDetails from '../facility-details'
import Legend from './legend'
import FieldValue from '../field-value'
import Infobox from './infobox'
import Definitions from '../definitions'
import facilitiesMapStyles from './map.module.scss'
Expand Down Expand Up @@ -282,53 +283,21 @@ const HHSFacilitiesMap = ({ center, zoom, state = false }) => {
</Td>
<Td>
{layer === 'patients' && (
<>
{typeof facility.properties
.total_adult_patients_hospitalized_confirmed_and_suspected_covid_7_day_avg !==
'undefined' ? (
<>
{facility.properties
.total_adult_patients_hospitalized_confirmed_and_suspected_covid_7_day_avg >=
0 ? (
<>
{Math.round(
facility.properties
.total_adult_patients_hospitalized_confirmed_and_suspected_covid_7_day_avg,
)}
</>
) : (
'between 0 and 4'
)}
</>
) : (
<>N/A</>
)}
</>
<FieldValue
field={
facility.properties
.total_adult_patients_hospitalized_confirmed_and_suspected_covid_7_day_avg
}
/>
)}

{layer === 'icu' && (
<>
{typeof facility.properties
.staffed_icu_adult_patients_confirmed_and_suspected_covid_7_day_avg !==
'undefined' ? (
<>
{facility.properties
.staffed_icu_adult_patients_confirmed_and_suspected_covid_7_day_avg >=
0 ? (
<>
{Math.round(
facility.properties
.staffed_icu_adult_patients_confirmed_and_suspected_covid_7_day_avg,
)}
</>
) : (
'between 0 and 4'
)}
</>
) : (
<>N/A</>
)}
</>
<FieldValue
field={
facility.properties
.staffed_icu_adult_patients_confirmed_and_suspected_covid_7_day_avg
}
/>
)}
</Td>
</tr>
Expand Down
73 changes: 16 additions & 57 deletions src/components/pages/data/hhs-facilities/map/infobox.js
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
/* eslint-disable max-len */
import React from 'react'
import FieldValue from '../field-value'
import infoboxStyle from './infobox.module.scss'

const Infobox = ({ layer, facility, x, y }) => (
Expand All @@ -15,79 +16,37 @@ const Infobox = ({ layer, facility, x, y }) => (
<>
<p>
<strong>Adult COVID-19 patients currently in hospital:</strong>{' '}
{typeof facility.total_adult_patients_hospitalized_confirmed_and_suspected_covid_7_day_avg !==
'undefined' ? (
<>
{facility.adult_inpatient_beds_occupancy_covid >= 0 ? (
<>
{Math.round(
facility.total_adult_patients_hospitalized_confirmed_and_suspected_covid_7_day_avg,
)}
</>
) : (
'between 0 and 4'
)}
</>
) : (
<>N/A</>
)}
<FieldValue
field={
facility.total_adult_patients_hospitalized_confirmed_and_suspected_covid_7_day_avg
}
/>
</p>
<p>
<strong>
Percent of inpatient beds occupied by COVID-19 patients:
</strong>{' '}
{typeof facility.adult_inpatient_beds_occupancy_covid !==
'undefined' ? (
<>
{facility.adult_inpatient_beds_occupancy_covid >= 0
? `${Math.round(
facility.adult_inpatient_beds_occupancy_covid * 100,
)}%`
: 'between 0 and 4%'}
</>
) : (
<>N/A</>
)}
<FieldValue
field={facility.adult_inpatient_beds_occupancy_covid}
percent
/>
</p>
</>
)}

{layer === 'icu' && (
<>
{console.log(facility.adult_inpatient_beds_occupancy_covid)}
<p>
<strong>Adult COVID-19 ICU patients currently in hospital:</strong>{' '}
{typeof facility.staffed_icu_adult_patients_confirmed_and_suspected_covid_7_day_avg !==
'undefined' ? (
<>
{facility.staffed_icu_adult_patients_confirmed_and_suspected_covid_7_day_avg >=
0 ? (
<>
{Math.round(
facility.staffed_icu_adult_patients_confirmed_and_suspected_covid_7_day_avg,
)}
</>
) : (
'between 0 and 4'
)}
</>
) : (
<>N/A</>
)}
<FieldValue
field={
facility.staffed_icu_adult_patients_confirmed_and_suspected_covid_7_day_avg
}
/>
</p>
<p>
<strong>Percent of ICU beds occupied by COVID-19 patients:</strong>{' '}
{typeof facility.adult_icu_beds_occupancy_covid !== 'undefined' ? (
<>
{facility.adult_icu_beds_occupancy_covid >= 0
? `${Math.round(
facility.adult_icu_beds_occupancy_covid * 100,
)}%`
: 'between 0 and 4%'}
</>
) : (
<>N/A</>
)}
<FieldValue field={facility.adult_icu_beds_occupancy_covid} percent />
</p>
</>
)}
Expand Down
72 changes: 33 additions & 39 deletions src/components/pages/data/hhs-facilities/search.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import { Row, Col } from '~components/common/grid'
import { Table, Th, Td } from '~components/common/table'
import { Form, Input } from '~components/common/form'
import Modal from '~components/common/modal'
import FieldValue from './field-value'
import FacilityDetails, { fields } from './facility-details'
import searchStyle from './search.module.scss'

Expand Down Expand Up @@ -84,19 +85,19 @@ const HHSFacilitiesSearch = () => {
<Table>
<thead>
<tr>
<Th header>State</Th>
<Th header alignLeft>
Name
<Th>State</Th>
<Th alignLeft>Name</Th>
<Th alignLeft>Address</Th>
<Th header="COVID patients in hospital" isFirst alignLeft>
Adult patients (7 day average)
</Th>
<Th header alignLeft>
Address
<Th header scope="col">
Percent of inpatient beds
</Th>
<Th header isFirst>
Adult COVID-19 patients currently in hospital
</Th>
<Th header>
Percent of inpatient beds occupied by COVID-19 patients
<Th header="COVID patients in ICU" isFirst alignLeft>
Adult patients (7 day average)
</Th>
<Th header="COVID patients in ICU">Percent of ICU beds</Th>
</tr>
</thead>
<tbody>
Expand All @@ -123,37 +124,30 @@ const HHSFacilitiesSearch = () => {
</address>
</Td>
<Td isFirst>
{typeof hit.total_adult_patients_hospitalized_confirmed_and_suspected_covid_7_day_avg !==
'undefined' ? (
<>
{hit.total_adult_patients_hospitalized_confirmed_and_suspected_covid_7_day_avg >
0 ? (
<>
{Math.round(
hit.total_adult_patients_hospitalized_confirmed_and_suspected_covid_7_day_avg,
)}
</>
) : (
'between 0 and 4%'
)}
</>
) : (
<>N/A</>
)}
<FieldValue
field={
hit.total_adult_patients_hospitalized_confirmed_and_suspected_covid_7_day_avg
}
/>
</Td>
<Td>
<FieldValue
field={hit.adult_inpatient_beds_occupancy_covid}
percent
/>
</Td>
<Td>
<FieldValue
field={
hit.staffed_icu_adult_patients_confirmed_and_suspected_covid_7_day_avg
}
/>
</Td>
<Td>
{typeof hit.adult_inpatient_beds_occupancy_covid !==
'undefined' ? (
<>
{hit.adult_inpatient_beds_occupancy_covid > 0
? `${Math.round(
hit.adult_inpatient_beds_occupancy_covid * 100,
)}%`
: 'between 0 and 4%'}
</>
) : (
<>N/A</>
)}
<FieldValue
field={hit.adult_icu_beds_occupancy_covid}
percent
/>
</Td>
</tr>
))}
Expand Down

0 comments on commit 3dd19dc

Please sign in to comment.