Fix class table width & height #137
Conversation
|
hm, i can't reproduce this on my browser; what browser are you using? |
|
Very interesting… I’m on Mac Safari 16.4, and I double-checked on localhost and hydrant.mit.edu. If that is the case, it could well be a bug of ag-grid-react. I’m down to either close this PR or merge this hot fix for Safari users (I'm unsure about the number of such students🤔). thank you very much! |
|
I double-checked in Chrome and Firefox on a Windows computer locally and at Hayden. The grid looks fine, just as expected. In fact, looking back, I noticed that I don't even have the "sort by column" toggle buttons, which makes a bug of ag-grid-react (on Webkit) more likely? |
|
this is potentially quite interesting… we should try upgrading ag-grid-react and see if it persists |
Description
For some mysterious reason, the class table grid is overflowing. This hides class details that are shown when a row is clicked.
On viewpoint of certain sizes, the grid may not take up 100% of the width.
Note
I write "mysterious" because I read from their official docs that the
<AgGridReact>is supposed to fit to the parent div's height and width. In our case, that div is a<Box>with height 320px and width 100%.<AgGridReact>ignores that... On the contrary, this page in the docs hints us to usestyleof<AgGridReact>which doesn't exist now (according to the Typescript spec). Hence, it is also possible that this is a bug with ag-grid (since we're using the latest 33.0.4 now) but unfortunately I don't have time to investigate...Screenshots
Before v.s. After
(Safari 16.4, on my Apple M2 MacBook Pro, Ventura 13.3.1)