Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

chore(email): update styling, copy, urls #2141

Merged
merged 11 commits into from
Oct 2, 2024
Merged

chore(email): update styling, copy, urls #2141

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
11 commits
Select commit Hold shift + click to select a range
2ddc3ad
chore(email): update styling, copy, urls
mcstepp Sep 25, 2024
850a0c0
update urls
mcstepp Oct 1, 2024
f8a972c
fix class name
mcstepp Oct 1, 2024
45db2c0
remove unused imports, update date previews
mcstepp Oct 1, 2024
480bd40
[autofix.ci] apply automated fixes
autofix-ci[bot] Oct 1, 2024
bf2b0d5
make James the signer of all emails
mcstepp Oct 1, 2024
a0e3760
add biome ignore to prevent it from breaking an import
mcstepp Oct 2, 2024
6590c5e
add biome ignore to other component
mcstepp Oct 2, 2024
d5a5dbe
Update copy and links to use Dub
perkinsjr Oct 2, 2024
22dc171
[autofix.ci] apply automated fixes
autofix-ci[bot] Oct 2, 2024
37a41c8
Merge branch 'main' into ENG-365-update-emails
perkinsjr Oct 2, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
69 changes: 27 additions & 42 deletions internal/resend/emails/payment_issue.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,68 +1,53 @@
"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://app.unkey.com/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:support@unkey.dev">support@unkey.dev</Link> or just reply to this
email.
</Text>
<Hr />
<Text>
Need help? Please reach out to{" "}
<Link href="mailto:support@unkey.dev">support@unkey.dev</Link> or just reply to this email.
</Text>

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

PaymentIssue.PreviewProps = {
username: "Mr. Pilkington",
date: "2024 03 08",
date: "Tue Oct 01 2024", // Date().toDateString
} satisfies Props;

export default PaymentIssue;
83 changes: 42 additions & 41 deletions internal/resend/emails/secret_scanning_key_detected.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,16 +1,13 @@
"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 = {
date: string;
source: string;
Expand All @@ -19,45 +16,49 @@ 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:support@unkey.dev">support@unkey.dev</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:support@unkey.dev">support@unkey.dev</Link> or just reply to this email.
</Text>
<Signature signedBy="James" />
</Layout>
);
}
SecretScanningKeyDetected.PreviewProps = {
date: "7/12/2024",
date: "Tue Oct 01 2024", // Date().toDateString
source: "commit",
url: "http://unkey.com",
} satisfies Props;
Expand Down
75 changes: 30 additions & 45 deletions internal/resend/emails/subscription_ended.tsx
View file
Open in desktop
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://app.unkey.com/settings/billing"
className="bg-gray-900 text-gray-50 rounded-lg p-3 w-2/3"
>
Upgrade Now
</Button>
</Section>
mcstepp marked this conversation as resolved.
Show resolved Hide resolved

<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="James" />
</Layout>
);
}

Expand Down
Loading
Loading