Как добавить в таблицу дополнительный столбец, если данные приходят как объект?

Question

[MarEeeeee]

Использую компонент material ui

<DataGrid className={styles.table} columns={columns} rows={rows} getRowId={row => row.tradePlace_id} />

Данные в строки я вытягиваю с сервера, задача заключается в том, чтобы к приходящим данным добавить статический столбец, то есть данные для него с сервера не приходят.
Кроме того, столбец должен представлять собой кнопку, при нажатии на которую, можно будет захватить всю строку к которой она относится.
Инициализирую так

const rows: GridRowsProp = tradePlaces.tradePlaces;

  const columns: GridColDef[] = [
        {field: 'col1', headerName: 'Изменить', width: 500}, // Здесь должна быть кнопка
        {field: 'tradePlace_id', headerName: '№', width: 300},
        {field: 'name', headerName: 'Название', width: 300},
        {field: 'adress', headerName: 'Адрес', width: 300},
    ];

Подскажите, как реализовать подобное, смотрел документацию к компоненту, но не совсем понял как решить поставленную задачу. Я использую в своем проекте TS, буду крайне благодарен если и пример будет с ним

Answer 1

[0xD34F]

смотрел документацию к компоненту, но...

плохо смотрели