Fix: Prevent duplicate IDs in FieldToggle when multiple column pickers are present

[Yashrajsingh2001]

Problem

When a page has multiple column-visibility UIs (e.g., a main DataTable with ColumnsButton and a nested DatagridConfigurable with SelectColumnsButton), clicking the text label next to a switch in the inner picker toggles columns on the outer (main) grid instead of the inner grid. This happens because the FieldToggle component uses the index prop to generate IDs for the Switch elements, causing duplicate IDs when both pickers are rendered simultaneously.

Solution

Replace the index-based ID generation with React.useId() to ensure each Switch component has a globally unique ID. This prevents label/id collisions when multiple column pickers are present in the DOM.

Changes made:

• Added const switchId = React.useId(); in the FieldToggle component
• Updated the htmlFor attribute in the label to use switchId
• Updated the Switch id prop to use switchId

How To Test

1. Create a List with DataTable and ColumnsButton (main column picker)
2. Inside an expanded row (or nested view), render another list with DatagridConfigurable / SelectColumnsButton (second column picker)
3. Ensure both pickers can be present in the DOM (e.g., main ColumnsButton Popover uses keepMounted)
4. Open the inner column picker and click a column name (label), not the switch
5. Verify that only the nested table's columns change (not the main table's columns)

Alternatively, use the CodeSandbox provided in the issue: https://codesandbox.io/p/github/marmelab/react-admin-sandbox/csb-pdqfw2/draft/condescending-spence

Additional Checks

• The PR targets master for a bugfix or a documentation fix, or next for a feature
• The PR includes unit tests (if not possible, describe why)
• The PR includes one or several stories (if not possible, describe why)
• The documentation is up to date

Note: Unit tests and stories are not included as this is a minimal fix to an existing component. The change is straightforward (using React's built-in useId() hook) and the existing tests should continue to pass. The fix addresses the root cause of the duplicate ID issue without changing the component's API or behavior.

Fixes #11236