How to generate a tree from .XML file using react.js?

Question

Hi,

I am new to ASP.net Core and React.js. I am converting asp.net webform application to react.js. Current application displays data in treeview using .xml, .xslt and .js. Please help me how to use these current .xml, .xslt code to generate a tree in react.js. Please find the current code in the attachment. I want the tree similar to this:. I am also including the react code component. This displays all the data in one list. Please modify the code so that it will generate a tree in react.

-Sales

      -A_test1_test1

              -A_Product1

                       - A_TestTemplate

       -A_test6

                -A_Prod

                           -Temp1

        -Gift Card

                  -Card

                           -All

-Service

        -Cards

                -Business Card

                          -Template

               -New Card

                          -tt

               -testCard

                          --Nttt

               - instantCard

                 --vvv

         --Card

               ---jjj

               --EmergencyCard

                       ----All

Thanks