Como você se lembra das lições anteriores, você pode usar o método map para iterar pelos diferentes objetos e renderizar os componentes dinamicamente assim:

export function App() {
  const fruits = [
    {
      id: 1,
      name: "Apple",
      color: "Red"
    },
    {
      id: 2,
      name: "Banana",
      color: "Yellow"
    },
    {
      id: 3,
      name: "Grapes",
      color: "Purple"
    }
  ];
  return (
    <div>
      {fruits.map(fruit => (
        <Card
          key={fruit.id}
          name={fruit.name}
          color={fruit.color}
        />
      ))}
    </div>
  );
}

Use o método map() para renderizar um único Card a partir do array. Passe os name, title e bio como props para o componente Card.

Testes:

• Você deve usar o método `map()` para iterar pelo array `profiles`.
• Você deve passar as props `name`, `title` e `bio` do objeto `profile`.