All the new and refactored code has been stored in a separate Portal folder to avoid collapsing with the legacy code base.
A new Design Component system was developed based on Material UI but customised for its purposes, including supporting several coloured themes.
Main flows were implemented as multistep forms with a focus only on grouped data with the ability to check selected information in the final step. All main user actions were gathered in the user panel under the main navigation bar. This user panel contains an icon button for applying filters, searching, downloading reports, adding new machines/groups/geofence etc.
All table pages with aggregate data and dashboard were enriched with sticky horizontal and vertical headers, the ability to scroll by many means (scrollbar, mouse dragging, button indicators) and a predefined filter and date range. Additionally, new metrics have been added, like shifts and off-hours.
Data analytics, including ML predictions, were implemented with the D3 library for profound visualisation and the ability to see all data segments. The general stats were represented with popular graphs in the Chart.js library.
New email templates have been developed to support images of graphs with data analytics for a week. Also, these templates were optimized to render conditionally supported/unsupported pieces of analytic data with the support of all popular email agents, including Outlook Windows. We use a combination of tools such as MJML email framework, Handlebars template engine and integration with Quickcharts.io based on Chart.js.
