CreateImageWizard: Add CentOS acknowledgement

Adds a PF4 info <Alert> that informs users that CentOS is intended only
for development of RHEL-Next if CentOS is the selected distro in the
Image Output step.

src/Components/CreateImageWizard/ImageCreator.js

@@ -15,6 +15,7 @@ import Select from '@data-driven-forms/pf4-component-mapper/select';
 import FileSystemConfiguration from './formComponents/FileSystemConfiguration';
 import FileSystemConfigToggle from './formComponents/FileSystemConfigToggle';
 import ImageOutputReleaseSelect from './formComponents/ImageOutputReleaseSelect';
+import CentOSAcknowledgement from './formComponents/CentOSAcknowledgement';
 
 const ImageCreator = ({
   schema,
@@ -53,6 +54,7 @@ const ImageCreator = ({
         'file-system-config-toggle': FileSystemConfigToggle,
         'file-system-configuration': FileSystemConfiguration,
         'image-output-release-select': ImageOutputReleaseSelect,
+        'centos-acknowledgement': CentOSAcknowledgement,
         ...customComponentMapper,
       }}
       onCancel={onClose}

src/Components/CreateImageWizard/formComponents/CentOSAcknowledgement.js

@@ -0,0 +1,44 @@
+import React from 'react';
+import { Alert, Button } from '@patternfly/react-core';
+import { ExternalLinkAltIcon } from '@patternfly/react-icons';
+
+const DeveloperProgramButton = () => {
+  return (
+    <Button
+      component="a"
+      target="_blank"
+      variant="link"
+      icon={<ExternalLinkAltIcon />}
+      iconPosition="right"
+      isInline
+      href={'https://developers.redhat.com/about'}
+    >
+      Red Hat Developer Program
+    </Button>
+  );
+};
+
+const CentOSAcknowledgement = () => {
+  return (
+    <Alert
+      variant="info"
+      isPlain
+      isInline
+      title={
+        <>
+          CentOS Stream builds may only be used for the development of
+          RHEL-Next.
+        </>
+      }
+    >
+      <p>
+        For other applications, use a RHEL distribution.
+        <br />
+        For those without subscriptions, join the Red Hat Developer program and
+        get cost-free RHEL: <DeveloperProgramButton />
+      </p>
+    </Alert>
+  );
+};
+
+export default CentOSAcknowledgement;

src/Components/CreateImageWizard/steps/imageOutput.js

@@ -38,6 +38,14 @@ export default {
         },
       ],
     },
+    {
+      component: 'centos-acknowledgement',
+      name: 'centos-acknowledgement',
+      condition: {
+        when: 'release',
+        pattern: /centos-*/,
+      },
+    },
     {
       component: 'output',
       name: 'target-environment',

src/test/Components/CreateImageWizard/CreateImageWizard.test.js

@@ -324,6 +324,29 @@ describe('Step Image output', () => {
 
     userEvent.click(releaseMenu);
   });
+
+  test('CentOS acknowledgement appears', async () => {
+    setUp();
+
+    const releaseMenu = screen.getByRole('button', {
+      name: /options menu/i,
+    });
+    userEvent.click(releaseMenu);
+
+    const showOptionsButton = screen.getByRole('button', {
+      name: 'Show options for further development of RHEL',
+    });
+    userEvent.click(showOptionsButton);
+
+    const centOSButton = screen.getByRole('option', {
+      name: 'CentOS Stream 9',
+    });
+    userEvent.click(centOSButton);
+
+    await screen.findByText(
+      'CentOS Stream builds may only be used for the development of RHEL-Next.'
+    );
+  });
 });
 
 describe('Step Upload to AWS', () => {