WIP Makefile

MANIFEST.in

@@ -12,7 +12,7 @@ recursive-include awx/plugins *.ps1
 recursive-include requirements *.txt
 recursive-include requirements *.yml
 recursive-include config *
-recursive-include licenses *
+recursive-include docs/licenses *
 recursive-exclude awx devonly.py*
 recursive-exclude awx/api/tests *
 recursive-exclude awx/main/tests *

Makefile

@@ -54,47 +54,6 @@ I18N_FLAG_FILE = .i18n_built
 	VERSION PYTHON_VERSION docker-compose-sources \
 	.git/hooks/pre-commit
 
-clean-tmp:
-	rm -rf tmp/
-
-clean-venv:
-	rm -rf venv/
-
-clean-dist:
-	rm -rf dist
-
-clean-schema:
-	rm -rf swagger.json
-	rm -rf schema.json
-	rm -rf reference-schema.json
-
-clean-languages:
-	rm -f $(I18N_FLAG_FILE)
-	find ./awx/locale/ -type f -regex ".*\.mo$" -delete
-
-## Remove temporary build files, compiled Python files.
-clean: clean-ui clean-api clean-awxkit clean-dist
-	rm -rf awx/public
-	rm -rf awx/lib/site-packages
-	rm -rf awx/job_status
-	rm -rf awx/job_output
-	rm -rf reports
-	rm -rf tmp
-	rm -rf $(I18N_FLAG_FILE)
-	mkdir tmp
-
-clean-api:
-	rm -rf build $(NAME)-$(VERSION) *.egg-info
-	rm -rf .tox
-	find . -type f -regex ".*\.py[co]$$" -delete
-	find . -type d -name "__pycache__" -delete
-	rm -f awx/awx_test.sqlite3*
-	rm -rf requirements/vendor
-	rm -rf awx/projects
-
-clean-awxkit:
-	rm -rf awxkit/*.egg-info awxkit/.tox awxkit/build/*
-
 ## convenience target to assert environment variables are defined
 guard-%:
 	@if [ "$${$*}" = "" ]; then \
@@ -372,15 +331,6 @@ bulk_data:
 
 UI_BUILD_FLAG_FILE = awx/ui/.ui-built
 
-clean-ui:
-	rm -rf node_modules
-	rm -rf awx/ui/node_modules
-	rm -rf awx/ui/build
-	rm -rf awx/ui/src/locales/_build
-	rm -rf $(UI_BUILD_FLAG_FILE)
-        # the collectstatic command doesn't like it if this dir doesn't exist.
-	mkdir -p awx/ui/build/static
-
 awx/ui/node_modules:
 	NODE_OPTIONS=--max-old-space-size=6144 $(NPM_BIN) --prefix awx/ui --loglevel warn --force ci
 
@@ -503,15 +453,6 @@ detect-schema-change: genschema
 	# Ignore differences in whitespace with -b
 	diff -u -b reference-schema.json schema.json
 
-docker-compose-clean: awx/projects
-	docker-compose -f tools/docker-compose/_sources/docker-compose.yml rm -sf
-
-docker-compose-container-group-clean:
-	@if [ -f "tools/docker-compose-minikube/_sources/minikube" ]; then \
-	    tools/docker-compose-minikube/_sources/minikube delete; \
-	fi
-	rm -rf tools/docker-compose-minikube/_sources/
-
 ## Base development image build
 docker-compose-build:
 	ansible-playbook tools/ansible/dockerfile.yml -e build_dev=True -e receptor_image=$(RECEPTOR_IMAGE)
@@ -519,15 +460,6 @@ docker-compose-build:
 	    --build-arg BUILDKIT_INLINE_CACHE=1 \
 	    --cache-from=$(DEV_DOCKER_TAG_BASE)/awx_devel:$(COMPOSE_TAG) .
 
-docker-clean:
-	$(foreach container_id,$(shell docker ps -f name=tools_awx -aq && docker ps -f name=tools_receptor -aq),docker stop $(container_id); docker rm -f $(container_id);)
-	if [ "$(shell docker images | grep awx_devel)" ]; then \
-	  docker images | grep awx_devel | awk '{print $$3}' | xargs docker rmi --force; \
-	fi
-
-docker-clean-volumes: docker-compose-clean docker-compose-container-group-clean
-	docker volume rm -f tools_awx_db tools_grafana_storage tools_prometheus_storage $(docker volume ls --filter name=tools_redis_socket_ -q)
-
 docker-refresh: docker-clean docker-compose
 
 ## Docker Development Environment with Elastic Stack Connected
@@ -540,14 +472,6 @@ docker-compose-cluster-elk: awx/projects docker-compose-sources
 docker-compose-container-group:
 	MINIKUBE_CONTAINER_GROUP=true make docker-compose
 
-clean-elk:
-	docker stop tools_kibana_1
-	docker stop tools_logstash_1
-	docker stop tools_elasticsearch_1
-	docker rm tools_logstash_1
-	docker rm tools_elasticsearch_1
-	docker rm tools_kibana_1
-
 psql-container:
 	docker run -it --net tools_default --rm postgres:12 sh -c 'exec psql -h "postgres" -p "5432" -U postgres'
 
@@ -604,6 +528,84 @@ messages:
 print-%:
 	@echo $($*)
 
+# Cleaning
+# --------------------------------------
+## Remove temporary build files, compiled Python files.
+clean: clean-ui clean-api clean-awxkit clean-dist
+	rm -rf awx/public
+	rm -rf awx/lib/site-packages
+	rm -rf awx/job_status
+	rm -rf awx/job_output
+	rm -rf reports
+	rm -rf tmp
+	rm -rf $(I18N_FLAG_FILE)
+	mkdir tmp
+
+clean-elk:
+	docker stop tools_kibana_1
+	docker stop tools_logstash_1
+	docker stop tools_elasticsearch_1
+	docker rm tools_logstash_1
+	docker rm tools_elasticsearch_1
+	docker rm tools_kibana_1
+
+clean-ui:
+	rm -rf node_modules
+	rm -rf awx/ui/node_modules
+	rm -rf awx/ui/build
+	rm -rf awx/ui/src/locales/_build
+	rm -rf $(UI_BUILD_FLAG_FILE)
+    # the collectstatic command doesn't like it if this dir doesn't exist.
+	mkdir -p awx/ui/build/static
+
+clean-tmp:
+	rm -rf tmp/
+
+clean-venv:
+	rm -rf venv/
+
+clean-dist:
+	rm -rf dist
+
+clean-schema:
+	rm -rf swagger.json
+	rm -rf schema.json
+	rm -rf reference-schema.json
+
+clean-languages:
+	rm -f $(I18N_FLAG_FILE)
+	find ./awx/locale/ -type f -regex ".*\.mo$" -delete
+
+clean-api:
+	rm -rf build $(NAME)-$(VERSION) *.egg-info
+	rm -rf .tox
+	find . -type f -regex ".*\.py[co]$$" -delete
+	find . -type d -name "__pycache__" -delete
+	rm -f awx/awx_test.sqlite3*
+	rm -rf requirements/vendor
+	rm -rf awx/projects
+
+clean-awxkit:
+	rm -rf awxkit/*.egg-info awxkit/.tox awxkit/build/*
+
+docker-compose-clean: awx/projects
+	docker-compose -f tools/docker-compose/_sources/docker-compose.yml rm -sf
+
+docker-compose-container-group-clean:
+	@if [ -f "tools/docker-compose-minikube/_sources/minikube" ]; then \
+	    tools/docker-compose-minikube/_sources/minikube delete; \
+	fi
+	rm -rf tools/docker-compose-minikube/_sources/
+
+docker-clean:
+	$(foreach container_id,$(shell docker ps -f name=tools_awx -aq && docker ps -f name=tools_receptor -aq),docker stop $(container_id); docker rm -f $(container_id);)
+	if [ "$(shell docker images | grep awx_devel)" ]; then \
+	  docker images | grep awx_devel | awk '{print $$3}' | xargs docker rmi --force; \
+	fi
+
+docker-clean-volumes: docker-compose-clean docker-compose-container-group-clean
+	docker volume rm -f tools_awx_db tools_grafana_storage tools_prometheus_storage $(docker volume ls --filter name=tools_redis_socket_ -q)
+
 # HELP related targets
 # --------------------------------------
 

awx/locale/es/LC_MESSAGES/django.po

@@ -6237,5 +6237,4 @@ msgstr "%s se está actualizando."
 
 #: awx/ui/urls.py:24
 msgid "This page will refresh when complete."
-msgstr "Esta página se actualizará cuando se complete."
-
+msgstr "Esta página se actualizará cuando se complete."

awx/locale/fr/LC_MESSAGES/django.po

@@ -721,7 +721,7 @@ msgstr "DTSTART valide obligatoire dans rrule. La valeur doit commencer par : DT
 #: awx/api/serializers.py:4657
 msgid ""
 "DTSTART cannot be a naive datetime.  Specify ;TZINFO= or YYYYMMDDTHHMMSSZZ."
-msgstr "DTSTART ne peut correspondre à une date-heure naïve. Spécifier ;TZINFO= ou YYYYMMDDTHHMMSSZZ."
+msgstr "DTSTART ne peut correspondre à une DateHeure naïve. Spécifier ;TZINFO= ou YYYYMMDDTHHMMSSZZ."
 
 #: awx/api/serializers.py:4659
 msgid "Multiple DTSTART is not supported."
@@ -6239,5 +6239,4 @@ msgstr "%s est en cours de mise à niveau."
 
 #: awx/ui/urls.py:24
 msgid "This page will refresh when complete."
-msgstr "Cette page sera rafraîchie une fois terminée."
-
+msgstr "Cette page sera rafraîchie une fois terminée."

awx/locale/nl/LC_MESSAGES/django.po

@@ -6237,5 +6237,4 @@ msgstr "Er wordt momenteel een upgrade van%s geïnstalleerd."
 
 #: awx/ui/urls.py:24
 msgid "This page will refresh when complete."
-msgstr "Deze pagina wordt vernieuwd als hij klaar is."
-
+msgstr "Deze pagina wordt vernieuwd als hij klaar is."

awx/main/tasks/receptor.py

@@ -61,15 +61,10 @@ def read_receptor_config():
             return yaml.safe_load(f)
 
 
-def work_signing_enabled(config_data):
-    for section in config_data:
-        if 'work-verification' in section:
-            return True
-    return False
+def get_receptor_sockfile():
+    data = read_receptor_config()
 
-
-def get_receptor_sockfile(config_data):
-    for section in config_data:
+    for section in data:
         for entry_name, entry_data in section.items():
             if entry_name == 'control-service':
                 if 'filename' in entry_data:
@@ -80,11 +75,12 @@ def get_receptor_sockfile(config_data):
         raise RuntimeError(f'Receptor conf {__RECEPTOR_CONF} does not have control-service entry needed to get sockfile')
 
 
-def get_tls_client(config_data, use_stream_tls=None):
+def get_tls_client(use_stream_tls=None):
     if not use_stream_tls:
         return None
 
-    for section in config_data:
+    data = read_receptor_config()
+    for section in data:
         for entry_name, entry_data in section.items():
             if entry_name == 'tls-client':
                 if 'name' in entry_data:
@@ -92,12 +88,10 @@ def get_tls_client(config_data, use_stream_tls=None):
     return None
 
 
-def get_receptor_ctl(config_data=None):
-    if config_data is None:
-        config_data = read_receptor_config()
-    receptor_sockfile = get_receptor_sockfile(config_data)
+def get_receptor_ctl():
+    receptor_sockfile = get_receptor_sockfile()
     try:
-        return ReceptorControl(receptor_sockfile, config=__RECEPTOR_CONF, tlsclient=get_tls_client(config_data, True))
+        return ReceptorControl(receptor_sockfile, config=__RECEPTOR_CONF, tlsclient=get_tls_client(True))
     except RuntimeError:
         return ReceptorControl(receptor_sockfile)
 
@@ -165,18 +159,15 @@ def run_until_complete(node, timing_data=None, **kwargs):
     """
     Runs an ansible-runner work_type on remote node, waits until it completes, then returns stdout.
     """
-    config_data = read_receptor_config()
-    receptor_ctl = get_receptor_ctl(config_data)
+    receptor_ctl = get_receptor_ctl()
 
     use_stream_tls = getattr(get_conn_type(node, receptor_ctl), 'name', None) == "STREAMTLS"
-    kwargs.setdefault('tlsclient', get_tls_client(config_data, use_stream_tls))
+    kwargs.setdefault('tlsclient', get_tls_client(use_stream_tls))
     kwargs.setdefault('ttl', '20s')
     kwargs.setdefault('payload', '')
-    if work_signing_enabled(config_data):
-        kwargs['signwork'] = True
 
     transmit_start = time.time()
-    result = receptor_ctl.submit_work(worktype='ansible-runner', node=node, **kwargs)
+    result = receptor_ctl.submit_work(worktype='ansible-runner', node=node, signwork=True, **kwargs)
 
     unit_id = result['unitid']
     run_start = time.time()
@@ -311,8 +302,7 @@ class AWXReceptorJob:
 
     def run(self):
         # We establish a connection to the Receptor socket
-        self.config_data = read_receptor_config()
-        receptor_ctl = get_receptor_ctl(self.config_data)
+        receptor_ctl = get_receptor_ctl()
 
         res = None
         try:
@@ -337,7 +327,7 @@ class AWXReceptorJob:
         if self.work_type == 'ansible-runner':
             work_submit_kw['node'] = self.task.instance.execution_node
             use_stream_tls = get_conn_type(work_submit_kw['node'], receptor_ctl).name == "STREAMTLS"
-            work_submit_kw['tlsclient'] = get_tls_client(self.config_data, use_stream_tls)
+            work_submit_kw['tlsclient'] = get_tls_client(use_stream_tls)
 
         with concurrent.futures.ThreadPoolExecutor(max_workers=1) as executor:
             transmitter_future = executor.submit(self.transmit, sockin)
@@ -487,9 +477,7 @@ class AWXReceptorJob:
 
     @property
     def sign_work(self):
-        if self.work_type in ('ansible-runner', 'local'):
-            return work_signing_enabled(self.config_data)
-        return False
+        return True if self.work_type in ('ansible-runner', 'local') else False
 
     @property
     def work_type(self):

awx/main/tests/functional/test_licenses.py

@@ -121,8 +121,8 @@ def test_python_and_js_licenses():
         return errors
 
     base_dir = settings.BASE_DIR
-    api_licenses = index_licenses('%s/../licenses' % base_dir)
-    ui_licenses = index_licenses('%s/../licenses/ui' % base_dir)
+    api_licenses = index_licenses('%s/../docs/licenses' % base_dir)
+    ui_licenses = index_licenses('%s/../docs/licenses/ui' % base_dir)
     api_requirements = read_api_requirements('%s/../requirements' % base_dir)
     ui_requirements = read_ui_requirements('%s/ui' % base_dir)
 

awx/ui/src/components/InstanceGroupLabels/InstanceGroupLabels.js

@@ -1,49 +0,0 @@
-import React from 'react';
-import { arrayOf, bool, number, shape, string } from 'prop-types';
-
-import { Label, LabelGroup } from '@patternfly/react-core';
-import { Link } from 'react-router-dom';
-
-function InstanceGroupLabels({ labels, isLinkable }) {
-  const buildLinkURL = (isContainerGroup) =>
-    isContainerGroup
-      ? '/instance_groups/container_group/'
-      : '/instance_groups/';
-  return (
-    <LabelGroup numLabels={5}>
-      {labels.map(({ id, name, is_container_group }) =>
-        isLinkable ? (
-          <Label
-            color="blue"
-            key={id}
-            render={({ className, content, componentRef }) => (
-              <Link
-                className={className}
-                innerRef={componentRef}
-                to={`${buildLinkURL(is_container_group)}${id}/details`}
-              >
-                {content}
-              </Link>
-            )}
-          >
-            {name}
-          </Label>
-        ) : (
-          <Label color="blue" key={id}>
-            {name}
-          </Label>
-        )
-      )}
-    </LabelGroup>
-  );
-}
-
-InstanceGroupLabels.propTypes = {
-  labels: arrayOf(shape({ id: number.isRequired, name: string.isRequired }))
-    .isRequired,
-  isLinkable: bool,
-};
-
-InstanceGroupLabels.defaultProps = { isLinkable: false };
-
-export default InstanceGroupLabels;

awx/ui/src/components/InstanceGroupLabels/index.js

@@ -1 +0,0 @@
-export { default } from './InstanceGroupLabels';

awx/ui/src/components/PromptDetail/PromptDetail.js

@@ -6,7 +6,6 @@ import { Link } from 'react-router-dom';
 import styled from 'styled-components';
 import { Chip, Divider, Title } from '@patternfly/react-core';
 import { toTitleCase } from 'util/strings';
-import InstanceGroupLabels from 'components/InstanceGroupLabels';
 import CredentialChip from '../CredentialChip';
 import ChipGroup from '../ChipGroup';
 import { DetailList, Detail, UserDateDetail } from '../DetailList';
@@ -228,7 +227,21 @@ function PromptDetail({
                   label={t`Instance Groups`}
                   rows={4}
                   value={
-                    <InstanceGroupLabels labels={overrides.instance_groups} />
+                    <ChipGroup
+                      numChips={5}
+                      totalChips={overrides.instance_groups.length}
+                      ouiaId="prompt-instance-groups-chips"
+                    >
+                      {overrides.instance_groups.map((instance_group) => (
+                        <Chip
+                          key={instance_group.id}
+                          ouiaId={`instance-group-${instance_group.id}-chip`}
+                          isReadOnly
+                        >
+                          {instance_group.name}
+                        </Chip>
+                      ))}
+                    </ChipGroup>
                   }
                 />
               )}

awx/ui/src/components/Schedule/ScheduleDetail/ScheduleDetail.js

@@ -10,7 +10,6 @@ import useRequest, { useDismissableError } from 'hooks/useRequest';
 import { JobTemplatesAPI, SchedulesAPI, WorkflowJobTemplatesAPI } from 'api';
 import { parseVariableField, jsonToYaml } from 'util/yaml';
 import { useConfig } from 'contexts/Config';
-import InstanceGroupLabels from 'components/InstanceGroupLabels';
 import parseRuleObj from '../shared/parseRuleObj';
 import FrequencyDetails from './FrequencyDetails';
 import AlertModal from '../../AlertModal';
@@ -28,6 +27,11 @@ import { VariablesDetail } from '../../CodeEditor';
 import { VERBOSITY } from '../../VerbositySelectField';
 import getHelpText from '../../../screens/Template/shared/JobTemplate.helptext';
 
+const buildLinkURL = (instance) =>
+  instance.is_container_group
+    ? '/instance_groups/container_group/'
+    : '/instance_groups/';
+
 const PromptDivider = styled(Divider)`
   margin-top: var(--pf-global--spacer--lg);
   margin-bottom: var(--pf-global--spacer--lg);
@@ -494,7 +498,26 @@ function ScheduleDetail({ hasDaysToKeepField, schedule, surveyConfig }) {
                 fullWidth
                 label={t`Instance Groups`}
                 value={
-                  <InstanceGroupLabels labels={instanceGroups} isLinkable />
+                  <ChipGroup
+                    numChips={5}
+                    totalChips={instanceGroups.length}
+                    ouiaId="instance-group-chips"
+                  >
+                    {instanceGroups.map((ig) => (
+                      <Link
+                        to={`${buildLinkURL(ig)}${ig.id}/details`}
+                        key={ig.id}
+                      >
+                        <Chip
+                          key={ig.id}
+                          ouiaId={`instance-group-${ig.id}-chip`}
+                          isReadOnly
+                        >
+                          {ig.name}
+                        </Chip>
+                      </Link>
+                    ))}
+                  </ChipGroup>
                 }
                 isEmpty={instanceGroups.length === 0}
               />

awx/ui/src/screens/Instances/InstanceDetail/InstanceDetail.js

@@ -1,6 +1,6 @@
 import React, { useCallback, useEffect, useState } from 'react';
 
-import { useHistory, useParams } from 'react-router-dom';
+import { Link, useHistory, useParams } from 'react-router-dom';
 import { t, Plural } from '@lingui/macro';
 import {
   Button,
@@ -11,6 +11,7 @@ import {
   CodeBlockCode,
   Tooltip,
   Slider,
+  Label,
 } from '@patternfly/react-core';
 import { DownloadIcon, OutlinedClockIcon } from '@patternfly/react-icons';
 import styled from 'styled-components';
@@ -33,7 +34,6 @@ import useRequest, {
   useDismissableError,
 } from 'hooks/useRequest';
 import HealthCheckAlert from 'components/HealthCheckAlert';
-import InstanceGroupLabels from 'components/InstanceGroupLabels';
 import RemoveInstanceButton from '../Shared/RemoveInstanceButton';
 
 const Unavailable = styled.span`
@@ -156,6 +156,11 @@ function InstanceDetail({ setBreadcrumb, isK8s }) {
     </>
   );
 
+  const buildLinkURL = (inst) =>
+    inst.is_container_group
+      ? '/instance_groups/container_group/'
+      : '/instance_groups/';
+
   const { error, dismissError } = useDismissableError(
     updateInstanceError || healthCheckError
   );
@@ -220,9 +225,25 @@ function InstanceDetail({ setBreadcrumb, isK8s }) {
                   label={t`Instance Groups`}
                   dataCy="instance-groups"
                   helpText={t`The Instance Groups to which this instance belongs.`}
-                  value={
-                    <InstanceGroupLabels labels={instanceGroups} isLinkable />
-                  }
+                  value={instanceGroups.map((ig) => (
+                    <React.Fragment key={ig.id}>
+                      <Label
+                        color="blue"
+                        isTruncated
+                        render={({ className, content, componentRef }) => (
+                          <Link
+                            to={`${buildLinkURL(ig)}${ig.id}/details`}
+                            className={className}
+                            innerRef={componentRef}
+                          >
+                            {content}
+                          </Link>
+                        )}
+                      >
+                        {ig.name}
+                      </Label>{' '}
+                    </React.Fragment>
+                  ))}
                   isEmpty={instanceGroups.length === 0}
                 />
               )}

awx/ui/src/screens/Inventory/InventoryDetail/InventoryDetail.js

@@ -23,7 +23,6 @@ import { InventoriesAPI } from 'api';
 import useRequest, { useDismissableError } from 'hooks/useRequest';
 import { Inventory } from 'types';
 import { relatedResourceDeleteRequests } from 'util/getRelatedResourceDeleteDetails';
-import InstanceGroupLabels from 'components/InstanceGroupLabels';
 import getHelpText from '../shared/Inventory.helptext';
 
 function InventoryDetail({ inventory }) {
@@ -106,7 +105,23 @@ function InventoryDetail({ inventory }) {
           <Detail
             fullWidth
             label={t`Instance Groups`}
-            value={<InstanceGroupLabels labels={instanceGroups} isLinkable />}
+            value={
+              <ChipGroup
+                numChips={5}
+                totalChips={instanceGroups?.length}
+                ouiaId="instance-group-chips"
+              >
+                {instanceGroups?.map((ig) => (
+                  <Chip
+                    key={ig.id}
+                    isReadOnly
+                    ouiaId={`instance-group-${ig.id}-chip`}
+                  >
+                    {ig.name}
+                  </Chip>
+                ))}
+              </ChipGroup>
+            }
             isEmpty={instanceGroups.length === 0}
           />
         )}

awx/ui/src/screens/Inventory/InventoryDetail/InventoryDetail.test.js

@@ -131,8 +131,9 @@ describe('<InventoryDetail />', () => {
     expect(InventoriesAPI.readInstanceGroups).toHaveBeenCalledWith(
       mockInventory.id
     );
-    const label = wrapper.find('Label').at(0);
-    expect(label.prop('children')).toEqual('Foo');
+    const chip = wrapper.find('Chip').at(0);
+    expect(chip.prop('isReadOnly')).toEqual(true);
+    expect(chip.prop('children')).toEqual('Foo');
   });
 
   test('should not load instance groups', async () => {

awx/ui/src/screens/Inventory/SmartInventoryDetail/SmartInventoryDetail.js

@@ -2,7 +2,7 @@ import React, { useCallback, useEffect } from 'react';
 import { Link, useHistory } from 'react-router-dom';
 
 import { t } from '@lingui/macro';
-import { Button, Label } from '@patternfly/react-core';
+import { Button, Chip, Label } from '@patternfly/react-core';
 
 import { Inventory } from 'types';
 import { InventoriesAPI, UnifiedJobsAPI } from 'api';
@@ -10,6 +10,7 @@ import useRequest, { useDismissableError } from 'hooks/useRequest';
 
 import AlertModal from 'components/AlertModal';
 import { CardBody, CardActionsRow } from 'components/Card';
+import ChipGroup from 'components/ChipGroup';
 import { VariablesDetail } from 'components/CodeEditor';
 import ContentError from 'components/ContentError';
 import ContentLoading from 'components/ContentLoading';
@@ -17,7 +18,6 @@ import DeleteButton from 'components/DeleteButton';
 import { DetailList, Detail, UserDateDetail } from 'components/DetailList';
 import ErrorDetail from 'components/ErrorDetail';
 import Sparkline from 'components/Sparkline';
-import InstanceGroupLabels from 'components/InstanceGroupLabels';
 
 function SmartInventoryDetail({ inventory }) {
   const history = useHistory();
@@ -120,7 +120,23 @@ function SmartInventoryDetail({ inventory }) {
           <Detail
             fullWidth
             label={t`Instance groups`}
-            value={<InstanceGroupLabels labels={instanceGroups} />}
+            value={
+              <ChipGroup
+                numChips={5}
+                totalChips={instanceGroups.length}
+                ouiaId="instance-group-chips"
+              >
+                {instanceGroups.map((ig) => (
+                  <Chip
+                    key={ig.id}
+                    isReadOnly
+                    ouiaId={`instance-group-${ig.id}-chip`}
+                  >
+                    {ig.name}
+                  </Chip>
+                ))}
+              </ChipGroup>
+            }
             isEmpty={instanceGroups.length === 0}
           />
           <VariablesDetail

awx/ui/src/screens/Job/useWsJob.js

@@ -4,7 +4,6 @@ import { getJobModel } from 'util/jobs';
 
 export default function useWsJob(initialJob) {
   const [job, setJob] = useState(initialJob);
-  const [pendingMessages, setPendingMessages] = useState([]);
   const lastMessage = useWebsocket({
     jobs: ['status_changed'],
     control: ['limit_reached_1'],
@@ -14,48 +13,30 @@ export default function useWsJob(initialJob) {
     setJob(initialJob);
   }, [initialJob]);
 
-  const processMessage = (message) => {
-    if (message.unified_job_id !== job.id) {
-      return;
-    }
-
-    if (
-      ['successful', 'failed', 'error', 'cancelled'].includes(message.status)
-    ) {
-      fetchJob();
-    }
-    setJob(updateJob(job, message));
-  };
-
-  async function fetchJob() {
-    const { data } = await getJobModel(job.type).readDetail(job.id);
-    setJob(data);
-  }
-
   useEffect(
     () => {
-      if (!lastMessage) {
+      async function fetchJob() {
+        const { data } = await getJobModel(job.type).readDetail(job.id);
+        setJob(data);
+      }
+
+      if (!job || lastMessage?.unified_job_id !== job.id) {
         return;
       }
-      if (job) {
-        processMessage(lastMessage);
-      } else if (lastMessage.unified_job_id) {
-        setPendingMessages(pendingMessages.concat(lastMessage));
+
+      if (
+        ['successful', 'failed', 'error', 'cancelled'].includes(
+          lastMessage.status
+        )
+      ) {
+        fetchJob();
+      } else {
+        setJob(updateJob(job, lastMessage));
       }
     },
     [lastMessage] // eslint-disable-line react-hooks/exhaustive-deps
   );
 
-  useEffect(() => {
-    if (!job || !pendingMessages.length) {
-      return;
-    }
-    pendingMessages.forEach((message) => {
-      processMessage(message);
-    });
-    setPendingMessages([]);
-  }, [job, pendingMessages]); // eslint-disable-line react-hooks/exhaustive-deps
-
   return job;
 }
 

awx/ui/src/screens/Organization/OrganizationDetail/OrganizationDetail.js

@@ -2,7 +2,7 @@ import React, { useEffect, useState, useCallback } from 'react';
 import { Link, useHistory, useRouteMatch } from 'react-router-dom';
 
 import { t } from '@lingui/macro';
-import { Button } from '@patternfly/react-core';
+import { Button, Chip } from '@patternfly/react-core';
 import { OrganizationsAPI } from 'api';
 import { DetailList, Detail, UserDateDetail } from 'components/DetailList';
 import { CardBody, CardActionsRow } from 'components/Card';
@@ -16,7 +16,6 @@ import ErrorDetail from 'components/ErrorDetail';
 import useRequest, { useDismissableError } from 'hooks/useRequest';
 import { useConfig } from 'contexts/Config';
 import ExecutionEnvironmentDetail from 'components/ExecutionEnvironmentDetail';
-import InstanceGroupLabels from 'components/InstanceGroupLabels';
 import { relatedResourceDeleteRequests } from 'util/getRelatedResourceDeleteDetails';
 
 function OrganizationDetail({ organization }) {
@@ -80,6 +79,11 @@ function OrganizationDetail({ organization }) {
     return <ContentError error={contentError} />;
   }
 
+  const buildLinkURL = (instance) =>
+    instance.is_container_group
+      ? '/instance_groups/container_group/'
+      : '/instance_groups/';
+
   return (
     <CardBody>
       <DetailList>
@@ -122,7 +126,25 @@ function OrganizationDetail({ organization }) {
             fullWidth
             label={t`Instance Groups`}
             helpText={t`The Instance Groups for this Organization to run on.`}
-            value={<InstanceGroupLabels labels={instanceGroups} isLinkable />}
+            value={
+              <ChipGroup
+                numChips={5}
+                totalChips={instanceGroups.length}
+                ouiaId="instance-group-chips"
+              >
+                {instanceGroups.map((ig) => (
+                  <Link to={`${buildLinkURL(ig)}${ig.id}/details`} key={ig.id}>
+                    <Chip
+                      key={ig.id}
+                      isReadOnly
+                      ouiaId={`instance-group-${ig.id}-chip`}
+                    >
+                      {ig.name}
+                    </Chip>
+                  </Link>
+                ))}
+              </ChipGroup>
+            }
             isEmpty={instanceGroups.length === 0}
           />
         )}

awx/ui/src/screens/Organization/OrganizationDetail/OrganizationDetail.test.js

@@ -90,7 +90,7 @@ describe('<OrganizationDetail />', () => {
     await waitForElement(component, 'ContentLoading', (el) => el.length === 0);
     expect(
       component
-        .find('Label')
+        .find('Chip')
         .findWhere((el) => el.text() === 'One')
         .exists()
     ).toBe(true);

awx/ui/src/screens/Template/JobTemplateDetail/JobTemplateDetail.js

@@ -34,7 +34,6 @@ import useRequest, { useDismissableError } from 'hooks/useRequest';
 import useBrandName from 'hooks/useBrandName';
 import ExecutionEnvironmentDetail from 'components/ExecutionEnvironmentDetail';
 import { relatedResourceDeleteRequests } from 'util/getRelatedResourceDeleteDetails';
-import InstanceGroupLabels from 'components/InstanceGroupLabels';
 import getHelpText from '../shared/JobTemplate.helptext';
 
 function JobTemplateDetail({ template }) {
@@ -168,6 +167,11 @@ function JobTemplateDetail({ template }) {
     );
   };
 
+  const buildLinkURL = (instance) =>
+    instance.is_container_group
+      ? '/instance_groups/container_group/'
+      : '/instance_groups/';
+
   if (instanceGroupsError) {
     return <ContentError error={instanceGroupsError} />;
   }
@@ -418,7 +422,25 @@ function JobTemplateDetail({ template }) {
           label={t`Instance Groups`}
           dataCy="jt-detail-instance-groups"
           helpText={helpText.instanceGroups}
-          value={<InstanceGroupLabels labels={instanceGroups} isLinkable />}
+          value={
+            <ChipGroup
+              numChips={5}
+              totalChips={instanceGroups.length}
+              ouiaId="instance-group-chips"
+            >
+              {instanceGroups.map((ig) => (
+                <Link to={`${buildLinkURL(ig)}${ig.id}/details`} key={ig.id}>
+                  <Chip
+                    key={ig.id}
+                    ouiaId={`instance-group-${ig.id}-chip`}
+                    isReadOnly
+                  >
+                    {ig.name}
+                  </Chip>
+                </Link>
+              ))}
+            </ChipGroup>
+          }
           isEmpty={instanceGroups.length === 0}
         />
         {job_tags && (