Accelerator Data Graph LWC - Source

Overview

This API specification is a component of MuleSoft Accelerators for Retail, which accelerates implementation of essential integration use cases for Salesforce, Salesforce Marketing Cloud, SAP and B2C Commerce.

This Lightning Web Component (LWC) can be used as a front end for displaying data from APIs delivered with Mule. This LWC displays a network graph relating a source record in Salesforce (as the root node) to N-number of systems (as child / edge nodes). This LWC is written generically to support any PARENT/CHILD relationship as a network graph.

Component Layout

The LWC is comprised of two visual elements, which can be added to a record detail view page:
1. The network graph that visualizes the parent/child relationship, including icons (png) to represent connected systems
2. A lightning tabset that dynamically generates tabs for each edge node (connected system), to display basic information. Currently only the ID is displayed however this could be extended to display a wide range of data elements

Mule App Formatting Notes

The format of the input data is critical to the LWC correctly rendering. The API should return an array of JSON with the minimum fields:
1. Id - an External ID referencing the relationship to a specific edge node (connected system)
2. Type - short reference to type of connected system (i.e. MDM)
3. Name - the label / display name presented on the Lightning Tabset

Additional data elements may be provided - but are not consumed nor required.
json [ { "Type":"MDM", "Name":"Master", "Id":"a114325f-ad0f-11eb-b4c8-0233bdd64096", "Status":"VALID", "LastChanged":"2021-05-04T19:33:40.000Z" }, { "Type":"SalesforceCore", "Name":"Salesforce", "Id":"0014x000009EdboAAC", "Status":"VALID", "LastChanged":"2021-05-04T19:33:40.000Z" }, { "Type":"SalesforceMarketing", "Name":"Marketing", "Id":"1289752144", "Status":"VALID", "LastChanged":"2021-05-04T19:33:45.000Z" }, { "Type":"SAPECC", "Name":"SAP", "Id":"0000001446", "Status":"VALID", "LastChanged":"2021-05-04T19:33:45.000Z" }, { "Type":"SalesforceB2C", "Name":"Commerce", "Id":"00014002", "Status":"VALID", "LastChanged":"2021-05-04T19:33:45.000Z" } ]