From 21f1560b0302019dbd17b23d82974cd15435757c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ja=CC=81n=20Mikla=CC=81s=CC=8C?= <neosinner@gmail.com>
Date: Tue, 23 Jun 2020 16:06:37 +0200
Subject: [PATCH] Allow rendering Button component as <a> or <button>

[MAILPOET-2784]
---
 assets/js/src/common/button/button.tsx | 50 ++++++++++++++------------
 1 file changed, 27 insertions(+), 23 deletions(-)

diff --git a/assets/js/src/common/button/button.tsx b/assets/js/src/common/button/button.tsx
index 4dbe456374..fc3117219d 100644
--- a/assets/js/src/common/button/button.tsx
+++ b/assets/js/src/common/button/button.tsx
@@ -12,6 +12,7 @@ type Props = {
   iconEnd?: JSX.Element,
   onClick?: () => void,
   href?: string,
+  type?: string,
   target?: '_blank' | '_self' | '_parent' | '_top' | string,
 };
 
@@ -27,28 +28,31 @@ const Button = ({
   onClick,
   href,
   target,
-}: Props) => (
-  <a
-    href={href}
-    onClick={onClick}
-    target={target}
-    className={
-      classnames(
-        'mailpoet-button',
-        {
-          [`mailpoet-button-${dimension}`]: dimension,
-          [`mailpoet-button-${variant}`]: variant,
-          'mailpoet-button-with-spinner': withSpinner,
-          'mailpoet-disabled': isDisabled,
-          'mailpoet-full-width': isFullWidth,
-        }
-      )
-    }
-  >
-    {iconStart}
-    {children && <span>{children}</span>}
-    {iconEnd}
-  </a>
-);
+}: Props) => {
+  const Element = href ? 'a' : 'button';
+  return (
+    <Element
+      href={href}
+      onClick={onClick}
+      target={target}
+      className={
+        classnames(
+          'mailpoet-button',
+          {
+            [`mailpoet-button-${dimension}`]: dimension,
+            [`mailpoet-button-${variant}`]: variant,
+            'mailpoet-button-with-spinner': withSpinner,
+            'mailpoet-disabled': isDisabled,
+            'mailpoet-full-width': isFullWidth,
+          }
+        )
+      }
+    >
+      {iconStart}
+      {children && <span>{children}</span>}
+      {iconEnd}
+    </Element>
+  );
+};
 
 export default Button;