Skip to content

Conversation

@NathanVss
Copy link
Collaborator

@NathanVss NathanVss commented Aug 21, 2024

Hi there πŸ‘‹

When using the selection feature on another project we realized that we needed to make some row non selectable at all by hiding the checkbox completely.

Result

Capture d’écran 2024-08-21 aΜ€ 16 20 35

Use case

We are building a file explorer in which we want to allow users to select files but not the folders, see:
Capture d’écran 2024-08-21 aΜ€ 16 21 08

@NathanVss NathanVss self-assigned this Aug 21, 2024
@changeset-bot
Copy link

changeset-bot bot commented Aug 21, 2024

πŸ¦‹ Changeset detected

Latest commit: 60d17e3

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
@openfun/cunningham-react Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@NathanVss NathanVss requested a review from jbpenrath August 21, 2024 14:21
@NathanVss NathanVss force-pushed the feat/datagrid-hide-select-checkboxes branch from e2adb7d to 486f028 Compare August 21, 2024 14:22
@NathanVss NathanVss marked this pull request as draft August 21, 2024 14:23
When using the selection feature on another project we realized that
we needed to make some row non selectable at all by hiding the checkbox
completely.
@NathanVss NathanVss force-pushed the feat/datagrid-hide-select-checkboxes branch from 486f028 to 60d17e3 Compare August 21, 2024 14:24
@NathanVss NathanVss marked this pull request as ready for review August 21, 2024 14:25
return (
<Checkbox
checked={row.getIsSelected()}
disabled={!row.getCanSelect}
Copy link
Collaborator

@jbpenrath jbpenrath Aug 21, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Your change highlights this logic is wrong

Suggested change
disabled={!row.getCanSelect}
disabled={!row.getCanSelect()}

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You are right on this, but we need a way to hide checkboxes, not just grey them out. WDYT about adding a props on DataGrid named hideSelectCellWhenDisabled ?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

(ping) :)

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Woops! I did not our reply ...
Ok let's do that


<Canvas sourceState="shown" of={Stories.ClientSideWithPagination}/>

You can also make a row non selectable by setting using `enableRowSelection` as a callback function that returns a boolean based on a condition.
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
You can also make a row non selectable by setting using `enableRowSelection` as a callback function that returns a boolean based on a condition.
You can also make a row non selectable by setting `enableRowSelection` prop with a callback function that returns a boolean based on a condition.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants