chore: clean up create-mail, tests

Author: shellscape

.github/workflows/release.yml

@@ -0,0 +1,61 @@
+name: Release Projects
+
+on:
+  workflow_dispatch:
+  push:
+    branches:
+      - main
+    tags-ignore:
+      - '*-v*'
+
+permissions:
+  contents: read
+  pages: write
+  id-token: write
+
+jobs:
+  release:
+    if: |
+      !startsWith(github.event.head_commit.message, 'chore(release):') &&
+      !startsWith(github.event.head_commit.message, 'chore(repo):')
+
+    permissions:
+      contents: write
+
+    runs-on: ubuntu-latest
+
+    name: release
+
+    steps:
+      - name: Checkout Commit
+        uses: actions/checkout@v4
+        with:
+          fetch-depth: 100
+          fetch-tags: true
+          ref: main
+          token: ${{ secrets.GH_TOKEN }}
+
+      - name: Fetch Tags
+        run: git fetch --tags
+
+      - name: Set Git Config
+        run: |
+          git config pull.rebase false
+          git config --global user.email "[email protected]"
+          git config --global user.name "Release Workflow"
+          git remote set-url origin https://github.com/${{ github.repository }}
+
+      - name: Setup
+        uses: ./.github/actions/setup
+
+      - name: Build Projects
+        run: |
+          moon jsx-email:build
+          moon create-mail:build
+          moon run :build --query "project~plugin-*"
+
+      - name: Release
+        run: moon run :release --affected --concurrency 1 --remote
+        env:
+          NODE_AUTH_TOKEN: ${{secrets.NPM_TOKEN}}
+          NPM_TOKEN: ${{ secrets.NPM_TOKEN }}

docs/quick-start.md

@@ -26,7 +26,7 @@ For those not familiar with the bits above, here are some links to resources tha
 
 ## New Projects
 
-If you're starting a new project — whether that's a project solely for email templates, or a project that will eventually host additional code — our [`create-mail`](https://github.com/shellscape/jsx-email/tree/main/packages/create-jsx-email) utility is a perfect choice, and the fastest way to get started. The utility will scaffold a new project and get everything ready for developing new email templates. To begin, make sure you have a terminal (or command line) open and your current working directory is the directory you'd like to create a new project. Run the following command in your terminal (without the `$` symbol):
+If you're starting a new project — whether that's a project solely for email templates, or a project that will eventually host additional code — our [`create-mail`](https://github.com/shellscape/jsx-email/tree/main/packages/create-mail) utility is a perfect choice, and the fastest way to get started. The utility will scaffold a new project and get everything ready for developing new email templates. To begin, make sure you have a terminal (or command line) open and your current working directory is the directory you'd like to create a new project. Run the following command in your terminal (without the `$` symbol):
 
 ```console
 $ npm create jsx-email

packages/create-mail/cli.js

@@ -25,7 +25,7 @@ Please upgrade Node.js to a supported version: ${engines}\n`);
   await checkEngine();
   const { run } = await import('./dist/index.js');
   return run();
-})
+})()
   .then(() => process.exit(0))
   .catch((error) => {
     danger(error);

packages/create-mail/src/index.ts

@@ -77,7 +77,7 @@ export const createEmail = async ({ jsx, name, outputPath }: CreateEmailArgs) =>
   return outPath;
 };
 
-const run = async () => {
+export const run = async () => {
   log(intro);
 
   const skip = process.argv.some((arg) => arg === '--yes');
@@ -184,5 +184,3 @@ ${install}
 
   log(footer);
 };
-
-run();

packages/jsx-email/src/cli/commands/create.ts

@@ -55,7 +55,7 @@ export const command: CommandFn = async (argv: CreateOptions, input) => {
 
   const [name] = input;
   const { jsx, out } = argv;
-  const template = await readFile(join(__dirname, '../../../templates/email.mustache'), 'utf8');
+  const template = await readFile(join(__dirname, '../../templates/email.mustache'), 'utf8');
   const data = {
     asConst: jsx ? '' : asConst,
     name,

test/cli/.snapshots/create-jsx-email.test.ts.snap

@@ -1,8 +1,8 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
-exports[`create-jsx-email > command 1`] = `
+exports[`create-mail > command 1`] = `
 "
-create-jsx-email 
+create-mail
 
 The fastest way to get started with JSX Email
 
@@ -22,7 +22,7 @@ Check out the docs! http://jsx.email/docs/quick-start
 "
 `;
 
-exports[`create-jsx-email > command 2`] = `
+exports[`create-mail > command 2`] = `
 "import {
   Body,
   Button,
@@ -124,7 +124,7 @@ export const Template = ({ email, name }: TemplateProps) => (
 "
 `;
 
-exports[`create-jsx-email > command 3`] = `
+exports[`create-mail > command 3`] = `
 [
   ".test/new/.gitignore",
   ".test/new/README.md",

test/cli/.snapshots/create-mail.test.ts.snap

@@ -0,0 +1,135 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`create-mail > command 1`] = `
+"
+create-mail 
+
+The fastest way to get started with JSX Email
+
+
+Creating Project at: .test/new/templates
+Creating a new template at: .test/new/templates/email.tsx
+
+✓ jsx-email Project Created
+
+Next, run:
+
+  $ cd email-project
+  $ pnpm install
+  $ pnpm run dev
+
+Check out the docs! http://jsx.email/docs/quick-start
+"
+`;
+
+exports[`create-mail > command 2`] = `
+"import {
+  Body,
+  Button,
+  Container,
+  Head,
+  Hr,
+  Html,
+  Link,
+  Preview,
+  Section,
+  Text
+} from 'jsx-email';
+
+interface TemplateProps {
+  email: string;
+  name: string;
+}
+
+const main = {
+  backgroundColor: '#f6f9fc',
+  fontFamily:
+    '-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Ubuntu,sans-serif'
+};
+
+const container = {
+  backgroundColor: '#ffffff',
+  margin: '0 auto',
+  marginBottom: '64px',
+  padding: '20px 0 48px'
+};
+
+const box = {
+  padding: '0 48px'
+};
+
+const hr = {
+  borderColor: '#e6ebf1',
+  margin: '20px 0'
+};
+
+const paragraph = {
+  color: '#777',
+  fontSize: '16px',
+  lineHeight: '24px',
+  textAlign: 'left' as const
+};
+
+const anchor = {
+  color: '#777'
+};
+
+const button = {
+  fontWeight: 'bold',
+  padding: '10px',
+  textDecoration: 'none'
+};
+
+export const previewProps: TemplateProps = {
+  email: '[email protected]',
+  name: 'Bruce Wayne'
+};
+
+export const templateName = 'email-project';
+
+export const Template = ({ email, name }: TemplateProps) => (
+  <Html>
+    <Head />
+    <Preview>This is our email preview text for {name} &lt;{email}&gt;</Preview>
+    <Body style={main}>
+      <Container style={container}>
+        <Section style={box}>
+          <Text style={paragraph}>This is our email body text</Text>
+          <Button
+            align={'center'}
+            backgroundColor={'#777'}
+            borderRadius={5}
+            fontSize={16}
+            height={60}
+            href="https://example.com"
+            style={button}
+            textColor={'#fff'}
+            width={160}
+          >
+            Action Button
+          </Button>
+          <Hr style={hr} />
+          <Text style={paragraph}>
+            This is text content with a{' '}
+            <Link style={anchor} href="mailto:{email}">
+              link
+            </Link>
+            .
+          </Text>
+        </Section>
+      </Container>
+    </Body>
+  </Html>
+);
+"
+`;
+
+exports[`create-mail > command 3`] = `
+[
+  ".test/new/.gitignore",
+  ".test/new/README.md",
+  ".test/new/package.json",
+  ".test/new/tsconfig.json",
+  ".test/new/templates/email.tsx",
+]
+`;

test/cli/.snapshots/create.test.ts.snap

@@ -22,7 +22,7 @@ interface TemplateProps {
 const main = {
   backgroundColor: '#f6f9fc',
   fontFamily:
-    '-apple-system,BlinkMacSystemFont,\\"Segoe UI\\",Roboto,\\"Helvetica Neue\\",Ubuntu,sans-serif'
+    '-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Ubuntu,sans-serif'
 };
 
 const container = {
@@ -79,7 +79,7 @@ export const Template = ({ email, name }: TemplateProps) => (
             borderRadius={5}
             fontSize={16}
             height={60}
-            href=\\"https://example.com\\"
+            href="https://example.com"
             style={button}
             textColor={'#fff'}
             width={160}
@@ -89,7 +89,7 @@ export const Template = ({ email, name }: TemplateProps) => (
           <Hr style={hr} />
           <Text style={paragraph}>
             This is text content with a{' '}
-            <Link style={anchor} href=\\"mailto:{email}\\">
+            <Link style={anchor} href="mailto:{email}">
               link
             </Link>
             .

test/cli/create-jsx-email.test.ts renamed to test/cli/create-mail.test.ts

@@ -7,16 +7,16 @@ import strip from 'strip-ansi';
 
 process.chdir(__dirname);
 
-describe('create-jsx-email', async () => {
+describe('create-mail', async () => {
   test('command', async () => {
     const { stdout } = await execa({
       cwd: __dirname,
       shell: true
       // Note: For some reason `pnpm exec` is fucking with our CWD, and resets it to
       // packages/jsx-email, which causes the config not to be found. so we use npx instead
-    })`IS_CLI_TEST=true create-jsx-email .test/new --yes`;
+    })`IS_CLI_TEST=true create-mail .test/new --yes`;
     const plain = strip(stdout)
-      .replace(/^(.*)create-jsx-email/, 'create-jsx-email')
+      .replace(/^(.*)create-mail/, 'create-mail')
       .replace(/v(\d+\.\d+\.\d+)/, '');
 
     expect(plain).toMatchSnapshot();