The DataTable keeps rerender when y use a component

[Kenya-DK]

The DataTable keeps rerender when y use a component in a column Describe the bug As the title says if y use a component in the column the database will keep rerender when y scroll up/down

To Reproduce Y can use the code in the example to reproduce the error

  import { Center, Text } from "@mantine/core";
  import { DataTable } from "mantine-datatable";
  import { useEffect, useState } from "react";

  function App() {
    const [companies, setCompanies] = useState<any>([]);

    useEffect(() => {
      Array.from({ length: 100 }).forEach((_, index) => {
        setCompanies((data: any) => [
          ...data,
          {
            id: Math.random(),
            name: `Company ${index}`,
            streetAddress: `Street Address ${index}`,
            city: `City ${index}`,
            state: `State ${index}`,
          },
        ]);
      });
    }, []);
    return (
      <Center w={"100%"} >
        <DataTable
          height={"50vh"}
          idAccessor={"id"}
          columns={[
            {
              accessor: 'name',
              render: ({ name }) => <TextTranslate i18nKey={name} />,
            },
            {
              accessor: 'streetAddress'
            },
            {
              accessor: 'city'
            },
            {
              accessor: 'state'
            }
          ]}
          records={companies}
        />
      </Center>
    );
  }

  export default App

  export type TextTranslateProps = {
    i18nKey: string;
  }
  export function TextTranslate({ i18nKey }: TextTranslateProps) {
    console.log("Render TextTranslate");
    return (
      <Text >
        {i18nKey}
      </Text>);
  }

Sorce code https://github.com/Kenya-DK/mantine-datatable-bug

Expected behavior I am not sure what the expected behavior is, but the database should not keep rerendering when y scroll up/down the DataTable component

Screenshots https://i.imgur.com/rAkDfQk.gif

Desktop (please complete the following information):

• OS: Windows 11
• Browser Brave Happens in Tauri as well
• Version Version 1.69.153 Chromium: 128.0.6613.85 (Officiel version) (64-bit)
• Node v20.9.0

[hilmia]

I have the same issue with v7.11.3

[ceciiiron]

I just tested it out today and I can also experience this issue. Components used inside the table keeps rerendering on scroll

[sidpagariya]

Reported this in #625 but there's been no response, it's likely due to the recent merge with row reordering but not entirely sure, if you revert back to v7.11.2 it should be good for now.

[icflorescu]

@mehdiraized and @MohdAhmad1, can you please have a look at this? Thanks a lot!

[icflorescu]

This and #625 should be fixed in v.7.12.3. Please note that some rerendering is expected to happen when scrolling, though (i.e. when the underlying scroll area is scrolled to top to to bottom).