Implementing Checkbox Toggle with Scale Components in React Data Grid about scale HOT 1 OPEN

Hi @henrisco82, sorry for the late reply.

I'm not sure the checkbox field should be set like that, looking at the docs https://telekom.github.io/scale/?path=/docs/components-data-grid--checkbox-cell the checkbox field is just a boolean (true for active), and not a complex object like in your code snippet. So your rows should be defined as follows:

const rows = activatedUsers.map((user) => ([
    user.email,
    user.roles,
    // if user object has an active property you could do:
    // user.active ? true : false
    // judging by the mapped array name 'activeUsers' i guess they can only be deactivated
    true

The scale-change event listener should be set on the ScaleDataGrid (or on window/document), so it would look something like this:

<ScaleDataGrid
    ...
    onScaleChange={() => {console.log('changed', rows}}
>

and this should log the rows with the updated values (when switched off they will be false).

I based my answer on #811 a little, where a somewhat similar issue was described, perhaps that can help you too.

Regarding the switch label, this seems not possible with the current implementation, and adding this would be a feature request (btw scale users are always welcome to open pull requests for such improvements 🤓).

from scale.