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>

plugins/catalog/src/components/EntityLinksCard/IconLink.test.tsx

@@ -1,38 +0,0 @@
-/*
- * 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.
- */
-
-import { lightTheme } from '@backstage/theme';
-import { ThemeProvider } from '@material-ui/core';
-import CloudIcon from '@material-ui/icons/Cloud';
-import { render } from '@testing-library/react';
-import React from 'react';
-import { IconLink } from './IconLink';
-
-describe('IconLink', () => {
-  it('should render an icon link', () => {
-    const rendered = render(
-      <ThemeProvider theme={lightTheme}>
-        <IconLink
-          href="https://example.com"
-          text="I am Link"
-          Icon={CloudIcon}
-        />
-      </ThemeProvider>,
-    );
-
-    expect(rendered.queryByText('I am Link')).toBeInTheDocument();
-  });
-});

plugins/catalog/src/components/EntityLinksCard/IconLink.tsx

@@ -1,58 +0,0 @@
-/*
- * 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.
- */
-
-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';
-
-const useStyles = makeStyles({
-  svgIcon: {
-    display: 'inline-block',
-    '& svg': {
-      display: 'inline-block',
-      fontSize: 'inherit',
-      verticalAlign: 'baseline',
-    },
-  },
-});
-
-export const IconLink = ({
-  href,
-  text,
-  Icon,
-}: {
-  href: string;
-  text?: string;
-  Icon?: IconComponent;
-}) => {
-  const classes = useStyles();
-
-  return (
-    <Grid container direction="row" spacing={1}>
-      <Grid item>
-        <Typography component="div" className={classes.svgIcon}>
-          {Icon ? <Icon /> : <LanguageIcon />}
-        </Typography>
-      </Grid>
-      <Grid item>
-        <Link to={href} target="_blank" rel="noopener">
-          {text || href}
-        </Link>
-      </Grid>
-    </Grid>
-  );
-};

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>