CRDCDH-538 Data Submission Statistics

[amattu2]

Overview

This PR adds the Data Submission statistics area to the Data Submissions Overview Page. Per K.C. request, Figma design 1 was implemented, if we need to change the chart to a different style, a new user story will be created.

To test this PR, use the submissions:

• http://localhost:4010/data-submission/34e60284-12b2-4b44-9252-0997057633a6/data-upload
• http://localhost:4010/data-submission/46cdaae6-ff98-4e53-823f-e67de6380fea/data-upload

Note: This is not a 1:1 implementation of the mockup. If this design does get approved, we will resolve any minor differences in UX QA.

Note: This PR introduces some 508 color contrast issues. These will be resolved when the other color scheme updates for CRDCDH-633 are provided.

Change Details (Specifics)

• Upgraded minimum MUI-X Charts dependency to latest stable release
• Modified the getSubmission query to also fetch submissionStats at the same time
• Added Recharts for the primary donut chart
  • MUI-X does not appear to provide contextual info on which slice is currently hovered over, which prevents the ability to change the center label depending on what slice is active

Related Ticket(s)

https://tracker.nci.nih.gov/browse/CRDCDH-538

[Alejandro-Vega]

Small optional changes requested. If will be fixed in future PR let me know.

[Alejandro-Vega]

Nice job, looks great!