React-Admin: How do I hide the "Checkbox" with the Datagrid <row>?

Question

Within my App, we have permissions like ADD/DELETE based on roles.

• Admin has all permissions to add, delete, edit the records
• customers don't have the delete permissions.

I therefore want to hide the delete checkbox within the <Datagrid> for customers.

//RoleList.js

import React from "react";
import { List, Datagrid, TextField, SingleFieldList, ChipField, EditButton, DeleteButton, ReferenceArrayField, Loading } from "react-admin";
import { makeStyles } from "@material-ui/core/styles";

const useStyles = makeStyles(theme => ({
  chips: {
    backgroundColor: theme.palette.secondary.light
  }
}));

const RoleList = ({ permissions, ...props }) => {
  const classes = useStyles();

  if (!permissions) return <Loading />;
  const permissionsList = permissions.split(",");

  return (
    <List {...props} title="roles">
      <Datagrid rowClick="show">
        <TextField source="name" />
        <ReferenceArrayField reference="permissions" source="permissions">
          <SingleFieldList>
            <ChipField source="name" className={classes.chips} />
          </SingleFieldList>
        </ReferenceArrayField>
        {permissionsList.includes("edit_roles") && <EditButton />}
        {permissionsList.includes("delete_roles") && <DeleteButton />}
      </Datagrid>
    </List>
  );
};

export default RoleList;

This is my component where I hide edit and delete button based on permissions, but the checkbox is still functional. Am I missing anything from react-admin?

Guilt

Kindly add to the code snippet, how you are using permissions to hide the checkboxes. Thanks. – Balm

Answer 1

To hide the checkboxes:

<List
    {...props}
    bulkActionButtons={false}
>
...
</List>

Typhon

Answer 2

To hide those checkboxes in RA v4 or greater:

<Datagrid
    {...props}
    bulkActionButtons={false}
>
...
</Datagrid>

The bulkActionButtons prop was moved from List component to Datagrid component in RA v4.

Barcus