fix email button

packages/email-templates/src/components/email-button.tsx

@@ -0,0 +1,16 @@
+import { Button } from '@react-email/components';
+
+export function EmailButton(
+  props: React.PropsWithChildren<{
+    href: string;
+  }>,
+) {
+  return (
+    <Button
+      className="hover:bg-primary/90 inline-flex w-full items-center justify-center gap-1 rounded bg-[#16a249] py-3 text-center text-[16px] font-semibold whitespace-nowrap text-white no-underline shadow-xs transition-colors focus-visible:outline-hidden disabled:pointer-events-none disabled:opacity-50"
+      href={props.href}
+    >
+      {props.children}
+    </Button>
+  );
+}

packages/email-templates/src/emails/doctor-summary-received.email.tsx

@@ -1,9 +1,7 @@
 import {
   Body,
-  Button,
   Head,
   Html,
-  Link,
   Preview,
   Tailwind,
   Text,
@@ -13,6 +11,7 @@ import {
 import { BodyStyle } from '../components/body-style';
 import CommonFooter from '../components/common-footer';
 import { EmailContent } from '../components/content';
+import { EmailButton } from '../components/email-button';
 import { EmailHeader } from '../components/header';
 import { EmailHeading } from '../components/heading';
 import { EmailWrapper } from '../components/wrapper';
@@ -72,11 +71,12 @@ export async function renderDoctorSummaryReceivedEmail({
               <Text className="text-[16px] leading-[24px] text-[#242424]">
                 {t(`${namespace}:summaryReceivedForOrder`, { orderNr })}
               </Text>
-              <Link
+
+              <EmailButton
                 href={`${process.env.NEXT_PUBLIC_SITE_URL}/home/order/${orderId}`}
               >
-                <Button> {t(`${namespace}:linkText`, { orderNr })}</Button>
-              </Link>
+                {t(`${namespace}:linkText`, { orderNr })}
+              </EmailButton>
               <Text>
                 {t(`${namespace}:ifButtonDisabled`)}{' '}
                 {`${process.env.NEXT_PUBLIC_SITE_URL}/home/order/${orderId}`}