diff --git a/components/Flipper/FlipRestrictionList/EditRestriction/EditRestriction.module.css b/components/Flipper/FlipRestrictionList/EditRestriction/EditRestriction.module.css new file mode 100644 index 00000000..2833bdb3 --- /dev/null +++ b/components/Flipper/FlipRestrictionList/EditRestriction/EditRestriction.module.css @@ -0,0 +1,3 @@ +.multiSearch { + flex: 1; +} \ No newline at end of file diff --git a/components/Flipper/FlipRestrictionList/EditRestriction/EditRestriction.tsx b/components/Flipper/FlipRestrictionList/EditRestriction/EditRestriction.tsx index 02b2d923..e715d380 100644 --- a/components/Flipper/FlipRestrictionList/EditRestriction/EditRestriction.tsx +++ b/components/Flipper/FlipRestrictionList/EditRestriction/EditRestriction.tsx @@ -5,6 +5,8 @@ import ItemFilter from '../../../ItemFilter/ItemFilter' import Tooltip from '../../../Tooltip/Tooltip' import TagSelect from '../TagSelect/TagSelect' import api from '../../../../api/ApiHelper' +import styles from './EditRestriction.module.css' +import ApiSearchField from '../../../Search/ApiSearchField' interface Props { defaultRestriction: FlipRestriction @@ -15,6 +17,7 @@ interface Props { export interface UpdateState { type: 'blacklist' | 'whitelist' + selectedItem?: Item tags?: string[] itemFilter?: ItemFilter } @@ -42,6 +45,37 @@ function EditRestriction(props: Props) { return (
+ { + setUpdateState({ + ...updateState, + selectedItem: items[0] + ? { + tag: items[0].id, + name: items[0].dataItem.name, + iconUrl: items[0].dataItem.iconUrl + } + : undefined + }) + }} + searchFunction={api.itemSearch} + selected={ + updateState.selectedItem + ? [ + { + dataItem: { + name: updateState.selectedItem.name, + iconUrl: updateState.selectedItem.iconUrl + }, + label: updateState.selectedItem.name, + id: updateState.selectedItem.tag + } as unknown as SearchResultItem + ] + : undefined + } + /> { props.onAdd(updateState) }} - disabled={!isFilterValid} + disabled={!isFilterValid || !!updateState.selectedItem} > Add filter(s) diff --git a/components/Flipper/FlipRestrictionList/FlipRestrictionList.tsx b/components/Flipper/FlipRestrictionList/FlipRestrictionList.tsx index 5a4e6262..63e97c6f 100644 --- a/components/Flipper/FlipRestrictionList/FlipRestrictionList.tsx +++ b/components/Flipper/FlipRestrictionList/FlipRestrictionList.tsx @@ -155,6 +155,7 @@ function FlipRestrictionList(props: Props) { newRestrictions[index].tags = updateState.tags newRestrictions[index].isEdited = false newRestrictions[index].type = restriction.type + newRestrictions[index].item = updateState.selectedItem }) setSetting(RESTRICTIONS_SETTINGS_KEY, JSON.stringify(getCleanRestrictionsForApi(newRestrictions)))