create-n8-app 0.1.0

package/template/server/db/schema.ts

@@ -0,0 +1,95 @@
+import {
+  pgTable,
+  text,
+  timestamp,
+  varchar,
+  serial,
+  integer,
+  primaryKey,
+} from 'drizzle-orm/pg-core'
+import type { AdapterAccountType } from 'next-auth/adapters'
+
+// ============================================================================
+// Auth Tables (NextAuth.js / Auth.js)
+// ============================================================================
+
+export const users = pgTable('users', {
+  id: text('id')
+    .primaryKey()
+    .$defaultFn(() => crypto.randomUUID()),
+  name: text('name'),
+  email: text('email').unique(),
+  emailVerified: timestamp('email_verified', { mode: 'date' }),
+  image: text('image'),
+  createdAt: timestamp('created_at', { mode: 'date' }).defaultNow().notNull(),
+  updatedAt: timestamp('updated_at', { mode: 'date' }).defaultNow().notNull(),
+})
+
+export const accounts = pgTable(
+  'accounts',
+  {
+    userId: text('user_id')
+      .notNull()
+      .references(() => users.id, { onDelete: 'cascade' }),
+    type: text('type').$type<AdapterAccountType>().notNull(),
+    provider: text('provider').notNull(),
+    providerAccountId: text('provider_account_id').notNull(),
+    refresh_token: text('refresh_token'),
+    access_token: text('access_token'),
+    expires_at: integer('expires_at'),
+    token_type: text('token_type'),
+    scope: text('scope'),
+    id_token: text('id_token'),
+    session_state: text('session_state'),
+  },
+  (account) => [
+    primaryKey({
+      columns: [account.provider, account.providerAccountId],
+    }),
+  ]
+)
+
+export const sessions = pgTable('sessions', {
+  sessionToken: text('session_token').primaryKey(),
+  userId: text('user_id')
+    .notNull()
+    .references(() => users.id, { onDelete: 'cascade' }),
+  expires: timestamp('expires', { mode: 'date' }).notNull(),
+})
+
+export const verificationTokens = pgTable(
+  'verification_tokens',
+  {
+    identifier: text('identifier').notNull(),
+    token: text('token').notNull(),
+    expires: timestamp('expires', { mode: 'date' }).notNull(),
+  },
+  (verificationToken) => [
+    primaryKey({
+      columns: [verificationToken.identifier, verificationToken.token],
+    }),
+  ]
+)
+
+// ============================================================================
+// Example Application Tables
+// ============================================================================
+
+export const posts = pgTable('posts', {
+  id: serial('id').primaryKey(),
+  title: varchar('title', { length: 256 }).notNull(),
+  content: text('content'),
+  authorId: text('author_id').references(() => users.id, { onDelete: 'set null' }),
+  createdAt: timestamp('created_at', { mode: 'date' }).defaultNow().notNull(),
+  updatedAt: timestamp('updated_at', { mode: 'date' }).defaultNow().notNull(),
+})
+
+// ============================================================================
+// Type Exports
+// ============================================================================
+
+export type User = typeof users.$inferSelect
+export type NewUser = typeof users.$inferInsert
+
+export type Post = typeof posts.$inferSelect
+export type NewPost = typeof posts.$inferInsert

package/template/stores/example-store.ts

@@ -0,0 +1,121 @@
+import { create } from 'zustand'
+import { persist } from 'zustand/middleware'
+
+/**
+ * Example Zustand store for managing global UI state
+ *
+ * Use Zustand for:
+ * - Shopping cart state
+ * - UI state (modals, sidebars, theme)
+ * - User preferences and settings
+ * - Global app state shared across components
+ *
+ * DON'T use Zustand for:
+ * - Server data (use React Query instead)
+ * - Form state (use React Hook Form or local state)
+ * - Local component state (use useState)
+ */
+
+interface UIState {
+  // Sidebar state
+  sidebarOpen: boolean
+  toggleSidebar: () => void
+  setSidebarOpen: (open: boolean) => void
+
+  // Theme state
+  theme: 'light' | 'dark' | 'system'
+  setTheme: (theme: 'light' | 'dark' | 'system') => void
+
+  // Modal state
+  activeModal: string | null
+  openModal: (modalId: string) => void
+  closeModal: () => void
+}
+
+export const useUIStore = create<UIState>()(
+  persist(
+    (set) => ({
+      // Sidebar
+      sidebarOpen: true,
+      toggleSidebar: () => set((state) => ({ sidebarOpen: !state.sidebarOpen })),
+      setSidebarOpen: (open) => set({ sidebarOpen: open }),
+
+      // Theme
+      theme: 'system',
+      setTheme: (theme) => set({ theme }),
+
+      // Modal
+      activeModal: null,
+      openModal: (modalId) => set({ activeModal: modalId }),
+      closeModal: () => set({ activeModal: null }),
+    }),
+    {
+      name: 'ui-storage', // localStorage key
+      partialize: (state) => ({
+        // Only persist these fields
+        sidebarOpen: state.sidebarOpen,
+        theme: state.theme,
+      }),
+    }
+  )
+)
+
+/**
+ * Example cart store (common use case)
+ */
+interface CartItem {
+  id: string
+  name: string
+  price: number
+  quantity: number
+}
+
+interface CartState {
+  items: CartItem[]
+  addItem: (item: Omit<CartItem, 'quantity'>) => void
+  removeItem: (id: string) => void
+  updateQuantity: (id: string, quantity: number) => void
+  clearCart: () => void
+  totalItems: () => number
+  totalPrice: () => number
+}
+
+export const useCartStore = create<CartState>()(
+  persist(
+    (set, get) => ({
+      items: [],
+
+      addItem: (item) =>
+        set((state) => {
+          const existingItem = state.items.find((i) => i.id === item.id)
+          if (existingItem) {
+            return {
+              items: state.items.map((i) =>
+                i.id === item.id ? { ...i, quantity: i.quantity + 1 } : i
+              ),
+            }
+          }
+          return { items: [...state.items, { ...item, quantity: 1 }] }
+        }),
+
+      removeItem: (id) =>
+        set((state) => ({
+          items: state.items.filter((i) => i.id !== id),
+        })),
+
+      updateQuantity: (id, quantity) =>
+        set((state) => ({
+          items: state.items.map((i) => (i.id === id ? { ...i, quantity } : i)),
+        })),
+
+      clearCart: () => set({ items: [] }),
+
+      totalItems: () => get().items.reduce((sum, item) => sum + item.quantity, 0),
+
+      totalPrice: () => get().items.reduce((sum, item) => sum + item.price * item.quantity, 0),
+    }),
+    {
+      name: 'cart-storage',
+    }
+  )
+)

package/template/tests/example.test.ts

@@ -0,0 +1,22 @@
+import { describe, it, expect } from 'vitest'
+
+describe('Example tests', () => {
+  it('should add numbers correctly', () => {
+    expect(1 + 1).toBe(2)
+  })
+
+  it('should handle string concatenation', () => {
+    expect('Hello' + ' ' + 'World').toBe('Hello World')
+  })
+
+  it('should handle arrays', () => {
+    const arr = [1, 2, 3]
+    expect(arr).toHaveLength(3)
+    expect(arr).toContain(2)
+  })
+
+  it('should handle async operations', async () => {
+    const result = await Promise.resolve('success')
+    expect(result).toBe('success')
+  })
+})

package/template/tests/setup.ts

@@ -0,0 +1,22 @@
+import '@testing-library/jest-dom/vitest'
+import { vi } from 'vitest'
+
+// Mock Next.js router
+vi.mock('next/navigation', () => ({
+  useRouter: () => ({
+    push: vi.fn(),
+    replace: vi.fn(),
+    prefetch: vi.fn(),
+    back: vi.fn(),
+  }),
+  usePathname: () => '/',
+  useSearchParams: () => new URLSearchParams(),
+}))
+
+// Mock next-auth
+vi.mock('next-auth/react', () => ({
+  useSession: () => ({ data: null, status: 'unauthenticated' }),
+  signIn: vi.fn(),
+  signOut: vi.fn(),
+  SessionProvider: ({ children }: { children: React.ReactNode }) => children,
+}))

package/template/tsconfig.json

@@ -0,0 +1,27 @@
+{
+  "compilerOptions": {
+    "target": "ES2017",
+    "lib": ["dom", "dom.iterable", "esnext"],
+    "allowJs": true,
+    "skipLibCheck": true,
+    "strict": true,
+    "noEmit": true,
+    "esModuleInterop": true,
+    "module": "esnext",
+    "moduleResolution": "bundler",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "jsx": "preserve",
+    "incremental": true,
+    "plugins": [
+      {
+        "name": "next"
+      }
+    ],
+    "paths": {
+      "@/*": ["./*"]
+    }
+  },
+  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
+  "exclude": ["node_modules"]
+}

package/template/vitest.config.ts

@@ -0,0 +1,30 @@
+import { defineConfig } from 'vitest/config'
+import react from '@vitejs/plugin-react'
+import path from 'path'
+
+export default defineConfig({
+  plugins: [react()],
+  test: {
+    environment: 'jsdom',
+    globals: true,
+    setupFiles: ['./tests/setup.ts'],
+    include: ['**/*.{test,spec}.{ts,tsx}'],
+    exclude: ['node_modules', '.next', 'dist'],
+    coverage: {
+      provider: 'v8',
+      reporter: ['text', 'json', 'html'],
+      exclude: [
+        'node_modules/',
+        '.next/',
+        '**/*.d.ts',
+        'tests/setup.ts',
+        'vitest.config.ts',
+      ],
+    },
+  },
+  resolve: {
+    alias: {
+      '@': path.resolve(__dirname, './'),
+    },
+  },
+})