diff --git a/ui/src/picker.test.tsx b/ui/src/picker.test.tsx
index 58cd881775..b3a8c3ddf0 100644
--- a/ui/src/picker.test.tsx
+++ b/ui/src/picker.test.tsx
@@ -148,7 +148,7 @@ describe('Picker.tsx', () => {
expect(getAllByRole('option')).toHaveLength(1)
})
- it('Filters correctly - does not offer already selected', () => {
+ it('Filters correctly - does not offer already selected - with input provided', () => {
const { getByRole, queryByRole } = render()
const input = (getByRole('combobox') as HTMLInputElement)
@@ -159,6 +159,24 @@ describe('Picker.tsx', () => {
expect(queryByRole('option')?.querySelector('.ms-Suggestions-none')).toBeInTheDocument()
})
+ it('Filters correctly - does not offer already selected - without input provided', () => {
+ const { getByRole, queryByRole, getAllByRole } = render()
+ const input = (getByRole('combobox') as HTMLInputElement)
+
+ fireEvent.click(input)
+ expect(getAllByRole('option')).toHaveLength(2)
+ typeToInput(input, name)
+ fireEvent.click(getByRole('option'))
+
+ fireEvent.click(input)
+ expect(getAllByRole('option')).toHaveLength(1)
+ typeToInput(input, altName)
+ fireEvent.click(getByRole('option'))
+
+ fireEvent.click(input)
+ expect(queryByRole('option')?.querySelector('.ms-Suggestions-none')).toBeInTheDocument()
+ })
+
it('Sets args - single selection', () => {
const { getByRole } = render()
diff --git a/ui/src/picker.tsx b/ui/src/picker.tsx
index 8794d0998d..51902765cf 100644
--- a/ui/src/picker.tsx
+++ b/ui/src/picker.tsx
@@ -67,7 +67,7 @@ export const XPicker = ({ model: m }: { model: Picker }) => {
wave.args[m.name] = items ? items.map(({ key }) => key) : null
if (m.trigger) wave.push()
},
- onEmptyResolveSuggestions = () => tags
+ onEmptyResolveSuggestions = () => tags.filter(tag => !selectedTags.includes(tag))
React.useEffect(() => {
wave.args[m.name] = m.values || null