diff --git a/CHANGELOG.md b/CHANGELOG.md index 6196e44b..5753aa1c 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -5,6 +5,9 @@ All notable changes to this project will be documented in this file. ## [Unreleased] +- [#260](https://github.com/os2display/display-admin-client/pull/260) + - Bug in multiselect, fixed by removing duplicates by key both `@id`and `id` + - [#259](https://github.com/os2display/display-admin-client/pull/259) - Add saving of playlists/groups with screen (as opposed to _after_) - Clean up `screen-manager.jsx` diff --git a/src/components/util/forms/multiselect-dropdown/multi-dropdown.jsx b/src/components/util/forms/multiselect-dropdown/multi-dropdown.jsx index ce8f2710..5bd7d4c1 100644 --- a/src/components/util/forms/multiselect-dropdown/multi-dropdown.jsx +++ b/src/components/util/forms/multiselect-dropdown/multi-dropdown.jsx @@ -18,7 +18,8 @@ import "./multi-dropdown.scss"; * @param {Array} props.selected - The selected options * @param {string} props.name - The id of the form element * @param {boolean} props.isLoading - Whether the component is loading. - * @param {string | null} props.noSelectedString - The label for when there is nothing selected. + * @param {string | null} props.noSelectedString - The label for when there is + * nothing selected. * @param {string} props.errorText - The string to display on error. * @param {string} props.label - The input label * @param {string | null} props.helpText - Help text for the dropdown. @@ -122,13 +123,22 @@ function MultiSelectComponent({ const addOrRemoveNewEntryToSelected = (multiselectData) => { let selectedOptions = []; const idsOfSelectedEntries = multiselectData.map(({ value }) => value); - - selectedOptions = removeDuplicatesByKey( - [...selected, ...options].filter((option) => - idsOfSelectedEntries.includes(option["@id"] || option.id) - ), - "@id" - ); + const selectedAndOptions = [...selected, ...options]; + if ("@id" in selectedAndOptions[0]) { + selectedOptions = removeDuplicatesByKey( + selectedAndOptions.filter((option) => + idsOfSelectedEntries.includes(option["@id"]) + ), + "@id" + ); + } else { + selectedOptions = removeDuplicatesByKey( + selectedAndOptions.filter(({ id }) => + idsOfSelectedEntries.includes(id) + ), + "id" + ); + } if (singleSelect) { selectedOptions = [selectedOptions[selectedOptions.length - 1]];