How to create Dynamic Hierarchy Structure View in joget UI Builder ?

I have multiple forms in my Joget app: NC, CN, and Units. The form fields are as follows:

• NC Form Fields: ID, Command Name, Command Code
• CN Form Fields: ID, Control Rate, Command, Location
• Units Form Fields: (Please specify the fields for the Units form)

I want to dynamically display CN records under their corresponding NC records on a Joget UI page. For example, if I enter the following records:

• NC Records: SNC, WNC, ENC
• CN Records: CN SNC, CN WNC, OF WNC, CN ENC

I want the UI to display them as follows:

• SNC
  • CN SNC
• WNC
  • CN WNC
  • OF WNC
• ENC
  • CN ENC

Please provide the necessary HTML and JavaScript code to achieve this functionality within the Joget UI Builder.