React based UI Component Library for big data handling, interactions, presentation and visualisation.
Currently a work in progress - Sept, 2022
Andy Clarke - Data Scientist & Engineer @ UBDC
To install this package in your React Project directly from the npm
registry.
npm i @urbanbigdatacentre/data-blocks
Check it out on npm
here.
Currently a work in progress - Aug, 2022
A customizable floating cookies banner sitting at the bottom of pages to control a user's cookie preferences.
Includes a basic description of cookie use and buttons to handle accept / reject behaviour.
Usage
Import the component
import {CookiesBanner} from '@urbanbigdatacentre/data-blocks'
- Required
color
prop:<string>
- Optional
theme
prop : Mui Design Theme<any>
<CookiesBanner color={"#219FF3"}/>
Two date pickers combined to provide a start date and end date picker. Allows for external state mgmt and dispatch actions.
Usage
Import the component
import {DateRangePicker} from '@urbanbigdatacentre/data-blocks'
All the following props are optional
theme
: Mui Design Theme<any>
startLabelText
: Label to go above start date text field<string>
endLabelText
: Label to go above end date text field<string>
externalStateStartDate
: External start date obj. Designed for Redux state mgmt<Dayjs | Date>
externalStateStartDate
: External end date obj. Designed for Redux state mgmt<Dayjs | Date>
externalStateSetStartDateDispatch
: Dispatch function to handle external start date state change. Designed for Redux state mgmt.<any>
externalStateSetEndDateDispatch
: Dispatch function to handle external end date state change. Designed for Redux state mgmt.<any>
// Example Usage
<DateRangePicker
theme={myMuiDesignTheme}
startLabelText={"Check In"}
endLabelText={"Check Out"}
externalStateStartDate={myReduxStore.startDate}
externalStateEndDate={myReduxStore.endDate}
externalStateSetStartDateDispatch={dispatchEvent}
externalStateSetEndDateDispatch={dispatchEvent}
/>
This package uses Github Actions to automatically publish to the npm
registry once a new release has been made on Github.
To make a new release ...
Update the version inside package.json
{
"version": "0.0.3"
}
Run rollup locally
npm run rollup
Add all changes to Github repo
git add .
Commit all changes for new version
git commit -m Added Cookies Banner - v.0.0.3
Push changes to remote origin
git push origin main
Draft and Publish new release in Github data-blocks
repo
Github Actions will automatically create a pipeline to publish the new version to the npm
registry.
Follow the changes inside this repo's Actions tab.