Wizard: Spread registration options

This moves registration options outside of the "Show additional connection options" expandable, making them always visible.

Author: regexowl

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

@@ -101,10 +101,6 @@ const Registration = () => {
   const distribution = useAppSelector(selectDistribution);
   const registrationType = useAppSelector(selectRegistrationType);
 
-  const [showOptions, setShowOptions] = useState(
-    registrationType === 'register-later'
-  );
-
   const isSatelliteRegistrationEnabled = useFlag(
     'image-builder.satellite.enabled'
   );
@@ -136,21 +132,9 @@ 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
@@ -170,6 +154,7 @@ const Registration = () => {
               }}
               id="register-system-now-insights"
               name="register-system-insights"
+              className="pf-v6-u-pt-0"
               body={
                 <Checkbox
                   label={
@@ -194,15 +179,13 @@ const Registration = () => {
                 />
               }
             />
-          )
         }
       />
       <Radio
         label="Register later"
         isChecked={registrationType === 'register-later'}
         onChange={() => {
           dispatch(changeRegistrationType('register-later'));
-          setShowOptions(false);
         }}
         id="register-later"
         name="register-later"
@@ -213,7 +196,6 @@ const Registration = () => {
           isChecked={registrationType === 'register-satellite'}
           onChange={() => {
             dispatch(changeRegistrationType('register-satellite'));
-            setShowOptions(false);
           }}
           id="register-satellite"
           name="register-satellite"

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', {
@@ -301,7 +295,6 @@ describe('Registration request generated correctly', () => {
   test('register + insights', async () => {
     await renderCreateMode();
     await goToRegistrationStep();
-    await clickShowAdditionalConnectionOptions();
     await deselectEnableRemoteRemediations();
     await goToReviewStep();
     const receivedRequest = await interceptBlueprintRequest(CREATE_BLUEPRINT);
@@ -325,7 +318,6 @@ describe('Registration request generated correctly', () => {
   test('register now', async () => {
     await renderCreateMode();
     await goToRegistrationStep();
-    await clickShowAdditionalConnectionOptions();
     await deselectPredictiveAnalytics();
     await goToReviewStep();
     // informational modal pops up in the first test only as it's tied
@@ -423,7 +415,7 @@ describe('Registration request generated correctly', () => {
     localStorage.clear();
   });
 
-  test('register with satellite', { timeout: 20000 }, async () => {
+  test('register with satellite', { timeout: 25000 }, async () => {
     await renderCreateMode();
     await goToRegistrationStep();
     await clickRegisterSatellite();