@springmicro/cli 0.2.0 → 0.2.1

package/README.md

@@ -31,7 +31,7 @@ $ npm install -g @springmicro/cli
 $ springmicro COMMAND
 running command...
 $ springmicro (--version)
-@springmicro/cli/0.2.0 win32-x64 node-v20.15.0
+@springmicro/cli/0.2.1 win32-x64 node-v20.15.0
 $ springmicro --help [COMMAND]
 USAGE
   $ springmicro COMMAND
@@ -69,6 +69,7 @@ USAGE
 
 <!-- commands -->
 * [`springmicro add auth`](#springmicro-add-auth)
+* [`springmicro add form`](#springmicro-add-form)
 * [`springmicro help [COMMAND]`](#springmicro-help-command)
 * [`springmicro init PROJECTTYPE`](#springmicro-init-projecttype)
 * [`springmicro init astro`](#springmicro-init-astro)
@@ -98,7 +99,27 @@ EXAMPLES
   $ springmicro add auth
 ```
 
-_See code: [src/commands/add/auth.ts](https://github.com/SpringMicro1/springmicrohost-js/blob/v0.2.0/src/commands/add/auth.ts)_
+_See code: [src/commands/add/auth.ts](https://github.com/SpringMicro1/springmicrohost-js/blob/v0.2.1/src/commands/add/auth.ts)_
+
+## `springmicro add form`
+
+add a form to your project
+
+```
+USAGE
+  $ springmicro add form [-t <value>]
+
+FLAGS
+  -t, --template=<value>  form template (contact|quote)
+
+DESCRIPTION
+  add a form to your project
+
+EXAMPLES
+  $ springmicro add form
+```
+
+_See code: [src/commands/add/form.ts](https://github.com/SpringMicro1/springmicrohost-js/blob/v0.2.1/src/commands/add/form.ts)_
 
 ## `springmicro help [COMMAND]`
 
@@ -141,7 +162,7 @@ EXAMPLES
   $ springmicro init astro -n example
 ```
 
-_See code: [src/commands/init/index.ts](https://github.com/SpringMicro1/springmicrohost-js/blob/v0.2.0/src/commands/init/index.ts)_
+_See code: [src/commands/init/index.ts](https://github.com/SpringMicro1/springmicrohost-js/blob/v0.2.1/src/commands/init/index.ts)_
 
 ## `springmicro init astro`
 
@@ -161,7 +182,7 @@ EXAMPLES
   $ springmicro init astro -n <project-name>
 ```
 
-_See code: [src/commands/init/astro.ts](https://github.com/SpringMicro1/springmicrohost-js/blob/v0.2.0/src/commands/init/astro.ts)_
+_See code: [src/commands/init/astro.ts](https://github.com/SpringMicro1/springmicrohost-js/blob/v0.2.1/src/commands/init/astro.ts)_
 
 ## `springmicro plugins`
 

package/dist/commands/add/form.d.ts

@@ -0,0 +1,12 @@
+import { Command } from '@oclif/core';
+import forms from '../../data/form/index.js';
+export default class Form extends Command {
+    static description: string;
+    static examples: string[];
+    static flags: {
+        template: import("@oclif/core/interfaces").OptionFlag<string | undefined, import("@oclif/core/interfaces").CustomOptions>;
+    };
+    extractEnvVars(formString: string): string[];
+    writeForm(template: keyof typeof forms): void;
+    run(): Promise<void>;
+}

package/dist/commands/add/form.js

@@ -0,0 +1,51 @@
+import { Command, Flags } from '@oclif/core';
+import forms from '../../data/form/index.js';
+import { checkUnixShellAndSpawn } from '../../utils/shell.js';
+import path from 'node:path';
+import fs from 'node:fs';
+import chalk from 'chalk';
+export default class Form extends Command {
+    // static override args = {
+    //   file: Args.string({description: 'file to read'}),
+    // }
+    static description = 'add a form to your project';
+    static examples = ['<%= config.bin %> <%= command.id %>'];
+    static flags = {
+        // flag with a value (-t, --template=VALUE)
+        template: Flags.string({ char: 't', description: 'form template (contact|quote)' }),
+    };
+    extractEnvVars(formString) {
+        const envVarRegex = /import\.meta\.env\.(\w+)/g;
+        let match;
+        const envVars = [];
+        while ((match = envVarRegex.exec(formString)) !== null) {
+            envVars.push(match[1]);
+        }
+        return envVars;
+    }
+    writeForm(template) {
+        const baseDir = path.posix.join('src', 'components', 'forms');
+        const baseDirApi = path.posix.join('src', 'pages', 'api', 'forms');
+        fs.mkdirSync(baseDir, { recursive: true });
+        fs.mkdirSync(baseDirApi, { recursive: true });
+        const filePath = path.posix.join(baseDir, forms[template].name + '.tsx');
+        fs.writeFileSync(filePath, forms[template].tsx);
+        const filePathApi = path.posix.join(baseDirApi, forms[template].name.toLowerCase() + '.ts');
+        fs.writeFileSync(filePathApi, forms[template].api);
+        this.log('');
+        this.log(chalk.bgCyan.black('FINISHED!'));
+        const envVars = this.extractEnvVars(forms[template].api);
+        if (envVars.length > 0) {
+            this.log('');
+            this.log(chalk.cyan('Make sure to set the following environment variables:'));
+            envVars.forEach((v) => this.log(chalk.cyan(`- ${v}`)));
+        }
+    }
+    async run() {
+        const { args, flags } = await this.parse(Form);
+        const template = flags.template ?? 'contact';
+        if (Object.keys(forms).includes(template)) {
+            await checkUnixShellAndSpawn('sh', [path.posix.join(this.config.root, 'dist', 'scripts', 'forms.sh')], path.join(this.config.root, 'dist', 'scripts', 'forms.bat'), [], () => this.writeForm(template));
+        }
+    }
+}

package/dist/commands/init/astro.js

@@ -47,6 +47,8 @@ export default class Astro extends Command {
         tsConfig['compilerOptions'] = {
             ...tsConfig['compilerOptions'],
             baseUrl: '.',
+            // allow implicit type imports
+            verbatimModuleSyntax: false,
             paths: {
                 '@/*': ['./src/*'],
             },

package/dist/data/form/index.d.ts

@@ -0,0 +1,10 @@
+type FormStrings = {
+    tsx: string;
+    name: string;
+    api: string;
+};
+declare const _default: {
+    contact: FormStrings;
+    quote: FormStrings;
+};
+export default _default;

package/dist/data/form/index.js

@@ -0,0 +1,274 @@
+const contact = {
+    name: 'Contact',
+    tsx: `import { zodResolver } from "@hookform/resolvers/zod";
+import { useForm } from "react-hook-form";
+import { z } from "zod";
+import { Button } from "@/components/ui/button";
+import { toast } from "sonner";
+import {
+  Form,
+  FormControl,
+  FormDescription,
+  FormField,
+  FormItem,
+  FormLabel,
+  FormMessage,
+} from "@/components/ui/form";
+import { Input } from "@/components/ui/input";
+import { Textarea } from "@/components/ui/textarea"; // Assume you have a Textarea component
+
+const formSchema = z.object({
+  name: z.string().min(1, {
+    message: "Name is required.",
+  }),
+  email: z.string().email({
+    message: "Invalid email address.",
+  }),
+  message: z.string().min(1, {
+    message: "Message is required.",
+  }),
+});
+
+export function ContactForm() {
+  // 1. Define your form.
+  const form = useForm<z.infer<typeof formSchema>>({
+    resolver: zodResolver(formSchema),
+    defaultValues: {
+      name: "",
+      email: "",
+      message: "",
+    },
+  });
+
+  // 2. Define a submit handler.
+  async function onSubmit(values: z.infer<typeof formSchema>) {
+    // Do something with the form values.
+    console.log(values);
+    const res = await fetch("/api/forms/contact", {
+      method: "POST",
+      body: JSON.stringify(values),
+      headers: { "Content-Type": "application/json" },
+    });
+    if (res.ok) {
+      // success toast
+      toast("Form submitted!");
+    } else {
+      // error toast
+      toast("Error submitting form, refresh and try again.");
+    }
+  }
+
+  return (
+    <Form {...form}>
+      <form onSubmit={form.handleSubmit(onSubmit)} className="space-y-8">
+        <FormField
+          control={form.control}
+          name="name"
+          render={({ field }) => (
+            <FormItem>
+              <FormLabel>Name</FormLabel>
+              <FormControl>
+                <Input placeholder="Your Name" {...field} />
+              </FormControl>
+              <FormMessage />
+            </FormItem>
+          )}
+        />
+        <FormField
+          control={form.control}
+          name="email"
+          render={({ field }) => (
+            <FormItem>
+              <FormLabel>Email</FormLabel>
+              <FormControl>
+                <Input
+                  type="email"
+                  placeholder="your.email@example.com"
+                  {...field}
+                />
+              </FormControl>
+              <FormMessage />
+            </FormItem>
+          )}
+        />
+        <FormField
+          control={form.control}
+          name="message"
+          render={({ field }) => (
+            <FormItem>
+              <FormLabel>Message</FormLabel>
+              <FormControl>
+                <Textarea rows={4} placeholder="Your message" {...field} />
+              </FormControl>
+              <FormMessage />
+            </FormItem>
+          )}
+        />
+        <Button type="submit">Submit</Button>
+      </form>
+    </Form>
+  );
+}
+
+`,
+    api: `import { emailOnlySGJSON } from "@springmicro/forms";
+import type { APIRoute } from "astro";
+
+export const POST: APIRoute = async ({ params, request }) => {
+  const subject = "Contact Form Submission";
+  const json = await request.json();
+  const to: string[] = [json.email];
+  const cc: string[] = [];
+  const bcc: string[] = [];
+
+  const res = await emailOnlySGJSON(
+    import.meta.env.SENDGRID_API_KEY,
+    subject,
+    json,
+    to,
+    cc,
+    bcc
+  );
+  return res;
+};
+`,
+};
+const quote = {
+    name: 'Quote',
+    tsx: `import { zodResolver } from "@hookform/resolvers/zod";
+import { useForm } from "react-hook-form";
+import { z } from "zod";
+import { Button } from "@/components/ui/button";
+import { toast } from "sonner";
+import {
+  Form,
+  FormControl,
+  FormDescription,
+  FormField,
+  FormItem,
+  FormLabel,
+  FormMessage,
+} from "@/components/ui/form";
+import { Input } from "@/components/ui/input";
+import { Textarea } from "@/components/ui/textarea"; // Assume you have a Textarea component
+
+const formSchema = z.object({
+  name: z.string().min(1, {
+    message: "Name is required.",
+  }),
+  email: z.string().email({
+    message: "Invalid email address.",
+  }),
+  message: z.string().min(1, {
+    message: "Message is required.",
+  }),
+});
+
+export function QuoteForm() {
+  // 1. Define your form.
+  const form = useForm<z.infer<typeof formSchema>>({
+    resolver: zodResolver(formSchema),
+    defaultValues: {
+      name: "",
+      email: "",
+      message: "",
+    },
+  });
+
+  // 2. Define a submit handler.
+  async function onSubmit(values: z.infer<typeof formSchema>) {
+    // Do something with the form values.
+    console.log(values);
+    const res = await fetch("/api/forms/quote", {
+      method: "POST",
+      body: JSON.stringify(values),
+      headers: { "Content-Type": "application/json" },
+    });
+    if (res.ok) {
+      // success toast
+      toast("Form submitted!");
+    } else {
+      // error toast
+      toast("Error submitting form, refresh and try again.");
+    }
+  }
+
+  return (
+    <Form {...form}>
+      <form onSubmit={form.handleSubmit(onSubmit)} className="space-y-8">
+        <FormField
+          control={form.control}
+          name="name"
+          render={({ field }) => (
+            <FormItem>
+              <FormLabel>Name</FormLabel>
+              <FormControl>
+                <Input placeholder="Your Name" {...field} />
+              </FormControl>
+              <FormMessage />
+            </FormItem>
+          )}
+        />
+        <FormField
+          control={form.control}
+          name="email"
+          render={({ field }) => (
+            <FormItem>
+              <FormLabel>Email</FormLabel>
+              <FormControl>
+                <Input
+                  type="email"
+                  placeholder="your.email@example.com"
+                  {...field}
+                />
+              </FormControl>
+              <FormMessage />
+            </FormItem>
+          )}
+        />
+        <FormField
+          control={form.control}
+          name="message"
+          render={({ field }) => (
+            <FormItem>
+              <FormLabel>Message</FormLabel>
+              <FormControl>
+                <Textarea rows={4} placeholder="Your message" {...field} />
+              </FormControl>
+              <FormMessage />
+            </FormItem>
+          )}
+        />
+        <Button type="submit">Submit</Button>
+      </form>
+    </Form>
+  );
+}
+
+`,
+    api: `import { emailOnlySGJSON } from "@springmicro/forms";
+import type { APIRoute } from "astro";
+
+export const POST: APIRoute = async ({ params, request }) => {
+  const subject = "Request a Quote Submission";
+  const json = await request.json();
+  const to: string[] = [json.email];
+  const cc: string[] = [];
+  const bcc: string[] = [];
+
+  const res = await emailOnlySGJSON(
+    import.meta.env.SENDGRID_API_KEY,
+    subject,
+    json,
+    to,
+    cc,
+    bcc
+  );
+  return res;
+};
+`,
+};
+export default {
+    contact,
+    quote,
+};

package/dist/scripts/forms.bat

@@ -0,0 +1,10 @@
+@echo off
+
+REM Use PowerShell to simulate 'yes no' command and pipe to pnpm
+powershell -Command "while ($true) { Write-Output 'n' }" | pnpm dlx shadcn-ui@latest add form
+powershell -Command "while ($true) { Write-Output 'n' }" | pnpm dlx shadcn-ui@latest add button
+powershell -Command "while ($true) { Write-Output 'n' }" | pnpm dlx shadcn-ui@latest add textarea
+powershell -Command "while ($true) { Write-Output 'n' }" | pnpm dlx shadcn-ui@latest add label
+powershell -Command "while ($true) { Write-Output 'n' }" | pnpm dlx shadcn-ui@latest add input
+powershell -Command "while ($true) { Write-Output 'n' }" | pnpm dlx shadcn-ui@latest add sonner
+pnpm add @springmicro/forms

package/dist/scripts/forms.sh

@@ -0,0 +1,8 @@
+# no to overwriting shadcn components that have already been installed
+yes no | pnpm dlx shadcn-ui@latest add form
+yes no | pnpm dlx shadcn-ui@latest add button
+yes no | pnpm dlx shadcn-ui@latest add textarea
+yes no | pnpm dlx shadcn-ui@latest add label
+yes no | pnpm dlx shadcn-ui@latest add input
+yes no | pnpm dlx shadcn-ui@latest add sonner
+pnpm add @springmicro/forms

package/oclif.manifest.json

@@ -24,6 +24,39 @@
         "auth.js"
       ]
     },
+    "add:form": {
+      "aliases": [],
+      "args": {},
+      "description": "add a form to your project",
+      "examples": [
+        "<%= config.bin %> <%= command.id %>"
+      ],
+      "flags": {
+        "template": {
+          "char": "t",
+          "description": "form template (contact|quote)",
+          "name": "template",
+          "hasDynamicHelp": false,
+          "multiple": false,
+          "type": "option"
+        }
+      },
+      "hasDynamicHelp": false,
+      "hiddenAliases": [],
+      "id": "add:form",
+      "pluginAlias": "@springmicro/cli",
+      "pluginName": "@springmicro/cli",
+      "pluginType": "core",
+      "strict": true,
+      "enableJsonFlag": false,
+      "isESM": true,
+      "relativePath": [
+        "dist",
+        "commands",
+        "add",
+        "form.js"
+      ]
+    },
     "init:astro": {
       "aliases": [],
       "args": {},
@@ -101,5 +134,5 @@
       ]
     }
   },
-  "version": "0.2.0"
+  "version": "0.2.1"
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@springmicro/cli",
   "description": "A new CLI generated with oclif",
-  "version": "0.2.0",
+  "version": "0.2.1",
   "author": "David Buckley",
   "private": false,
   "publishConfig": {
@@ -76,5 +76,5 @@
     "version": "oclif readme && git add README.md"
   },
   "types": "dist/index.d.ts",
-  "gitHead": "bada90b1f5c1efcd122b4a69436098408162677c"
+  "gitHead": "5060bfe477b5be4d15de32991fb8ebc839143430"
 }