From b96d9c5677dcbcf275b623ac89de1aab4d71c0a0 Mon Sep 17 00:00:00 2001
From: James Turley <james.turley@signalmedia.co>
Date: Tue, 16 Mar 2021 10:45:48 +0000
Subject: [PATCH] Move IconLink from catalog to core

To reuse in scaffolder.

Signed-off-by: James Turley <james.turley@signalmedia.co>
Signed-off-by: James Turley <jamesturley1905@googlemail.com>
---
 .../components/IconLink}/IconLink.test.tsx    |  0
 .../src/components/IconLink}/IconLink.tsx     | 28 ++++++++++---------
 .../core/src/components/IconLink/index.ts     | 17 +++++++++++
 packages/core/src/components/index.ts         |  1 +
 .../EntityLinksCard/LinksGridList.tsx         | 11 ++++++--
 5 files changed, 41 insertions(+), 16 deletions(-)
 rename {plugins/catalog/src/components/EntityLinksCard => packages/core/src/components/IconLink}/IconLink.test.tsx (100%)
 rename {plugins/catalog/src/components/EntityLinksCard => packages/core/src/components/IconLink}/IconLink.tsx (74%)
 create mode 100644 packages/core/src/components/IconLink/index.ts

diff --git a/plugins/catalog/src/components/EntityLinksCard/IconLink.test.tsx b/packages/core/src/components/IconLink/IconLink.test.tsx
similarity index 100%
rename from plugins/catalog/src/components/EntityLinksCard/IconLink.test.tsx
rename to packages/core/src/components/IconLink/IconLink.test.tsx
diff --git a/plugins/catalog/src/components/EntityLinksCard/IconLink.tsx b/packages/core/src/components/IconLink/IconLink.tsx
similarity index 74%
rename from plugins/catalog/src/components/EntityLinksCard/IconLink.tsx
rename to packages/core/src/components/IconLink/IconLink.tsx
index 32ea085889..c2f0a5c5da 100644
--- a/plugins/catalog/src/components/EntityLinksCard/IconLink.tsx
+++ b/packages/core/src/components/IconLink/IconLink.tsx
@@ -14,10 +14,12 @@
  * limitations under the License.
  */
 
-import { Link, IconComponent } from '@backstage/core';
-import { Grid, makeStyles, Typography } from '@material-ui/core';
-import LanguageIcon from '@material-ui/icons/Language';
 import React from 'react';
+import { IconComponent } from '@backstage/core-api';
+import { Grid, LinkProps, makeStyles, Typography } from '@material-ui/core';
+import LanguageIcon from '@material-ui/icons/Language';
+import { omit } from 'lodash';
+import { Link } from '../Link';
 
 const useStyles = makeStyles({
   svgIcon: {
@@ -30,15 +32,15 @@ const useStyles = makeStyles({
   },
 });
 
-export const IconLink = ({
-  href,
-  text,
-  Icon,
-}: {
-  href: string;
-  text?: string;
-  Icon?: IconComponent;
-}) => {
+export const IconLink = (
+  props: {
+    href: string;
+    text?: string;
+    Icon?: IconComponent;
+  } & LinkProps,
+) => {
+  const { href, text, Icon, ...linkProps } = props;
+
   const classes = useStyles();
 
   return (
@@ -49,7 +51,7 @@ export const IconLink = ({
         </Typography>
       </Grid>
       <Grid item>
-        <Link to={href} target="_blank" rel="noopener">
+        <Link to={href} {...linkProps}>
           {text || href}
         </Link>
       </Grid>
diff --git a/packages/core/src/components/IconLink/index.ts b/packages/core/src/components/IconLink/index.ts
new file mode 100644
index 0000000000..b650b07279
--- /dev/null
+++ b/packages/core/src/components/IconLink/index.ts
@@ -0,0 +1,17 @@
+/*
+ * Copyright 2020 Spotify AB
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+export { IconLink } from './IconLink';
diff --git a/packages/core/src/components/index.ts b/packages/core/src/components/index.ts
index c8797f576b..aec8cc9a64 100644
--- a/packages/core/src/components/index.ts
+++ b/packages/core/src/components/index.ts
@@ -26,6 +26,7 @@ export * from './ResponseErrorPanel';
 export * from './FeatureDiscovery';
 export * from './HeaderIconLinkRow';
 export * from './HorizontalScrollGrid';
+export * from './IconLink';
 export * from './Lifecycle';
 export * from './Link';
 export * from './MarkdownContent';
diff --git a/plugins/catalog/src/components/EntityLinksCard/LinksGridList.tsx b/plugins/catalog/src/components/EntityLinksCard/LinksGridList.tsx
index 9ef77a4bbf..a2793f9aa4 100644
--- a/plugins/catalog/src/components/EntityLinksCard/LinksGridList.tsx
+++ b/plugins/catalog/src/components/EntityLinksCard/LinksGridList.tsx
@@ -14,10 +14,9 @@
  * limitations under the License.
  */
 
-import { IconComponent } from '@backstage/core';
+import { IconComponent, IconLink } from '@backstage/core';
 import { GridList, GridListTile } from '@material-ui/core';
 import React from 'react';
-import { IconLink } from './IconLink';
 import { ColumnBreakpoints } from './types';
 import { useDynamicColumns } from './useDynamicColumns';
 
@@ -39,7 +38,13 @@ export const LinksGridList = ({ items, cols = undefined }: Props) => {
     <GridList cellHeight="auto" cols={numOfCols}>
       {items.map(({ text, href, Icon }, i) => (
         <GridListTile key={i}>
-          <IconLink href={href} text={text ?? href} Icon={Icon} />
+          <IconLink
+            href={href}
+            text={text ?? href}
+            Icon={Icon}
+            target="_blank"
+            rel="noopener"
+          />
         </GridListTile>
       ))}
     </GridList>