Cómo editar y hacer un bucle en un objeto de Array en ReactJS.

En mi proyecto de React, estoy tratando de mostrar una tabla (usando react-data-table-component).

Aquí está mi código:

import React from "react";
import DataTable from "react-data-table-component";

class WrapperTableTile extends React.Component {
  render(){
    const {data} = this.props;
    const key = this.props.data[0];
    const keys = Object.keys({...key});

return (
  <div classname="card p-4 mb-4">
    <datatable title="" columns="{keys}" data="{data}" defaultsortfield="title" pagination="" selectablerows="" classname="table myDataTable" highlightonhover="{true}"></datatable>
  </div>
)


}
}

WrapperTableTile.defaultProps={
  data:{
    title:"",
    columns:[],
    rows:[]
  }
}

WrapperTableTile.propTypes={
  data:WrapperTableTileType
}

export default WrapperTableTile;

Mis datos son un array JSON con diferentes objetos, y uso Object.keys para obtener solo las claves del primer objeto, para usarlas como nombres de columnas en la tabla.

No funciona porque la salida de las claves es un objeto como:
{‘ID’,’NAME’,’AGE’,…} en lugar de un array que DataTable necesita para ser usado como columns = {keys}, como:

{
name: “ID”,
selector: “ID”,
sortable: true,
},
{
name: “NAME”,
selector: “NAME”,
sortable: true,
},
{
name: “AGE”,
selector: “AGE”,
sortable: true,
},

Entonces, al final, en React no sé cómo hacer algo como esto:

for (i = 0; i < keys.length; i++) {
{
name: keys[i],
selector: keys[i],
sortable: true,
}
}

¿Cómo puedo editar mi array para usarlo como valor en mi componente?