diff --git a/awx/ui_next/src/components/Lookup/HostFilterLookup.jsx b/awx/ui_next/src/components/Lookup/HostFilterLookup.jsx
index 1d08ea30c7..ea224dc5d1 100644
--- a/awx/ui_next/src/components/Lookup/HostFilterLookup.jsx
+++ b/awx/ui_next/src/components/Lookup/HostFilterLookup.jsx
@@ -32,7 +32,9 @@ import {
} from './shared/HostFilterUtils';
const ChipHolder = styled.div`
- --pf-c-form-control--Height: auto;
+ && {
+ --pf-c-form-control--Height: auto;
+ }
.pf-c-chip-group {
margin-right: 8px;
}
@@ -271,6 +273,27 @@ function HostFilterLookup({
))}
))}
+ {/* Parse advanced search chips */}
+ {Object.keys(chips).length > 0 &&
+ Object.keys(chips)
+ .filter(val => chips[val].chips.length > 0)
+ .filter(
+ val => searchColumns.map(val2 => val2.key).indexOf(val) === -1
+ )
+ .map(leftoverKey => (
+
+ {chips[leftoverKey]?.chips?.map(chip => (
+
+ {chip.node}
+
+ ))}
+
+ ))}
);
diff --git a/awx/ui_next/src/screens/Inventory/SmartInventory.jsx b/awx/ui_next/src/screens/Inventory/SmartInventory.jsx
index f3600ce95b..d490652138 100644
--- a/awx/ui_next/src/screens/Inventory/SmartInventory.jsx
+++ b/awx/ui_next/src/screens/Inventory/SmartInventory.jsx
@@ -1,5 +1,4 @@
import React, { useCallback, useEffect } from 'react';
-
import { t } from '@lingui/macro';
import {
Link,
diff --git a/awx/ui_next/src/screens/Inventory/shared/SmartInventoryForm.test.jsx b/awx/ui_next/src/screens/Inventory/shared/SmartInventoryForm.test.jsx
index 015aac2f32..d8f69af143 100644
--- a/awx/ui_next/src/screens/Inventory/shared/SmartInventoryForm.test.jsx
+++ b/awx/ui_next/src/screens/Inventory/shared/SmartInventoryForm.test.jsx
@@ -122,12 +122,44 @@ describe('', () => {
expect(groupChipGroup.find('Chip').length).toBe(1);
});
+ test('should display filter chips for advanced host filter', async () => {
+ await act(async () => {
+ wrapper.find('HostFilterLookup').invoke('onBlur')();
+ wrapper.find('HostFilterLookup').invoke('onChange')(
+ 'name__contains=f or name__contains=o'
+ );
+ });
+ wrapper.update();
+ const nameChipGroup = wrapper.find(
+ 'HostFilterLookup ChipGroup[categoryName="name__contains"]'
+ );
+ expect(nameChipGroup.find('Chip').length).toBe(2);
+ expect(
+ nameChipGroup
+ .find('Chip')
+ .at(0)
+ .prop('children')
+ ).toBe('f');
+ expect(
+ nameChipGroup
+ .find('Chip')
+ .at(1)
+ .prop('children')
+ ).toBe('o');
+ });
+
test('should submit expected form values on save', async () => {
await act(async () => {
wrapper.find('InstanceGroupsLookup').invoke('onChange')(
mockFormValues.instance_groups
);
});
+ await act(async () => {
+ wrapper.find('HostFilterLookup').invoke('onBlur')();
+ wrapper.find('HostFilterLookup').invoke('onChange')(
+ mockFormValues.host_filter
+ );
+ });
wrapper.update();
await act(async () => {
wrapper.find('button[aria-label="Save"]').simulate('click');