title: adding a delete button
body: <p>I created a search app where users can search movies and it will be shown in the table. However, I want a delete button in the last column in each movie row to delete a movie from the table. I'm being unable to do that. Can someone help me as to how to add that delete button in the last column? I've already created the deleteMovie action and reducers. I'm just not sure how to add it to the table. I tried to do as they told in the <a href="https://react-bootstrap-table.github.io/react-bootstrap-table2/docs/column-props.html#columnevents-object" rel="nofollow noreferrer">docs</a> but it isn't working for me</p>
  <pre><code>import React from &quot;react&quot;;
  import PropTypes from &quot;prop-types&quot;;
  import { connect } from &quot;react-redux&quot;;
  import { deleteMovie } from &quot;../action/movieActions&quot;;
  import &quot;react-bootstrap-table-next/dist/react-bootstrap-table2.min.css&quot;;
  import BootstrapTable from &quot;react-bootstrap-table-next&quot;;
  const MovieTable = ({ data, deleteMovie }) =&gt; {
    console.log(data);
    const columns = [
      {
        dataField: &quot;movieId&quot;,
        text: &quot;ID&quot;,
        sort: true
      },
      {
        dataField: &quot;name&quot;,
        text: &quot;Name&quot;,
        sort: true
      },
      {
        dataField: &quot;year&quot;,
        text: &quot;Year&quot;,
        sort: true
      },
      {
        dataField: &quot;Delete&quot;,
        title: &quot;delete&quot;,
        text: &quot;Delete&quot;,
         events: {
          onClick: () =&gt; deleteMovie(data.movieId)//tried this but didn't work
       }
      }
    ]
    return (
      &lt;div className=&quot;col m4&quot;&gt;
        &lt;BootstrapTable keyField=&quot;id&quot; data={data} columns={columns} /&gt;
      &lt;/div&gt;
    );
  };
  
  MovieTable.propTypes = {
    deleteMovie: PropTypes.func.isRequired
  };
  
  export default connect(
    null,
    { deleteMovie }
  )(MovieTable);
  </code></pre>