2 tables on the same page causes React non-unique id warning

## Expected Behavior
When rendering multiple tables on the same page, I expect them to render without warnings.

## Current Behavior
React throw a warning in the console: `Found 2 elements with non-unique id #pagination-next`


## Steps to Reproduce (for bugs)
Just render two tables on the same page.

Sandbox with code to reproduce (codesandbox doesn't show the error, have to run locally)
https://codesandbox.io/s/upbeat-mclaren-che94

## Your Environment
| Tech | Version |
|--------------|---------|
| @material-ui/core | 4.11.0 |
| @material-ui/icons | 4.9.1 |
| MUI-datatables | 3.4.1 |
| React | 16.13.1 |
| browser | Chrome |
| NextJS | 9.5.3 |

Start by running the linked CodeSandbox reproduction locally and inspect how pagination elements are rendered when two tables are present. Done means rendering multiple tables without React's non-unique #pagination-next warning.

Written by the indexing model from the issue text.