push

Co-Authored-By: Bloxs <[email protected]>
Wave-Studio · Jan 17, 2024 · 1494754 · 1494754
1 parent fe7b079
commit 1494754
Show file tree

Hide file tree

Showing 15 changed files with 4,728 additions and 202 deletions.
diff --git a/.env.example b/.env.example
@@ -6,4 +6,5 @@ IMAGEKIT_PUBLIC_KEY=<imagekit public key> (i.e. "public_...")
 IMAGEKIT_PRIVATE_KEY=<imagekit private key> (i.e. "private_...")
 IMAGEKIT_URL_ENDPOINT=<imagekit url> (i.e. "https://ik.imagekit.io/...")
 AWS_ACCESS_KEY_ID=....
-AWS_SECRET_ACCESS_KEY=....
+AWS_SECRET_ACCESS_KEY=....
+AWS_EMAIL_SOURCE="Name <[email protected]>"
diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml
@@ -23,7 +23,19 @@ jobs:
         with:
           deno-version: v1.x
 
-      - name: Build step
+      - name: Install Node
+        uses: actions/setup-node@v3
+        with:
+          node-version: "18"
+          cache: "yarn"
+
+      - name: Install node depends
+        run: yarn install
+
+      - name: Build Emails
+        run: yarn run export
+
+      - name: Build Fresh Website
         env:
           ALLOWED_EMAILS: ${{ secrets.ALLOWED_EMAILS }}
           IMAGEKIT_ENABLED: ${{ secrets.IMAGEKIT_ENABLED }}

diff --git a/.gitignore b/.gitignore
@@ -10,4 +10,6 @@
 
 # Fresh build directory
 /_fresh
-/db
+/db
+/.react-email
+/out
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -3,8 +3,10 @@
   "deno.lint": true,
   "deno.unstable": true,
   "deno.cacheOnSave": true,
+  "deno.config": "deno.jsonc",
   "emmet.includeLanguages": {
     "javascriptreact": "html",
     "typescriptreact": "html"
-  }
+  },
+  "deno.disablePaths": ["./.react-email"]
 }
diff --git a/deno.jsonc b/deno.jsonc
@@ -1,6 +1,5 @@
 {
   "lock": false,
-  "nodeModulesDir": true,
   "tasks": {
     "check": "deno fmt --check && deno lint && deno check **/*.ts && deno check **/*.tsx",
     "fmt": "npx prettier . --write",
@@ -11,7 +10,7 @@
   },
   "lint": { "rules": { "tags": ["fresh", "recommended"] } },
   "imports": {
-    "$fresh/": "https://deno.land/x/[email protected].1/",
+    "$fresh/": "https://deno.land/x/[email protected].3/",
     "preact": "https://esm.sh/[email protected]",
     "preact/": "https://esm.sh/[email protected]/",
     "preact-render-to-string": "https://esm.sh/*[email protected]",
@@ -26,7 +25,9 @@
     "tailwindcss": "npm:[email protected]",
     "tailwindcss/": "npm:/[email protected]/",
     "tailwindcss/plugin": "npm:/[email protected]/plugin.js",
-    "@tailwindcss/typography": "npm:@tailwindcss/typography"
+    "@tailwindcss/typography": "npm:@tailwindcss/typography",
+    "react": "npm:react",
+    "@react-email/components": "npm:@react-email/components"
   },
   "compilerOptions": { "jsx": "react-jsx", "jsxImportSource": "preact" },
   "exclude": ["**/_fresh/*"]

diff --git a/emails/login.tsx b/emails/login.tsx
@@ -0,0 +1,52 @@
+import {
+  Body,
+  Container,
+  Head,
+  Heading,
+  Html,
+  Img,
+  Link,
+  Section,
+  Tailwind,
+  Text,
+} from "@react-email/components";
+import * as React from "react";
+import config from "../tailwind.config.ts"
+
+export default function LoginEmail({ otp = "123456" }: { otp: string }) {
+  return (
+    <Html>
+      <Head />
+      <Tailwind config={{
+        theme: config.theme
+      }}>
+        <Body className="bg-white">
+          <Container className="">
+            <Img
+              src={`https://events.deno.dev/orange-logo.svg`}
+              width="212"
+              height="88"
+              alt="Plaid"
+            />
+            <Text >Verify Your Identity</Text>
+            <Heading >
+              Enter the following code to finish linking Venmo.
+            </Heading>
+            <Section>
+              <Text>{otp}</Text>
+            </Section>
+            <Text>Not expecting this email?</Text>
+            <Text>
+              Contact{" "}
+              <Link href="mailto:[email protected]">
+                [email protected]
+              </Link>{" "}
+              if you did not request this code.
+            </Text>
+          </Container>
+        </Body>
+      </Tailwind>
+    </Html>
+  );
+}
+
diff --git a/fresh.config.ts b/fresh.config.ts
@@ -1,5 +1,5 @@
 import { defineConfig } from "$fresh/server.ts";
-import tailwind from "./plugins/tailwind.ts";
+import tailwind from "$fresh/plugins/tailwind.ts";
 import { kvInsightsPlugin } from "https://deno.land/x/[email protected]/mod.ts";
 import { kv } from "@/utils/db/kv.ts";
 

diff --git a/package.json b/package.json
@@ -0,0 +1,17 @@
+{
+  "name": "emails",
+  "version": "0.0.18",
+  "private": true,
+
+  "workspaces": [
+    ".react-email"
+  ],
+  "scripts": {
+    "dev": "email dev",
+    "export": "email export"
+  },
+  "dependencies": {
+    "@react-email/components": "^0.0.12",
+    "react-email": "1.10.0"
+  }
+}
diff --git a/plugins/tailwind.ts b/plugins/tailwind.ts
diff --git a/plugins/tailwind/compiler.ts b/plugins/tailwind/compiler.ts
diff --git a/routes/api/auth/login.ts b/routes/api/auth/login.ts
@@ -8,6 +8,8 @@ import {
 import { deleteCookie, setCookie } from "$std/http/cookie.ts";
 import { sendEmail } from "@/utils/email/client.ts";
 
+const emailHTML = await Deno.readTextFile("./out/login.html");
+
 const emailRegex =
   /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|.(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
 
@@ -45,10 +47,13 @@ export const handler: Handlers<{ email: string; otp: string }> = {
     }
 
     const otp = await generateOTP(email);
+
+    const otpHTML = emailHTML.replace("123456", otp);
+
     try {
       await sendEmail([email], "Your Events Authorization Code", {
-        content: `Your one time login code is ${otp}.<br/> <b>Do not share it with anyone</b>`,
-        html: true,
+        html: otpHTML,
+        fallback: `Your one time login code is ${otp}. Do not share it with anyone.`,
       });
     } catch (err) {
       console.error(err);

diff --git a/static/orange-logo.png b/static/orange-logo.png
-Original file line number
+Diff line change
@@ Expand Up / @@ -10,4 +10,6 @@ @@
     # Fresh build directory
     /_fresh
-    /db
+    /db
+    /.react-email
+    /out