After the Table (see screenshot below of existing design) gets converted into an MUI data grid, we'll probably want a better mobile view experience for the document list.
For a while, a card design has been under discussion, see screenshot from Issue #222 (which was for contactsList, formerly clientList). However, the designs has yet to be implemented.
For the responsive breakpoint we could use the existing MUI breakpoint at theme.breakpoints.down('sm') which can be obtained by importing theme and calling const isSmallScreen = useMediaQuery(theme.breakpoints.down('sm'));.
Rationale:
While MUI data grids might look great for Desktop, it might be better to adopt a card design instead for mobile, even if it lack some of the features like sorting and filtering. But, we could always create a custom function for sorting and filtering for those cards in the future, if needed.
Describe the Current Behavior/Feature:
After the Table (see screenshot below of existing design) gets converted into an MUI data grid, we'll probably want a better mobile view experience for the document list.
For a while, a card design has been under discussion, see screenshot from Issue #222 (which was for
contactsList
, formerlyclientList
). However, the designs has yet to be implemented.For the responsive breakpoint we could use the existing MUI breakpoint at
theme.breakpoints.down('sm')
which can be obtained by importing theme and callingconst isSmallScreen = useMediaQuery(theme.breakpoints.down('sm'));
.Rationale:
While MUI data grids might look great for Desktop, it might be better to adopt a card design instead for mobile, even if it lack some of the features like sorting and filtering. But, we could always create a custom function for sorting and filtering for those cards in the future, if needed.