About the two date boxes, use a mui select tool to show quick options, custom should be selected by default. https://mui.com/material-ui/react-text-field/#select options should match the list below. Selecting an option will prefill the start and end date, and refresh the table
Show date ranges always top right, when date range is clicked use mui popover https://mui.com/material-ui/react-popover/ component show an experience with two date picker boxes, use two mui inputs with type=date as option https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/date
About the two date boxes, use a mui select tool to show quick options, custom should be selected by default. https://mui.com/material-ui/react-text-field/#select options should match the list below. Selecting an option will prefill the start and end date, and refresh the table