@tanstack/cta-engine 0.10.0-alpha.10

package/src/types.ts

@@ -0,0 +1,119 @@
+import type { CODE_ROUTER, FILE_ROUTER } from './constants.js'
+import type { PackageManager } from './package-manager.js'
+import type { ToolChain } from './toolchain.js'
+
+export type Framework = 'solid' | 'react'
+
+export interface Options {
+  framework: Framework
+  projectName: string
+  typescript: boolean
+  tailwind: boolean
+  packageManager: PackageManager
+  toolchain: ToolChain
+  mode: typeof CODE_ROUTER | typeof FILE_ROUTER
+  addOns: boolean
+  chosenAddOns: Array<AddOn>
+  git: boolean
+  variableValues: Record<string, string | number | boolean>
+  overlay?: AddOn | undefined
+}
+
+export interface CliOptions {
+  template?: 'typescript' | 'javascript' | 'file-router'
+  framework?: Framework
+  tailwind?: boolean
+  packageManager?: PackageManager
+  toolchain?: ToolChain
+  projectName?: string
+  git?: boolean
+  addOns?: Array<string> | boolean
+  listAddOns?: boolean
+  mcp?: boolean
+  mcpSse?: boolean
+  overlay?: string
+  targetDir?: string
+}
+
+export type Environment = {
+  startRun: () => void
+  finishRun: () => void
+  getErrors: () => Array<string>
+
+  appendFile: (path: string, contents: string) => Promise<void>
+  copyFile: (from: string, to: string) => Promise<void>
+  writeFile: (path: string, contents: string) => Promise<void>
+  execute: (command: string, args: Array<string>, cwd: string) => Promise<void>
+  deleteFile: (path: string) => Promise<void>
+
+  readFile: (path: string, encoding?: BufferEncoding) => Promise<string>
+  exists: (path: string) => boolean
+  readdir: (path: string) => Array<string>
+  isDirectory: (path: string) => boolean
+}
+
+type BooleanVariable = {
+  name: string
+  default: boolean
+  description: string
+  type: 'boolean'
+}
+
+type NumberVariable = {
+  name: string
+  default: number
+  description: string
+  type: 'number'
+}
+
+type StringVariable = {
+  name: string
+  default: string
+  description: string
+  type: 'string'
+}
+
+export type Variable = BooleanVariable | NumberVariable | StringVariable
+
+export type AddOn = {
+  id: string
+  name: string
+  description: string
+  type: 'add-on' | 'example' | 'overlay'
+  link: string
+  templates: Array<string>
+  routes: Array<{
+    url: string
+    name: string
+  }>
+  packageAdditions: {
+    dependencies?: Record<string, string>
+    devDependencies?: Record<string, string>
+    scripts?: Record<string, string>
+  }
+  command?: {
+    command: string
+    args?: Array<string>
+  }
+  readme?: string
+  phase: 'setup' | 'add-on'
+  shadcnComponents?: Array<string>
+  warning?: string
+  dependsOn?: Array<string>
+  variables?: Array<Variable>
+
+  files?: Record<string, string>
+  deletedFiles?: Array<string>
+}
+
+export type Overlay = AddOn & {
+  type: 'overlay'
+  version: string
+  author: string
+  link: string
+  license: string
+  mode: typeof CODE_ROUTER | typeof FILE_ROUTER
+  framework: Framework
+  typescript: boolean
+  tailwind: boolean
+}

package/src/utils.ts

@@ -0,0 +1,10 @@
+export function sortObject(
+  obj: Record<string, string>,
+): Record<string, string> {
+  return Object.keys(obj)
+    .sort()
+    .reduce<Record<string, string>>((acc, key) => {
+      acc[key] = obj[key]
+      return acc
+    }, {})
+}

package/templates/react/add-on/clerk/README.md

@@ -0,0 +1,3 @@
+## Setting up Clerk
+
+- Set the `VITE_CLERK_PUBLISHABLE_KEY` in your `.env.local`.

package/templates/react/add-on/clerk/assets/_dot_env.local.append

@@ -0,0 +1,2 @@
+# Clerk configuration, get this key from your [Dashboard](https://clerk.com/dashboard).
+VITE_CLERK_PUBLISHABLE_KEY=

package/templates/react/add-on/clerk/assets/src/integrations/clerk/header-user.tsx

@@ -0,0 +1,19 @@
+import {
+  SignedIn,
+  SignInButton,
+  SignedOut,
+  UserButton,
+} from '@clerk/clerk-react'
+
+export default function HeaderUser() {
+  return (
+    <>
+      <SignedIn>
+        <UserButton />
+      </SignedIn>
+      <SignedOut>
+        <SignInButton />
+      </SignedOut>
+    </>
+  )
+}

package/templates/react/add-on/clerk/assets/src/integrations/clerk/provider.tsx

@@ -0,0 +1,18 @@
+import { ClerkProvider } from '@clerk/clerk-react'
+
+const PUBLISHABLE_KEY = import.meta.env.VITE_CLERK_PUBLISHABLE_KEY
+if (!PUBLISHABLE_KEY) {
+  throw new Error('Add your Clerk Publishable Key to the .env.local file')
+}
+
+export default function AppClerkProvider({
+  children,
+}: {
+  children: React.ReactNode
+}) {
+  return (
+    <ClerkProvider publishableKey={PUBLISHABLE_KEY} afterSignOutUrl="/">
+      {children}
+    </ClerkProvider>
+  )
+}

package/templates/react/add-on/clerk/assets/src/routes/demo.clerk.tsx

@@ -0,0 +1,20 @@
+import { createFileRoute } from '@tanstack/react-router'
+import { useUser } from '@clerk/clerk-react'
+
+export const Route = createFileRoute('/demo/clerk')({
+  component: App,
+})
+
+function App() {
+  const { isSignedIn, user, isLoaded } = useUser()
+
+  if (!isLoaded) {
+    return <div className="p-4">Loading...</div>
+  }
+
+  if (!isSignedIn) {
+    return <div className="p-4">Sign in to view this page</div>
+  }
+
+  return <div className="p-4">Hello {user.firstName}!</div>
+}

package/templates/react/add-on/clerk/info.json

@@ -0,0 +1,13 @@
+{
+  "name": "Clerk",
+  "description": "Add Clerk authentication to your application.",
+  "phase": "add-on",
+  "templates": ["file-router"],
+  "link": "https://clerk.com",
+  "routes": [
+    {
+      "url": "/demo/clerk",
+      "name": "Clerk"
+    }
+  ]
+}

package/templates/react/add-on/clerk/package.json

@@ -0,0 +1,5 @@
+{
+  "dependencies": {
+    "@clerk/clerk-react": "^5.22.13"
+  }
+}

package/templates/react/add-on/convex/README.md

@@ -0,0 +1,4 @@
+## Setting up Convex
+
+- Set the `VITE_CONVEX_URL` and `CONVEX_DEPLOYMENT` environment variables in your `.env.local`. (Or run `npx convex init` to set them automatically.)
+- Run `npx convex dev` to start the Convex server.

package/templates/react/add-on/convex/assets/_dot_cursorrules.append

@@ -0,0 +1,93 @@
+This document serves as some special instructions when working with Convex.
+
+# Schemas
+
+When designing the schema please see this page on built in System fields and data types available: https://docs.convex.dev/database/types
+
+Here are some specifics that are often mishandled:
+
+## v (https://docs.convex.dev/api/modules/values#v)
+
+The validator builder.
+
+This builder allows you to build validators for Convex values.
+
+Validators can be used in schema definitions and as input validators for Convex functions.
+
+Type declaration
+Name	Type
+id	<TableName>(tableName: TableName) => VId<GenericId<TableName>, "required">
+null	() => VNull<null, "required">
+number	() => VFloat64<number, "required">
+float64	() => VFloat64<number, "required">
+bigint	() => VInt64<bigint, "required">
+int64	() => VInt64<bigint, "required">
+boolean	() => VBoolean<boolean, "required">
+string	() => VString<string, "required">
+bytes	() => VBytes<ArrayBuffer, "required">
+literal	<T>(literal: T) => VLiteral<T, "required">
+array	<T>(element: T) => VArray<T["type"][], T, "required">
+object	<T>(fields: T) => VObject<Expand<{ [Property in string | number | symbol]?: Exclude<Infer<T[Property]>, undefined> } & { [Property in string | number | symbol]: Infer<T[Property]> }>, T, "required", { [Property in string | number | symbol]: Property | `${Property & string}.${T[Property]["fieldPaths"]}` }[keyof T] & string>
+record	<Key, Value>(keys: Key, values: Value) => VRecord<Record<Infer<Key>, Value["type"]>, Key, Value, "required", string>
+union	<T>(...members: T) => VUnion<T[number]["type"], T, "required", T[number]["fieldPaths"]>
+any	() => VAny<any, "required", string>
+optional	<T>(value: T) => VOptional<T>
+
+## System fields (https://docs.convex.dev/database/types#system-fields)
+
+Every document in Convex has two automatically-generated system fields:
+
+_id: The document ID of the document.
+_creationTime: The time this document was created, in milliseconds since the Unix epoch.
+
+You do not need to add indices as these are added automatically.
+
+## Example Schema
+
+This is an example of a well crafted schema.
+
+```ts
+import { defineSchema, defineTable } from "convex/server";
+import { v } from "convex/values";
+
+export default defineSchema(
+  {
+    users: defineTable({
+      name: v.string(),
+    }),
+    
+    sessions: defineTable({
+      userId: v.id("users"),
+      sessionId: v.string(),
+    }).index("sessionId", ["sessionId"]),
+    
+    threads: defineTable({
+      uuid: v.string(),
+      summary: v.optional(v.string()),
+      summarizer: v.optional(v.id("_scheduled_functions")),
+    }).index("uuid", ["uuid"]),
+
+    messages: defineTable({
+      message: v.string(),
+      threadId: v.id("threads"),
+      author: v.union(
+        v.object({
+          role: v.literal("system"),
+        }),
+        v.object({
+          role: v.literal("assistant"),
+          context: v.array(v.id("messages")),
+          model: v.optional(v.string()),
+        }),
+        v.object({
+          role: v.literal("user"),
+          userId: v.id("users"),
+        }),
+      ),
+    })
+      .index("threadId", ["threadId"]),
+  },
+);
+```
+
+Sourced from: https://github.com/PatrickJS/awesome-cursorrules/blob/main/rules/convex-cursorrules-prompt-file/.cursorrules

package/templates/react/add-on/convex/assets/_dot_env.local.append

@@ -0,0 +1,3 @@
+# Convex configuration, get this URL from your [Dashboard](https://convex.dev/dashboard).
+CONVEX_DEPLOYMENT=
+VITE_CONVEX_URL=

package/templates/react/add-on/convex/assets/convex/products.ts

@@ -0,0 +1,8 @@
+import { query } from "./_generated/server";
+
+export const get = query({
+  args: {},
+  handler: async (ctx) => {
+    return await ctx.db.query("products").collect();
+  },
+});

package/templates/react/add-on/convex/assets/convex/schema.ts

@@ -0,0 +1,10 @@
+import { defineSchema, defineTable } from "convex/server";
+import { v } from "convex/values";
+
+export default defineSchema({
+  products: defineTable({
+    title: v.string(),
+    imageId: v.string(),
+    price: v.number(),
+  }),
+});

package/templates/react/add-on/convex/assets/src/integrations/convex/provider.tsx

@@ -0,0 +1,20 @@
+import { ConvexProvider } from 'convex/react'
+import { ConvexQueryClient } from '@convex-dev/react-query'
+
+const CONVEX_URL = (import.meta as any).env.VITE_CONVEX_URL
+if (!CONVEX_URL) {
+  console.error('missing envar CONVEX_URL')
+}
+const convexQueryClient = new ConvexQueryClient(CONVEX_URL)
+
+export default function AppConvexProvider({
+  children,
+}: {
+  children: React.ReactNode
+}) {
+  return (
+    <ConvexProvider client={convexQueryClient.convexClient}>
+      {children}
+    </ConvexProvider>
+  )
+}

package/templates/react/add-on/convex/assets/src/routes/demo.convex.tsx

@@ -0,0 +1,33 @@
+import { Suspense } from 'react'
+import { createFileRoute } from '@tanstack/react-router'
+import { useQuery } from 'convex/react'
+
+import { api } from '../../convex/_generated/api'
+
+export const Route = createFileRoute('/demo/convex')({
+  component: App,
+})
+
+function Products() {
+  const products = useQuery(api.products.get)
+
+  return (
+    <ul>
+      {(products || []).map((p) => (
+        <li key={p._id}>
+          {p.title} - {p.price}
+        </li>
+      ))}
+    </ul>
+  )
+}
+
+function App() {
+  return (
+    <div className="p-4">
+      <Suspense fallback={<div>Loading...</div>}>
+        <Products />
+      </Suspense>
+    </div>
+  )
+}

package/templates/react/add-on/convex/info.json

@@ -0,0 +1,13 @@
+{
+  "name": "Convex",
+  "description": "Add the Convex database to your application.",
+  "link": "https://convex.dev",
+  "phase": "add-on",
+  "templates": ["file-router"],
+  "routes": [
+    {
+      "url": "/demo/convex",
+      "name": "Convex"
+    }
+  ]
+}

package/templates/react/add-on/convex/package.json

@@ -0,0 +1,6 @@
+{
+  "dependencies": {
+    "@convex-dev/react-query": "0.0.0-alpha.8",
+    "convex": "^1.19.2"
+  }
+}