[OSCI][FIX] responsive basic table components

[thanhinhchtom]

Description

Fix responsive basic table components

Issues Resolved

Fix #967 I try to change the layout for the screen that is bigger than a phone and smaller than a laptop. When in this type of screen, the hover will not show up some actions anymore, instead, it just have a multiple options button.

Screenshot

• Before:

• After:

Check List

• [ ] New functionality includes testing.
• [ ] New functionality has been documented.
• [x] All tests pass
  • [x] yarn lint
  • [x] yarn test-unit
• [x] Update CHANGELOG.md
• [x] Commits are signed per the DCO using --signoff

By submitting this pull request, I confirm that my contribution is made under the terms of the Apache 2.0 license.

For more information on following Developer Certificate of Origin and signing off your commits, please check here.

[joshuarrrr]

@thanhinhchtom For UI changes like this, can you provide before/after screenshots or screencasts that demonstrate the behavior? That makes it easier for reviewers to understand the intended change and how it was tested.

[thanhinhchtom]

@joshuarrrr I already added some description of what I have done to fix the responsive and visualize it with 2 screenshots above. Is that okay?

[joshuarrrr]

@joshuarrrr I already added some description of what I have done to fix the responsive and visualize it with 2 screenshots above. Is that okay?

Yep, thanks, that's helpful!

[thanhinhchtom]

@joshuarrrr I already try to make it show 1 button in this situation, but I think the component that is currently used will make it always shows up even if I hover or not when I reduce it to 1 button. So I decided to not show anything as the recommended solution in the issue. Is it okay to do so?

[joshuarrrr]

Wetting this to draft - @thanhinhchtom Feel free to set it back if you're able to revisit.