Wizard: Deduplicate ManageRepositoriesButton

This moves the `ManageRepositoriesButton` component to its own file and deduplicates it in the code base.

Tooltip for Upload repositories was also fixed and is now readable again.

src/Components/CreateImageWizard/steps/Repositories/components/ManageRepositoriesButton.tsx

@@ -0,0 +1,24 @@
+import React from 'react';
+
+import { Button } from '@patternfly/react-core';
+import { ExternalLinkAltIcon } from '@patternfly/react-icons';
+
+import { CONTENT_URL } from '../../../../../constants';
+
+const ManageRepositoriesButton = () => {
+  return (
+    <Button
+      component="a"
+      target="_blank"
+      variant="link"
+      iconPosition="right"
+      isInline
+      icon={<ExternalLinkAltIcon />}
+      href={CONTENT_URL}
+    >
+      Create and manage repositories here
+    </Button>
+  );
+};
+
+export default ManageRepositoriesButton;

src/Components/CreateImageWizard/steps/Repositories/components/UploadRepositoryLabel.tsx

@@ -1,29 +1,19 @@
 import React from 'react';
 
-import { Button, Label, Content, Tooltip } from '@patternfly/react-core';
-import { ExternalLinkAltIcon, UploadIcon } from '@patternfly/react-icons';
+import { Label, Tooltip } from '@patternfly/react-core';
+import { UploadIcon } from '@patternfly/react-icons';
 
-import { CONTENT_URL } from '../../../../../constants';
+import ManageRepositoriesButton from './ManageRepositoriesButton';
 
 const UploadRepositoryLabel = () => {
   return (
     <Tooltip
       content={
-        <Content>
+        <>
           Upload repository: Snapshots will only be taken when new content is
-          uploaded.&nbsp;
-          <Button
-            component="a"
-            target="_blank"
-            variant="link"
-            iconPosition="right"
-            isInline
-            icon={<ExternalLinkAltIcon />}
-            href={CONTENT_URL}
-          >
-            Create and manage repositories here.
-          </Button>
-        </Content>
+          uploaded.
+          <ManageRepositoriesButton />
+        </>
       }
     >
       <Label

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

@@ -1,33 +1,16 @@
 import React from 'react';
 
-import { Alert, Button, Form, Content, Title } from '@patternfly/react-core';
-import { ExternalLinkAltIcon } from '@patternfly/react-icons';
+import { Alert, Form, Content, Title } from '@patternfly/react-core';
 
+import ManageRepositoriesButton from './components/ManageRepositoriesButton';
 import Repositories from './Repositories';
 
-import { CONTENT_URL } from '../../../../constants';
 import { useAppSelector } from '../../../../store/hooks';
 import {
   selectPackages,
   selectRecommendedRepositories,
 } from '../../../../store/wizardSlice';
 
-const ManageRepositoriesButton = () => {
-  return (
-    <Button
-      component="a"
-      target="_blank"
-      variant="link"
-      iconPosition="right"
-      isInline
-      icon={<ExternalLinkAltIcon />}
-      href={CONTENT_URL}
-    >
-      Create and manage repositories here
-    </Button>
-  );
-};
-
 const RepositoriesStep = () => {
   const packages = useAppSelector(selectPackages);
   const recommendedRepos = useAppSelector(selectRecommendedRepositories);
@@ -39,9 +22,10 @@ const RepositoriesStep = () => {
       </Title>
       <Content>
         Select the linked custom repositories from which you can add packages to
-        the image.
-        <br />
-        <ManageRepositoriesButton />
+        the image
+        <Content>
+          <ManageRepositoriesButton />
+        </Content>
       </Content>
       {packages.length && recommendedRepos.length ? (
         <Alert