-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
6 changed files
with
206 additions
and
179 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,94 @@ | ||
import PropTypes from 'prop-types'; | ||
import Typography from '@mui/material/Typography'; | ||
import Accordion from '@mui/material/Accordion'; | ||
import AccordionSummary from '@mui/material/AccordionSummary'; | ||
import AccordionDetails from '@mui/material/AccordionDetails'; | ||
import ExpandMoreIcon from '@mui/icons-material/ExpandMore'; | ||
import Link from '@mui/material/Link'; | ||
import FooterRow from '../FooterRow/FooterRow'; | ||
|
||
const Dictionary = ({ definitions, format, }) => ( | ||
<FooterRow heading='Definitions of terms'> | ||
{definitions.map((section, i) => ( | ||
<DictionarySection key={`def-section-${i}`} | ||
format={format} | ||
{...section} | ||
i={i} | ||
/> | ||
))} | ||
</FooterRow> | ||
); | ||
|
||
Dictionary.propTypes = { | ||
definitions: PropTypes.arrayOf(PropTypes.object).isRequired, | ||
format: PropTypes.func, | ||
}; | ||
|
||
const DictionarySection = ({ source, format, variables, i, }) => ( | ||
<Accordion | ||
disableGutters | ||
elevation={0} | ||
> | ||
<AccordionSummary | ||
aria-controls={`def-section-content-${i}`} | ||
id={`def-section-header-${i}`} | ||
expandIcon={<ExpandMoreIcon />} | ||
sx={{ | ||
'& .MuiAccordionSummary-content': { | ||
margin: '4px 0', | ||
}, | ||
}} | ||
size='small' | ||
variant='filled' | ||
> | ||
<Typography variant='h4'>{source}</Typography> | ||
</AccordionSummary> | ||
<AccordionDetails | ||
sx={{ | ||
'& dl': { | ||
margin: 0, | ||
} | ||
}} | ||
> | ||
<dl> | ||
{variables.map((def, j) => ( | ||
<Definition format={format} key={`def-${j}`} {...def} /> | ||
))} | ||
</dl> | ||
</AccordionDetails> | ||
</Accordion> | ||
); | ||
|
||
DictionarySection.propTypes = { | ||
source: PropTypes.string.isRequired, | ||
variables: PropTypes.arrayOf(PropTypes.object).isRequired, | ||
i: PropTypes.number.isRequired, | ||
format: PropTypes.func, | ||
}; | ||
|
||
const Definition = ({ term, definition, url, format }) => ( | ||
<> | ||
<dt | ||
style={{ | ||
fontWeight: '600', | ||
}} | ||
> | ||
{term} | ||
</dt> | ||
<dd> | ||
{format(definition)} | ||
{url && ( | ||
<Link href={url}> Learn more here.</Link> | ||
)} | ||
</dd> | ||
</> | ||
); | ||
|
||
Definition.propTypes = { | ||
term: PropTypes.string.isRequired, | ||
definition: PropTypes.string, | ||
url: PropTypes.string, | ||
format: PropTypes.func, | ||
}; | ||
|
||
export default Dictionary; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,28 @@ | ||
import PropTypes from 'prop-types'; | ||
import Typography from '@mui/material/Typography'; | ||
import Link from '@mui/material/Link'; | ||
import FooterRow from '../FooterRow/FooterRow'; | ||
|
||
const Download = ({ dwBase, dwSlug, ghBase, csvFn }) => { | ||
const dlLink = <Link href={`https://query.data.world/s/${dwSlug}`}>Download</Link>; | ||
const dwLink = <Link href={dwBase}>data.world</Link>; | ||
const ghLink = <Link href={`${ghBase}/${csvFn}`}>GitHub</Link>; | ||
return ( | ||
<FooterRow heading='Download data'> | ||
<Typography> | ||
{dlLink} data for all towns and COGs (.csv file), | ||
filter and analyze data online on {dwLink} (requires free sign-up), | ||
or download / clone from {ghLink} (advanced users). | ||
</Typography> | ||
</FooterRow> | ||
); | ||
}; | ||
|
||
Download.propTypes = { | ||
dwBase: PropTypes.string.isRequired, | ||
dwSlug: PropTypes.string.isRequired, | ||
ghBase: PropTypes.string.isRequired, | ||
csvFn: PropTypes.string.isRequired, | ||
}; | ||
|
||
export default Download; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,20 @@ | ||
import PropTypes from 'prop-types'; | ||
import Typography from '@mui/material/Typography'; | ||
import Box from '@mui/material/Box'; | ||
|
||
const FooterRow = ({ heading, children }) => ( | ||
<Box> | ||
<Typography | ||
variant='h3' | ||
gutterBottom | ||
>{heading}</Typography> | ||
{children} | ||
</Box> | ||
); | ||
|
||
FooterRow.propTypes = { | ||
heading: PropTypes.string.isRequired, | ||
children: PropTypes.node.isRequired, | ||
}; | ||
|
||
export default FooterRow; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,21 @@ | ||
import PropTypes from 'prop-types'; | ||
import Typography from '@mui/material/Typography'; | ||
import FooterRow from '../FooterRow/FooterRow'; | ||
|
||
const Geography = ({ towns, cog }) => ( | ||
<FooterRow heading='Geography'> | ||
<Typography> | ||
Note that in order to include Community Wellbeing Survey results for small towns, values shown here are based on a model that incorporates direct measurements. Contact DataHaven for more information about the methodology used. | ||
</Typography> | ||
{towns && <Typography> | ||
{`${cog} is made up of the towns of ${towns}.`} | ||
</Typography>} | ||
</FooterRow> | ||
); | ||
|
||
Geography.propTypes = { | ||
towns: PropTypes.string, | ||
cog: PropTypes.string, | ||
}; | ||
|
||
export default Geography; |
Oops, something went wrong.