'React Material UI Collapsible Table with responsiveness

As of now, the current collapsible table allows us to put another element inside the collapse component. I have an existing data table from a website template which enables collapse upon resizing the windows (example screenshots attached). What it does is, enables collapse button upon resizing to tablet or mobile size and the headers along with its data will be inside the collapse element.

What I currently have is the demo from MUI website: https://codesandbox.io/s/3r9un3?file=/demo.js

Sample Images:

https://ibb.co/2Zck7GJ

https://ibb.co/pwDCqGC



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source