Duplicate IconLink instead of moving to core

Signed-off-by: James Turley <jamesturley1905@googlemail.com>

packages/core/src/components/IconLink/index.ts

@@ -1,17 +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.
- */
-
-export { IconLink } from './IconLink';

packages/core/src/components/index.ts

@@ -26,7 +26,6 @@ export * from './ResponseErrorPanel';
 export * from './FeatureDiscovery';
 export * from './HeaderIconLinkRow';
 export * from './HorizontalScrollGrid';
-export * from './IconLink';
 export * from './Lifecycle';
 export * from './Link';
 export * from './MarkdownContent';

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

@@ -0,0 +1,58 @@
+/*
+ * 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,9 +14,10 @@
  * limitations under the License.
  */
 
-import { IconComponent, IconLink } from '@backstage/core';
+import { IconComponent } 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';
 
@@ -38,13 +39,7 @@ 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}
-            target="_blank"
-            rel="noopener"
-          />
+          <IconLink href={href} text={text ?? href} Icon={Icon} />
         </GridListTile>
       ))}
     </GridList>

plugins/scaffolder/src/components/TaskPage/IconLink.test.tsx

@@ -0,0 +1,38 @@
+/*
+ * 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/scaffolder/src/components/TaskPage/IconLink.tsx

@@ -15,10 +15,9 @@
  */
 
 import React from 'react';
-import { IconComponent } from '@backstage/core-api';
+import { IconComponent, Link } from '@backstage/core';
 import { Grid, LinkProps, makeStyles, Typography } from '@material-ui/core';
 import LanguageIcon from '@material-ui/icons/Language';
-import { Link } from '../Link';
 
 const useStyles = makeStyles({
   svgIcon: {

plugins/scaffolder/src/components/TaskPage/TaskPageLinks.tsx

@@ -16,7 +16,8 @@
 
 import React from 'react';
 import { parseEntityName } from '@backstage/catalog-model';
-import { IconComponent, IconKey, IconLink, useApp } from '@backstage/core';
+import { IconComponent, IconKey, useApp } from '@backstage/core';
+import { IconLink } from './IconLink';
 import { entityRoute } from '@backstage/plugin-catalog-react';
 import { Box } from '@material-ui/core';
 import LanguageIcon from '@material-ui/icons/Language';