Disable hover effect on MUI DataGrid

Question

I'm struggling on small detail that would be to disable the hover effect of a MUI Datagrid row.

I can't find an easy way to do it, and reading the API documentation didn't help me.

How would you do it ?

<DataGrid
            columns={COLUMNS}
            rows={dailyReportItems}
            pageSize={pageSize}
            autoHeight
            onPageSizeChange={(newPageSize) => setPageSize(newPageSize)}
            pageSizeOptions={[10]}
            rowsPerPageOptions={[10]}
            disableSelectionOnClick
            getRowId={(row) => row.date}
            components={{
                NoRowsOverlay: () => (
                    <Stack
                        height="100%"
                        alignItems="center"
                        justifyContent="center"
                    >
                        Aucun résultat
                    </Stack>
                ),
                NoResultsOverlay: () => (
                    <Stack
                        height="100%"
                        alignItems="center"
                        justifyContent="center"
                    >
                        Aucun résultat sur ces filtres
                    </Stack>
                ),
            }}
            sx={{
                ".MuiTablePagination-displayedRows, .MuiTablePagination-selectLabel":
                    {
                        marginTop: "1em",
                        marginBottom: "1em",
                    },
            }}
        />

Answer 1

It seems only targeting .MuiDataGrid-row:hover is part of the way but will leave you with an annoying glitch as seen below.

This is because it seems to be adding a 'Mui-hovered' class temporarily which causes said glitch.

Making both transparent fixed it for me with no hover and no glitch.

// Neutralize the hover colour (causing a flash)
"& .MuiDataGrid-row.Mui-hovered": {
backgroundColor: "transparent",
},
// Take out the hover colour
"& .MuiDataGrid-row:hover": {
backgroundColor: "transparent",
},