Initial commit: backend, storefront, vendor-panel added

backend/packages/modules/resend/src/email-templates/buyer-shipped-order.tsx

@@ -0,0 +1,71 @@
+interface EmailTemplateProps {
+  data: {
+		user_name: string,
+		host: string,
+		order_id: string,
+		order: {
+			id: string,
+			display_id: string,
+			trackingNumber: string,
+			items: any[],
+			currency_code: string,
+			item_total: number,
+			shipping_methods: {
+				amount: number,
+				name: string
+			}[],
+			total: number
+			email: string
+			shipping_address: {
+				first_name: string,
+				last_name: string,
+				company: string,
+				address_1: string,
+				address_2: string,
+				city: string,
+				province: string,
+				postal_code: string,
+				phone: string
+			}
+		}
+	}
+}
+
+export const BuyerOrderShippedEmailTemplate: React.FC<Readonly<EmailTemplateProps>> = ({ data }) => {
+  return (
+    <div>
+      <h1>Your order #{data.order.trackingNumber} has been shipped!</h1>
+      <p>The package is on its way and will be in your hands soon.</p>
+      <div>
+        <p>
+          <strong>Shipping address:</strong>
+        </p>
+        <p>
+          {data.order.shipping_address.first_name} {data.order.shipping_address.last_name}
+          ,<br />
+          {data.order.shipping_address?.company ? `${data.order.shipping_address.company}, ` : ''}
+          {data.order.shipping_address.address_1}
+          {data.order.shipping_address.address_2}, {data.order.shipping_address.postal_code}{' '}
+          {data.order.shipping_address.city}
+          {data.order.shipping_address.province ? `, ${data.order.shipping_address.province}` : ''}
+          <br />
+          {data.order.email}, {data.order.shipping_address.phone}
+        </p>
+      </div>
+      <p>
+        <a href={`${data.host}/orders/${data.order.id}`}>View Order Details</a>
+        If you can’t click the button, no worries! Here’s your link: {`${data.host}/orders/${data.order.id}`}
+      </p>
+
+      <p>
+        You received this email because you made a purchase or sale on the Mercur marketplace. If you have any
+        questions, please contact our support team.
+      </p>
+      <div style={{ marginTop: 32 }}>
+        <div>Best regards,</div>
+        <div style={{ fontWeight: 600 }}>The Mercur Team</div>
+        <div style={{ color: '#888', marginTop: 4 }}>mercurjs.com</div>
+      </div>
+    </div>
+  )
+}