Cannot remove row while using custom renderer

[juliencampion]

First of all, thanks for creating and maintaining TUI Grid! Here's my bug report.

Describe the bug I am unable to properly delete rows from a grid I am working on. My use case is somewhat non-trivial, so I have created a sandbox with the minimum required code to trigger the bug: https://codesandbox.io/s/silly-lena-7hsj37

To Reproduce So far, this bug only seems to show itself under the following conditions:

• Use the React wrapper for TUI Grid (@toast-ui/react-grid)
• Maintain the table data in a state variable which is then passed as prop to the Grid component
• Use a custom renderer which makes a few calls to the grid instance passed as prop.

The codesandbox link above shows the conditions under which the bug is triggered.

If you remove the custom renderer from the sandbox code, the bug disappears.

Expected behavior In the sandbox linked above, the "Delete last row" button should remove the last row and the table should render only two rows.

Actual behavior The table fails to remove its last row. Additionally, a few console errors pop up during the sandbox app lifecycle.

Screenshots In the sandbox linked above, here is how the table looks in its initial state:

Upon clicking the "Delete last row" button, here is how the table looks:

Desktop (please complete the following information): I have been able to reproduce the bug on two different laptops using wildly different software (one runs MacOS/Chrome and the other Linux/Firefox), so I don't think the bug is browser dependent.

I am using the latest version of React (18.2.0) and TUI Grid (4.21.4), as shown in the sandbox.

Thank you for your time reading this bug report :)

[jajugoguma]

Sorry for late replying.

Thanks for reporting the bug. Could you please use your code like below for a while as I fix it?

const rowsWithSameArtist = data.filter(
  (row) => row. artist ?? {} === currentRow. artist ?? {}
);

[juliencampion]

Got it! Thanks. No worries!