Json Design: What is the backend responsible for vs the frontend?

Let's say I'm trying to make a universal cat tracking app.

I have two ideas for designing this json, where each json represents the node and the arrow before it. Designing from an api backend perspective where the general idea of cat ownership is more important (so users pulling from this endpoint can understand and use the data as they see fit), I have this:

{
nodeId: Integer
Linked to: last node id
EvidenceConfidence: (high medium low)
Explanation: ["checked collar, checked with neighbors"]
recordType: [cat location event, evidence, cat ownership determination]
recordDetail: {
evidenceType: (collar, word of mouth, missing cat report match, etc )
neighbor name:
neighbor phone:
}

This json breaks down the information into well named fields, but does not conform to the ui.

Designing from a frontend perspective where the structure of the actual ui design is more important, I have this:

const example = {
 id: node id,
EvidenceConfidence:
  linkedTo: 'last node id',
  Explanation: ["checked collar, checked with neighbors"]
recordType: [cat location event, evidence, cat ownership determination]
  content: 'neighhbors suggest cat lives a t this residence',
  label: 'neighbor name',
  sublabel: 'neighbor phone',
  additionalInfo:,
};

This json is a lot more specific to the ui, and would simplify my ui codebase as I wouldn't have to translate between the raw data from the backend and the frontend.

Which json is better? Should there be some data processing layer in between the front and api to translate the data from raw api data to a format the ui can use? Should the backend directly pipeline data to the frontend in the format the frontend wants it to be in? Should the frontend massage the data to be in the format it wants it to be in?