Fix unable to view loading circular progress #4043
Conversation
| @@ -34,6 +34,10 @@ const MuiButton = styled(MuiIconButton)` | |||
| color: #666666; | |||
| `; | |||
|
|
|||
| const EmptyView = styled.div` | |||
| height: 50vh; | |||
There was a problem hiding this comment.
Where does 50vh come from? Seems pretty magic to me, and I can't see what it relates to...
There was a problem hiding this comment.
Yeah it is a very special case for LoadingContainer. EmptyView will help us to control the height of LoadingContainer dynamically.
The first thing is the height of LoadingContainer is the height of its child component. The existing problem is LoadingContainer current child isExportView, and its height is fixed, so when loading, if client has a small screen they cannot see the loading circular progress, unless they drag down.
I choose to adapt the behaviour of LoadingContainer since it got used by many places.
There was a problem hiding this comment.
Right I get it!
How about something like this? https://github.com/beyondessential/tupaia/pull/4048/files
The EmptyView wasn't as clear to me as an "isLoading" prop that defines the different styles
There was a problem hiding this comment.
That's much clearer @edmofro thanks! Nice one.
Issue #:
https://linear.app/bes/issue/RN-476#comment-5192a9d2