I am trying to create a menuTree from fetched arrays in React. My problem is that I don't know how to build my array recursively:

Lets say I do a fetch of a mainUrl and get the array:

```
[
 {"id":"EU","type":"l","text":"Europe"},
 {"id":"AS","type":"l","text":"Asia"}
]

```

Since type is "l" i need to do another fetch: mainUrl/EU

Now i get:

```
[
 {"id":"SP","type":"l","text":"Spain"},
 {"id":"FR","type":"l","text":"France"}
]

```

Again both types are "l" so I do another fetch: mainUrl/EU/SP

Now i get:

```
[
 {"id":"MA","type":"t","text":"Madrid"}
]

```

Since type is now "t" i stop and start again with France and then Asia.

Keeping in mind that i don't know the dept of they children in the array

The my array should look like this: 

```
[
    {
        "id": "EU",
        "type": "l",
        "text": "Europe",
        "children": [
            {
                "id": "SP",
                "type": "l",
                "text": "Spain",
                "children":[
                    {
                        "id": "MA",
                        "type": "t",
                        "text": "Madrid"
                    }
                ]
            },
            {
                "id": "FR",
                "type": "l",
                "text": "France",
                "children": [
                    {
                        "id": "PA",
                        "type": "t",
                        "text": "Paris"
                    }
                ]
            }
        ]
    },
    {
        "id": "AS",
        "type": "l",
        "text": "Asia",
        "children":[...]
    }
]

```