From 3e9257107834b67ccaad6f3a00df2691bcbf2c42 Mon Sep 17 00:00:00 2001
From: sean-brydon <55134778+sean-brydon@users.noreply.github.com>
Date: Fri, 9 Sep 2022 12:18:15 +0100
Subject: [PATCH] Add rounded-none to combined buttons by default (#4330)

* Add rounded-none to combined buttons by default

* Remove combined

Co-authored-by: Peer Richelsen <peeroke@gmail.com>
---
 apps/storybook/stories/ButtonGroup.stories.tsx        | 11 ++++++-----
 .../components/v2/eventtype/EventTypeSingleLayout.tsx |  4 +---
 .../ee/routing_forms/components/SingleForm.tsx        |  8 +-------
 packages/ui/v2/core/ButtonGroup.tsx                   |  2 +-
 4 files changed, 9 insertions(+), 16 deletions(-)

diff --git a/apps/storybook/stories/ButtonGroup.stories.tsx b/apps/storybook/stories/ButtonGroup.stories.tsx
index 17309c92de..d86b019dcc 100644
--- a/apps/storybook/stories/ButtonGroup.stories.tsx
+++ b/apps/storybook/stories/ButtonGroup.stories.tsx
@@ -28,13 +28,14 @@ export const Default = () => (
 export const Combined = () => (
   <div className="flex flex-col space-y-2">
     <ButtonGroup combined>
-      <Button StartIcon={Trash2} size="icon" color="secondary" combined />
-      <Button StartIcon={Navigation2} size="icon" color="secondary" combined />
-      <Button StartIcon={Clipboard} size="icon" color="secondary" combined />
+      <Button StartIcon={Trash2} size="icon" color="secondary" />
+      <Button StartIcon={Navigation2} size="icon" color="secondary" />
+      <Button StartIcon={Clipboard} size="icon" color="secondary" />
     </ButtonGroup>
     <ButtonGroup combined>
-      <Button StartIcon={ArrowLeft} size="icon" color="secondary" combined />
-      <Button StartIcon={ArrowRight} size="icon" color="secondary" combined />
+      <Button StartIcon={ArrowLeft} size="icon" color="secondary" />
+      <Button StartIcon={ArrowRight} size="icon" color="secondary" />
+      <Button StartIcon={ArrowRight} href="/" size="icon" color="secondary" />
     </ButtonGroup>
   </div>
 );
diff --git a/apps/web/components/v2/eventtype/EventTypeSingleLayout.tsx b/apps/web/components/v2/eventtype/EventTypeSingleLayout.tsx
index 4e9fb84645..5fc7b0ee3b 100644
--- a/apps/web/components/v2/eventtype/EventTypeSingleLayout.tsx
+++ b/apps/web/components/v2/eventtype/EventTypeSingleLayout.tsx
@@ -184,7 +184,6 @@ function EventTypeSingleLayout({
                 href={permalink}
                 rel="noreferrer"
                 StartIcon={Icon.FiExternalLink}
-                combined
               />
             </Tooltip>
 
@@ -200,12 +199,11 @@ function EventTypeSingleLayout({
               }}
             />
             {/* TODO: Implement embed here @hariom */}
-            {/* <Button color="secondary" size="icon" StartIcon={Icon.FiCode} combined /> */}
+            {/* <Button color="secondary" size="icon" StartIcon={Icon.FiCode} /> */}
             <Button
               color="secondary"
               size="icon"
               StartIcon={Icon.FiTrash}
-              combined
               tooltip={t("delete")}
               disabled={!hasPermsToDelete}
               onClick={() => setDeleteDialogOpen(true)}
diff --git a/packages/app-store/ee/routing_forms/components/SingleForm.tsx b/packages/app-store/ee/routing_forms/components/SingleForm.tsx
index 2f4b668183..bb3be97da5 100644
--- a/packages/app-store/ee/routing_forms/components/SingleForm.tsx
+++ b/packages/app-store/ee/routing_forms/components/SingleForm.tsx
@@ -63,7 +63,6 @@ const Actions = ({
             rel="noreferrer"
             action="preview"
             StartIcon={Icon.FiExternalLink}
-            combined
           />
         </Tooltip>
         <FormAction
@@ -74,7 +73,6 @@ const Actions = ({
           type="button"
           StartIcon={Icon.FiLink}
           tooltip={t("copy_link")}
-          combined
         />
         <Tooltip content="Download Responses">
           <FormAction
@@ -85,7 +83,6 @@ const Actions = ({
             size="icon"
             type="button"
             StartIcon={Icon.FiDownload}
-            combined
           />
         </Tooltip>
         <FormAction
@@ -95,7 +92,6 @@ const Actions = ({
           size="icon"
           StartIcon={Icon.FiCode}
           tooltip={t("embed")}
-          combined
         />
         <FormAction
           routingForm={form}
@@ -106,7 +102,6 @@ const Actions = ({
           color="secondary"
           type="button"
           tooltip={t("delete")}
-          combined
         />
       </ButtonGroup>
       <div className="flex md:hidden">
@@ -118,8 +113,7 @@ const Actions = ({
             type="button"
             rel="noreferrer"
             action="preview"
-            StartIcon={Icon.FiExternalLink}
-            combined>
+            StartIcon={Icon.FiExternalLink}>
             Preview
           </FormAction>
           <FormAction
diff --git a/packages/ui/v2/core/ButtonGroup.tsx b/packages/ui/v2/core/ButtonGroup.tsx
index bf33317d69..eac1ab97cb 100644
--- a/packages/ui/v2/core/ButtonGroup.tsx
+++ b/packages/ui/v2/core/ButtonGroup.tsx
@@ -21,7 +21,7 @@ export default function ButtonGroup({ children, combined = false, containerProps
         "flex",
         !combined
           ? "space-x-2"
-          : "[&_button]:border-l-0 [&>*:first-child]:rounded-l-md [&>*:first-child]:border-l [&_a]:border-l-0  [&>*:last-child]:rounded-r-md",
+          : "[&_button]:rounded-none [&_button]:border-l-0 [&>*:first-child]:rounded-l-md [&>*:first-child]:border-l [&_a]:rounded-none  [&_a]:border-l-0 [&>*:last-child]:rounded-r-md",
         containerProps?.className
       )}>
       {children}