JSFiddle - React, Tailwind, and code Playground

by Jussia

JavaScript

var products = [
  {
    "Type":"NUL",
    "ID-Begin":"146300185700001457",
    "packingLevel":11,
    "packingId":"",
  },
  {
  	"Type":"BJ",
			"ID-Begin":"146300185700001440",
      "packingLevel":12,
			"packingId":"146300185700001457",
      	packing:{
          "Type":"NUL",
          "ID-Begin":"146300185700001457",
          "packingLevel":30,
          "packingId":"",
      }
  },
	{
  	"ItemDescription":"товар в палете 1",
		"QuantityDespatched":"11",
    "Type":"",
		"ID-Begin":"",
    "packingLevel":22,
		"packingId":"146300185700001440",
    packing:{
    	"Type":"BJ",
			"ID-Begin":"146300185700001440",
      "packingLevel":30,
			"packingId":"146300185700001457",
      	packing:{
          "Type":"NUL",
          "ID-Begin":"146300185700001457",
          "packingLevel":40,
          "packingId":"",
      }
    }
  },
  {
  	"ItemDescription":"товар в палете 2",
		"QuantityDespatched":"22",
    "Type":"",
		"ID-Begin":"",
    "packingLevel":15,
		"packingId":"146300185700001440",
    packing:{
    	"Type":"BJ",
			"ID-Begin":"146300185700001440",
      "packingLevel":60,
			"packingId":"146300185700001457",
      	packing:{
          "Type":"NUL",
          "ID-Begin":"146300185700001457",
          "packingLevel":70,
          "packingId":"",
      }
    }
  },
  {
    "Type":"NUL",
    "ID-Begin":"146300185700001464",
    "packingLevel":1,
    "packingId":"",
  },
  {
  	"ItemDescription":"товар в упаковке 1",
		"QuantityDespatched":"22",
    "Type":"",
		"ID-Begin":"",
    "packingLevel":0,
		"packingId":"146300185700001464",
    packing:{
    	"Type":"NUL",
			"ID-Begin":"146300185700001464",
      "packingLevel":1,
			"packingId":"",
    }
  }
]

var changePackingToProduct = function(products) {
	return products.map(function(product) {
  var changePackingOnChildItems = function(product) {
 		var level = 1
  
  	if (product.hasOwnProperty('packing')) {
					product.childItems = [product.packing];
          if...