feat: create email template for TTO reservation confirmation

feat: implement order notifications service with TTO reservation confirmation handling feat: create migration for TTO booking email webhook trigger
2025-09-30 16:05:43 +03:00
parent 4003284f3a
commit 72f6f2b716
56 changed files with 3692 additions and 294 deletions
--- a/packages/email-templates/src/emails/email.tsx
+++ b/packages/email-templates/src/emails/email.tsx
@@ -0,0 +1,8 @@
+import React from 'react';
+
+const Email = () => {
+  return <div>Email</div>;
+};
+
+export default Email;
+Email.PreviewProps = {};
--- a/packages/email-templates/src/emails/tto-reservation-confirmation.email.tsx
+++ b/packages/email-templates/src/emails/tto-reservation-confirmation.email.tsx
@@ -0,0 +1,137 @@
+import {
+  Body,
+  Head,
+  Html,
+  Link,
+  Preview,
+  Tailwind,
+  Text,
+  render,
+} from '@react-email/components';
+
+import { BodyStyle } from '../components/body-style';
+import CommonFooter from '../components/common-footer';
+import { EmailContent } from '../components/content';
+import { EmailHeader } from '../components/header';
+import { EmailHeading } from '../components/heading';
+import { EmailWrapper } from '../components/wrapper';
+import { initializeEmailI18n } from '../lib/i18n';
+
+export async function renderTtoReservationConfirmationEmail({
+  language,
+  recipientName,
+  startTime,
+  orderName,
+  locationName,
+  locationAddress,
+  orderId,
+  serviceProviderName,
+  serviceProviderEmail,
+  serviceProviderPhone,
+}: {
+  language: string;
+  recipientName: string;
+  startTime: string;
+  orderName: string;
+  locationName?: string;
+  locationAddress?: string | null;
+  orderId: string;
+  serviceProviderName?: string;
+  serviceProviderEmail?: string | null;
+  serviceProviderPhone?: string | null;
+}) {
+  const namespace = 'tto-reservation-confirmation-email';
+
+  const { t } = await initializeEmailI18n({
+    language,
+    namespace: [namespace, 'common'],
+  });
+
+  const previewText = t(`${namespace}:previewText`, {
+    reservation: orderName,
+  });
+
+  const subject = t(`${namespace}:subject`, {
+    reservation: orderName,
+  });
+
+  const email = (
+    <Html>
+      <Head>
+        <BodyStyle />
+      </Head>
+
+      <Preview>{previewText}</Preview>
+
+      <Tailwind>
+        <Body>
+          <EmailWrapper>
+            <EmailContent>
+              <EmailHeader>
+                <EmailHeading>{previewText}</EmailHeading>
+              </EmailHeader>
+              <Text className="text-[16px] leading-[24px] text-[#242424]">
+                {t(`${namespace}:helloName`, { name: recipientName })}
+              </Text>
+              <Text className="text-[16px] leading-[24px] text-[#242424]">
+                {t(`${namespace}:thankYou`)}
+              </Text>
+              <Text className="text-[16px] leading-[24px] text-[#242424]">
+                {orderName}, {new Date(startTime).toLocaleString()},{' '}
+                {locationAddress}, {locationName}
+              </Text>
+              <Text className="text-[16px] leading-[24px] text-[#242424]">
+                <Link
+                  href={`${process.env.NEXT_PUBLIC_SITE_URL}/home/order/${orderId}`}
+                >
+                  {t(`${namespace}:viewOrder`)}
+                </Link>
+              </Text>
+              <Text className="mt-10 text-[16px] leading-[24px] text-[#242424]">
+                {serviceProviderName}
+              </Text>
+              <Text className="text-[16px] leading-[24px] text-[#242424]">
+                {t(`${namespace}:customerSupport`)}
+                <Link href={`tel:${serviceProviderPhone})}`}>
+                  {serviceProviderPhone}
+                </Link>
+              </Text>
+              <Link href={`mailto:${serviceProviderEmail}`}>
+                {serviceProviderEmail}
+              </Link>
+
+              <CommonFooter t={t} />
+            </EmailContent>
+          </EmailWrapper>
+        </Body>
+      </Tailwind>
+    </Html>
+  );
+
+  const html = await render(email);
+
+  return {
+    html,
+    subject,
+    email,
+  };
+}
+
+const PreviewEmail = async () => {
+  const { email } = await renderTtoReservationConfirmationEmail({
+    language: 'et',
+    recipientName: 'John Doe',
+    startTime: '2025-09-27 05:45:00+00',
+    orderName: 'Hambaarst',
+    locationName: 'Tallinn',
+    locationAddress: 'Põhja puiestee, 2/3A',
+    orderId: '123123',
+    serviceProviderName: 'Dentas OÜ',
+    serviceProviderEmail: 'email@example.ee',
+    serviceProviderPhone: '+372111111',
+  });
+  return email;
+};
+
+export default PreviewEmail;
+PreviewEmail.PreviewProps = {};