From 58d7ed8cccf2e47bcbc3bf5ef68aee407805dc97 Mon Sep 17 00:00:00 2001
From: Pontus Abrahamsson <pontus@lostisland.co>
Date: Tue, 14 Nov 2023 00:54:49 +0100
Subject: [PATCH] Email wip

---
 apps/dashboard/src/jobs/transactions.ts |  40 +++-
 apps/website/package.json               |   2 +-
 apps/website/public/email/logo.png      | Bin 0 -> 4386 bytes
 apps/website/src/middleware.ts          |   2 +-
 bun.lockb                               | Bin 344136 -> 343768 bytes
 package.json                            |   1 +
 packages/email/emails/transactions.tsx  | 249 +++++++++++++++---------
 packages/email/package.json             |   3 +-
 packages/notification/src/index.ts      |  27 ++-
 9 files changed, 227 insertions(+), 97 deletions(-)
 create mode 100644 apps/website/public/email/logo.png

diff --git a/apps/dashboard/src/jobs/transactions.ts b/apps/dashboard/src/jobs/transactions.ts
index b6e7bb89b0..335f197c60 100644
--- a/apps/dashboard/src/jobs/transactions.ts
+++ b/apps/dashboard/src/jobs/transactions.ts
@@ -1,5 +1,6 @@
 import { client } from "@/trigger";
 import { getTransactions } from "@midday/gocardless";
+import { TriggerEvents, trigger, triggerBulk } from "@midday/notification";
 import { Database } from "@midday/supabase/src/types";
 import { eventTrigger } from "@trigger.dev/sdk";
 import { Supabase, SupabaseManagement } from "@trigger.dev/supabase";
@@ -82,7 +83,7 @@ client.defineJob({
     await dynamicSchedule.register(payload.record.id, {
       type: "interval",
       options: {
-        seconds: 10 * 60, // 10 minutes
+        seconds: 3600 * 4, // every 4h
       },
     });
   },
@@ -139,6 +140,43 @@ client.defineJob({
       .select();
 
     if (transactionsData?.length && transactionsData.length > 0) {
+      // Send notification for each transaction
+      triggerBulk(
+        transactionsData.map((transaction) => ({
+          name: TriggerEvents.TransactionNewInApp,
+          payload: {
+            html: "TODO",
+          },
+          users: [
+            {
+              subscriberId: "",
+              teamId: "123",
+              email: "",
+              fullName: "Pontus Abrahamsson",
+              avatarUrl: "https://",
+            },
+          ],
+        }))
+      );
+
+      // Send email with react-email-template
+      trigger({
+        name: TriggerEvents.TransactionNewEmail,
+        payload: {
+          subject: "New transactions",
+          html: "TODO",
+        },
+        users: [
+          {
+            subscriberId: "",
+            teamId: "123",
+            email: "",
+            fullName: "Pontus Abrahamsson",
+            avatarUrl: "https://",
+          },
+        ],
+      });
+
       revalidateTag(`transactions_${data?.team_id}`);
       revalidateTag(`spending_${data?.team_id}`);
       revalidateTag(`metrics_${data?.team_id}`);
diff --git a/apps/website/package.json b/apps/website/package.json
index 1ae7fe3020..2fda4ce798 100644
--- a/apps/website/package.json
+++ b/apps/website/package.json
@@ -5,7 +5,7 @@
   "scripts": {
     "build": "next build",
     "clean": "git clean -xdf .next .turbo node_modules",
-    "dev": "next dev",
+    "dev": "next dev -p 3000",
     "lint": "next lint",
     "format": "biome format --write .",
     "start": "next start",
diff --git a/apps/website/public/email/logo.png b/apps/website/public/email/logo.png
new file mode 100644
index 0000000000000000000000000000000000000000..4117f08a24dcd1283b79a8e3579f83748c83151c
GIT binary patch
literal 4386
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

literal 0
HcmV?d00001

diff --git a/apps/website/src/middleware.ts b/apps/website/src/middleware.ts
index 4f6188593b..7bf3f8e3a0 100644
--- a/apps/website/src/middleware.ts
+++ b/apps/website/src/middleware.ts
@@ -11,5 +11,5 @@ export function middleware(request: NextRequest) {
 }
 
 export const config = {
-  matcher: ["/((?!api|_next/static|_next/image|favicon.ico|auth).*)"],
+  matcher: ["/((?!.*\\.|api|_next/static|_next/image|favicon.ico|auth\\/).*)"],
 };
diff --git a/bun.lockb b/bun.lockb
index ad40bfa178fda2894b3843ee99d6ac8cd4c34c9a..29c7bdb053757ed22c43cab84f2994708c24acb4 100755
GIT binary patch
delta 11383
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%0AEY5^bNGM^sCe8To-x
zw#Cu>8D=o_?ycv?sKNT)7`0aO5H6aK&SS~I*?=pDP|<#aL!ZSu=t`_wvv#y(U6OGA
zk_ptC$ErcK`QC-;nq=`c+8#YOR&A<8>#I>XB$)Rz(k+Q_fZai~+oJJJUMFa*_)lnj
zOU(D8o%LI+qKkyvp-=2CU*UBV&0aLVh>sM_K{P&(y6YX|)RoF6{cN0C)3jN-+ZYjO
z$KVR=1elsisrs;s0lv;`CUI`CHvvp7B+ec7b@@@(QnUup_*R^+y*)*12)l22oXOxN
z6?#CdFNIr6U?XVHw(z_qt}!%jG4he>D_RrSv!QVq{6yokZKPa&fYjFv8n<3KG;J+f
zYwV`Lc?5^4odmXk{fB7nMQaJ|C%r*D2JNV11xc0{vL=caELtmQ(_q&EhlqyO472cg
z)dq(`<A8eu`J#nMoDZ}D(K?Fe3+?rCt%{+Oh;1Ow(M#B;_Q>PbO1NbC!_ESjx`-A4
zdm!KhbQP^F>_C928#MN*9l&v}3q(p>d)ThHS=_<hMPs=m<zs9zM2Q##@oo7a`Bg)|
z48cGeG=B0i&{!q}@Q}E8i3^3c8<~y3J)yBP9e~Bq*rDDM7bY4%_ymiF*RvhrjAhM8
zi4xcec31R(pL~*NongmHT(W54(8^%*W=IjO3v8D41NRZFE9{@8Y$`PT8M*;SO%OR8
z{Us158VsXxb(Sj^EfU(dh~rhJi`E@>FR3s?v?ypv&^m($K;tMx18ZP24U)JR*w40U
zO@k#c7UHi`;ZO;TgEj;j8yhBZJzx)#xGaf_hh~{=!P%nqgv~8jHkKo0d%@<uFVhHU
zFinQua8AQw2gXR@1lT+*!N$glmI#}pz>3F-mIV9R2J(2(lA&Eh92=VejiZnPToP@P
z#Pxx8ndcywawRYo_7w@70u6tLz5sWx+0p4zxF2kO#_Xs`wEnQ~BaWTQ6D<w)pU~LY
z4AIhIUxmiDW>yz5kGCk&TLbhl32GC4d4k%mdTV@dya6A;7x2?BC#X@bF)+DBxDnV4
zd<wKfh3$brJu*=psqaiw^V;*x`hHZaqoYfKWdL8_9|V2?4ly6#)UyXz39JU*({qzl
zkLn-6Tn4-ga9?DR{$Y|DSDRZXzoMtV0NiJp4ZN;bPgXsYMBOJ@b<=w%tBo3XLFQYC
zW599X1aK1IUZxo+(w8Nxo&6JG=AvIbio*#m1mL6=26P0%0nS>Sr6K^%Ox<;x6g9~_
zC`Hv2AMQgO0e%9`;9_@yxj9k<d<O7$8aH1!VXXjkeRUtz#fCp@Cj#U3Z~CZhm7#iB
zAGNa{o~kx;zKbs12Oa=?3ve2I1~{wdr>aS&pJ8%4cLl(WYR*XGaRuCsuLrmSoREe=
z%LKB45dbG7o=aH)`~z4C6aodn>%bepo4{OP9xwvnL^KK*4P*m38n(xxVZ`VuebsDz
zUtjf%*9r9T7l6M+rvTG|aljZL6BrHT03(4c{dhmM>F@?Hxx-KeTo-TwY5+BXT0m{U
z5h%lTJONbL=fM{M9&@M+SOYeIEx^MdhXFp+xo6Jj_<Udi&|e?jUv)7xg~{^({KAdK
zaFif)5AY?h7x)VJ7qA*Qh?qmbQrHUso*J48@L@R?7zae44nB?V;WNJvJO-WsPXRty
z6yPfCi@+t-pg--et}r>G15Q9SfX6dbKm+(nnFm?;h&~2jzu$6J;0^FVU_8K660Lz2
z08durp&h=Q=h>qlVIKy*1Lnie17-kmKo1}u=&2cWw{+F$&>K!7kPKAQo2RSYQtVNm
z1HdCCPa*S+3ZKv?0X~#@xQ1^yX8<#SHnh=JKJ=MD6b54`co@Kka|)0O^wqyfS3OL8
z=Kcoo7(_l$0Pv7UCNw*MkI>72KQtbrxd+?;_Tpn-1$+!F2iBm;Q0QD?b_S-P*}>5M
zg}j|WF>Ef{IssY8TZfnraoHm?)EMVoaNY+#0JspF4P*gP`k@RpDUutZp8{KeBdBK&
z@D;EH;QHZH)YlL7ayh^QFS}8+7+3^wnt#UA_3;DLIFlQS9EH3Dp(B8i0O!>)fH%OI
zWIyu-6Tp#Zg7arpu^)jS17*N3z+{x;xhPJF{eb?!hq%2SfFA;<0ntsC>B|PfvxYb&
zT>^dwt^j8N&LFIiv&MDcCU6Jf5hu<XJPXB{;u^3O<G>CwpJ03uXL+OuPD@C(!Q<Qb
zhPwN?kJV=;s5Q*T2CBc|$BSbAe4P4oWu>>iV5(YE>1F<4s(MMWekw^{G+mu!!)4P>
z)E}?cHmOa0d%)##I!@&J;PMp{?oLdph_vt|X?m59KEb3mF|RVI-wxMXELZEAv#zOk
zI#llO-^#m{ufaUnODoiLPhZVXnW<;^YBOwa`rs0fy#4g6zFN4sRU567m2J9Tx#}Be
zp6su!YpnR2JyNxn_O<+5jT<`I#}Bo&@fw&hB4bQ$D}VEVq1p^ZZ}_g(K(C*r+2{_L
znqLJsJ5vjI?$*?Q%G8=YciTU=s_L_|H17)TsiCOqW|r3Yxn`qx$ktlC=vLO>$<~@u
zb2p#O)*@6(wz>OAZ9tG-y_K<{ezTF$sDJW6vp1h!uldhVeOh^&>v$SHG>aADZH&^C
zHu|Ar&BOeWpRt3{>=bC!728pPxY3aI1?umF8XM_nf{e*_)q=`J_Yk9g%~z{y?iXxq
fV`bYTq+DJX!r19HH^q<8I|du;nL|1l?UerkNCcUw

delta 11713
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
O>oEAHlfHT@?SBF5jP~{b

diff --git a/package.json b/package.json
index 95c8794722..6f21da7484 100644
--- a/package.json
+++ b/package.json
@@ -13,6 +13,7 @@
     "dev": "turbo dev --parallel",
     "start:dashboard": "turbo dev --filter=@midday/dashboard",
     "dev:dashboard": "turbo dev --filter=@midday/dashboard",
+    "dev:website": "turbo dev --filter=@midday/website",
     "dev:desktop": "turbo dev --filter=@midday/desktop",
     "jobs:dashboard": "turbo jobs --filter=@midday/dashboard",
     "format": "biome format --write .",
diff --git a/packages/email/emails/transactions.tsx b/packages/email/emails/transactions.tsx
index 06471845cb..bc79373d4f 100644
--- a/packages/email/emails/transactions.tsx
+++ b/packages/email/emails/transactions.tsx
@@ -1,8 +1,10 @@
+import { cn } from "@midday/ui/utils";
 import {
   Body,
   Button,
   Column,
   Container,
+  Font,
   Head,
   Heading,
   Hr,
@@ -15,124 +17,197 @@ import {
   Tailwind,
   Text,
 } from "@react-email/components";
+import { format } from "date-fns";
 import * as React from "react";
 
+type Transaction = {
+  id: string;
+  date: string;
+  amount: number;
+  name: string;
+  currency: string;
+};
+
 interface TransactionsEmailEmailProps {
-  username?: string;
-  userImage?: string;
-  invitedByUsername?: string;
-  invitedByEmail?: string;
-  teamName?: string;
-  teamImage?: string;
-  inviteLink?: string;
-  inviteFromIp?: string;
-  inviteFromLocation?: string;
+  firstName: string;
+  transactions: Transaction[];
+  locale: string;
 }
 
-const baseUrl = process.env.VERCEL_URL
-  ? `https://${process.env.VERCEL_URL}`
-  : "";
+const defaultTransactions = [
+  {
+    id: "1",
+    date: new Date().toISOString(),
+    amount: -1000,
+    currency: "USD",
+    name: "Spotify",
+  },
+  {
+    id: "2",
+    date: new Date().toISOString(),
+    amount: 1000,
+    currency: "USD",
+    name: "H23504959",
+  },
+  {
+    id: "3",
+    date: new Date().toISOString(),
+    amount: -1000,
+    currency: "USD",
+    name: "Webflow",
+  },
+  {
+    id: "4",
+    date: new Date().toISOString(),
+    amount: -1000,
+    currency: "USD",
+    name: "Netflix",
+  },
+];
+
+const baseUrl =
+  process.env.NODE_ENV === "production"
+    ? "https://midday.ai"
+    : "http://localhost:3000/email";
+
+const baseAppUrl =
+  process.env.NODE_ENV === "production"
+    ? "https://app.midday.ai"
+    : "http://localhost:3001";
 
 export const TransactionsEmail = ({
-  username = "zenorocha",
-  userImage = `${baseUrl}/static/vercel-user.png`,
-  invitedByUsername = "bukinoshita",
-  invitedByEmail = "bukinoshita@example.com",
-  teamName = "My Project",
-  teamImage = `${baseUrl}/static/vercel-team.png`,
-  inviteLink = "https://vercel.com/teams/invite/foo",
-  inviteFromIp = "204.13.186.218",
-  inviteFromLocation = "São Paulo, Brazil",
+  firstName = "Viktor",
+  transactions = defaultTransactions,
+  locale = "en",
 }: TransactionsEmailEmailProps) => {
-  const previewText = `Join ${invitedByUsername} on Vercel`;
+  const previewText = `Hi ${firstName}, We found 5 transactions thats missing receipts. Feel free to attach them to ease your own or your accountants work for upcoming declerations.`;
 
   return (
     <Html>
-      <Head />
+      <Head>
+        <Font
+          fontFamily="Instrument Sans"
+          fallbackFontFamily="Helvetica"
+          webFont={{
+            url: "https://fonts.gstatic.com/s/instrumentsans/v1/pxiTypc9vsFDm051Uf6KVwgkfoSxQ0GsQv8ToedPibnr0She1ZuWi3hKpA.woff2",
+            format: "woff2",
+          }}
+        />
+        <Font
+          fontFamily="Instrument Sans"
+          fallbackFontFamily="Helvetica"
+          webFont={{
+            url: "https://fonts.gstatic.com/s/instrumentsans/v1/pxiTypc9vsFDm051Uf6KVwgkfoSxQ0GsQv8ToedPibnr0She1ZuWi3hKpA.woff2",
+            format: "woff2",
+          }}
+          fontWeight={600}
+        />
+      </Head>
       <Preview>{previewText}</Preview>
       <Tailwind>
         <Body className="bg-white my-auto mx-auto font-sans">
-          <Container className="border border-solid border-[#eaeaea] rounded my-[40px] mx-auto p-[20px] w-[465px]">
+          <Container className="border border-solid border-[#eaeaea] rounded my-[40px] mx-auto p-[20px] w-[560px]">
             <Section className="mt-[32px]">
               <Img
-                src={`${baseUrl}/static/vercel-logo.png`}
-                width="40"
-                height="37"
-                alt="Vercel"
+                src={`${baseUrl}/logo.png`}
+                width="45"
+                height="45"
+                alt="Midday"
                 className="my-0 mx-auto"
               />
             </Section>
-            <Heading className="text-black text-[24px] font-normal text-center p-0 my-[30px] mx-0">
-              Join <strong>{teamName}</strong> on <strong>Vercel</strong>
+            <Heading className="text-black text-[21px] font-normal text-center p-0 my-[30px] mx-0">
+              You have <span className="font-medium">5 transactions</span> thats
+              missing <br />
+              receipts.
             </Heading>
             <Text className="text-black text-[14px] leading-[24px]">
-              Hello {username},
-            </Text>
-            <Text className="text-black text-[14px] leading-[24px]">
-              <strong>bukinoshita</strong> (
-              <Link
-                href={`mailto:${invitedByEmail}`}
-                className="text-blue-600 no-underline"
-              >
-                {invitedByEmail}
-              </Link>
-              ) has invited you to the <strong>{teamName}</strong> team on{" "}
-              <strong>Vercel</strong>.
+              Hi {firstName}, We found{" "}
+              <span className="font-medium">5 transactions</span> thats missing
+              receipts. Feel free to attach them to ease your own or your
+              accountants work for upcoming declerations.
             </Text>
-            <Section>
-              <Row>
-                <Column align="right">
-                  <Img
-                    className="rounded-full"
-                    src={userImage}
-                    width="64"
-                    height="64"
-                  />
-                </Column>
-                <Column align="center">
-                  <Img
-                    src={`${baseUrl}/static/vercel-arrow.png`}
-                    width="12"
-                    height="9"
-                    alt="invited you to"
-                  />
-                </Column>
-                <Column align="left">
-                  <Img
-                    className="rounded-full"
-                    src={teamImage}
-                    width="64"
-                    height="64"
-                  />
-                </Column>
-              </Row>
-            </Section>
+
+            <table style={{ width: "100%" }}>
+              <thead>
+                <tr style={{ borderBottom: "1px solid black" }}>
+                  <th align="left">
+                    <Text className="text-[14px] font-medium m-0 p-0">
+                      Date
+                    </Text>
+                  </th>
+                  <th align="left" style={{ width: "50%" }}>
+                    <Text className="text-[14px] font-medium m-0 p-0">
+                      To/From
+                    </Text>
+                  </th>
+                  <th align="left">
+                    <Text className="text-[14px] font-medium m-0 p-0">
+                      Amount
+                    </Text>
+                  </th>
+                </tr>
+              </thead>
+
+              <tbody>
+                {transactions.map((transaction) => (
+                  <tr key={transaction.id}>
+                    <td align="left">
+                      <Text className="text-[14px] m-0 p-0 mt-1 pb-1">
+                        {format(new Date(transaction.date), "MMM d")}
+                      </Text>
+                    </td>
+                    <td align="left" style={{ width: "50%" }}>
+                      <Link
+                        href={`${baseAppUrl}/transactions?id=${transaction.id}`}
+                        className={cn(
+                          "text-black",
+                          transaction.amount > 0 && "text-[#00C969]"
+                        )}
+                      >
+                        <Text className="text-[14px] m-0 p-0 mt-1 pb-1">
+                          {transaction.name}
+                        </Text>
+                      </Link>
+                    </td>
+                    <td align="left">
+                      <Text
+                        className={cn(
+                          "text-[14px] m-0 p-0 mt-1 pb-1",
+                          transaction.amount > 0 && "text-[#00C969]"
+                        )}
+                      >
+                        {Intl.NumberFormat(locale, {
+                          style: "currency",
+                          currency: transaction.currency,
+                        }).format(transaction.amount)}
+                      </Text>
+                    </td>
+                  </tr>
+                ))}
+              </tbody>
+            </table>
+
             <Section className="text-center mt-[32px] mb-[32px]">
               <Button
                 pX={20}
                 pY={12}
-                className="bg-[#000000] rounded text-white text-[12px] font-semibold no-underline text-center"
-                href={inviteLink}
+                className="bg-[#000000] rounded-xl text-white text-[12px] font-semibold no-underline text-center"
+                href={`${baseAppUrl}/transactions?from_id=${
+                  transactions.at(0).id
+                }`}
               >
-                Join the team
+                View transactions
               </Button>
             </Section>
-            <Text className="text-black text-[14px] leading-[24px]">
-              or copy and paste this URL into your browser:{" "}
-              <Link href={inviteLink} className="text-blue-600 no-underline">
-                {inviteLink}
-              </Link>
-            </Text>
             <Hr className="border border-solid border-[#eaeaea] my-[26px] mx-0 w-full" />
             <Text className="text-[#666666] text-[12px] leading-[24px]">
-              This invitation was intended for{" "}
-              <span className="text-black">{username} </span>.This invite was
-              sent from <span className="text-black">{inviteFromIp}</span>{" "}
-              located in{" "}
-              <span className="text-black">{inviteFromLocation}</span>. If you
-              were not expecting this invitation, you can ignore this email. If
-              you are concerned about your account's safety, please reply to
-              this email to get in touch with us.
+              Nam imperdiet congue volutpat. Nulla quis facilisis lacus. Vivamus
+              convallis sit amet lectus eget tincidunt. Vestibulum vehicula
+              rutrum nisl, sed faucibus neque. Donec lacus mi, rhoncus at dictum
+              eget, pulvinar at metus. Donec cursus tellus erat, a hendrerit
+              elit rutrum ut. Fusce quis tristique ligula. Etiam sit amet enim
+              vitae mauris auctor blandit id et nibh.
             </Text>
           </Container>
         </Body>
diff --git a/packages/email/package.json b/packages/email/package.json
index 860d53d11c..c68c83d10a 100644
--- a/packages/email/package.json
+++ b/packages/email/package.json
@@ -7,11 +7,12 @@
     "lint": "biome check .",
     "format": "biome format --write .",
     "check:types": "tsc --noEmit",
-    "dev": "email dev -p 3002",
+    "dev": "email dev -p 3003",
     "export": "email export"
   },
   "dependencies": {
     "@react-email/components": "0.0.6",
+    "date-fns": "^2.30.0",
     "react-email": "1.9.3"
   },
   "devDependencies": {
diff --git a/packages/notification/src/index.ts b/packages/notification/src/index.ts
index 873e4c698b..90e675ebca 100644
--- a/packages/notification/src/index.ts
+++ b/packages/notification/src/index.ts
@@ -4,7 +4,8 @@ const novu = new Novu(process.env.NOVU_API_KEY!);
 const API_ENDPOINT = "https://api.novu.co/v1";
 
 export enum TriggerEvents {
-  TransactionNew = "transaction_new",
+  TransactionNewInApp = "transaction_new_in_app",
+  TransactionNewEmail = "transaction_new_email",
 }
 
 type TriggerUser = {
@@ -16,15 +17,14 @@ type TriggerUser = {
 };
 
 type TriggerPayload = {
-  event: TriggerEvents;
-  html?: string;
+  name: TriggerEvents;
   payload: any;
   users: TriggerUser[];
   tenant?: string; // NOTE: Currently no way to listen for messages with tenant, we use team_id + user_id for unique
 };
 
 export async function trigger(data: TriggerPayload) {
-  return novu.trigger(data.event, {
+  return novu.trigger(data.name, {
     to: data.users.map((user) => ({
       ...user,
       //   Prefix subscriber id with team id
@@ -35,6 +35,21 @@ export async function trigger(data: TriggerPayload) {
   });
 }
 
+export async function triggerBulk(events: TriggerPayload[]) {
+  return novu.bulkTrigger(
+    events.map((data) => ({
+      name: data.name,
+      to: data.users.map((user) => ({
+        ...user,
+        //   Prefix subscriber id with team id
+        subscriberId: `${user.teamId}_${user.subscriberId}`,
+      })),
+      payload: data.payload,
+      tenant: data.tenant,
+    }))
+  );
+}
+
 type GetSubscriberPreferencesParams = {
   teamId: string;
   subscriberId: string;
@@ -51,7 +66,7 @@ export async function getSubscriberPreferences({
       headers: {
         Authorization: `ApiKey ${process.env.NOVU_API_KEY!}`,
       },
-    },
+    }
   );
 
   return response.json();
@@ -86,7 +101,7 @@ export async function updateSubscriberPreference({
           enabled,
         },
       }),
-    },
+    }
   );
 
   return response.json();