create-ej-app 16.0.0 → 17.0.0

package/README.md

@@ -1,6 +1,6 @@
 # create-ej-app
 
-A no-bullshit CLI to bootstrap a production-ready **fucking beast** of a app with Next.js, Better Auth, Drizzle ORM, Elysia, Workflow, shadcn/ui, React Email, and deployment wired up so you don’t screw your shit up in production.
+A no-bullshit CLI to bootstrap a production-ready **fucking beast** of a app with Next.js, Better Auth, Drizzle ORM, Elysia, Workflow, shadcn/ui, React Email, OTEL, and deployment wired up so you don’t screw your shit up in production.
 
 ```bash
 bunx create-ej-app@latest
@@ -11,6 +11,7 @@ bunx create-ej-app@latest
 ## ✨ Features (aka the good shit)
 
 - **Next.js 16** – Powered by React 19, Server Components, App Router. Fast as hell.
+
 - **Better Auth** – Auth that doesn’t suck:
   - Email/Password
   - Magic link (because passwords are annoying as fuck)
@@ -19,15 +20,31 @@ bunx create-ej-app@latest
   - Admin powers
 
 - **Drizzle ORM** – Type-safe SQL over PostgreSQL without the usual ORM garbage.
+
 - **Elysia** – Built for Bun. Minimal, fast, no nonsense.
+
 - **Workflow** – Durable jobs so your background tasks don’t randomly die like weak shit.
+
 - **React Email** – Build transactional emails using React components instead of ugly HTML nightmares.
+
+- **OTEL (OpenTelemetry)** – Production-grade observability:
+  - Distributed tracing
+  - Metrics
+  - Structured logs
+  - Works with GCP, Datadog, Honeycomb, Grafana, etc.
+
 - **shadcn/ui** – Clean, accessible components built on Radix UI.
+
 - **TailwindCSS 4** – Utility-first styling with zero CSS drama.
+
 - **TypeScript** – Strict types so you don’t ship dumb bugs.
+
 - **TanStack Query** – Server state that doesn’t implode.
+
 - **Lucide React** – Icons that don’t look like 2009 garbage.
+
 - **Docker + Terraform** – Ship this shit properly.
+
 - Terraform setup for Google Cloud Platform so you don’t YOLO infra.
 
 ---
@@ -68,6 +85,7 @@ Boom. Done.
 - **Database**: PostgreSQL + Drizzle
 - **Auth**: Better Auth
 - **Emails**: React Email (transactional + auth templates ready)
+- **Observability**: OpenTelemetry
 - **Background Jobs**: Workflow
 - **UI**: shadcn/ui
 - **Styling**: TailwindCSS
@@ -232,6 +250,7 @@ MIT. Do whatever the hell you want, just don’t blame us if you screw it up.
   - [Workflow](https://useworkflow.dev)
   - [shadcn/ui](https://ui.shadcn.com)
   - [React Email](https://react.email)
+  - [Logging](https://loggingsucks.com)
 
 ---
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-ej-app",
-  "version": "16.0.0",
+  "version": "17.0.0",
   "description": "Bootstrap a next.js app with my preferred setup",
   "main": "cli.js",
   "scripts": {

package/template/base/package.json

@@ -24,6 +24,8 @@
     "@elysiajs/eden": "1.4.8",
     "@hookform/resolvers": "5.2.2",
     "@next/third-parties": "16.1.6",
+    "@opentelemetry/api": "1.9.0",
+    "@opentelemetry/sdk-trace-base": "2.5.1",
     "@paralleldrive/cuid2": "3.3.0",
     "@radix-ui/react-label": "2.1.8",
     "@radix-ui/react-separator": "1.1.8",
@@ -32,12 +34,13 @@
     "@react-email/render": "2.0.4",
     "@t3-oss/env-nextjs": "0.13.10",
     "@tanstack/react-query": "5.90.21",
+    "@vercel/otel": "2.1.1",
     "better-auth": "1.4.18",
     "class-variance-authority": "0.7.1",
     "clsx": "2.1.1",
     "drizzle-orm": "0.45.1",
     "elysia": "1.4.25",
-    "lucide-react": "0.563.0",
+    "lucide-react": "0.564.0",
     "next": "16.1.6",
     "next-safe-action": "8.0.11",
     "next-themes": "0.4.6",
@@ -48,9 +51,9 @@
     "react-dom": "19.2.4",
     "react-hook-form": "7.71.1",
     "sonner": "2.0.7",
-    "tailwind-merge": "3.4.0",
+    "tailwind-merge": "3.4.1",
     "tw-animate-css": "1.4.0",
-    "workflow": "4.1.0-beta.56",
+    "workflow": "4.1.0-beta.57",
     "zod": "4.3.6"
   },
   "devDependencies": {
@@ -58,7 +61,7 @@
     "@react-email/preview-server": "5.2.8",
     "@tailwindcss/postcss": "4.1.18",
     "@types/bun": "1.3.9",
-    "@types/nodemailer": "7.0.9",
+    "@types/nodemailer": "7.0.10",
     "@types/react": "19.2.14",
     "@types/react-dom": "19.2.3",
     "babel-plugin-react-compiler": "1.0.0",

package/template/base/src/app/not-found.tsx

@@ -1,7 +1,13 @@
+'use client'
+
+import { Button } from '@/components/ui/button'
 import Link from 'next/link'
-import { Button } from '~/components/ui/button'
+import { usePathname } from 'next/navigation'
 
 export default function NotFound() {
+  const pathname = usePathname()
+  const homeRoute = pathname?.startsWith('/admin') ? '/admin' : '/'
+
   return (
     <main className="bg-background text-foreground flex min-h-screen flex-col">
       <section className="flex min-h-[60vh] flex-col items-center justify-center px-4">
@@ -12,7 +18,7 @@ export default function NotFound() {
             The page you're looking for doesn't exist.
           </p>
           <Button asChild>
-            <Link href="/">Return to Home</Link>
+            <Link href={homeRoute}>Return to Home</Link>
           </Button>
         </div>
       </section>

package/template/base/src/instrumentation.ts

@@ -0,0 +1,26 @@
+import { SpanStatusCode } from '@opentelemetry/api'
+import {
+  ConsoleSpanExporter,
+  ReadableSpan,
+  SimpleSpanProcessor
+} from '@opentelemetry/sdk-trace-base'
+import { registerOTel } from '@vercel/otel'
+
+class SmartSamplingSpanProcessor extends SimpleSpanProcessor {
+  onEnd(span: ReadableSpan): void {
+    const isError = span.status.code === SpanStatusCode.ERROR
+    const isSlow = span.duration[0] * 1000 + span.duration[1] / 1e6 > 5000
+    const isLucky = Math.random() < 0 // Adjust this value to adjust the sampling rate for non-error and non-slow spans
+
+    if (isError || isSlow || isLucky) {
+      super.onEnd(span)
+    }
+  }
+}
+
+export function register() {
+  registerOTel({
+    serviceName: 'tdc-ai',
+    spanProcessors: [new SmartSamplingSpanProcessor(new ConsoleSpanExporter())]
+  })
+}

package/template/base/src/lib/otel.ts

@@ -0,0 +1,27 @@
+import { SpanStatusCode, trace } from '@opentelemetry/api'
+
+function getSpan() {
+  const span = trace.getActiveSpan()
+  return span
+}
+
+export function recordWideEvent(attributes: Record<string, any>) {
+  const span = getSpan()
+  if (!span) return
+
+  span.setAttributes(attributes)
+}
+
+export function recordError(err: unknown) {
+  const span = getSpan()
+  if (!span) return
+
+  span.setStatus({
+    code: SpanStatusCode.ERROR,
+    message: err instanceof Error ? err.message : String(err)
+  })
+
+  span.recordException(err instanceof Error ? err : String(err))
+
+  return span.spanContext().traceId
+}

package/template/base/src/lib/safe-action.ts

@@ -1,10 +1,18 @@
 import { createSafeActionClient } from 'next-safe-action'
 import { getAuthSession } from './auth'
+import { recordWideEvent } from './otel'
 
 export const actionClient = createSafeActionClient().use(
   async ({ next, ctx }) => {
     const authSession = await getAuthSession()
 
+    if (authSession)
+      recordWideEvent({
+        'user.id': authSession.user.id,
+        'user.admin': authSession.isAdmin,
+        'session.id': authSession.session.id
+      })
+
     return next({
       ctx: {
         ...ctx,