From ba679976efb0257479386a75fa795d7b5df87ea9 Mon Sep 17 00:00:00 2001
From: blam <ben@blam.sh>
Date: Fri, 3 Feb 2023 15:15:30 +0100
Subject: [PATCH] chore: use the backstage link component instead and wrap a
 div instead

Signed-off-by: blam <ben@blam.sh>
---
 .../src/next/OngoingTask/Outputs/LinkOutputs.tsx | 16 ++++++----------
 1 file changed, 6 insertions(+), 10 deletions(-)

diff --git a/plugins/scaffolder/src/next/OngoingTask/Outputs/LinkOutputs.tsx b/plugins/scaffolder/src/next/OngoingTask/Outputs/LinkOutputs.tsx
index 596e91d5ab..d7c5ad0b67 100644
--- a/plugins/scaffolder/src/next/OngoingTask/Outputs/LinkOutputs.tsx
+++ b/plugins/scaffolder/src/next/OngoingTask/Outputs/LinkOutputs.tsx
@@ -16,10 +16,11 @@
 import { IconComponent, useApp, useRouteRef } from '@backstage/core-plugin-api';
 import { entityRouteRef } from '@backstage/plugin-catalog-react';
 import { ScaffolderTaskOutput } from '@backstage/plugin-scaffolder-react';
-import { Button, makeStyles, Link } from '@material-ui/core';
+import { Button, makeStyles } from '@material-ui/core';
 import React from 'react';
 import WebIcon from '@material-ui/icons/Web';
 import { parseEntityRef } from '@backstage/catalog-model';
+import { Link } from '@backstage/core-components';
 
 const useStyles = makeStyles({
   root: {
@@ -53,15 +54,10 @@ export const LinkOutputs = (props: { output: ScaffolderTaskOutput }) => {
         .map(({ url, title, icon }, i) => {
           const Icon = iconResolver(icon);
           return (
-            <Link
-              classes={{ root: classes.root }}
-              href={url}
-              key={i}
-              component={Button}
-              target="_blank"
-              startIcon={<Icon />}
-            >
-              {title}
+            <Link to={url} key={i} classes={{ root: classes.root }}>
+              <Button startIcon={<Icon />} component="div" color="primary">
+                {title}
+              </Button>
             </Link>
           );
         })}