React (Nextjs): render table row to boostrap modal onclick

Question

I have the following Nextjs page using React bootstrap modal and a MUI datatables component:

const Start = () => {

 const [show, setShow] = useState(false);

  const handleClose = () => setShow(false);
  const handleShow = () => setShow(true);

const options = {
    onTableInit: rowData,
    onRowClick: rowData => Testing(rowData),
  }

return (
    <Layout>
      <Modal show={show} onHide={handleClose}>
        <Modal.Header>
          <Modal.Title>Modal heading</Modal.Title>
        </Modal.Header>
        <Modal.Body>
          Modal content
          
        </Modal.Body>
        <Modal.Footer>
          <Button variant="secondary" onClick={handleClose}>
            Close
          </Button>
        </Modal.Footer>
      </Modal>

  <MUIDataTable
            title={"Datatable with modal onRowClick"}
            data={data}
            columns={columns}
            options={options}
            responsive="scrollFullHeight"
          />

 </Layout>
  )
  
}
export default Start;

The bootsrap modal works fine and opens onRowClick, I am also able to console log the rowData in a function when clicking a certain row:

function Testing(rowData) {
    console.log(rowData)
);

I would like to achieve passing this rowData to the bootstrap modal accordingly when clicked on certain row.

I know I should be using the mapping, since it's an JSON object

{rowData.map(item => {
   return <li key={item}>{item}</li>
}
)}

But how to integrate this into my current system? I get the error on rowData is not a function.