Skip to content

Commit

Permalink
chore(email): update styling, copy, urls
Browse files Browse the repository at this point in the history
  • Loading branch information
mcstepp committed Sep 30, 2024
1 parent 889e073 commit 2ddc3ad
Show file tree
Hide file tree
Showing 11 changed files with 308 additions and 247 deletions.
67 changes: 26 additions & 41 deletions internal/resend/emails/payment_issue.tsx
Original file line number Diff line number Diff line change
@@ -1,62 +1,47 @@
"use client";
import { Button } from "@react-email/button";
import { Container } from "@react-email/container";
import { Head } from "@react-email/head";
import { Heading } from "@react-email/heading";
import { Hr } from "@react-email/hr";
import { Html } from "@react-email/html";
import { Link } from "@react-email/link";
import { Section } from "@react-email/section";
import { Tailwind } from "@react-email/tailwind";
import { Text } from "@react-email/text";
import React from "react";
import tailwindConfig from "../tailwind.config";
import { Layout } from "../src/components/layout";
import { Signature } from "../src/components/signature";
export type Props = {
username: string;
date: string;
};

export function PaymentIssue({ username, date }: Props) {
return (
<Tailwind config={tailwindConfig}>
<Html className="font-sans text-zinc-800">
<Head />
<Section className="bg-white">
<Container className="container mx-auto">
<Heading className="font-sans text-2xl text-semibold">
There was an issue with your payment.
</Heading>
<Text>Hey {username},</Text>
<Text>
We had trouble processing your payment on {date}. Please update your payment
information below to prevent your account from being downgraded.
</Text>
<Layout>
<Heading className="font-sans text-3xl text-semibold text-center">
There was an issue with your payment.
</Heading>
<Text>Hey {username},</Text>
<Text>
We had trouble processing your payment on {date}. Please update your payment information
below to prevent your account from being downgraded.
</Text>

<Container className="flex items-center justify-center my-8">
<Button
href="https://unkey.dev/app/settings/billing/stripe"
className="px-4 py-2 text-white bg-black rounded"
>
Update payment information
</Button>
</Container>
<Section className="text-center py-3">
<Button
href="https://unkey.com/app/settings/billing/stripe"
className="bg-gray-900 text-gray-50 rounded-lg p-3 w-2/3"
>
Update payment information
</Button>
</Section>

<Hr />
<Text>
Need help? Please reach out to{" "}
<Link href="mailto:[email protected]">[email protected]</Link> or just reply to this
email.
</Text>
<Hr />
<Text>
Need help? Please reach out to{" "}
<Link href="mailto:[email protected]">[email protected]</Link> or just reply to this email.
</Text>

<Text>
Cheers,
<br />
Andreas
</Text>
</Container>
</Section>
</Html>
</Tailwind>
<Signature signedBy="Andreas" />
</Layout>
);
}

Expand Down
76 changes: 41 additions & 35 deletions internal/resend/emails/secret_scanning_key_detected.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,8 @@ import { Section } from "@react-email/section";
import { Tailwind } from "@react-email/tailwind";
import { Text } from "@react-email/text";
import React from "react";
import { Layout } from "../src/components/layout";
import { Signature } from "../src/components/signature";
import tailwindConfig from "../tailwind.config";
export type Props = {
date: string;
Expand All @@ -19,41 +21,45 @@ export type Props = {

export function SecretScanningKeyDetected({ date, source, url }: Props) {
return (
<Tailwind config={tailwindConfig}>
<Html className="font-sans text-zinc-800">
<Head />
<Section className="bg-white">
<Container className="container mx-auto">
<Heading className="font-sans text-2xl text-semibold">
Alert! One of your keys was found to be leaked.
</Heading>
<Text>Hello</Text>
<Text>Github has found one of your keys has been leaked. Details are as follows:</Text>
<Text>- Source: {source} </Text>
<Text>- Date: {date} </Text>
<Text>- URL: {url} </Text>
<Container className="flex items-center justify-center my-8">
<Button href={url} className="px-4 py-2 text-white bg-black rounded">
Go to source
</Button>
</Container>
<Hr />
<Text>
You can disable the Root Key in your dashboard by following our docs listed here:{" "}
<Link href="https://www.unkey.com/docs/security/root-keys">here.</Link> If you have
any problems or questions, please reach out to
<Link href="mailto:[email protected]">[email protected]</Link> or just reply to this
email.
</Text>
<Text>
Cheers,
<br />
James
</Text>
</Container>
</Section>
</Html>
</Tailwind>
<Layout>
<Heading className="font-sans text-3xl text-semibold text-center">
Warning! One of your keys was leaked!
</Heading>
<Text>Hi there!</Text>
<Text>Github found that one of your keys has been leaked. Details are as follows:</Text>
<ul className="pb-4">
<li className="pt-4">
{" "}
<strong>Source:</strong> {source}{" "}
</li>
<li className="pt-4">
{" "}
<strong>Date:</strong> {date}{" "}
</li>
<li className="pt-4">
{" "}
<strong>URL:</strong> {url}
</li>
</ul>
<Section className="text-center py-3">
<Button href={url} className="bg-gray-900 text-gray-50 rounded-lg p-3 w-2/3">
Go to source
</Button>
</Section>
<Hr />
<Text>
You can disable the Root Key in your dashboard by following our docs available at{" "}
<Link href="https://www.unkey.com/docs/security/root-keys">
https://www.unkey.com/docs/security/root-keys
</Link>
.
</Text>
<Text>
Need help? Please reach out to{" "}
<Link href="mailto:[email protected]">[email protected]</Link> or just reply to this email.
</Text>
<Signature signedBy="James" />
</Layout>
);
}
SecretScanningKeyDetected.PreviewProps = {
Expand Down
75 changes: 30 additions & 45 deletions internal/resend/emails/subscription_ended.tsx
Original file line number Diff line number Diff line change
@@ -1,64 +1,49 @@
"use client";
import { Button } from "@react-email/button";
import { Container } from "@react-email/container";
import { Head } from "@react-email/head";
import { Heading } from "@react-email/heading";
import { Hr } from "@react-email/hr";
import { Html } from "@react-email/html";
import { Section } from "@react-email/section";
import { Tailwind } from "@react-email/tailwind";
import { Text } from "@react-email/text";
import React from "react";
import tailwindConfig from "../tailwind.config";
import { Layout } from "../src/components/layout";
import { Signature } from "../src/components/signature";
export type Props = {
username: string;
};

export function SubscriptionEnded({ username }: Props) {
return (
<Tailwind config={tailwindConfig}>
<Html className="font-sans text-zinc-800">
<Head />
<Section className="bg-white">
<Container className="container mx-auto">
<Heading className="font-sans text-2xl text-semibold">
Your Unkey subscription has ended.
</Heading>
<Text>Hey {username},</Text>
<Text>
We're reaching out to let you know that your trial period has come to an end for Unkey
Pro. We have downgraded the workspace to free, which means you lose access to the
workspace, but we will retain all your team and key data.
</Text>
<Text>
If you want to continue with Unkey Pro, click the button below, and you can add your
credit card.
</Text>
<Layout>
<Heading className="font-sans text-3xl text-semibold text-center">
Your Unkey subscription has ended.
</Heading>
<Text>Hey {username},</Text>
<Text>
We're reaching out to let you know that your trial period has come to an end for Unkey Pro.
We have downgraded the workspace to Free, which means you lose access to the workspace, but
we will retain all your team and key data.
</Text>
<Text>
If you want to continue with Unkey Pro, click the button below, and you can add your credit
card.
</Text>

<Container className="flex items-center justify-center my-8">
<Button
href="https://unkey.dev/app/settings/billing"
className="px-4 py-2 text-white bg-black rounded"
>
Upgrade Now
</Button>
</Container>
<Section className="text-center py-3">
<Button
href="https://unkey.com/app/settings/billing"
className="bg-gray-900 text-gray-50 rounded-lg p-3 w-2/3"
>
Upgrade Now
</Button>
</Section>

<Hr />
<Text>
If you have any feedback, please reply to this email. We would love to hear all about
it.
</Text>
<Hr />
<Text>
If you have any feedback, please reply to this email. We would love to hear all about it.
</Text>

<Text>
Cheers,
<br />
Andreas
</Text>
</Container>
</Section>
</Html>
</Tailwind>
<Signature signedBy="Andreas" />
</Layout>
);
}

Expand Down
Loading

0 comments on commit 2ddc3ad

Please sign in to comment.