Solucionem este erro, por favor [fechada]

Fetch

async function getSatellites(id) {
  let response = await fetch(`http://localhost:3000/api/${id}.json`)
  let data = await response.json();
  return data;
}

I have 3 JSONs with different satellites and a main JSON with the planets

{
  "satellites": (
    {"name": "Phobos"},
    {"name": "Deimos"},
    {"name": "Umbriel"},
    {"name": "Titania"},
    {"name": "Oberon"}
  )
}

JSON with the planets

{
  "planets": (
    {
      "id": "mars",
      "name": "Mars",
      "description": "Mars is the fourth planet from the Sun and the second-smallest planet in the Solar System after Mercury. In English, Mars carries a name of the Roman god of war and is often referred to as the 'Red Planet'.",
      "img_url": "https://upload.wikimedia.org/wikipedia/commons/thumb/0/02/OSIRIS_Mars_true_color.jpg/220px-OSIRIS_Mars_true_color.jpg",
      "link": "https://en.wikipedia.org/wiki/Mars"
    },
    {
      "id": "pluto",
      "name": "Pluto",
      "description": "Pluto (minor planet designation: 134340 Pluto) is a dwarf planet in the Kuiper belt, a ring of bodies beyond Neptune. It was the first Kuiper belt object to be discovered and is the largest known plutoid (or ice dwarf).",
      "img_url": "https://upload.wikimedia.org/wikipedia/commons/thumb/e/ef/Pluto_in_True_Color_-_High-Res.jpg/280px-Pluto_in_True_Color_-_High-Res.jpg",
      "link": "https://en.wikipedia.org/wiki/Pluto"
    },    
    {
      "id": "uranus",
      "name": "Uranus",
      "description": "Uranus (from the Latin name Ūranus for the Greek god Οὐρανός) is the seventh planet from the Sun. It has the third-largest planetary radius and fourth-largest planetary mass in the Solar System.",
      "img_url": "https://upload.wikimedia.org/wikipedia/commons/thumb/3/3d/Uranus2.jpg/280px-Uranus2.jpg",
      "link": "https://en.wikipedia.org/wiki/Uranus"
    }

  )
}

The error I’m getting

Uncaught (in promise) SyntaxError: Unexpected token < in JSON at position 0
Promise.then (async)
(anonymous) @ index.js:16
invokePassiveEffectCreate @ react-dom.development.js:23487
callCallback @ react-dom.development.js:3945
invokeGuardedCallbackDev @ react-dom.development.js:3994
invokeGuardedCallback @ react-dom.development.js:4056
flushPassiveEffectsImpl @ react-dom.development.js:23574
unstable_runWithPriority @ scheduler.development.js:468
runWithPriority$1 @ react-dom.development.js:11276
flushPassiveEffects @ react-dom.development.js:23447
(anonymous) @ react-dom.development.js:23324
workLoop @ scheduler.development.js:417
flushWork @ scheduler.development.js:390
performWorkUntilDeadline @ scheduler.development.js:157

OBS: The index.js : 16 leads to the second line of this useEffect, the one that has getSatellites on.

useEffect(() => {
    getSatellites(props.id).then(data => {
      setSatellites(data('satellites'))
    })
  }, ())

How do I solve this?