frontend: Change link to external link

Changed Marketplace link in Operator details modal to external link. Fixes https://bugzilla.redhat.com/show_bug.cgi?id=1796664
openshift · Feb 5, 2020 · a4d59ea · a4d59ea
1 parent 8a4f90d
commit a4d59ea
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 10 deletions.
diff --git a/...nd/packages/operator-lifecycle-manager/src/components/operator-hub/operator-hub-items.tsx b/...nd/packages/operator-lifecycle-manager/src/components/operator-hub/operator-hub-items.tsx
@@ -6,6 +6,7 @@ import { CatalogItemHeader, CatalogTile } from '@patternfly/react-catalog-view-e
 import * as classNames from 'classnames';
 import { Button, Modal } from '@patternfly/react-core';
 import { ExternalLinkAltIcon } from '@patternfly/react-icons';
+import { ExternalLink } from '@console/internal/components/utils';
 
 import {
   COMMUNITY_PROVIDERS_WARNING_LOCAL_STORAGE_KEY,
@@ -357,15 +358,18 @@ export const OperatorHubTileView: React.FC<OperatorHubTileViewProps> = (props) =
               />
               <div className="co-catalog-page__overlay-actions">
                 {detailsItem.marketplaceRemoteWorkflow && (
-                  <Link
-                    className="pf-c-button pf-m-primary co-catalog-page__overlay-action"
-                    to={detailsItem.marketplaceRemoteWorkflow}
-                  >
-                    <div className="co-catalog-page__overlay-action-label">
-                      {detailsItem.marketplaceActionText || 'View Details'}
-                    </div>
-                    <ExternalLinkAltIcon className="co-catalog-page__overlay-action-icon" />
-                  </Link>
+                  <ExternalLink
+                    additionalClassName="pf-c-button pf-m-primary co-catalog-page__overlay-action"
+                    href={detailsItem.marketplaceRemoteWorkflow}
+                    text={
+                      <>
+                        <div className="co-catalog-page__overlay-action-label">
+                          {detailsItem.marketplaceActionText || 'View Details'}
+                        </div>
+                        <ExternalLinkAltIcon className="co-catalog-page__overlay-action-icon" />
+                      </>
+                    }
+                  />
                 )}
                 {!detailsItem.installed ? (
                   <Link

diff --git a/frontend/public/components/utils/link.tsx b/frontend/public/components/utils/link.tsx
@@ -91,7 +91,7 @@ LinkifyExternal.displayName = 'LinkifyExternal';
 
 type ExternalLinkProps = {
   href: string;
-  text: string;
+  text: React.ReactNode;
   additionalClassName?: string;
   dataTestID?: string;
 };