resolve cyclical group association

awx/ui_next/src/api/models/Groups.js

@@ -48,6 +48,12 @@ class Groups extends Base {
       id: childId,
     });
   }
+
+  readPotentialGroups(id, params) {
+    return this.http.get(`${this.baseUrl}${id}/potential_children/`, {
+      params,
+    });
+  }
 }
 
 export default Groups;

awx/ui_next/src/screens/Inventory/InventoryGroup/InventoryGroup.jsx

@@ -48,7 +48,7 @@ function InventoryGroup({ i18n, setBreadcrumb, inventory }) {
     {
       name: (
         <>
-          <CaretLeftIcon />
+          <CaretLeftIcon aria-label={i18n._(t`Back to Groups`)} />
           {i18n._(t`Back to Groups`)}
         </>
       ),

awx/ui_next/src/screens/Inventory/InventoryRelatedGroups/InventoryRelatedGroupList.jsx

@@ -73,13 +73,14 @@ function InventoryRelatedGroupList({ i18n }) {
 
   const fetchGroupsToAssociate = useCallback(
     params => {
-      return InventoriesAPI.readGroups(
-        inventoryId,
-        mergeParams(params, { not__id: inventoryId, not__parents: inventoryId })
+      return GroupsAPI.readPotentialGroups(
+        groupId,
+        mergeParams(params, { not__id: groupId, not__parents: groupId })
       );
     },
-    [inventoryId]
+    [groupId]
   );
+
   const associateGroup = useCallback(
     async selectedGroups => {
       try {

awx/ui_next/src/screens/Inventory/InventoryRelatedGroups/InventoryRelatedGroupList.test.jsx

@@ -189,7 +189,7 @@ describe('<InventoryRelatedGroupList />', () => {
   });
 
   test('should associate existing group', async () => {
-    InventoriesAPI.readGroups.mockResolvedValue({
+    GroupsAPI.readPotentialGroups.mockResolvedValue({
       data: { count: mockGroups.length, results: mockGroups },
     });
     await act(async () => {
@@ -204,6 +204,13 @@ describe('<InventoryRelatedGroupList />', () => {
         .find('DropdownItem[aria-label="Add existing group"]')
         .prop('onClick')()
     );
+    expect(GroupsAPI.readPotentialGroups).toBeCalledWith(2, {
+      not__id: 2,
+      not__parents: 2,
+      order_by: 'name',
+      page: 1,
+      page_size: 5,
+    });
     wrapper.update();
     act(() =>
       wrapper.find('CheckboxListItem[name="foo"]').prop('onSelect')({ id: 1 })