Всем привет. Подскажите, пожалуйста, как решить следующую задачу. С backend приходит массив с данных с типом виджетов, например:
{
  "widgets": [
    {
      "type": "One",
      "data": {
        "title": "title1",
        "subTitle": "subTitle1",
        "thirdText": "thirdText1"
      }
    },
    {
      "type": "Three",
      "data": {
        "title": "title3",
        "subTitle": "subTitle3",
        "thirdText": "thirdText3"
      }
    },
    {
      "type": "Two",
      "data": {
        "title": "title2",
        "subTitle": "subTitle2",
        "thirdText": "thirdText2"
      }
    }
  ]
}
Моя задача состоит в следующем: выводить виджеты в том порядке, в котором они пришли с backend. Т.е. в данном случае, вывод будет такой:
<React.Fragment>
  <ComponentOne />
  <ComponentThree />
  <ComponentTwo />
</React.Fragment>
Если данные не пришли на One, то вывод будет:
<React.Fragment>
  <ComponentThree />
  <ComponentTwo />
</React.Fragment>
Подскажите, пожалуйста, как правильно решить эту задачу сделать?