Knocks a couple of tasks off the list in #25 by adding a date slider that filters the alerts on the map, and what is provided via the Download CSV / GeoJSON buttons.
Adds a function getDateOptions to AlertDashboard (formerly "Alerts"), which sorts the dates in the "Month detected" field in the GeoJSON properties, and returns an array of a maximum of the 12 last dates, with any earlier being truncated out. The returned array is stored in a prop dateOptions which is passed to the new slider component.
Once the user interacts with the slider, AlertSlider emits a range of dates, which is passed upstream to AlertDashboard and used to filter the data against the same "Month detected" field, in handleDateRangeChanged.
Additionally, instead of all of the data being passed to the "Download CSV / GeoJSON" buttons, we are now using a computed function filteredData to return filtered data, or all of it if no date range has been selected.
Otherwise, some cleanup - with the creation of AlertSlider I opted to move the Chart.JS into its own component as well, and I cleaned up the code for AlertDashboard in some places.
Still to do (as noted in comments) is ensuring that filtering is working correctly when there are more than 12 dates... so maybe that's a good call to action to add tests! :)
Knocks a couple of tasks off the list in #25 by adding a date slider that filters the alerts on the map, and what is provided via the Download CSV / GeoJSON buttons.
This PR:
AlertSlider.getDateOptionstoAlertDashboard(formerly "Alerts"), which sorts the dates in the "Month detected" field in the GeoJSON properties, and returns an array of a maximum of the 12 last dates, with any earlier being truncated out. The returned array is stored in a propdateOptionswhich is passed to the new slider component.AlertSlideremits a range of dates, which is passed upstream toAlertDashboardand used to filter the data against the same "Month detected" field, inhandleDateRangeChanged.filteredDatato return filtered data, or all of it if no date range has been selected.AlertSliderI opted to move the Chart.JS into its own component as well, and I cleaned up the code forAlertDashboardin some places.Still to do (as noted in comments) is ensuring that filtering is working correctly when there are more than 12 dates... so maybe that's a good call to action to add tests! :)