What is proper way to hide column on click event using material UI data grid

Here is the code sand box. I am trying to hide a certain column after the user clicks any cell in the data grid. Right now, I put columns of data into const [cols, setCols] = React.useState(columns); I just modify use the setCols to modify hide attribute in the cols data. I have been trying to find a proper way to achieve this, however, the paid version of material ui have this feature and during the search on google, It seems like this is the only way to achieve the goal. I just want to check if there is another another potential approach to achieve my goal. Thanks!