Data table can still be interacted with when loading
- Dominant language
- TypeScript
- Stars
- 53
- Forks
- 63
- Avg merge
- 2d 4h
- Merged PRs (30d)
- 15
Description
## Summary
It should probably not be possible for the data table to be interacted with at all when it is loading.
## 💬 Description
When the `loading` prop is applied, you can still interact with the data table e.g. click on the pagination bar buttons (look at the [data table playground story and enable the loading prop](https://mi6.github.io/ic-ui-kit/branches/canary/v3.0.0/develop/react/?path=/story/react-components-data-table--playground-example&args=loading:!true)).
This is likely to cause issues e.g. because the user is executing / trying to execute functionality when there is no data yet. It may cause confusion to the user - perhaps seeming like the data table is half loaded.
I think it would be best if the user cannot interact with the data table at all when it is loading. Maybe the [loading overlay](https://mi6.github.io/ic-ui-kit/branches/canary/v3.0.0/develop/react/?path=/story/react-components-data-table--playground-example&args=loading:!true;loadingOverlay:!true) should be displayed by default? Because it prevents any interaction.
## 💰 Use value
This would help prevent any confusion for the user when the data table is loading, and prevent creating any issues in the app with people being able to interact when no data is loaded.
Contributor guide
Research direction
Start with the React data table playground story linked in the issue and compare the behavior with the loading overlay example. Trace the loading prop and pagination controls from that entry point, then verify that no table interaction is possible while loading and that normal interaction returns afterward.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 45/100