He obtenido algunos datos:

 const data = { type: "footer", company_data: { phone: "123456", email: "hello@site.com", page1: { title: "Terms & Conditions", url: "/terms-conditions/", }, page2: { title: "Privacy Policy", url: "/privacy-policy/", }, }, };

Yo uso el componente de esta manera:

 <Footer data={data} />

El componente:

 export default function Footer({ data }) { return ( <div> {data.type} </div> ); }

¡Excelente! Esto imprime el tipo: pie de página. Sin embargo, si trato de mapear con Object.entries , aparece un error:

 Error: Objects are not valid as a React child (found: object with keys {phone, email, page1, page2}). If you meant to render a collection of children, use an array instead.

OK, entonces no puedo usar un objeto como un niño React. He intentado convertir a matriz usando Object.entries(data); sin embargo, esto aún devuelve el mismo error ya que mantiene los objetos dentro de la matriz.

Cualquier ayuda sobre cómo puedo obtener una matriz u objeto utilizable para usar en el componente con claves y valores intactos sería muy apreciada.