mi6 / mi6/ic-ui-kit

Data table can still be interacted with when loading

Open
#3,021 4 comments 0 reactions 0 assignees View on GitHub
data-table component
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

Open the contributing 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

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.