The tables are custom generated depending on user input. It is built using ag-grid react.

The number of tables being displayed are mapped accoring to the user input. Im not sure if this is causing duplicate/repeated data to be entered in my tables.

appCountArray is an array which stores the number of tables to be displayed. I need the data entered in different tables to have individual values.

enter code here{appCountArray.map((column) => (
        <AgGridReact getRowNodeId={getRowNodeId}
          {...column}
          key={column.field}
          className="ag-theme-alpine"
          rowData={arr1}
          columnDefs={dataMapp}
          frameworkComponents={{
            numericEditor: CellEditor
          }}
          defaultColDef={{
            editable: true,
            sortable: true,
            flex: 1,
            minWidth: 100,
            filter: true
            ///resizable: true
          }}
        />
      ))}

Find the running code below: https://codesandbox.io/s/silly-dijkstra-l9c8m?file=/src/App.js