From 27cb9d7beef54ee48fbf8e1124ec1299f3202ebd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C3=9Cst=C3=BCn=20=C3=96zg=C3=BCr?= <ustun@edgedelta.com>
Date: Wed, 27 Nov 2024 14:13:39 +0300
Subject: [PATCH] [@mantine/core] Do not validate options by default in
 OptionsDropdown, MultiSelect and Select

Previously Mantine punished the common scenario of duplicate keys too heavily, resulting in component failures in duplicate options data. Now duplicate values are silently ignored as in React.
---
 .../core/src/components/Combobox/Combobox.types.ts        | 2 +-
 .../Combobox/OptionsDropdown/OptionsDropdown.tsx          | 8 ++++++--
 .../core/src/components/MultiSelect/MultiSelect.tsx       | 2 ++
 packages/@mantine/core/src/components/Select/Select.tsx   | 2 ++
 4 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/packages/@mantine/core/src/components/Combobox/Combobox.types.ts b/packages/@mantine/core/src/components/Combobox/Combobox.types.ts
index 089f88b1d31..1e30e8f07fd 100644
--- a/packages/@mantine/core/src/components/Combobox/Combobox.types.ts
+++ b/packages/@mantine/core/src/components/Combobox/Combobox.types.ts
@@ -34,7 +34,7 @@ export type ComboboxLikeStylesNames = Exclude<ComboboxStylesNames, 'header' | 'f
 export interface ComboboxLikeProps {
   /** Data used to generate options */
   data?: ComboboxData;
-
+  validateOptions?: boolean;
   /** Controlled dropdown opened state */
   dropdownOpened?: boolean;
 
diff --git a/packages/@mantine/core/src/components/Combobox/OptionsDropdown/OptionsDropdown.tsx b/packages/@mantine/core/src/components/Combobox/OptionsDropdown/OptionsDropdown.tsx
index 712f3a9b9a7..736248f5ac8 100644
--- a/packages/@mantine/core/src/components/Combobox/OptionsDropdown/OptionsDropdown.tsx
+++ b/packages/@mantine/core/src/components/Combobox/OptionsDropdown/OptionsDropdown.tsx
@@ -6,7 +6,7 @@ import { ComboboxItem, ComboboxLikeRenderOptionInput, ComboboxParsedItem } from
 import { defaultOptionsFilter, FilterOptionsInput } from './default-options-filter';
 import { isEmptyComboboxData } from './is-empty-combobox-data';
 import { isOptionsGroup } from './is-options-group';
-import { validateOptions } from './validate-options';
+import { validateOptions as validateOptionsFn } from './validate-options';
 import classes from '../Combobox.module.css';
 
 export type OptionsFilter = (input: FilterOptionsInput) => ComboboxParsedItem[];
@@ -95,6 +95,7 @@ export interface OptionsDropdownProps {
   hidden?: boolean;
   hiddenWhenEmpty?: boolean;
   filterOptions?: boolean;
+  validateOptions?: boolean;
   withCheckIcon?: boolean;
   value?: string | string[] | null;
   checkIconPosition?: 'left' | 'right';
@@ -116,6 +117,7 @@ export function OptionsDropdown({
   maxDropdownHeight,
   withScrollArea = true,
   filterOptions = true,
+  validateOptions = false,
   withCheckIcon = false,
   value,
   checkIconPosition,
@@ -126,7 +128,9 @@ export function OptionsDropdown({
   scrollAreaProps,
   'aria-label': ariaLabel,
 }: OptionsDropdownProps) {
-  validateOptions(data);
+  if (validateOptions) {
+    validateOptionsFn(data);
+  }
 
   const shouldFilter = typeof search === 'string';
   const filteredData = shouldFilter
diff --git a/packages/@mantine/core/src/components/MultiSelect/MultiSelect.tsx b/packages/@mantine/core/src/components/MultiSelect/MultiSelect.tsx
index 863a94bd861..125f85da8a6 100644
--- a/packages/@mantine/core/src/components/MultiSelect/MultiSelect.tsx
+++ b/packages/@mantine/core/src/components/MultiSelect/MultiSelect.tsx
@@ -189,6 +189,7 @@ export const MultiSelect = factory<MultiSelectFactory>((_props, ref) => {
     required,
     mod,
     renderOption,
+    validateOptions,
     onRemove,
     onClear,
     scrollAreaProps,
@@ -412,6 +413,7 @@ export const MultiSelect = factory<MultiSelectFactory>((_props, ref) => {
           withScrollArea={withScrollArea}
           maxDropdownHeight={maxDropdownHeight}
           filterOptions={searchable}
+          validateOptions={validateOptions}
           value={_value}
           checkIconPosition={checkIconPosition}
           withCheckIcon={withCheckIcon}
diff --git a/packages/@mantine/core/src/components/Select/Select.tsx b/packages/@mantine/core/src/components/Select/Select.tsx
index 8fda3c2dc82..8ffafa3f608 100644
--- a/packages/@mantine/core/src/components/Select/Select.tsx
+++ b/packages/@mantine/core/src/components/Select/Select.tsx
@@ -145,6 +145,7 @@ export const Select = factory<SelectFactory>((_props, ref) => {
     clearButtonProps,
     hiddenInputProps,
     renderOption,
+    validateOptions,
     onClear,
     autoComplete,
     scrollAreaProps,
@@ -300,6 +301,7 @@ export const Select = factory<SelectFactory>((_props, ref) => {
           withScrollArea={withScrollArea}
           maxDropdownHeight={maxDropdownHeight}
           filterOptions={searchable && selectedOption?.label !== search}
+          validateOptions={validateOptions}
           value={_value}
           checkIconPosition={checkIconPosition}
           withCheckIcon={withCheckIcon}