From f11e50ea712e939039a3dc5ccd0b50b4a903f9f8 Mon Sep 17 00:00:00 2001
From: Deepak Bhardwaj <deepak.bhardwaj@outlook.com>
Date: Mon, 28 Jun 2021 21:05:11 +0530
Subject: [PATCH] feat: open external tools in new tab

Signed-off-by: Deepak Bhardwaj <deepak.bhardwaj@outlook.com>
---
 .changeset/fair-falcons-scream.md                    | 5 +++++
 plugins/explore/src/components/ToolCard/ToolCard.tsx | 8 +++++++-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/fair-falcons-scream.md

diff --git a/.changeset/fair-falcons-scream.md b/.changeset/fair-falcons-scream.md
new file mode 100644
index 0000000000..5ce4b40265
--- /dev/null
+++ b/.changeset/fair-falcons-scream.md
@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-explore': patch
+---
+
+Enhanced tools card to open external tools in new tab
diff --git a/plugins/explore/src/components/ToolCard/ToolCard.tsx b/plugins/explore/src/components/ToolCard/ToolCard.tsx
index 2baa0cffda..00c9851865 100644
--- a/plugins/explore/src/components/ToolCard/ToolCard.tsx
+++ b/plugins/explore/src/components/ToolCard/ToolCard.tsx
@@ -63,6 +63,7 @@ export const ToolCard = ({ card, objectFit }: Props) => {
   const classes = useStyles();
 
   const { title, description, url, image, lifecycle, tags } = card;
+  const isExternalUrl = url.startsWith('https://') || url.startsWith('http://');
 
   return (
     <Card key={title}>
@@ -97,7 +98,12 @@ export const ToolCard = ({ card, objectFit }: Props) => {
         )}
       </CardContent>
       <CardActions>
-        <Button color="primary" href={url} disabled={!url}>
+        <Button
+          {...(isExternalUrl ? { target: '_blank' } : {})}
+          color="primary"
+          href={url}
+          disabled={!url}
+        >
           Explore
         </Button>
       </CardActions>