@claudetools/tools 0.8.11 → 0.9.0

package/dist/codedna/generators/tanstack-start-drizzle.js

@@ -0,0 +1,824 @@
+// =============================================================================
+// Tanstack Start + Drizzle ORM Generator
+// =============================================================================
+//
+// Generates complete full-stack application with:
+// - Tanstack Start (React framework with SSR/CSR)
+// - Drizzle ORM (type-safe SQL)
+// - File-based routing
+// - Type-safe data loading
+// - Server actions for mutations
+// - Multiple database support (PostgreSQL, MySQL, SQLite)
+// - Cloudflare and Node deployment
+//
+import { BaseGenerator } from './base.js';
+import { TemplateEngine, buildContext } from '../template-engine.js';
+export class TanstackStartDrizzleGenerator extends BaseGenerator {
+    engine;
+    dbOptions;
+    constructor(options = {}) {
+        super();
+        this.engine = new TemplateEngine();
+        this.dbOptions = {
+            database: options.database || 'postgresql',
+            deployment: options.deployment || 'cloudflare',
+            ssr: options.ssr ?? true,
+            auth: options.auth ?? false,
+            ...options,
+        };
+    }
+    /**
+     * Generate complete Tanstack Start + Drizzle application
+     */
+    async generate(entity) {
+        const files = [];
+        const context = buildContext(entity, this.dbOptions);
+        // 1. Drizzle schema
+        files.push(await this.generateSchema(entity, context));
+        // 2. Drizzle migrations
+        files.push(await this.generateMigration(entity, context));
+        // 3. Database client configuration
+        files.push(await this.generateDbClient(context));
+        // 4. CRUD operations (queries + mutations)
+        files.push(await this.generateQueries(entity, context));
+        files.push(await this.generateMutations(entity, context));
+        // 5. Tanstack Start routes
+        files.push(await this.generateIndexRoute(entity, context)); // List view
+        files.push(await this.generateDetailRoute(entity, context)); // Detail view
+        files.push(await this.generateCreateRoute(entity, context)); // Create form
+        files.push(await this.generateEditRoute(entity, context)); // Edit form
+        // 6. React components
+        files.push(await this.generateListComponent(entity, context));
+        files.push(await this.generateFormComponent(entity, context));
+        // 7. Type definitions
+        files.push(await this.generateTypes(entity, context));
+        // 8. Configuration files
+        if (this.dbOptions.deployment === 'cloudflare') {
+            files.push(await this.generateWranglerConfig(context));
+        }
+        files.push(await this.generateDrizzleConfig(context));
+        files.push(await this.generatePackageJson(context));
+        return files;
+    }
+    /**
+     * Generate Drizzle schema definition
+     */
+    async generateSchema(entity, context) {
+        const template = this.getSchemaTemplate();
+        const content = this.engine.render(template, context);
+        return {
+            path: `src/db/schema/${entity.name.toLowerCase()}.ts`,
+            content,
+            language: 'typescript',
+        };
+    }
+    /**
+     * Generate database migration
+     */
+    async generateMigration(entity, context) {
+        const template = this.getMigrationTemplate();
+        const content = this.engine.render(template, context);
+        const timestamp = new Date().getTime();
+        return {
+            path: `drizzle/migrations/${timestamp}_create_${entity.name.toLowerCase()}.sql`,
+            content,
+            language: 'sql',
+        };
+    }
+    /**
+     * Generate database client configuration
+     */
+    async generateDbClient(context) {
+        const template = this.getDbClientTemplate();
+        const content = this.engine.render(template, context);
+        return {
+            path: 'src/db/client.ts',
+            content,
+            language: 'typescript',
+        };
+    }
+    /**
+     * Generate type-safe query functions
+     */
+    async generateQueries(entity, context) {
+        const template = this.getQueriesTemplate();
+        const content = this.engine.render(template, context);
+        return {
+            path: `src/queries/${entity.name.toLowerCase()}.ts`,
+            content,
+            language: 'typescript',
+        };
+    }
+    /**
+     * Generate server action mutations
+     */
+    async generateMutations(entity, context) {
+        const template = this.getMutationsTemplate();
+        const content = this.engine.render(template, context);
+        return {
+            path: `src/mutations/${entity.name.toLowerCase()}.ts`,
+            content,
+            language: 'typescript',
+        };
+    }
+    /**
+     * Generate index route (list view)
+     */
+    async generateIndexRoute(entity, context) {
+        const template = this.getIndexRouteTemplate();
+        const content = this.engine.render(template, context);
+        return {
+            path: `src/routes/${entity.name.toLowerCase()}/index.tsx`,
+            content,
+            language: 'typescript',
+        };
+    }
+    /**
+     * Generate detail route
+     */
+    async generateDetailRoute(entity, context) {
+        const template = this.getDetailRouteTemplate();
+        const content = this.engine.render(template, context);
+        return {
+            path: `src/routes/${entity.name.toLowerCase()}/$id.tsx`,
+            content,
+            language: 'typescript',
+        };
+    }
+    /**
+     * Generate create route
+     */
+    async generateCreateRoute(entity, context) {
+        const template = this.getCreateRouteTemplate();
+        const content = this.engine.render(template, context);
+        return {
+            path: `src/routes/${entity.name.toLowerCase()}/create.tsx`,
+            content,
+            language: 'typescript',
+        };
+    }
+    /**
+     * Generate edit route
+     */
+    async generateEditRoute(entity, context) {
+        const template = this.getEditRouteTemplate();
+        const content = this.engine.render(template, context);
+        return {
+            path: `src/routes/${entity.name.toLowerCase()}/$id/edit.tsx`,
+            content,
+            language: 'typescript',
+        };
+    }
+    /**
+     * Generate list component
+     */
+    async generateListComponent(entity, context) {
+        const template = this.getListComponentTemplate();
+        const content = this.engine.render(template, context);
+        return {
+            path: `src/components/${entity.name}List.tsx`,
+            content,
+            language: 'typescript',
+        };
+    }
+    /**
+     * Generate form component
+     */
+    async generateFormComponent(entity, context) {
+        const template = this.getFormComponentTemplate();
+        const content = this.engine.render(template, context);
+        return {
+            path: `src/components/${entity.name}Form.tsx`,
+            content,
+            language: 'typescript',
+        };
+    }
+    /**
+     * Generate TypeScript type definitions
+     */
+    async generateTypes(entity, context) {
+        const template = this.getTypesTemplate();
+        const content = this.engine.render(template, context);
+        return {
+            path: `src/types/${entity.name.toLowerCase()}.ts`,
+            content,
+            language: 'typescript',
+        };
+    }
+    /**
+     * Generate Wrangler configuration for Cloudflare
+     */
+    async generateWranglerConfig(context) {
+        const template = this.getWranglerConfigTemplate();
+        const content = this.engine.render(template, context);
+        return {
+            path: 'wrangler.toml',
+            content,
+            language: 'toml',
+        };
+    }
+    /**
+     * Generate Drizzle configuration
+     */
+    async generateDrizzleConfig(context) {
+        const template = this.getDrizzleConfigTemplate();
+        const content = this.engine.render(template, context);
+        return {
+            path: 'drizzle.config.ts',
+            content,
+            language: 'typescript',
+        };
+    }
+    /**
+     * Generate package.json with dependencies
+     */
+    async generatePackageJson(context) {
+        const template = this.getPackageJsonTemplate();
+        const content = this.engine.render(template, context);
+        return {
+            path: 'package.json',
+            content,
+            language: 'json',
+        };
+    }
+    // =============================================================================
+    // Templates
+    // =============================================================================
+    getSchemaTemplate() {
+        return `// {{ entity.name }} Drizzle Schema
+// Generated by CodeDNA
+
+{% if options.database === 'postgresql' %}
+import { pgTable, serial, varchar, integer, boolean, timestamp, text, jsonb } from 'drizzle-orm/pg-core';
+{% elif options.database === 'mysql' %}
+import { mysqlTable, serial, varchar, int, boolean, timestamp, text, json } from 'drizzle-orm/mysql-core';
+{% elif options.database === 'sqlite' %}
+import { sqliteTable, integer as sqliteInt, text as sqliteText } from 'drizzle-orm/sqlite-core';
+{% endif %}
+import { relations } from 'drizzle-orm';
+
+{% if options.database === 'postgresql' %}
+export const {{ entity.name | lower }} = pgTable('{{ entity.name | lower | plural }}', {
+{% elif options.database === 'mysql' %}
+export const {{ entity.name | lower }} = mysqlTable('{{ entity.name | lower | plural }}', {
+{% elif options.database === 'sqlite' %}
+export const {{ entity.name | lower }} = sqliteTable('{{ entity.name | lower | plural }}', {
+{% endif %}
+  id: serial('id').primaryKey(),
+{% for field in entity.fields %}
+  {% if field.type.kind === 'primitive' %}
+  {{ field.name }}: {{ field.type | sqlType | lower }}('{{ field.name }}'){% if field | hasConstraint('required') %}.notNull(){% endif %}{% if field | hasConstraint('unique') %}.unique(){% endif %}{% if field | getConstraint('default') %}.default({{ field | getConstraint('default') }}){% endif %},
+  {% elif field.type.kind === 'reference' %}
+  {{ field.name }}Id: integer('{{ field.name }}_id'){% if field | hasConstraint('required') %}.notNull(){% endif %}.references(() => {{ field.type.entity | lower }}.id),
+  {% elif field.type.kind === 'enum' %}
+  {{ field.name }}: varchar('{{ field.name }}', { length: 50 }){% if field | hasConstraint('required') %}.notNull(){% endif %},
+  {% elif field.type.kind === 'array' %}
+  {{ field.name }}: {% if options.database === 'postgresql' %}jsonb{% else %}json{% endif %}('{{ field.name }}'){% if field | hasConstraint('required') %}.notNull(){% endif %},
+  {% elif field.type.kind === 'json' %}
+  {{ field.name }}: {% if options.database === 'postgresql' %}jsonb{% else %}json{% endif %}('{{ field.name }}'){% if field | hasConstraint('required') %}.notNull(){% endif %},
+  {% endif %}
+{% endfor %}
+  createdAt: timestamp('created_at').defaultNow().notNull(),
+  updatedAt: timestamp('updated_at').defaultNow().notNull(),
+});
+
+// Relations
+export const {{ entity.name | lower }}Relations = relations({{ entity.name | lower }}, ({ one, many }) => ({
+{% for field in entity.fields %}
+  {% if field.type.kind === 'reference' %}
+  {% if field.type.relation === 'oneToMany' %}
+  {{ field.name }}: one({{ field.type.entity | lower }}, {
+    fields: [{{ entity.name | lower }}.{{ field.name }}Id],
+    references: [{{ field.type.entity | lower }}.id],
+  }),
+  {% elif field.type.relation === 'manyToMany' %}
+  {{ field.name }}: many({{ field.type.entity | lower }}),
+  {% else %}
+  {{ field.name }}: one({{ field.type.entity | lower }}, {
+    fields: [{{ entity.name | lower }}.{{ field.name }}Id],
+    references: [{{ field.type.entity | lower }}.id],
+  }),
+  {% endif %}
+  {% endif %}
+{% endfor %}
+}));
+
+// TypeScript type
+export type {{ entity.name }} = typeof {{ entity.name | lower }}.$inferSelect;
+export type New{{ entity.name }} = typeof {{ entity.name | lower }}.$inferInsert;
+`;
+    }
+    getMigrationTemplate() {
+        return `-- {{ entity.name }} Migration
+-- Generated by CodeDNA
+
+CREATE TABLE {{ entity.name | lower | plural }} (
+  id SERIAL PRIMARY KEY,
+{% for field in entity.fields %}
+  {% if field.type.kind === 'primitive' %}
+  {{ field.name }} {{ field.type | sqlType }}{% if field | hasConstraint('required') %} NOT NULL{% endif %}{% if field | hasConstraint('unique') %} UNIQUE{% endif %},
+  {% elif field.type.kind === 'reference' %}
+  {{ field.name }}_id INTEGER{% if field | hasConstraint('required') %} NOT NULL{% endif %} REFERENCES {{ field.type.entity | lower | plural }}(id),
+  {% elif field.type.kind === 'enum' %}
+  {{ field.name }} VARCHAR(50){% if field | hasConstraint('required') %} NOT NULL{% endif %},
+  {% elif field.type.kind === 'array' or field.type.kind === 'json' %}
+  {{ field.name }} {% if options.database === 'postgresql' %}JSONB{% else %}JSON{% endif %}{% if field | hasConstraint('required') %} NOT NULL{% endif %},
+  {% endif %}
+{% endfor %}
+  created_at TIMESTAMP NOT NULL DEFAULT NOW(),
+  updated_at TIMESTAMP NOT NULL DEFAULT NOW()
+);
+
+-- Indexes
+{% for field in entity.fields %}
+{% if field | hasConstraint('index') %}
+CREATE INDEX idx_{{ entity.name | lower }}_{{ field.name }} ON {{ entity.name | lower | plural }}({{ field.name }});
+{% endif %}
+{% if field.type.kind === 'reference' %}
+CREATE INDEX idx_{{ entity.name | lower }}_{{ field.name }}_id ON {{ entity.name | lower | plural }}({{ field.name }}_id);
+{% endif %}
+{% endfor %}
+`;
+    }
+    getDbClientTemplate() {
+        return `// Database Client Configuration
+// Generated by CodeDNA
+
+{% if options.database === 'postgresql' %}
+import { drizzle } from 'drizzle-orm/postgres-js';
+import postgres from 'postgres';
+{% elif options.database === 'mysql' %}
+import { drizzle } from 'drizzle-orm/mysql2';
+import mysql from 'mysql2/promise';
+{% elif options.database === 'sqlite' %}
+import { drizzle } from 'drizzle-orm/better-sqlite3';
+import Database from 'better-sqlite3';
+{% endif %}
+
+import * as schema from './schema';
+
+{% if options.deployment === 'cloudflare' %}
+// Cloudflare D1 binding (set in wrangler.toml)
+declare const DB: D1Database;
+
+export const db = drizzle(DB, { schema });
+{% else %}
+// Database connection
+const connectionString = process.env.DATABASE_URL!;
+
+{% if options.database === 'postgresql' %}
+const queryClient = postgres(connectionString);
+export const db = drizzle(queryClient, { schema });
+{% elif options.database === 'mysql' %}
+const pool = mysql.createPool(connectionString);
+export const db = drizzle(pool, { schema });
+{% elif options.database === 'sqlite' %}
+const sqlite = new Database(connectionString);
+export const db = drizzle(sqlite, { schema });
+{% endif %}
+{% endif %}
+`;
+    }
+    getQueriesTemplate() {
+        return `// {{ entity.name }} Queries
+// Generated by CodeDNA
+
+import { db } from '../db/client';
+import { {{ entity.name | lower }} } from '../db/schema/{{ entity.name | lower }}';
+import { eq, desc } from 'drizzle-orm';
+
+/**
+ * Get all {{ entity.name | plural }}
+ */
+export async function getAll{{ entity.name | plural }}() {
+  return db.select().from({{ entity.name | lower }}).orderBy(desc({{ entity.name | lower }}.createdAt));
+}
+
+/**
+ * Get {{ entity.name }} by ID
+ */
+export async function get{{ entity.name }}ById(id: number) {
+  const result = await db.select().from({{ entity.name | lower }}).where(eq({{ entity.name | lower }}.id, id));
+  return result[0] || null;
+}
+
+/**
+ * Search {{ entity.name | plural }}
+ */
+export async function search{{ entity.name | plural }}(query: string) {
+  // Implement search logic based on your needs
+  return db.select().from({{ entity.name | lower }});
+}
+`;
+    }
+    getMutationsTemplate() {
+        return `// {{ entity.name }} Mutations (Server Actions)
+// Generated by CodeDNA
+
+'use server';
+
+import { db } from '../db/client';
+import { {{ entity.name | lower }}, New{{ entity.name }} } from '../db/schema/{{ entity.name | lower }}';
+import { eq } from 'drizzle-orm';
+import { revalidatePath } from '@tanstack/react-router';
+
+/**
+ * Create new {{ entity.name }}
+ */
+export async function create{{ entity.name }}(data: New{{ entity.name }}) {
+  const result = await db.insert({{ entity.name | lower }}).values(data).returning();
+  revalidatePath('/{{ entity.name | lower }}');
+  return result[0];
+}
+
+/**
+ * Update {{ entity.name }}
+ */
+export async function update{{ entity.name }}(id: number, data: Partial<New{{ entity.name }}>) {
+  const result = await db
+    .update({{ entity.name | lower }})
+    .set({ ...data, updatedAt: new Date() })
+    .where(eq({{ entity.name | lower }}.id, id))
+    .returning();
+
+  revalidatePath('/{{ entity.name | lower }}');
+  revalidatePath(\`/{{ entity.name | lower }}/\${id}\`);
+  return result[0];
+}
+
+/**
+ * Delete {{ entity.name }}
+ */
+export async function delete{{ entity.name }}(id: number) {
+  await db.delete({{ entity.name | lower }}).where(eq({{ entity.name | lower }}.id, id));
+  revalidatePath('/{{ entity.name | lower }}');
+}
+`;
+    }
+    getIndexRouteTemplate() {
+        return `// {{ entity.name }} List Route
+// Generated by CodeDNA
+
+import { createFileRoute } from '@tanstack/react-router';
+import { getAll{{ entity.name | plural }} } from '../../queries/{{ entity.name | lower }}';
+import { {{ entity.name }}List } from '../../components/{{ entity.name }}List';
+
+export const Route = createFileRoute('/{{ entity.name | lower }}/')({
+  loader: async () => {
+    const items = await getAll{{ entity.name | plural }}();
+    return { items };
+  },
+  component: {{ entity.name }}IndexPage,
+});
+
+function {{ entity.name }}IndexPage() {
+  const { items } = Route.useLoaderData();
+
+  return (
+    <div className="container mx-auto p-6">
+      <div className="flex justify-between items-center mb-6">
+        <h1 className="text-3xl font-bold">{{ entity.name | plural }}</h1>
+        <a
+          href="/{{ entity.name | lower }}/create"
+          className="btn btn-primary"
+        >
+          Create {{ entity.name }}
+        </a>
+      </div>
+      <{{ entity.name }}List items={items} />
+    </div>
+  );
+}
+`;
+    }
+    getDetailRouteTemplate() {
+        return `// {{ entity.name }} Detail Route
+// Generated by CodeDNA
+
+import { createFileRoute } from '@tanstack/react-router';
+import { get{{ entity.name }}ById } from '../../queries/{{ entity.name | lower }}';
+import { notFound } from '@tanstack/react-router';
+
+export const Route = createFileRoute('/{{ entity.name | lower }}/$id')({
+  loader: async ({ params }) => {
+    const item = await get{{ entity.name }}ById(Number(params.id));
+    if (!item) throw notFound();
+    return { item };
+  },
+  component: {{ entity.name }}DetailPage,
+});
+
+function {{ entity.name }}DetailPage() {
+  const { item } = Route.useLoaderData();
+
+  return (
+    <div className="container mx-auto p-6">
+      <h1 className="text-3xl font-bold mb-6">{{ entity.name }} Details</h1>
+      <div className="card">
+        {% for field in entity.fields %}
+        <div className="mb-4">
+          <label className="font-semibold">{{ field.name | capitalize }}:</label>
+          <p>{item.{{ field.name }}}</p>
+        </div>
+        {% endfor %}
+      </div>
+      <div className="mt-6 flex gap-4">
+        <a href="/{{ entity.name | lower }}/{item.id}/edit" className="btn btn-secondary">
+          Edit
+        </a>
+        <a href="/{{ entity.name | lower }}" className="btn">
+          Back to List
+        </a>
+      </div>
+    </div>
+  );
+}
+`;
+    }
+    getCreateRouteTemplate() {
+        return `// {{ entity.name }} Create Route
+// Generated by CodeDNA
+
+import { createFileRoute, useNavigate } from '@tanstack/react-router';
+import { {{ entity.name }}Form } from '../../components/{{ entity.name }}Form';
+import { create{{ entity.name }} } from '../../mutations/{{ entity.name | lower }}';
+
+export const Route = createFileRoute('/{{ entity.name | lower }}/create')({
+  component: {{ entity.name }}CreatePage,
+});
+
+function {{ entity.name }}CreatePage() {
+  const navigate = useNavigate();
+
+  const handleSubmit = async (data: any) => {
+    const created = await create{{ entity.name }}(data);
+    navigate({ to: '/{{ entity.name | lower }}/$id', params: { id: created.id.toString() } });
+  };
+
+  return (
+    <div className="container mx-auto p-6">
+      <h1 className="text-3xl font-bold mb-6">Create {{ entity.name }}</h1>
+      <{{ entity.name }}Form onSubmit={handleSubmit} />
+    </div>
+  );
+}
+`;
+    }
+    getEditRouteTemplate() {
+        return `// {{ entity.name }} Edit Route
+// Generated by CodeDNA
+
+import { createFileRoute, useNavigate } from '@tanstack/react-router';
+import { get{{ entity.name }}ById } from '../../../queries/{{ entity.name | lower }}';
+import { update{{ entity.name }} } from '../../../mutations/{{ entity.name | lower }}';
+import { {{ entity.name }}Form } from '../../../components/{{ entity.name }}Form';
+import { notFound } from '@tanstack/react-router';
+
+export const Route = createFileRoute('/{{ entity.name | lower }}/$id/edit')({
+  loader: async ({ params }) => {
+    const item = await get{{ entity.name }}ById(Number(params.id));
+    if (!item) throw notFound();
+    return { item };
+  },
+  component: {{ entity.name }}EditPage,
+});
+
+function {{ entity.name }}EditPage() {
+  const { item } = Route.useLoaderData();
+  const navigate = useNavigate();
+
+  const handleSubmit = async (data: any) => {
+    await update{{ entity.name }}(item.id, data);
+    navigate({ to: '/{{ entity.name | lower }}/$id', params: { id: item.id.toString() } });
+  };
+
+  return (
+    <div className="container mx-auto p-6">
+      <h1 className="text-3xl font-bold mb-6">Edit {{ entity.name }}</h1>
+      <{{ entity.name }}Form initialData={item} onSubmit={handleSubmit} />
+    </div>
+  );
+}
+`;
+    }
+    getListComponentTemplate() {
+        return `// {{ entity.name }} List Component
+// Generated by CodeDNA
+
+import { {{ entity.name }} } from '../types/{{ entity.name | lower }}';
+
+interface {{ entity.name }}ListProps {
+  items: {{ entity.name }}[];
+}
+
+export function {{ entity.name }}List({ items }: {{ entity.name }}ListProps) {
+  return (
+    <div className="overflow-x-auto">
+      <table className="table w-full">
+        <thead>
+          <tr>
+            <th>ID</th>
+            {% for field in entity.fields %}
+            <th>{{ field.name | capitalize }}</th>
+            {% endfor %}
+            <th>Actions</th>
+          </tr>
+        </thead>
+        <tbody>
+          {items.map((item) => (
+            <tr key={item.id}>
+              <td>{item.id}</td>
+              {% for field in entity.fields %}
+              <td>{item.{{ field.name }}}</td>
+              {% endfor %}
+              <td>
+                <a href={\`/{{ entity.name | lower }}/\${item.id}\`} className="btn btn-sm">
+                  View
+                </a>
+              </td>
+            </tr>
+          ))}
+        </tbody>
+      </table>
+    </div>
+  );
+}
+`;
+    }
+    getFormComponentTemplate() {
+        return `// {{ entity.name }} Form Component
+// Generated by CodeDNA
+
+import { useState } from 'react';
+import { {{ entity.name }} } from '../types/{{ entity.name | lower }}';
+
+interface {{ entity.name }}FormProps {
+  initialData?: Partial<{{ entity.name }}>;
+  onSubmit: (data: any) => Promise<void>;
+}
+
+export function {{ entity.name }}Form({ initialData, onSubmit }: {{ entity.name }}FormProps) {
+  const [formData, setFormData] = useState(initialData || {});
+  const [isSubmitting, setIsSubmitting] = useState(false);
+
+  const handleSubmit = async (e: React.FormEvent) => {
+    e.preventDefault();
+    setIsSubmitting(true);
+    try {
+      await onSubmit(formData);
+    } finally {
+      setIsSubmitting(false);
+    }
+  };
+
+  return (
+    <form onSubmit={handleSubmit} className="space-y-4">
+      {% for field in entity.fields %}
+      {% if field.type.kind === 'primitive' %}
+      <div>
+        <label className="label">{{ field.name | capitalize }}</label>
+        <input
+          type="{% if field.type.value === 'email' %}email{% elif field.type.value === 'url' %}url{% elif field.type.value === 'integer' or field.type.value === 'decimal' %}number{% else %}text{% endif %}"
+          className="input w-full"
+          value={formData.{{ field.name }} || ''}
+          onChange={(e) => setFormData({ ...formData, {{ field.name }}: e.target.value })}
+          {% if field | hasConstraint('required') %}required{% endif %}
+        />
+      </div>
+      {% elif field.type.kind === 'enum' %}
+      <div>
+        <label className="label">{{ field.name | capitalize }}</label>
+        <select
+          className="select w-full"
+          value={formData.{{ field.name }} || ''}
+          onChange={(e) => setFormData({ ...formData, {{ field.name }}: e.target.value })}
+          {% if field | hasConstraint('required') %}required{% endif %}
+        >
+          <option value="">Select {{ field.name }}</option>
+          {% for value in field.type.values %}
+          <option value="{{ value }}">{{ value | capitalize }}</option>
+          {% endfor %}
+        </select>
+      </div>
+      {% endif %}
+      {% endfor %}
+
+      <div className="flex gap-4">
+        <button type="submit" className="btn btn-primary" disabled={isSubmitting}>
+          {isSubmitting ? 'Saving...' : 'Save'}
+        </button>
+        <a href="/{{ entity.name | lower }}" className="btn">
+          Cancel
+        </a>
+      </div>
+    </form>
+  );
+}
+`;
+    }
+    getTypesTemplate() {
+        return `// {{ entity.name }} Types
+// Generated by CodeDNA
+
+export interface {{ entity.name }} {
+  id: number;
+  {% for field in entity.fields %}
+  {{ field.name }}: {{ field.type | tsType }}{% if not (field | hasConstraint('required')) %} | null{% endif %};
+  {% endfor %}
+  createdAt: Date;
+  updatedAt: Date;
+}
+
+export type New{{ entity.name }} = Omit<{{ entity.name }}, 'id' | 'createdAt' | 'updatedAt'>;
+`;
+    }
+    getWranglerConfigTemplate() {
+        return `# Wrangler Configuration for Cloudflare
+# Generated by CodeDNA
+
+name = "{{ options.projectName || 'tanstack-app' }}"
+main = "src/index.ts"
+compatibility_date = "2024-12-01"
+
+[[ d1_databases ]]
+binding = "DB"
+database_name = "{{ options.database || 'app' }}"
+database_id = "{{ options.databaseId || 'YOUR_DATABASE_ID' }}"
+
+[[ kv_namespaces ]]
+binding = "KV"
+id = "{{ options.kvId || 'YOUR_KV_ID' }}"
+`;
+    }
+    getDrizzleConfigTemplate() {
+        return `// Drizzle Configuration
+// Generated by CodeDNA
+
+import type { Config } from 'drizzle-kit';
+
+export default {
+  schema: './src/db/schema',
+  out: './drizzle/migrations',
+  {% if options.database === 'postgresql' %}
+  driver: 'pg',
+  {% elif options.database === 'mysql' %}
+  driver: 'mysql2',
+  {% elif options.database === 'sqlite' %}
+  driver: 'better-sqlite',
+  {% endif %}
+  dbCredentials: {
+    {% if options.database === 'postgresql' %}
+    connectionString: process.env.DATABASE_URL!,
+    {% elif options.database === 'mysql' %}
+    connectionString: process.env.DATABASE_URL!,
+    {% elif options.database === 'sqlite' %}
+    url: process.env.DATABASE_URL!,
+    {% endif %}
+  },
+} satisfies Config;
+`;
+    }
+    getPackageJsonTemplate() {
+        return `{
+  "name": "{{ options.projectName || 'tanstack-drizzle-app' }}",
+  "version": "0.1.0",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "dev": "vinxi dev",
+    "build": "vinxi build",
+    "start": "vinxi start",
+    "db:generate": "drizzle-kit generate",
+    "db:migrate": "drizzle-kit migrate",
+    "db:push": "drizzle-kit push",
+    "db:studio": "drizzle-kit studio"
+  },
+  "dependencies": {
+    "@tanstack/react-router": "^1.80.0",
+    "@tanstack/start": "^1.80.0",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    {% if options.database === 'postgresql' %}
+    "drizzle-orm": "^0.38.0",
+    "postgres": "^3.4.5",
+    {% elif options.database === 'mysql' %}
+    "drizzle-orm": "^0.38.0",
+    "mysql2": "^3.11.5",
+    {% elif options.database === 'sqlite' %}
+    "drizzle-orm": "^0.38.0",
+    "better-sqlite3": "^11.8.1",
+    {% endif %}
+    "vinxi": "^0.4.0"
+  },
+  "devDependencies": {
+    "@types/node": "^22.10.2",
+    "@types/react": "^19.0.0",
+    "@types/react-dom": "^19.0.0",
+    "drizzle-kit": "^0.29.0",
+    "typescript": "^5.7.2",
+    "vite": "^6.0.0"
+  }
+}
+`;
+    }
+}