how to solve this error Objects are not valid as a React child (found: object with keys {id, text, checked}). If you meant to render a collection of children, use an array instead. code example
Example: Objects are not valid as a React child
<SomeComponent>
{ property1: 'someText', property2: 69 }
</SomeComponent>
<SomeComponent>
<AnotherComponent />
<p>Hello, World</p>
</SomeComponent>
<SomeComponent>
const someObject = { property1: 'someText', property2: 69 };
someObject.map(function(item, i) => <li key={i}>{item}</li>)
</SomeComponent>