[data grid] editing with getRowId for custom id field issue

[roastnewt]

Steps to reproduce

Steps:

1. Open this link to live example: https://codesandbox.io/p/devbox/polished-framework-x4fzg7
2. Double click to edit a row
3. Hit enter or clickaway to stop editing
4. Get TypeError: row is null

Current behavior

Datagrid - Editing a row with a custom rowId field and saving throws an error, and the row stays in edit mode

This started occurring when we updated from datagrid premium 7.27.3 to 7.28.0

Expected behavior

Clicking away / hitting enter should save the row and be back in view mode

Context

No response

Your environment

npx @mui/envinfo

   System:
    OS: Windows 11 10.0.22631
  Binaries:
    Node: 22.12.0 - C:\Program Files\nodejs\node.EXE
    npm: 10.9.0 - C:\Program Files\nodejs\npm.CMD
    pnpm: Not Found
  Browsers:
    Chrome: Not Found
    Edge: Chromium (127.0.2651.74)
  npmPackages:
    @emotion/react:  11.11.4
    @emotion/styled:  11.10.6
    @mui/core-downloads-tracker:  6.4.8
    @mui/icons-material: ^6.4.8 => 6.4.8
    @mui/material: ^6.1.1 => 6.4.8
    @mui/private-theming:  6.4.8
    @mui/styled-engine:  6.4.8
    @mui/system:  6.4.8
    @mui/types:  7.2.24
    @mui/utils:  6.4.8
    @mui/x-data-grid:  7.28.0
    @mui/x-data-grid-premium: ^7.27.3 => 7.28.0
    @mui/x-data-grid-pro:  7.28.0
    @mui/x-date-pickers:  7.28.0
    @mui/x-date-pickers-pro: ^7.27.3 => 7.28.0
    @mui/x-internals:  7.28.0
    @mui/x-license:  7.28.0
    @types/react: ^19.0.11 => 19.0.11
    react: ^19.0.0 => 19.0.0
    react-dom: ^19.0.0 => 19.0.0
    typescript: ^5.8.2 => 5.8.2

Search keywords: getRowId null edit datagrid save

Order ID or Support key 💳 (optional)

75070

[arminmeh]

hey @roastnewt
I can't access your sandbox.
can you update the permissions?

[roastnewt]

Whoops! Fixed

[michelengelen]

Hey @roastnewt ... It seems thegetRowWithUpdatedValuesFromRowEditing function is getting called with the wrong id. This diff fixes it, but i would like a second look from another dev from the team on this:

--- a/packages/x-data-grid/src/hooks/features/editing/useGridRowEditing.ts
+++ b/packages/x-data-grid/src/hooks/features/editing/useGridRowEditing.ts
@@ -535,7 +535,7 @@ export const useGridRowEditing = (
         return;
       }

-      const rowUpdate = apiRef.current.getRowWithUpdatedValuesFromRowEditing(row.id);
+      const rowUpdate = apiRef.current.getRowWithUpdatedValuesFromRowEditing(id);

       if (processRowUpdate) {
         const handleError = (errorThrown: any) => {

cc @arminmeh

[arminmeh]

@michelengelen what are the differences in v8 to make this work as is?

[michelengelen]

@michelengelen what are the differences in v8 to make this work as is?

Oh, I forgot to update the comment. This actually did not work when I updated all dependencies (fresh install).

[arminmeh]

I'll look into this

[arminmeh]

Your proposal is fine @michelengelen
I will open a PR with the fix

[github-actions]

This issue has been closed. If you have a similar problem but not exactly the same, please open a new issue.
Now, if you have additional information related to this issue or things that could help future readers, feel free to leave a comment.

[roastnewt]

Thank you @arminmeh @michelengelen for the quick turnaround and fix, it is very much appreciated