This library package React components that are used to visualize HURUmap data.
HURUmap is an interactive web platform that allows citizens and journalists to explore, visualise, and download census data. This gives them the power to give context to stories that was otherwise hard to spot. Accessible at https://hurumap.org
Hurumap-UI Storybook.
This project will be primarily using airbnb react and material-ui as our main style guides when implementing components.This is to create code consistency and readability.
If you'd like to contribute to sensors.AFRICA, check out the CONTRIBUTING.md file on how to get started; or jump right into our GitHub issues.
To publish a new release, we use the excellent yarn version cli command, configured to both publish to npm as well as deploy storybook to GitHub pages.
yarn version
Storybook is an open-source tool that provides a sandbox to develop and visualize components in isolation. See the Storybook site for more information about the tool.
HURUmap uses Storybook to view and work with the UI components developed in the HURUmap packages.
View online at: https://codeforafrica.github.io/HURUmap-UI/
Run locally in your development environment running: yarn start
from the top-level Gutenberg directory.
Run yarn publish:packages
otherwise always publish using lerna --contents
argument like so yarn lerna publish --contents build
.
When adding a new package, be sure to add the alias to the babel.config.js and .eslintrc.js:
- babel.config.js
module.exports = {
presets: ['@babel/preset-react', '@babel/preset-env'],
plugins: ['inline-react-svg'],
env: {
development: {
plugins: [
[
'module-resolver',
{
alias: {
'@hurumap-ui/content': './packages/content/src',
'@hurumap-ui/charts': './packages/charts/src',
'@hurumap-ui/core': './packages/core/src'
}
}
]
]
}
}
};
- .eslintrc.js
module.exports = {
...,
settings: {
'import/resolver': {
'babel-module': {
alias: {
'@hurumap-ui/content': './packages/content/src',
'@hurumap-ui/charts': './packages/charts/src',
'@hurumap-ui/core': './packages/core/src'
}
}
}
}
};
.babelrc
for storybook https://storybook.js.org/docs/configurations/custom-babel-config/
{
"presets": ["@babel/preset-react", "@babel/preset-env"],
"plugins": ["inline-react-svg", [
"module-resolver",
{
"alias": {
"@hurumap-ui/content": "./packages/content/src",
"@hurumap-ui/charts": "./packages/charts/src",
"@hurumap-ui/core": "./packages/core/src"
}
}
]]
}
Jest is used for testing.
- Run tests for packages with command
yarn lerna run test
- Run packge test
cd packages/<package name> && yarn test
GNU GPLv3
Copyright (C) 2018 Code for Africa
This program is free software: you can redistribute it and/or modify it under the terms of the GNU General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version.
This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for more details.
You should have received a copy of the GNU General Public License along with this program. If not, see https://www.gnu.org/licenses/.