1
0
mirror of https://github.com/Unleash/unleash.git synced 2025-02-09 00:18:00 +01:00

fix: display previously selected tags in dialog (#7271)

When opening a dialog where there's previously selected tags, also
render the previously selected tags.

This is consistent with how we do it for bulk tags.

So instead of showing this when you open the tag manager on a flag with
existing tags:

![image](https://github.com/Unleash/unleash/assets/17786332/c82393f6-9561-4f71-a64e-8537f10400d2)

We show this:

![image](https://github.com/Unleash/unleash/assets/17786332/8ae8acb7-fc13-4289-bae8-d58545f704f3)
This commit is contained in:
Thomas Heartman 2024-06-05 08:13:16 +02:00 committed by GitHub
parent 1c30fafd0f
commit 257cd5513f
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -2,7 +2,6 @@ import {
Autocomplete,
type AutocompleteProps,
Checkbox,
Chip,
createFilterOptions,
type FilterOptionsState,
TextField,
@ -14,7 +13,6 @@ import IndeterminateCheckBoxIcon from '@mui/icons-material/IndeterminateCheckBox
import type { ITag, ITagType } from 'interfaces/tags';
import { ConditionallyRender } from 'component/common/ConditionallyRender/ConditionallyRender';
import Add from '@mui/icons-material/Add';
import type { AutocompleteRenderGetTagProps } from '@mui/material/Autocomplete/Autocomplete';
export type TagOption = {
title: string;
@ -88,22 +86,6 @@ export const TagsInput = ({
);
};
const renderTags = (
tagValue: TagOption[],
getTagProps: AutocompleteRenderGetTagProps,
) =>
tagValue.map((option, index) => {
const exists = existingTags.some(
(existingTag) =>
existingTag.value === option.title &&
existingTag.type === tagType.name,
);
if (exists && indeterminateOptions === undefined) {
return null;
}
return <Chip {...getTagProps({ index })} label={option.title} />;
});
const filterOptions = (
options: TagOption[],
params: FilterOptionsState<TagOption>,
@ -134,7 +116,6 @@ export const TagsInput = ({
placeholder='Select Values'
options={options}
value={selectedOptions}
renderTags={renderTags}
isOptionEqualToValue={(option, value) => {
if (value.inputValue && value.inputValue !== '') {
return option.title === value.inputValue;