CRDCDH-538 Fix Node Sorting & Partially-Visible Carousel Elements

[amattu2]

Overview

This is a minor change to the CRDCDH-538 implementation to fix an issue noticed in the prod builds.

Issue 1: Inconsistent Node Sorting

Without React StrictMode, the nodes in the primary chart would appear in the order that the API sent the nodes until you switch the view type.

Issue 2: Partially Visible Nodes

For small datasets (under 3 nodes), the carousel would partially overlap with the individual node charts and not provide arrows to make them visible. This is fixed now.

Cases:

• 1 Node f30c5850-2349-4cd0-a4ef-959b8ea34ee5
• 2 Nodes 45a25d33-86a5-4cf3-bfa2-9a557dbfeb2c
• 3 Nodes 7408c5bb-d8a8-470a-9d9e-88c8792a84a1
• 7 Nodes b80ddec8-6f0e-4189-b7c0-0a60b9fda08c

Change Details (Specifics)

• Sort the dataset at the component level, prior to the primary chart rendering
• Recenter the carousel track (previously removed)
• Conditionally add the PaddingBox element to the carousel children
• Replace "no data..." message to conform to the user story

Related Ticket(s)

CRDCDH-538

[Alejandro-Vega]

LGTM!