create-kuckit-app 0.1.1 → 0.2.0

package/templates/base/packages/items-module/src/ui/ItemsPage.tsx

@@ -0,0 +1,162 @@
+import { useState, useEffect } from 'react'
+
+interface Item {
+	id: string
+	name: string
+	description?: string
+	createdAt: Date
+	updatedAt: Date
+}
+
+/**
+ * Items page component
+ * Demonstrates CRUD operations using the items module
+ */
+export function ItemsPage() {
+	const [items, setItems] = useState<Item[]>([])
+	const [newItemName, setNewItemName] = useState('')
+	const [newItemDescription, setNewItemDescription] = useState('')
+	const [loading, setLoading] = useState(true)
+	const [error, setError] = useState<string | null>(null)
+
+	const apiUrl = import.meta.env.VITE_API_URL || 'http://localhost:3000'
+
+	// Fetch items on mount
+	useEffect(() => {
+		fetchItems()
+	}, [])
+
+	const fetchItems = async () => {
+		try {
+			setLoading(true)
+			const response = await fetch(`${apiUrl}/rpc/items.list`, {
+				method: 'POST',
+				headers: { 'Content-Type': 'application/json' },
+				credentials: 'include',
+				body: JSON.stringify({}),
+			})
+			if (response.ok) {
+				const data = await response.json()
+				setItems(data)
+			}
+		} catch {
+			setError('Failed to load items')
+		} finally {
+			setLoading(false)
+		}
+	}
+
+	const createItem = async (e: React.FormEvent) => {
+		e.preventDefault()
+		if (!newItemName.trim()) return
+
+		try {
+			const response = await fetch(`${apiUrl}/rpc/items.create`, {
+				method: 'POST',
+				headers: { 'Content-Type': 'application/json' },
+				credentials: 'include',
+				body: JSON.stringify({
+					name: newItemName,
+					description: newItemDescription || undefined,
+				}),
+			})
+			if (response.ok) {
+				setNewItemName('')
+				setNewItemDescription('')
+				fetchItems()
+			}
+		} catch {
+			setError('Failed to create item')
+		}
+	}
+
+	const deleteItem = async (id: string) => {
+		try {
+			const response = await fetch(`${apiUrl}/rpc/items.delete`, {
+				method: 'POST',
+				headers: { 'Content-Type': 'application/json' },
+				credentials: 'include',
+				body: JSON.stringify({ id }),
+			})
+			if (response.ok) {
+				fetchItems()
+			}
+		} catch {
+			setError('Failed to delete item')
+		}
+	}
+
+	if (loading) {
+		return <div style={{ padding: '2rem' }}>Loading items...</div>
+	}
+
+	return (
+		<div style={{ padding: '2rem', fontFamily: 'system-ui', maxWidth: '600px', margin: '0 auto' }}>
+			<h1>Items</h1>
+
+			{error && (
+				<div style={{ color: 'red', marginBottom: '1rem' }}>
+					{error}
+					<button onClick={() => setError(null)} style={{ marginLeft: '1rem' }}>
+						Dismiss
+					</button>
+				</div>
+			)}
+
+			<form onSubmit={createItem} style={{ marginBottom: '2rem' }}>
+				<div style={{ display: 'flex', flexDirection: 'column', gap: '0.5rem' }}>
+					<input
+						type="text"
+						placeholder="Item name"
+						value={newItemName}
+						onChange={(e) => setNewItemName(e.target.value)}
+						required
+						style={{ padding: '0.5rem', fontSize: '1rem' }}
+					/>
+					<input
+						type="text"
+						placeholder="Description (optional)"
+						value={newItemDescription}
+						onChange={(e) => setNewItemDescription(e.target.value)}
+						style={{ padding: '0.5rem', fontSize: '1rem' }}
+					/>
+					<button type="submit" style={{ padding: '0.5rem 1rem', cursor: 'pointer' }}>
+						Add Item
+					</button>
+				</div>
+			</form>
+
+			<ul style={{ listStyle: 'none', padding: 0 }}>
+				{items.map((item) => (
+					<li
+						key={item.id}
+						style={{
+							padding: '1rem',
+							border: '1px solid #ccc',
+							marginBottom: '0.5rem',
+							borderRadius: '4px',
+							display: 'flex',
+							justifyContent: 'space-between',
+							alignItems: 'center',
+						}}
+					>
+						<div>
+							<strong>{item.name}</strong>
+							{item.description && (
+								<p style={{ margin: '0.5rem 0 0 0', color: '#666' }}>{item.description}</p>
+							)}
+						</div>
+						<button
+							onClick={() => deleteItem(item.id)}
+							style={{ cursor: 'pointer', color: 'red', background: 'none', border: 'none' }}
+						>
+							Delete
+						</button>
+					</li>
+				))}
+			</ul>
+
+			{items.length === 0 && <p>No items yet. Create one above!</p>}
+		</div>
+	)
+}

package/templates/base/packages/items-module/src/usecases/create-item.ts

@@ -0,0 +1,25 @@
+import type { ItemRepository } from '../ports/item.repository'
+import type { Item, CreateItemInput } from '../domain/item.entity'
+
+export interface CreateItemUseCaseInput extends CreateItemInput {
+	userId: string
+}
+
+interface CreateItemDeps {
+	itemRepository: ItemRepository
+}
+
+/**
+ * Create item use case
+ */
+export function makeCreateItem(deps: CreateItemDeps) {
+	return async (input: CreateItemUseCaseInput): Promise<Item> => {
+		const id = crypto.randomUUID()
+		return deps.itemRepository.create({
+			id,
+			name: input.name,
+			description: input.description,
+			userId: input.userId,
+		})
+	}
+}

package/templates/base/packages/items-module/src/usecases/delete-item.ts

@@ -0,0 +1,18 @@
+import type { ItemRepository } from '../ports/item.repository'
+
+export interface DeleteItemInput {
+	id: string
+}
+
+interface DeleteItemDeps {
+	itemRepository: ItemRepository
+}
+
+/**
+ * Delete item use case
+ */
+export function makeDeleteItem(deps: DeleteItemDeps) {
+	return async (input: DeleteItemInput): Promise<boolean> => {
+		return deps.itemRepository.delete(input.id)
+	}
+}

package/templates/base/packages/items-module/src/usecases/get-item.ts

@@ -0,0 +1,19 @@
+import type { ItemRepository } from '../ports/item.repository'
+import type { Item } from '../domain/item.entity'
+
+export interface GetItemInput {
+	id: string
+}
+
+interface GetItemDeps {
+	itemRepository: ItemRepository
+}
+
+/**
+ * Get item use case
+ */
+export function makeGetItem(deps: GetItemDeps) {
+	return async (input: GetItemInput): Promise<Item | null> => {
+		return deps.itemRepository.findById(input.id)
+	}
+}

package/templates/base/packages/items-module/src/usecases/list-items.ts

@@ -0,0 +1,21 @@
+import type { ItemRepository } from '../ports/item.repository'
+import type { Item } from '../domain/item.entity'
+
+export interface ListItemsInput {
+	userId: string
+}
+
+export type ListItemsOutput = Item[]
+
+interface ListItemsDeps {
+	itemRepository: ItemRepository
+}
+
+/**
+ * List items use case
+ */
+export function makeListItems(deps: ListItemsDeps) {
+	return async (input: ListItemsInput): Promise<ListItemsOutput> => {
+		return deps.itemRepository.findByUserId(input.userId)
+	}
+}

package/templates/base/packages/items-module/tsconfig.json

@@ -0,0 +1,9 @@
+{
+	"extends": "../../tsconfig.base.json",
+	"compilerOptions": {
+		"outDir": "dist",
+		"rootDir": "src",
+		"jsx": "react-jsx"
+	},
+	"include": ["src/**/*"]
+}

package/templates/base/turbo.json

@@ -1,8 +1,10 @@
 {
 	"$schema": "https://turbo.build/schema.json",
+	"ui": "tui",
 	"tasks": {
 		"build": {
 			"dependsOn": ["^build"],
+			"inputs": ["$TURBO_DEFAULT$", ".env*"],
 			"outputs": ["dist/**"]
 		},
 		"dev": {
@@ -10,7 +12,17 @@
 			"persistent": true
 		},
 		"check-types": {
-			"dependsOn": ["^build"]
+			"dependsOn": ["^check-types"]
+		},
+		"db:generate": {
+			"cache": false
+		},
+		"db:migrate": {
+			"cache": false
+		},
+		"db:studio": {
+			"cache": false,
+			"persistent": true
 		}
 	}
 }

package/templates/base/apps/web/src/App.tsx

@@ -1,16 +0,0 @@
-export function App() {
-	return (
-		<div style={{ fontFamily: 'system-ui', padding: '2rem' }}>
-			<h1>Welcome to __APP_NAME__</h1>
-			<p>Your Kuckit application is ready!</p>
-			<ul>
-				<li>
-					Server: <a href="http://localhost:3000/health">http://localhost:3000/health</a>
-				</li>
-				<li>
-					Web: <a href="http://localhost:3001">http://localhost:3001</a>
-				</li>
-			</ul>
-		</div>
-	)
-}