From d4644f5920ff2eedb363d373680d89af35b36359 Mon Sep 17 00:00:00 2001
From: Dominik Henneke <dominik.henneke@sda-se.com>
Date: Mon, 14 Jun 2021 17:11:09 +0200
Subject: [PATCH] Use the Backstage `Link` component in the `Button`

Signed-off-by: Dominik Henneke <dominik.henneke@sda-se.com>
---
 .changeset/yellow-schools-matter.md            |  5 +++++
 packages/core/src/components/Button/Button.tsx | 14 ++++++++------
 2 files changed, 13 insertions(+), 6 deletions(-)
 create mode 100644 .changeset/yellow-schools-matter.md

diff --git a/.changeset/yellow-schools-matter.md b/.changeset/yellow-schools-matter.md
new file mode 100644
index 0000000000..b159828b88
--- /dev/null
+++ b/.changeset/yellow-schools-matter.md
@@ -0,0 +1,5 @@
+---
+'@backstage/core': patch
+---
+
+Use the Backstage `Link` component in the `Button`
diff --git a/packages/core/src/components/Button/Button.tsx b/packages/core/src/components/Button/Button.tsx
index ca45b3da7f..c678b9a9db 100644
--- a/packages/core/src/components/Button/Button.tsx
+++ b/packages/core/src/components/Button/Button.tsx
@@ -14,17 +14,19 @@
  * limitations under the License.
  */
 
-import React, { ComponentProps } from 'react';
-import { Button as MaterialButton } from '@material-ui/core';
-import { Link as RouterLink } from 'react-router-dom';
+import {
+  Button as MaterialButton,
+  ButtonProps as MaterialButtonProps,
+} from '@material-ui/core';
+import React from 'react';
+import { Link, LinkProps } from '../Link';
 
-type Props = ComponentProps<typeof MaterialButton> &
-  ComponentProps<typeof RouterLink>;
+type Props = MaterialButtonProps & Omit<LinkProps, 'variant' | 'color'>;
 
 /**
  * Thin wrapper on top of material-ui's Button component
  * Makes the Button to utilise react-router
  */
 export const Button = React.forwardRef<any, Props>((props, ref) => (
-  <MaterialButton ref={ref} component={RouterLink} {...props} />
+  <MaterialButton ref={ref} component={Link} {...props} />
 ));