Merge bd3b87fa52 into 7391652e17

src/Components/CreateImageWizard/CreateImageWizard.scss

@@ -17,6 +17,10 @@
     --pf-c-form__group-label--PaddingBottom: var(--pf-v6-global--spacer--xs);
 }
 
+.pf-v6-c-radio__body { // remove margin from radio button body block
+    margin: 0;
+}
+
 .provider-icon {
     width: 3.5em;
     height: 3.5em;

src/Components/CreateImageWizard/steps/Registration/components/Registration.tsx

@@ -1,4 +1,4 @@
-import React, { useState } from 'react';
+import React from 'react';
 
 import {
   Button,
@@ -99,10 +99,6 @@ const Registration = () => {
   const dispatch = useAppDispatch();
   const registrationType = useAppSelector(selectRegistrationType);
 
-  const [showOptions, setShowOptions] = useState(
-    registrationType === 'register-later',
-  );
-
   const isSatelliteRegistrationEnabled = useFlag(
     'image-builder.satellite.enabled',
   );
@@ -124,63 +120,51 @@ const Registration = () => {
         id='register-system-now'
         name='register-system-now'
         autoFocus
-        description={
-          <Button
-            component='a'
-            variant='link'
-            isDisabled={!registrationType.startsWith('register-now')}
-            isInline
-            onClick={() => setShowOptions(!showOptions)}
-          >
-            {`${!showOptions ? 'Show' : 'Hide'} additional connection options`}
-          </Button>
-        }
+        className='pf-v6-u-pb-sm'
         body={
-          showOptions && (
-            <Checkbox
-              className='pf-v6-u-ml-lg'
-              label={
-                <>
-                  Enable predictive analytics and management capabilities
-                  <InsightsPopover />
-                </>
+          <Checkbox
+            label={
+              <>
+                Enable predictive analytics and management capabilities
+                <InsightsPopover />
+              </>
+            }
+            isChecked={
+              registrationType === 'register-now-insights' ||
+              registrationType === 'register-now-rhc'
+            }
+            onChange={(_event, checked) => {
+              if (checked) {
+                dispatch(changeRegistrationType('register-now-insights'));
+              } else {
+                dispatch(changeRegistrationType('register-now'));
               }
-              isChecked={
-                registrationType === 'register-now-insights' ||
-                registrationType === 'register-now-rhc'
-              }
-              onChange={(_event, checked) => {
-                if (checked) {
-                  dispatch(changeRegistrationType('register-now-insights'));
-                } else {
-                  dispatch(changeRegistrationType('register-now'));
+            }}
+            id='register-system-now-insights'
+            name='register-system-insights'
+            className='pf-v6-u-pt-0'
+            body={
+              <Checkbox
+                label={
+                  <>
+                    Enable remote remediations and system management with
+                    automation
+                    <RhcPopover />
+                  </>
                 }
-              }}
-              id='register-system-now-insights'
-              name='register-system-insights'
-              body={
-                <Checkbox
-                  label={
-                    <>
-                      Enable remote remediations and system management with
-                      automation
-                      <RhcPopover />
-                    </>
+                isChecked={registrationType === 'register-now-rhc'}
+                onChange={(_event, checked) => {
+                  if (checked) {
+                    dispatch(changeRegistrationType('register-now-rhc'));
+                  } else {
+                    dispatch(changeRegistrationType('register-now-insights'));
                   }
-                  isChecked={registrationType === 'register-now-rhc'}
-                  onChange={(_event, checked) => {
-                    if (checked) {
-                      dispatch(changeRegistrationType('register-now-rhc'));
-                    } else {
-                      dispatch(changeRegistrationType('register-now-insights'));
-                    }
-                  }}
-                  id='register-system-now-rhc'
-                  name='register-system-rhc'
-                />
-              }
-            />
-          )
+                }}
+                id='register-system-now-rhc'
+                name='register-system-rhc'
+              />
+            }
+          />
         }
       />
       <Radio
@@ -188,7 +172,6 @@ const Registration = () => {
         isChecked={registrationType === 'register-later'}
         onChange={() => {
           dispatch(changeRegistrationType('register-later'));
-          setShowOptions(false);
         }}
         id='register-later'
         name='register-later'
@@ -199,7 +182,6 @@ const Registration = () => {
           isChecked={registrationType === 'register-satellite'}
           onChange={() => {
             dispatch(changeRegistrationType('register-satellite'));
-            setShowOptions(false);
           }}
           id='register-satellite'
           name='register-satellite'

src/Components/CreateImageWizard/steps/Registration/index.tsx

@@ -2,6 +2,7 @@ import React from 'react';
 
 import {
   ClipboardCopy,
+  Content,
   Form,
   FormGroup,
   FormHelperText,
@@ -34,11 +35,15 @@ const RegistrationStep = () => {
       <Title headingLevel='h1' size='xl'>
         Register systems using this image
       </Title>
+      <Content>
+        Configure registration settings for systems that will use this image.
+      </Content>
       <FormGroup label='Organization ID'>
         <ClipboardCopy
           hoverTip='Copy to clipboard'
           clickTip='Successfully copied to clipboard!'
-          variant='inline-compact'
+          isReadOnly
+          className='pf-v6-u-w-25'
         >
           {orgId || ''}
         </ClipboardCopy>

src/test/Components/CreateImageWizard/steps/Registration/Registration.test.tsx

@@ -57,12 +57,6 @@ Object.defineProperty(window, 'localStorage', {
 // Initiliaze the router
 const router: RemixRouter | undefined = undefined;
 
-const clickShowAdditionalConnectionOptions = async () => {
-  const user = userEvent.setup();
-  const link = await screen.findByText('Show additional connection options');
-  await waitFor(() => user.click(link));
-};
-
 const deselectEnableRemoteRemediations = async () => {
   const user = userEvent.setup();
   const checkBox = await screen.findByRole('checkbox', {
@@ -281,7 +275,6 @@ describe('Registration request generated correctly', () => {
   test('register + insights', async () => {
     await renderCreateMode();
     await goToRegistrationStep();
-    await clickShowAdditionalConnectionOptions();
     await deselectEnableRemoteRemediations();
     await goToReview();
     const receivedRequest = await interceptBlueprintRequest(CREATE_BLUEPRINT);
@@ -305,7 +298,6 @@ describe('Registration request generated correctly', () => {
   test('register now', async () => {
     await renderCreateMode();
     await goToRegistrationStep();
-    await clickShowAdditionalConnectionOptions();
     await deselectPredictiveAnalytics();
     await goToReview();
     // informational modal pops up in the first test only as it's tied