I've a conditional disabled row in material ui data grid where user cannot select or perform actions on it. I want to show cursor: "not-allowed" on this row. How can we add styling to that row? As we don't have any parameter in rows specifying that it's a disabled row.

      <DataGrid
        rowHeight={75}
        components={{
          NoRowsOverlay: CustomNoRowsOverlay,
        }}
        onSelectionModelChange={currentlySelected}
        selectionModel={[...selected]}
        columns={columns}
        rows={rows}
        autoHeight
        disableSelectionOnClick={disableSelectionOnClick}
        {...props}
        checkboxSelection={role === ROLES.ADMIN}
        disableColumnMenu
        isRowSelectable={(params) =>
          !(params?.row?.id === currentUserID)
        }
      />

and This is what disabled row and normal row look like in browser inspect element. First one is disabled row here.

CSS implementation for root class, in which the datagrid is wrapped.

root: {
  '& .MuiDataGrid-columnsContainer': {
    backgroundColor: theme.palette.secondary.main,
    color: theme.palette.text.light,
    lineHeight: '62px !important',
    maxHeight: '62px !important',
    minHeight: '62px !important',

    '& .MuiCheckbox-root': {
      color: theme.palette.checkbox.secondary,
    },
  },
  '& .MuiDataGrid-cell, & .MuiDataGrid-columnHeader': {
    outline: 'none !important',
  },
  '& .MuiDataGrid-window': {
    backgroundColor: colors.bgColor.secondary,
  },
  '& .MuiDataGrid-columnSeparator': { display: 'none' },
  '
  '& .MuiCheckbox-root': {
    color: theme.palette.checkbox.main,
  },
  '& .MuiDataGrid-sortIcon': {
    color: theme.palette.iconColor.default,
  },
  '& .MuiCheckbox-colorPrimary.Mui-disabled': {
    color: 'rgba(0, 0, 0, 0.26)',
  },
},