create-velox-app 0.6.31 → 0.6.52

package/src/templates/source/rsc-auth/app/pages/index.tsx

@@ -0,0 +1,83 @@
+/**
+ * Home Page
+ *
+ * A React Server Component that runs on the server at request time.
+ * For database access, use the API endpoints at /api/*.
+ */
+
+export default function HomePage() {
+  return (
+    <div className="home-page">
+      <header className="hero">
+        <h1>Welcome to VeloxTS</h1>
+        <p className="tagline">Full-stack React Server Components with Authentication</p>
+      </header>
+
+      <section className="quick-links">
+        <h2>Quick Links</h2>
+        <ul>
+          <li>
+            <a href="/auth/login">Login</a>
+          </li>
+          <li>
+            <a href="/auth/register">Register</a>
+          </li>
+          <li>
+            <a href="/dashboard">Dashboard</a> (requires login)
+          </li>
+          <li>
+            <a href="/users">Users</a>
+          </li>
+        </ul>
+      </section>
+
+      <section className="api-endpoints">
+        <h2>API Endpoints</h2>
+        <ul>
+          <li>
+            <code>GET /api/health</code> - Health check
+          </li>
+          <li>
+            <code>POST /api/auth/register</code> - Create account
+          </li>
+          <li>
+            <code>POST /api/auth/login</code> - Get tokens
+          </li>
+          <li>
+            <code>GET /api/auth/me</code> - Current user (protected)
+          </li>
+          <li>
+            <code>GET /api/users</code> - List users
+          </li>
+        </ul>
+      </section>
+
+      <section className="features">
+        <h2>Features</h2>
+        <ul>
+          <li>
+            <strong>JWT Authentication</strong> - Access and refresh tokens
+          </li>
+          <li>
+            <strong>Rate Limiting</strong> - Built-in protection for auth endpoints
+          </li>
+          <li>
+            <strong>Password Validation</strong> - Strength requirements enforced
+          </li>
+          <li>
+            <strong>Role-Based Access</strong> - Authorization via guards
+          </li>
+          <li>
+            <strong>Server Actions</strong> - Type-safe with validated() helper
+          </li>
+        </ul>
+      </section>
+
+      <footer className="cta">
+        <p>
+          Edit <code>app/pages/index.tsx</code> to customize this page.
+        </p>
+      </footer>
+    </div>
+  );
+}

package/src/templates/source/rsc-auth/app/pages/users.tsx

@@ -0,0 +1,47 @@
+/**
+ * Users Page (RSC)
+ *
+ * A React Server Component listing users.
+ * For database access, use the API endpoint at /api/users.
+ */
+
+export default function UsersPage() {
+  return (
+    <div style={{ padding: '2rem', maxWidth: '800px', margin: '0 auto' }}>
+      <h1>Users</h1>
+      <p style={{ color: '#666' }}>
+        Fetch user data from the API at <code>/api/users</code>
+      </p>
+
+      <div
+        style={{ marginTop: '2rem', padding: '1rem', background: '#f5f5f5', borderRadius: '8px' }}
+      >
+        <h3>API Usage</h3>
+        <pre
+          style={{
+            background: '#1e1e1e',
+            color: '#d4d4d4',
+            padding: '1rem',
+            borderRadius: '4px',
+            overflow: 'auto',
+          }}
+        >
+          {`// Fetch users from the API
+const response = await fetch('/api/users');
+const users = await response.json();
+
+// Or use the typed client
+import { createClient } from '@veloxts/client';
+const client = createClient('/api');
+const users = await client.users.list();`}
+        </pre>
+      </div>
+
+      <div style={{ marginTop: '2rem' }}>
+        <a href="/" style={{ color: '#007bff' }}>
+          &larr; Back to Home
+        </a>
+      </div>
+    </div>
+  );
+}

package/src/templates/source/rsc-auth/app.config.ts

@@ -0,0 +1,12 @@
+/**
+ * Vinxi Application Configuration
+ *
+ * VeloxTS full-stack application with React Server Components.
+ * All options have sensible defaults - only specify what you need to change.
+ */
+
+import { defineVeloxApp } from '@veloxts/web';
+
+export default defineVeloxApp({
+  port: __API_PORT__,
+});

package/src/templates/source/rsc-auth/docker-compose.yml

@@ -0,0 +1,21 @@
+services:
+  postgres:
+    image: postgres:16-alpine
+    container_name: __PROJECT_NAME__-postgres
+    restart: unless-stopped
+    environment:
+      POSTGRES_USER: ${DATABASE_USER:-user}
+      POSTGRES_PASSWORD: ${DATABASE_PASSWORD:-password}
+      POSTGRES_DB: ${DATABASE_NAME:-__PROJECT_NAME__}
+    ports:
+      - "${DATABASE_PORT:-5432}:5432"
+    volumes:
+      - postgres_data:/var/lib/postgresql/data
+    healthcheck:
+      test: ["CMD-SHELL", "pg_isready -U ${DATABASE_USER:-user} -d ${DATABASE_NAME:-__PROJECT_NAME__}"]
+      interval: 10s
+      timeout: 5s
+      retries: 5
+
+volumes:
+  postgres_data:

package/src/templates/source/rsc-auth/env.example

@@ -0,0 +1,11 @@
+# Database
+DATABASE_URL="__DATABASE_URL__"
+
+# JWT Secrets (REQUIRED for production)
+# Generate with: openssl rand -base64 64
+JWT_SECRET="development-only-jwt-secret-at-least-64-characters-long-change-in-prod"
+JWT_REFRESH_SECRET="development-only-refresh-secret-at-least-64-chars-long-change-prod"
+
+# Server
+NODE_ENV="development"
+PORT=__API_PORT__

package/src/templates/source/rsc-auth/gitignore

@@ -0,0 +1,34 @@
+# Dependencies
+node_modules/
+
+# Build output
+dist/
+.vinxi/
+.output/
+
+# Database
+*.db
+*.db-journal
+
+# Environment
+.env
+.env.local
+.env.*.local
+
+# IDE
+.vscode/
+.idea/
+*.swp
+*.swo
+
+# OS
+.DS_Store
+Thumbs.db
+
+# Logs
+*.log
+npm-debug.log*
+pnpm-debug.log*
+
+# TypeScript
+*.tsbuildinfo

package/src/templates/source/rsc-auth/package.json

@@ -0,0 +1,44 @@
+{
+  "name": "__PROJECT_NAME__",
+  "version": "0.0.1",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "dev": "vinxi dev --port __API_PORT__",
+    "build": "vinxi build",
+    "start": "vinxi start --port __API_PORT__",
+    "db:generate": "prisma generate",
+    "db:push": "prisma db push",
+    "db:migrate": "prisma migrate dev",
+    "db:studio": "prisma studio",
+    "type-check": "tsc --noEmit",
+    "lint:client": "./scripts/check-client-imports.sh"
+  },
+  "dependencies": {
+    "@prisma/adapter-better-sqlite3": "7.2.0",
+    "@prisma/client": "7.2.0",
+    "@prisma/client-runtime-utils": "7.2.0",
+    "better-sqlite3": "12.5.0",
+    "@veloxts/auth": "__VELOXTS_VERSION__",
+    "@veloxts/core": "__VELOXTS_VERSION__",
+    "@veloxts/orm": "__VELOXTS_VERSION__",
+    "@veloxts/router": "__VELOXTS_VERSION__",
+    "@veloxts/validation": "__VELOXTS_VERSION__",
+    "@veloxts/web": "__VELOXTS_VERSION__",
+    "@vinxi/server-functions": "0.5.1",
+    "bcrypt": "6.0.0",
+    "dotenv": "17.2.3",
+    "react": "19.2.3",
+    "react-dom": "19.2.3",
+    "vinxi": "0.5.10",
+    "zod": "3.25.76"
+  },
+  "devDependencies": {
+    "@types/bcrypt": "5.0.2",
+    "@types/node": "25.0.3",
+    "@types/react": "19.2.7",
+    "@types/react-dom": "19.2.3",
+    "prisma": "7.2.0",
+    "typescript": "5.9.3"
+  }
+}

package/src/templates/source/rsc-auth/prisma/schema.prisma

@@ -0,0 +1,23 @@
+// Prisma Schema for VeloxTS RSC with Auth
+// Database: __DATABASE_PROVIDER__
+
+generator client {
+  provider = "prisma-client-js"
+  output   = "../node_modules/.prisma/client"
+}
+
+datasource db {
+  provider = "__DATABASE_PROVIDER__"
+}
+
+model User {
+  id        String   @id @default(uuid())
+  email     String   @unique
+  name      String?
+  password  String?  // Hashed password (nullable for OAuth users)
+  roles     String?  @default("[\"user\"]") // JSON array of roles
+  createdAt DateTime @default(now())
+  updatedAt DateTime @updatedAt
+
+  @@map("users")
+}

package/src/templates/source/rsc-auth/prisma.config.ts

@@ -0,0 +1,22 @@
+/**
+ * Prisma Configuration (Prisma 7.x)
+ *
+ * Database URL is configured here instead of schema.prisma.
+ */
+
+import 'dotenv/config';
+
+import { defineConfig } from 'prisma/config';
+
+const databaseUrl = process.env.DATABASE_URL;
+
+if (!databaseUrl) {
+  throw new Error('DATABASE_URL environment variable is required');
+}
+
+export default defineConfig({
+  schema: './prisma/schema.prisma',
+  datasource: {
+    url: databaseUrl,
+  },
+});

package/src/templates/source/rsc-auth/public/favicon.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32">
+  <rect width="32" height="32" rx="6" fill="#6366f1"/>
+  <text x="50%" y="50%" dominant-baseline="central" text-anchor="middle" fill="white" font-family="system-ui" font-weight="bold" font-size="18">V</text>
+</svg>

package/src/templates/source/rsc-auth/src/api/database.ts

@@ -0,0 +1,129 @@
+/**
+ * Database Configuration
+ *
+ * Prisma client instance for database access.
+ * Uses Laravel-style `db` export for consistency.
+ *
+ * Note: Prisma 7 requires using driver adapters for direct database connections.
+ * We explicitly load dotenv here because Vite's SSR module evaluation
+ * doesn't always have access to .env variables.
+ */
+
+import { createRequire } from 'node:module';
+import { dirname, resolve } from 'node:path';
+import { fileURLToPath } from 'node:url';
+
+/* @if sqlite */
+// Type imports (erased at runtime, safe for ESM)
+import type { PrismaBetterSqlite3 as PrismaBetterSqlite3Type } from '@prisma/adapter-better-sqlite3';
+/* @endif sqlite */
+/* @if postgresql */
+// Type imports (erased at runtime, safe for ESM)
+import type { PrismaPg as PrismaPgType } from '@prisma/adapter-pg';
+/* @endif postgresql */
+import type { PrismaClient as PrismaClientType } from '@prisma/client';
+import dotenv from 'dotenv';
+
+// Runtime imports using createRequire for Node.js v24+ CJS interop
+const require = createRequire(import.meta.url);
+/* @if sqlite */
+const { PrismaBetterSqlite3 } = require('@prisma/adapter-better-sqlite3') as {
+  PrismaBetterSqlite3: typeof PrismaBetterSqlite3Type;
+};
+/* @endif sqlite */
+/* @if postgresql */
+const { PrismaPg } = require('@prisma/adapter-pg') as {
+  PrismaPg: typeof PrismaPgType;
+};
+/* @endif postgresql */
+const { PrismaClient } = require('@prisma/client') as {
+  PrismaClient: typeof PrismaClientType;
+};
+
+// Get the project root directory (2 levels up from src/api/)
+const __dirname = dirname(fileURLToPath(import.meta.url));
+const projectRoot = resolve(__dirname, '..', '..');
+
+// Load .env file explicitly for Vite SSR compatibility
+// Use project root for reliable path resolution
+dotenv.config({ path: resolve(projectRoot, '.env') });
+
+declare global {
+  // Allow global `var` declarations for hot reload in development
+  // eslint-disable-next-line no-var
+  var __db: PrismaClient | undefined;
+}
+
+/* @if sqlite */
+/**
+ * Create a Prisma client instance using the SQLite adapter.
+ *
+ * Prisma 7 Breaking Change:
+ * - `datasourceUrl` and `datasources` options removed from PrismaClient
+ * - Must use driver adapters for direct database connections
+ * - Validates that DATABASE_URL is set before creating the client
+ */
+function createPrismaClient(): PrismaClient {
+  const databaseUrl = process.env.DATABASE_URL;
+
+  if (!databaseUrl) {
+    throw new Error(
+      '[VeloxTS] DATABASE_URL environment variable is not set. ' +
+        'Ensure .env file exists in project root with DATABASE_URL defined.'
+    );
+  }
+
+  // Prisma 7 requires driver adapters for direct connections
+  const adapter = new PrismaBetterSqlite3({ url: databaseUrl });
+  return new PrismaClient({ adapter });
+}
+/* @endif sqlite */
+/* @if postgresql */
+/**
+ * Create a Prisma client instance using the PostgreSQL adapter.
+ *
+ * Prisma 7 Breaking Change:
+ * - PrismaPg now takes connectionString directly (not a Pool instance)
+ * - Pool management is handled internally by the adapter
+ */
+function createPrismaClient(): PrismaClient {
+  const connectionString = process.env.DATABASE_URL;
+
+  if (!connectionString) {
+    throw new Error(
+      '[VeloxTS] DATABASE_URL environment variable is not set. ' +
+        'Ensure .env file exists in project root with DATABASE_URL defined.'
+    );
+  }
+
+  // Prisma 7: Pass connectionString directly to PrismaPg (not a Pool)
+  const adapter = new PrismaPg({ connectionString });
+  return new PrismaClient({ adapter });
+}
+/* @endif postgresql */
+
+/* @if sqlite */
+// Use global singleton for hot reload in development
+export const db = globalThis.__db ?? createPrismaClient();
+
+if (process.env.NODE_ENV !== 'production') {
+  globalThis.__db = db;
+}
+/* @endif sqlite */
+/* @if postgresql */
+// Use global singleton for hot reload in development
+export const db = globalThis.__db ?? createPrismaClient();
+
+if (process.env.NODE_ENV !== 'production') {
+  globalThis.__db = db;
+}
+
+// Graceful shutdown - disconnect Prisma on process exit
+const shutdown = async () => {
+  await db.$disconnect();
+  process.exit(0);
+};
+
+process.on('SIGTERM', shutdown);
+process.on('SIGINT', shutdown);
+/* @endif postgresql */

package/src/templates/source/rsc-auth/src/api/handler.ts

@@ -0,0 +1,85 @@
+/**
+ * API Handler with Authentication
+ *
+ * This creates the Fastify API handler that gets embedded in Vinxi.
+ * All routes under /api/* are handled by this Fastify instance.
+ * Includes JWT authentication via @veloxts/auth.
+ */
+
+import { authPlugin } from '@veloxts/auth';
+import { veloxApp } from '@veloxts/core';
+import { databasePlugin } from '@veloxts/orm';
+import { rest } from '@veloxts/router';
+import { createH3ApiHandler } from '@veloxts/web/adapters';
+
+import { db } from './database.js';
+import { authProcedures } from './procedures/auth.js';
+import { healthProcedures } from './procedures/health.js';
+import { userProcedures } from './procedures/users.js';
+import { getJwtSecrets, parseUserRoles, tokenStore } from './utils/auth.js';
+
+// Export router type for frontend type safety
+const router = { health: healthProcedures, users: userProcedures, auth: authProcedures };
+export type AppRouter = typeof router;
+
+/**
+ * Create auth configuration for the embedded API.
+ */
+function createAuthConfig() {
+  const { jwtSecret, refreshSecret } = getJwtSecrets();
+
+  return {
+    jwt: {
+      secret: jwtSecret,
+      refreshSecret: refreshSecret,
+      accessTokenExpiry: '15m',
+      refreshTokenExpiry: '7d',
+      issuer: 'velox-app',
+      audience: 'velox-app-client',
+    },
+    userLoader: async (userId: string) => {
+      const user = await db.user.findUnique({
+        where: { id: userId },
+      });
+
+      if (!user) return null;
+
+      return {
+        id: user.id,
+        email: user.email,
+        name: user.name,
+        roles: parseUserRoles(user.roles),
+      };
+    },
+    isTokenRevoked: async (jti: string) => tokenStore.isRevoked(jti),
+    rateLimit: {
+      max: 100,
+      windowMs: 60000,
+    },
+  };
+}
+
+/**
+ * Export the h3 event handler for Vinxi embedding.
+ */
+export default createH3ApiHandler({
+  app: async () => {
+    const app = await veloxApp();
+
+    // Register database plugin
+    await app.register(databasePlugin({ client: db }));
+
+    // Register auth plugin for JWT verification
+    await app.register(authPlugin(createAuthConfig()));
+
+    // Register REST routes from procedures
+    app.routes(
+      rest([healthProcedures, userProcedures, authProcedures], {
+        prefix: '', // No prefix - Vinxi handles /api/*
+      })
+    );
+
+    return app.server;
+  },
+  basePath: '/api',
+});