[V0_FILE]typescript:file="index.ts" isFixed="true" isQuickEdit="true" isMerged="true" #!/usr/bin/env node import { program } from 'commander'; import inquirer from 'inquirer'; import fs from 'fs-extra'; import { execa } from 'execa'; import path from 'path'; import chalk from 'chalk'; import ora from 'ora'; interface ProjectConfig { name: string; version: 'Basic' | 'Advanced'; database?: 'None' | 'PostgreSQL' | 'MySQL' | 'MongoDB'; auth?: 'None' | 'NextAuth.js'; stateManagement?: 'None' | 'Zustand'; } async function ensurePnpmInstalled() { try { await execa('pnpm', ['--version']); } catch (error) { console.error(chalk.red('pnpm is not installed. Please install it first: npm install -g pnpm')); process.exit(1); } } async function createBasicStructure(projectDirectory: string, config: ProjectConfig) { const srcPath = path.join(projectDirectory, 'src'); await fs.ensureDir(srcPath); // Create basic folder structure const folders = ['components', 'core/config', 'core/utils', 'hooks', 'styles', 'types']; for (const folder of folders) { await fs.ensureDir(path.join(srcPath, folder)); } // Create basic files await fs.writeFile(path.join(srcPath, 'core/utils/cn.ts'), ` import { type ClassValue, clsx } from "clsx" import { twMerge } from "tailwind-merge" export function cn(...inputs: ClassValue[]) { return twMerge(clsx(inputs)) } `); await fs.writeFile(path.join(srcPath, 'hooks/use-local-storage.ts'), ` import { useState, useEffect } from 'react' export function useLocalStorage(key: string, initialValue: T): [T, (value: T) => void] { const [storedValue, setStoredValue] = useState(initialValue) useEffect(() => { const item = window.localStorage.getItem(key) if (item) { setStoredValue(JSON.parse(item)) } }, [key]) const setValue = (value: T) => { setStoredValue(value) window.localStorage.setItem(key, JSON.stringify(value)) } return [storedValue, setValue] } `); await fs.writeFile(path.join(srcPath, 'styles/globals.css'), ` @tailwind base; @tailwind components; @tailwind utilities; `); // Create index.ts files const indexFiles = ['components/index.ts', 'hooks/index.ts', 'types/index.ts']; for (const file of indexFiles) { await fs.writeFile(path.join(srcPath, file), ''); } // Add new configuration file await fs.writeFile(path.join(srcPath, 'core/config/project-config.ts'), ` export const projectConfig = ${JSON.stringify(config, null, 2)} `); } async function createAdvancedStructure(projectDirectory: string, config: ProjectConfig) { const srcPath = path.join(projectDirectory, 'src'); await fs.ensureDir(srcPath); // Create advanced folder structure const folders = [ 'app/(routes)/about', 'components/ui', 'components/layout', 'core/config', 'core/utils', 'hooks', 'styles', 'types' ]; for (const folder of folders) { await fs.ensureDir(path.join(srcPath, folder)); } // Create advanced files const files = [ { path: 'app/layout.tsx', content: '' }, { path: 'app/page.tsx', content: '' }, { path: 'app/error.tsx', content: '' }, { path: 'app/loading.tsx', content: '' }, { path: 'app/(routes)/about/page.tsx', content: '' }, { path: 'components/layout/header.tsx', content: '' }, { path: 'components/layout/footer.tsx', content: '' }, { path: 'components/layout/index.ts', content: "export * from './header';\nexport * from './footer';" }, { path: 'core/config/site.ts', content: '' }, { path: 'core/utils/cn.ts', content: ` import { type ClassValue, clsx } from "clsx" import { twMerge } from "tailwind-merge" export function cn(...inputs: ClassValue[]) { return twMerge(clsx(inputs)) } ` }, { path: 'core/utils/generate-uuid.ts', content: ` export function generateUUID() { return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) { var r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8); return v.toString(16); }); } ` }, { path: 'core/utils/index.ts', content: "export * from './cn';\nexport * from './generate-uuid';" }, { path: 'hooks/use-local-storage.ts', content: ` import { useState, useEffect } from 'react' export function useLocalStorage(key: string, initialValue: T): [T, (value: T) => void] { const [storedValue, setStoredValue] = useState(initialValue) useEffect(() => { const item = window.localStorage.getItem(key) if (item) { setStoredValue(JSON.parse(item)) } }, [key]) const setValue = (value: T) => { setStoredValue(value) window.localStorage.setItem(key, JSON.stringify(value)) } return [storedValue, setValue] } ` }, { path: 'hooks/index.ts', content: "export * from './use-local-storage';" }, { path: 'styles/globals.css', content: ` @tailwind base; @tailwind components; @tailwind utilities; ` }, { path: 'types/index.ts', content: '' }, ]; for (const file of files) { await fs.writeFile(path.join(srcPath, file.path), file.content); } // Create root files await fs.writeFile(path.join(projectDirectory, 'next.config.js'), ` /** @type {import('next').NextConfig} */ const nextConfig = { reactStrictMode: true, } module.exports = nextConfig `); await fs.writeFile(path.join(projectDirectory, 'tsconfig.json'), ` { "compilerOptions": { "target": "es5", "lib": ["dom", "dom.iterable", "esnext"], "allowJs": true, "skipLibCheck": true, "strict": true, "forceConsistentCasingInFileNames": true, "noEmit": true, "esModuleInterop": true, "module": "esnext", "moduleResolution": "node", "resolveJsonModule": true, "isolatedModules": true, "jsx": "preserve", "incremental": true, "plugins": [ { "name": "next" } ], "paths": { "@/*": ["./src/*"] } }, "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"], "exclude": ["node_modules"] } `); await fs.writeFile(path.join(projectDirectory, '.env.local'), ''); // Add new configuration file await fs.writeFile(path.join(projectDirectory, 'src/core/config/project-config.ts'), ` export const projectConfig = ${JSON.stringify(config, null, 2)} `); } async function installShadcn(projectDirectory: string) { await execa('pnpm', ['add', '-D', '@shadcn/ui'], { cwd: projectDirectory }); await execa('pnpm', ['dlx', 'shadcn-ui@latest', 'init'], { cwd: projectDirectory }); const uiPath = path.join(projectDirectory, 'src', 'components', 'ui'); await fs.ensureDir(uiPath); await fs.writeFile(path.join(uiPath, 'index.ts'), ''); const components = await inquirer.prompt([ { type: 'checkbox', name: 'selected', message: 'Select shadcn/ui components to install:', choices: ['button', 'card', 'dialog', 'alert'], }, ]); for (const component of components.selected) { await execa('pnpm', ['dlx', 'shadcn-ui@latest', 'add', component], { cwd: projectDirectory }); await fs.appendFile(path.join(uiPath, 'index.ts'), `export * from './${component}';\n`); } } async function installDependencies(projectDirectory: string, config: ProjectConfig) { const spinner = ora('Installing dependencies...').start(); try { if (config.database === 'PostgreSQL') { await execa('pnpm', ['add', 'pg', '@prisma/client'], { cwd: projectDirectory }); await execa('pnpm', ['add', '-D', 'prisma'], { cwd: projectDirectory }); } else if (config.database === 'MySQL') { await execa('pnpm', ['add', 'mysql2', '@prisma/client'], { cwd: projectDirectory }); await execa('pnpm', ['add', '-D', 'prisma'], { cwd: projectDirectory }); } else if (config.database === 'MongoDB') { await execa('pnpm', ['add', 'mongodb', 'mongoose'], { cwd: projectDirectory }); } if (config.auth === 'NextAuth.js') { await execa('pnpm', ['add', 'next-auth'], { cwd: projectDirectory }); } if (config.stateManagement === 'Zustand') { await execa('pnpm', ['add', 'zustand'], { cwd: projectDirectory }); } spinner.succeed('Dependencies installed successfully'); } catch (error) { spinner.fail('Failed to install dependencies'); console.error(chalk.red(error)); } } async function runPostInstallScripts(projectDirectory: string, config: ProjectConfig) { const spinner = ora('Running post-install scripts...').start(); try { if (config.database === 'PostgreSQL' || config.database === 'MySQL') { await execa('pnpm', ['dlx', 'prisma', 'init'], { cwd: projectDirectory }); } spinner.succeed('Post-install scripts completed successfully'); } catch (error) { spinner.fail('Failed to run post-install scripts'); console.error(chalk.red(error)); } } program .version('0.0.3') .argument('', 'The directory to create the project in') .action(async (projectDirectory: string) => { await ensurePnpmInstalled(); const config: ProjectConfig = await inquirer.prompt([ { type: 'input', name: 'name', message: 'What is the name of your project?', default: path.basename(projectDirectory), }, { type: 'list', name: 'version', message: 'Choose your project version:', choices: ['Basic', 'Advanced'], }, { type: 'list', name: 'database', message: 'Choose your database:', choices: ['None', 'PostgreSQL', 'MySQL', 'MongoDB'], }, { type: 'list', name: 'auth', message: 'Choose your authentication method:', choices: ['None', 'NextAuth.js'], }, { type: 'list', name: 'stateManagement', message: 'Choose your state management library:', choices: ['None', 'Zustand'], }, ]); console.log(chalk.blue(`Creating your custom Next.js project (${config.version} version)...`)); const spinner = ora('Setting up project...').start(); try { // Create Next.js app await execa('pnpm', [ 'create', 'next-app@latest', projectDirectory, '--typescript', '--eslint', '--tailwind', '--app', '--src-dir', '--import-alias', '@/*', '--use-pnpm' ]); // Change to project directory process.chdir(projectDirectory); if (config.version === 'Basic') { await createBasicStructure(projectDirectory, config); const { installShadcnUi } = await inquirer.prompt([ { type: 'confirm', name: 'installShadcnUi', message: 'Do you want to install shadcn/ui?', default: false, }, ]); if (installShadcnUi) { await installShadcn(projectDirectory); } } else { await createAdvancedStructure(projectDirectory, config); } spinner.succeed('Project structure created successfully'); await installDependencies(projectDirectory, config); await runPostInstallScripts(projectDirectory, config); console.log(chalk.green(`\nYour custom Next.js project (${config.version} version) with pnpm is ready!`)); console.log(chalk.yellow('\nNext steps:')); console.log(chalk.yellow('1. cd', projectDirectory)); console.log(chalk.yellow('2. pnpm dev')); console.log(chalk.yellow('3. Open http://localhost:3000 in your browser')); console.log(chalk.yellow('\nHappy coding!')); } catch (error) { spinner.fail('Failed to create project'); console.error(chalk.red(error)); } }); program.parse(process.argv); [V0_FILE]javascript:file="lib/installDependencies.js" isMerged="true" const ora = require('ora'); const { execa } = require('execa'); async function installDependencies(projectDirectory, config) { const spinner = ora('Installing dependencies...').start(); try { if (config.database === 'PostgreSQL') { await execa('pnpm', ['add', 'pg', '@prisma/client'], { cwd: projectDirectory }); await execa('pnpm', ['add', '-D', 'prisma'], { cwd: projectDirectory }); } else if (config.database === 'MySQL') { await execa('pnpm', ['add', 'mysql2', '@prisma/client'], { cwd: projectDirectory }); await execa('pnpm', ['add', '-D', 'prisma'], { cwd: projectDirectory }); } else if (config.database === 'MongoDB') { await execa('pnpm', ['add', 'mongodb', 'mongoose'], { cwd: projectDirectory }); } if (config.auth === 'NextAuth.js') { await execa('pnpm', ['add', 'next-auth'], { cwd: projectDirectory }); } if (config.stateManagement === 'Zustand') { await execa('pnpm', ['add', 'zustand'], { cwd: projectDirectory }); } spinner.succeed('Dependencies installed successfully'); } catch (error) { spinner.fail('Failed to install dependencies'); throw error; } } module.exports = { installDependencies }; [V0_FILE]javascript:file="lib/postInstall.js" isMerged="true" const ora = require('ora'); const { execa } = require('execa'); async function runPostInstallScripts(projectDirectory, config) { const spinner = ora('Running post-install scripts...').start(); try { if (config.database === 'PostgreSQL' || config.database === 'MySQL') { await execa('pnpm', ['dlx', 'prisma', 'init'], { cwd: projectDirectory }); } spinner.succeed('Post-install scripts completed successfully'); } catch (error) { spinner.fail('Failed to run post-install scripts'); throw error; } } module.exports = { runPostInstallScripts }; [V0_FILE]javascript:file="lib/installShadcn.js" isMerged="true" const fs = require('fs-extra'); const path = require('path'); const { execa } = require('execa'); const inquirer = require('inquirer'); async function installShadcn(projectDirectory) { await execa('pnpm', ['add', '-D', '@shadcn/ui'], { cwd: projectDirectory }); await execa('pnpm', ['dlx', 'shadcn-ui@latest', 'init'], { cwd: projectDirectory }); const uiPath = path.join(projectDirectory, 'src', 'components', 'ui'); await fs.ensureDir(uiPath); await fs.writeFile(path.join(uiPath, 'index.js'), ''); const components = await inquirer.prompt([ { type: 'checkbox', name: 'selected', message: 'Select shadcn/ui components to install:', choices: ['button', 'card', 'dialog', 'alert'], }, ]); for (const component of components.selected) { await execa('pnpm', ['dlx', 'shadcn-ui@latest', 'add', component], { cwd: projectDirectory }); await fs.appendFile(path.join(uiPath, 'index.js'), `export * from './${component}';\n`); } } module.exports = { installShadcn }; [V0_FILE]javascript:file="lib/utils.js" isMerged="true" const { execa } = require('execa'); async function detectPackageManager() { const managers = ['pnpm', 'yarn', 'npm', 'bun']; for (const manager of managers) { try { await execa(manager, ['--version']); return manager; } catch (error) { // Manager not found, continue to next } } return 'npm'; // Default to npm if nothing else is found } function getInstallCommand(packageManager) { switch (packageManager) { case 'yarn': return 'add'; case 'pnpm': case 'npm': case 'bun': return 'install'; default: throw new Error(`Unsupported package manager: ${packageManager}`); } } async function isGitHubCliInstalled() { try { await execa('gh', ['--version']); return true; } catch (error) { return false; } } module.exports = { detectPackageManager, getInstallCommand, isGitHubCliInstalled }; [V0_FILE]typescriptreact:file="scripts/clear-database.sh" isQuickEdit="true" isMerged="true" #!/bin/bash # Colors RED='\033[0;31m' GREEN='\033[0;32m' YELLOW='\033[1;33m' NC='\033[0m' # No Color # Helper functions print_warning() { echo -e "${YELLOW}WARNING: $1${NC}" } print_error() { echo -e "${RED}ERROR: $1${NC}" } print_success() { echo -e "${GREEN}$1${NC}" } # Determine the database type if [ -f ".env.local" ]; then source .env.local elif [ -f ".env" ]; then source .env else print_error ".env or .env.local file not found" exit 1 fi if [[ $DATABASE_URL == sqlite:* ]]; then DB_TYPE="sqlite" elif [[ $DATABASE_URL == postgres:* ]]; then DB_TYPE="postgres" else print_error "Unsupported database type in DATABASE_URL" exit 1 fi # Function to clear PostgreSQL database clear_postgres() { local mode=$1 local dry_run=$2 local action="Truncating" local sql_command="TRUNCATE TABLE" if [ "$mode" == "drop" ]; then action="Dropping" sql_command="DROP TABLE IF EXISTS" fi if [ "$dry_run" == "true" ]; then print_warning "Dry run: Would $action all tables in PostgreSQL database" PGPASSWORD=$POSTGRES_PASSWORD psql -h localhost -U $POSTGRES_USER -d $POSTGRES_DB -c " SELECT tablename FROM pg_tables WHERE schemaname = 'public'; " else PGPASSWORD=$POSTGRES_PASSWORD psql -h localhost -U $POSTGRES_USER -d $POSTGRES_DB -c " DO \$\$ DECLARE r RECORD; BEGIN FOR r IN (SELECT tablename FROM pg_tables WHERE schemaname = 'public') LOOP EXECUTE '$sql_command ' || quote_ident(r.tablename) || ' CASCADE'; END LOOP; END \$\$; " print_success "All tables ${action,,}." fi } # Function to clear SQLite database clear_sqlite() { local mode=$1 local dry_run=$2 local action="Truncating" local sql_command="DELETE FROM" if [ "$mode" == "drop" ]; then action="Dropping" sql_command="DROP TABLE IF EXISTS" fi if [ "$dry_run" == "true" ]; then print_warning "Dry run: Would $action all tables in SQLite database" sqlite3 database.sqlite "SELECT name FROM sqlite_master WHERE type='table' AND name!='sqlite_sequence';" else sqlite3 database.sqlite " PRAGMA foreign_keys = OFF; BEGIN TRANSACTION; SELECT '$sql_command ' || name || ';' FROM sqlite_master WHERE type='table' AND name!='sqlite_sequence' | while read stmt; do sqlite3 database.sqlite \"\$stmt\"; done; COMMIT; PRAGMA foreign_keys = ON; " print_success "All tables ${action,,}." fi } # Clear the screen clear # Main script echo -e "${YELLOW}Database Clearing Utility${NC}" echo "1) Truncate all tables" echo "2) Remove all tables" echo "3) Dry run (show what would be affected)" read -p "Enter your choice (1, 2, or 3): " choice case $choice in 1) action="truncate" ;; 2) action="drop" ;; 3) action="truncate" dry_run=true ;; *) print_error "Invalid choice. Exiting." exit 1 ;; esac if [ "$dry_run" != "true" ]; then print_warning "This action will permanently affect your database." read -p "Are you sure you want to continue? (y/N): " confirm if [[ $confirm != [yY] ]]; then print_warning "Operation cancelled." exit 0 fi fi if [ "$DB_TYPE" == "postgres" ]; then clear_postgres "$action" "${dry_run:-false}" elif [ "$DB_TYPE" == "sqlite" ]; then clear_sqlite "$action" "${dry_run:-false}" fi [V0_FILE]typescriptreact:file="index.js" isQuickEdit="true" isMerged="true" const { runTestHelper } = require('./lib/testHelper'); // ... (existing imports) const validateProjectName = require('./lib/validateProjectName'); // ... (in the main action function) if (!projectDirectory) { const { inputProjectDirectory } = await inquirer.prompt([ { type: 'input', name: 'inputProjectDirectory', message: 'What is the name of your project?', validate: (input) => { const validation = validateProjectName(input); return validation.valid || validation.problems[0]; } } ]); projectDirectory = inputProjectDirectory; } program .command('test') .description('Run the test helper menu') .action(runTestHelper); [V0_FILE]javascript:file="lib/setupDatabase.js" isFixed="true" isQuickEdit="true" isMerged="true" const fs = require('fs-extra'); const path = require('path'); const { execa } = require('execa'); const chalk = require('chalk'); async function setupPostgresDocker(projectDirectory) { const dockerComposePath = path.join(projectDirectory, 'docker-compose.yml'); const dockerComposeContent = ` version: '3.8' services: db: image: postgres:13 environment: POSTGRES_USER: ${process.env.DB_USER || 'user'} POSTGRES_PASSWORD: ${process.env.DB_PASSWORD || 'password'} POSTGRES_DB: ${process.env.DB_NAME || 'myapp'} ports: - "${process.env.DB_PORT || 5432}:5432" volumes: - postgres_data:/var/lib/postgresql/data volumes: postgres_data: `; await fs.writeFile(dockerComposePath, dockerComposeContent); console.log(chalk.green('Created Docker Compose file for PostgreSQL')); } async function setupSqliteDocker(projectDirectory) { const dockerComposePath = path.join(projectDirectory, 'docker-compose.yml'); const dockerComposeContent = ` version: '3.8' services: db: image: keinos/sqlite3 volumes: - ./data:/data `; await fs.writeFile(dockerComposePath, dockerComposeContent); console.log(chalk.green('Created Docker Compose file for SQLite')); } async function setupPrisma(projectDirectory, config) { await execa('npx', ['prisma', 'init'], { cwd: projectDirectory }); const prismaSchemaPath = path.join(projectDirectory, 'prisma', 'schema.prisma'); let prismaSchema = await fs.readFile(prismaSchemaPath, 'utf-8'); if (config.databaseType === 'PostgreSQL') { prismaSchema = prismaSchema.replace('provider = "postgresql"', 'provider = "postgresql"\n url = env("DATABASE_URL")'); } else if (config.databaseType === 'SQLite') { prismaSchema = prismaSchema.replace('provider = "sqlite"', 'provider = "sqlite"\n url = "file:./dev.db"'); } await fs.writeFile(prismaSchemaPath, prismaSchema); console.log(chalk.green('Prisma schema updated')); } async function setupDrizzle(projectDirectory, config) { await execa('npm', ['install', 'drizzle-orm', 'pg'], { cwd: projectDirectory }); await execa('npm', ['install', '-D', 'drizzle-kit'], { cwd: projectDirectory }); const drizzleConfigPath = path.join(projectDirectory, 'drizzle.config.ts'); const drizzleConfigContent = ` import type { Config } from 'drizzle-kit'; export default { schema: './src/db/schema.ts', out: './drizzle', } satisfies Config; `; await fs.writeFile(drizzleConfigPath, drizzleConfigContent); console.log(chalk.green('Drizzle configuration created')); } module.exports = { setupPostgresDocker, setupSqliteDocker, setupPrisma, setupDrizzle }; [V0_FILE]javascript:file="lib/createProject.js" isFixed="true" isQuickEdit="true" isMerged="true" const fs = require('fs-extra'); const path = require('path'); const ora = require('ora'); const { execa } = require('execa'); const chalk = require('chalk'); const inquirer = require('inquirer'); const { getInstallCommand, isGitHubCliInstalled } = require('./utils'); const { createBasicStructure, createAdvancedStructure } = require('./createStructure'); const { setupPrisma, setupDrizzle } = require('./setupDatabase'); const { chmod } = require('fs/promises'); const { testDatabaseConnection } = require('./testDatabaseConnection'); async function setupApiLayer(projectDirectory, config) { if (config.databaseType === 'PostgreSQL') { await setupPostgresDocker(projectDirectory); config.databaseUrl = 'postgresql://user:password@localhost:5432/myapp'; // Update with actual values } else if (config.databaseType === 'SQLite') { await setupSqliteDocker(projectDirectory); config.databaseUrl = './data/database.sqlite'; // Update with actual path } if (config.ormChoice === 'Prisma') { await setupPrisma(projectDirectory, config); } else if (config.ormChoice === 'Drizzle') { await setupDrizzle(projectDirectory, config); } await createEnvFile(projectDirectory, config); await updateReadme(projectDirectory); } async function createProject(projectDirectory, config) { console.log(chalk.blue(`Creating your custom Next.js project (${config.version} version)...`)); const spinner = ora('Setting up project...').start(); try { // ... (previous project creation steps remain unchanged) // Set up shadcn/ui await setupShadcnUi(projectDirectory, config); // ... (rest of the function remains unchanged) console.log(chalk.green('🎉 Setup finished successfully!')); } catch (error) { spinner.fail('Failed to create project'); console.error(chalk.red('Error details:'), error.message); if (error.stack) { console.error(chalk.gray('Stack trace:'), error.stack); } process.exit(1); } } async function setupShadcnUi(projectDirectory, config) { const spinner = ora('Setting up shadcn/ui...').start(); try { // Determine the correct command based on the package manager let initCommand; switch (config.packageManager) { case 'npm': initCommand = 'npx shadcn@latest init -d'; break; case 'yarn': initCommand = 'yarn dlx shadcn@latest init -d'; break; case 'pnpm': initCommand = 'pnpm dlx shadcn@latest init -d'; break; case 'bun': initCommand = 'bunx --bun shadcn@latest init -d'; break; default: initCommand = 'npx shadcn@latest init -d'; } // Run the shadcn/ui init command await execa.command(initCommand, { cwd: projectDirectory, stdio: 'inherit' }); // Remove the existing components.json file await fs.remove(path.join(projectDirectory, 'components.json')); // Create a new components.json file with the specified content const componentsJsonContent = { "$schema": "https://ui.shadcn.com/schema.json", "style": "new-york", "rsc": true, "tsx": true, "tailwind": { "config": "tailwind.config.ts", "css": "styles/app.css", "baseColor": "neutral", "cssVariables": true, "prefix": "" }, "aliases": { "components": "@/shared/components", "utils": "@/shared/helpers", "ui": "@/shared/components/ui", "lib": "@/shared/helpers", "hooks": "@/shared/hooks" }, "iconLibrary": "lucide" }; await fs.writeJson(path.join(projectDirectory, 'components.json'), componentsJsonContent, { spaces: 2 }); spinner.succeed('shadcn/ui setup completed successfully'); } catch (error) { spinner.fail('Failed to set up shadcn/ui'); throw error; } } module.exports = { createProject, setupApiLayer }; [V0_FILE]typescriptreact:file="scripts/add-alias.sh" isQuickEdit="true" isMerged="true" #!/bin/bash # Colors RED='\033[0;31m' GREEN='\033[0;32m' YELLOW='\033[1;33m' NC='\033[0m' # No Color # Check if fzf is installed if ! command -v fzf &> /dev/null; then echo -e "${RED}Error: fzf is not installed. Please install it to use this script.${NC}" # Detect OS if [[ "$OSTYPE" == "darwin"* ]]; then # macOS echo "You're using macOS. You can install fzf using Homebrew:" echo " 1. Install Homebrew (if not already installed):" echo " /bin/bash -c \"\$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)\"" echo " 2. Then install fzf:" echo " brew install fzf" elif [[ "$OSTYPE" == "linux-gnu"* ]]; then # Linux if command -v apt-get &> /dev/null; then echo "You're using a Debian-based Linux. You can install fzf using apt:" echo " sudo apt-get update && sudo apt-get install fzf" elif command -v yum &> /dev/null; then echo "You're using a Red Hat-based Linux. You can install fzf using yum:" echo " sudo yum install fzf" elif command -v pacman &> /dev/null; then echo "You're using an Arch-based Linux. You can install fzf using pacman:" echo " sudo pacman -S fzf" else echo "Unable to determine your package manager. Please install fzf manually." fi else echo "Unable to determine your operating system." fi echo "For more options, visit https://github.com/junegunn/fzf#installation" exit 1 fi # Function to add alias to tsconfig.json add_alias_to_tsconfig() { local alias=$1 local path=$2 local tsconfig_file="tsconfig.json" # Check if tsconfig.json exists if [ ! -f "$tsconfig_file" ]; then echo -e "${RED}Error: tsconfig.json not found in the current directory.${NC}" exit 1 fi # Add alias to tsconfig.json tmp=$(mktemp) jq --arg alias "$alias" --arg path "$path" '.compilerOptions.paths += {($alias): [$path]}' "$tsconfig_file" > "$tmp" && mv "$tmp" "$tsconfig_file" echo -e "${GREEN}Alias '$alias' -> '$path' added to tsconfig.json${NC}" } # Main script echo -e "${YELLOW}Add Custom Alias to tsconfig.json${NC}" # Prompt for alias name read -p "Enter the alias name (e.g., @components): " alias_name # Fuzzy search for file path or enter custom path echo "Select an existing path or enter a custom path:" selected_path=$(find src -type d | fzf --print-query | tail -n1) if [ -z "$selected_path" ]; then read -p "Enter a custom path: " custom_path selected_path=$custom_path fi # Add alias to tsconfig.json add_alias_to_tsconfig "$alias_name" "./$selected_path/*" echo -e "${GREEN}Alias added successfully!${NC}" [V0_FILE]javascript:file="__tests__/utils.test.js" isMerged="true" const { detectPackageManager, getInstallCommand, isGitHubCliInstalled } = require('../lib/utils'); jest.mock('execa'); describe('Utils', () => { describe('detectPackageManager', () => { it('should detect pnpm if available', async () => { require('execa').mockResolvedValueOnce({ stdout: '6.0.0' }); const result = await detectPackageManager(); expect(result).toBe('pnpm'); }); it('should fallback to npm if no other manager is found', async () => { require('execa').mockRejectedValue(new Error('Command not found')); const result = await detectPackageManager(); expect(result).toBe('npm'); }); }); describe('getInstallCommand', () => { it('should return "add" for yarn', () => { expect(getInstallCommand('yarn')).toBe('add'); }); it('should return "install" for npm, pnpm, and bun', () => { expect(getInstallCommand('npm')).toBe('install'); expect(getInstallCommand('pnpm')).toBe('install'); expect(getInstallCommand('bun')).toBe('install'); }); it('should throw an error for unsupported package managers', () => { expect(() => getInstallCommand('unsupported')).toThrow('Unsupported package manager: unsupported'); }); }); describe('isGitHubCliInstalled', () => { it('should return true if GitHub CLI is installed', async () => { require('execa').mockResolvedValueOnce({ stdout: '2.0.0' }); const result = await isGitHubCliInstalled(); expect(result).toBe(true); }); it('should return false if GitHub CLI is not installed', async () => { require('execa').mockRejectedValue(new Error('Command not found')); const result = await isGitHubCliInstalled(); expect(result).toBe(false); }); }); }); [V0_FILE]javascript:file="__tests__/createStructure.test.js" isMerged="true" const fs = require('fs-extra'); const path = require('path'); const { createBasicStructure, createAdvancedStructure } = require('../lib/createStructure'); jest.mock('fs-extra'); jest.mock('execa'); jest.mock('inquirer'); describe('Create Structure', () => { const mockProjectDirectory = '/mock/project'; const mockConfig = { name: 'test-project', version: 'Basic', }; beforeEach(() => { jest.clearAllMocks(); }); describe('createBasicStructure', () => { it('should create basic folder structure', async () => { await createBasicStructure(mockProjectDirectory, mockConfig); expect(fs.ensureDir).toHaveBeenCalledWith(expect.stringContaining('src')); expect(fs.ensureDir).toHaveBeenCalledWith(expect.stringContaining('components')); expect(fs.ensureDir).toHaveBeenCalledWith(expect.stringContaining('core/config')); expect(fs.ensureDir).toHaveBeenCalledWith(expect.stringContaining('core/utils')); expect(fs.ensureDir).toHaveBeenCalledWith(expect.stringContaining('styles')); }); it('should create basic files', async () => { await createBasicStructure(mockProjectDirectory, mockConfig); expect(fs.writeFile).toHaveBeenCalledWith( expect.stringContaining('core/utils/cn.js'), expect.stringContaining('export function cn') ); expect(fs.writeFile).toHaveBeenCalledWith( expect.stringContaining('styles/globals.css'), expect.stringContaining('@tailwind') ); }); }); describe('createAdvancedStructure', () => { it('should create advanced folder structure', async () => { await createAdvancedStructure(mockProjectDirectory, mockConfig); expect(fs.ensureDir).toHaveBeenCalledWith(expect.stringContaining('components')); expect(fs.ensureDir).toHaveBeenCalledWith(expect.stringContaining('core/config')); expect(fs.ensureDir).toHaveBeenCalledWith(expect.stringContaining('core/types')); expect(fs.ensureDir).toHaveBeenCalledWith(expect.stringContaining('features')); expect(fs.ensureDir).toHaveBeenCalledWith(expect.stringContaining('server/db')); }); it('should create advanced files', async () => { await createAdvancedStructure(mockProjectDirectory, mockConfig); expect(fs.writeFile).toHaveBeenCalledWith( expect.stringContaining('core/config/site.ts'), expect.stringContaining('export const siteConfig') ); expect(fs.writeFile).toHaveBeenCalledWith( expect.stringContaining('core/types/global.d.ts'), expect.stringContaining('declare global') ); }); }); }); [V0_FILE]javascript:file="lib/testHelper.js" isMerged="true" const inquirer = require('inquirer'); const { execa } = require('execa'); const chalk = require('chalk'); async function runTestHelper() { const { action } = await inquirer.prompt([ { type: 'list', name: 'action', message: 'What would you like to do?', choices: [ { name: 'Run all tests', value: 'all' }, { name: 'Run unit tests', value: 'unit' }, { name: 'Run integration tests', value: 'integration' }, { name: 'Run E2E tests', value: 'e2e' }, { name: 'Run performance tests', value: 'performance' }, { name: 'Run tests in watch mode', value: 'watch' }, { name: 'View test coverage', value: 'coverage' }, { name: 'Run linting check', value: 'lint' }, { name: 'Run formatting check', value: 'format' }, { name: 'Exit', value: 'exit' } ] } ]); switch (action) { case 'all': await runTests(); break; case 'unit': await runTests('unit'); break; case 'integration': await runTests('integration'); break; case 'e2e': await runTests('e2e'); break; case 'performance': await runTests('performance'); break; case 'watch': await runTestsInWatchMode(); break; case 'coverage': await viewTestCoverage(); break; case 'lint': await runLintCheck(); break; case 'format': await runFormatCheck(); break; case 'exit': console.log(chalk.yellow('Exiting test helper.')); return; } // Run the menu again await runTestHelper(); } async function runTests(testType = 'all') { try { let command = 'npm run test'; if (testType !== 'all') { command += `:${testType}`; } console.log(chalk.blue(`Running ${testType} tests...`)); await execa.command(command, { stdio: 'inherit' }); } catch (error) { console.error(chalk.red('Error running tests:'), error); } } async function runTestsInWatchMode() { try { console.log(chalk.blue('Running tests in watch mode...')); await execa.command('npm run test:watch', { stdio: 'inherit' }); } catch (error) { console.error(chalk.red('Error running tests in watch mode:'), error); } } async function viewTestCoverage() { try { console.log(chalk.blue('Generating test coverage report...')); await execa.command('npm run test:coverage', { stdio: 'inherit' }); } catch (error) { console.error(chalk.red('Error generating test coverage report:'), error); } } async function runLintCheck() { try { console.log(chalk.blue('Running linting check...')); await execa.command('npm run lint', { stdio: 'inherit' }); } catch (error) { console.error(chalk.red('Error running linting check:'), error); } } async function runFormatCheck() { try { console.log(chalk.blue('Running formatting check...')); await execa.command('npm run format', { stdio: 'inherit' }); } catch (error) { console.error(chalk.red('Error running formatting check:'), error); } } module.exports = { runTestHelper }; [V0_FILE]javascript:file="__tests__/unit/utils.test.js" isMerged="true" const { detectPackageManager, getInstallCommand } = require('../../lib/utils'); describe('unit | Utils', () => { describe('getInstallCommand', () => { it('should return "add" for yarn', () => { expect(getInstallCommand('yarn')).toBe('add'); }); it('should return "install" for npm, pnpm, and bun', () => { expect(getInstallCommand('npm')).toBe('install'); expect(getInstallCommand('pnpm')).toBe('install'); expect(getInstallCommand('bun')).toBe('install'); }); it('should throw an error for unsupported package managers', () => { expect(() => getInstallCommand('unsupported')).toThrow('Unsupported package manager: unsupported'); }); }); }); [V0_FILE]javascript:file="__tests__/integration/createProject.test.js" isMerged="true" const fs = require('fs-extra'); const path = require('path'); const { createProject } = require('../../lib/createProject'); jest.mock('fs-extra'); jest.mock('execa'); jest.mock('inquirer'); describe('integration | Create Project', () => { const mockProjectDirectory = '/mock/project'; const mockConfig = { name: 'test-project', version: 'Basic', packageManager: 'npm', wantApiLayer: false, }; beforeEach(() => { jest.clearAllMocks(); }); it('should create a basic project structure', async () => { await createProject(mockProjectDirectory, mockConfig); expect(fs.ensureDir).toHaveBeenCalledWith(expect.stringContaining('src')); expect(fs.ensureDir).toHaveBeenCalledWith(expect.stringContaining('components')); expect(fs.ensureDir).toHaveBeenCalledWith(expect.stringContaining('core/config')); expect(fs.writeFile).toHaveBeenCalledWith(expect.stringContaining('README.md'), expect.any(String)); }); }); [V0_FILE]javascript:file="__tests__/e2e/cli.test.js" isMerged="true" const { execa } = require('execa'); const fs = require('fs-extra'); const path = require('path'); describe('E2E | CLI', () => { const testProjectName = 'test-project'; const testProjectPath = path.join(__dirname, '..', '..', testProjectName); beforeAll(async () => { // Clean up any existing test project await fs.remove(testProjectPath); }); afterAll(async () => { // Clean up the test project await fs.remove(testProjectPath); }); it('should create a new project with default options', async () => { const result = await execa('node', ['index.js', testProjectName], { cwd: path.join(__dirname, '..', '..'), }); expect(result.exitCode).toBe(0); expect(fs.existsSync(testProjectPath)).toBe(true); expect(fs.existsSync(path.join(testProjectPath, 'package.json'))).toBe(true); expect(fs.existsSync(path.join(testProjectPath, 'src'))).toBe(true); }, 60000); // Increase timeout for this test }); [V0_FILE]javascript:file="__tests__/unit/error-handling.test.js" isMerged="true" const { validateProjectName } = require('../../lib/validateProjectName'); describe('unit | Error Handling', () => { describe('validateProjectName', () => { it('should return valid for a valid project name', () => { const result = validateProjectName('valid-project-name'); expect(result.valid).toBe(true); }); it('should return invalid for a project name with spaces', () => { const result = validateProjectName('invalid project name'); expect(result.valid).toBe(false); expect(result.problems).toContain('Project name cannot contain spaces'); }); it('should return invalid for a project name starting with a dot', () => { const result = validateProjectName('.invalidprojectname'); expect(result.valid).toBe(false); expect(result.problems).toContain('Project name cannot start with a dot'); }); }); }); [V0_FILE]javascript:file="__tests__/performance/create-project.test.js" isMerged="true" const { createProject } = require('../../lib/createProject'); const fs = require('fs-extra'); jest.mock('fs-extra'); jest.mock('execa'); jest.mock('inquirer'); describe('performance | Create Project', () => { const mockProjectDirectory = '/mock/project'; const mockConfig = { name: 'test-project', version: 'Basic', packageManager: 'npm', wantApiLayer: false, }; beforeEach(() => { jest.clearAllMocks(); }); it('should create a project within a reasonable time', async () => { const startTime = Date.now(); await createProject(mockProjectDirectory, mockConfig); const endTime = Date.now(); const duration = endTime - startTime; expect(duration).toBeLessThan(5000); // Assuming project creation should take less than 5 seconds }); }); [V0_FILE]javascript:file="__tests__/snapshot/generated-files.test.js" isMerged="true" const { createBasicStructure } = require('../../lib/createStructure'); const fs = require('fs-extra'); jest.mock('fs-extra'); describe('snapshot | Generated Files', () => { const mockProjectDirectory = '/mock/project'; const mockConfig = { name: 'test-project', version: 'Basic', }; beforeEach(() => { jest.clearAllMocks(); }); it('should generate correct content for cn.js', async () => { let capturedContent = ''; fs.writeFile.mockImplementation((path, content) => { if (path.includes('cn.js')) { capturedContent = content; } }); await createBasicStructure(mockProjectDirectory, mockConfig); expect(capturedContent).toMatchSnapshot(); }); }); [V0_FILE]javascript:file="lib/testDatabaseConnection.js" isMerged="true" const { Client } = require('pg'); const sqlite3 = require('sqlite3').verbose(); const ora = require('ora'); const chalk = require('chalk'); async function testPostgresConnection(config) { const spinner = ora('Testing PostgreSQL connection...').start(); const client = new Client({ connectionString: config.databaseUrl, }); try { await client.connect(); await client.query('SELECT NOW()'); spinner.succeed(chalk.green('Successfully connected to PostgreSQL database')); return true; } catch (error) { spinner.fail(chalk.red(`Failed to connect to PostgreSQL database: ${error.message}`)); return false; } finally { await client.end(); } } function testSqliteConnection(config) { return new Promise((resolve) => { const spinner = ora('Testing SQLite connection...').start(); const db = new sqlite3.Database(config.databaseUrl, sqlite3.OPEN_READWRITE, (err) => { if (err) { spinner.fail(chalk.red(`Failed to connect to SQLite database: ${err.message}`)); resolve(false); } else { db.get("SELECT name FROM sqlite_master WHERE type='table' AND name='sqlite_master'", (err, row) => { if (err) { spinner.fail(chalk.red(`Failed to query SQLite database: ${err.message}`)); resolve(false); } else { spinner.succeed(chalk.green('Successfully connected to SQLite database')); resolve(true); } db.close(); }); } }); }); } async function testDatabaseConnection(config) { if (config.databaseType === 'PostgreSQL') { return testPostgresConnection(config); } else if (config.databaseType === 'SQLite') { return testSqliteConnection(config); } else { console.log(chalk.yellow('No database connection test available for the selected database type.')); return true; // Assume success for unsupported database types } } module.exports = { testDatabaseConnection }; [V0_FILE]javascript:file="lib/createStructure.js" isFixed="true" isQuickEdit="true" isMerged="true" const fs = require('fs-extra'); const path = require('path'); const execa = require('execa'); const inquirer = require('inquirer'); async function createBasicStructure(projectDirectory, config) { const srcPath = path.join(projectDirectory, 'src'); await fs.ensureDir(srcPath); // Create basic folder structure const folders = [ 'components', 'core/config', 'core/utils', 'styles/theme', 'shared/components', 'shared/components/ui', 'shared/helpers', 'shared/hooks' ]; for (const folder of folders) { await fs.ensureDir(path.join(srcPath, folder)); } // Create basic files await fs.writeFile(path.join(srcPath, 'core/utils/cn.ts'), ` import { type ClassValue, clsx } from "clsx" import { twMerge } from "tailwind-merge" export function cn(...inputs: ClassValue[]) { return twMerge(clsx(inputs)) } `); // Create variables.css await fs.writeFile(path.join(srcPath, 'styles/theme/variables.css'), ` @layer base { :root { --background: 0 0% 100%; --foreground: 0 0% 3.9%; --card: 0 0% 100%; --card-foreground: 0 0% 3.9%; --popover: 0 0% 100%; --popover-foreground: 0 0% 3.9%; --primary: 0 0% 9%; --primary-foreground: 0 0% 98%; --secondary: 0 0% 96.1%; --secondary-foreground: 0 0% 9%; --muted: 0 0% 96.1%; --muted-foreground: 0 0% 45.1%; --accent: 0 0% 96.1%; --accent-foreground: 0 0% 9%; --destructive: 0 84.2% 60.2%; --destructive-foreground: 0 0% 98%; --border: 0 0% 89.8%; --input: 0 0% 89.8%; --ring: 0 0% 3.9%; --chart-1: 12 76% 61%; --chart-2: 173 58% 39%; --chart-3: 197 37% 24%; --chart-4: 43 74% 66%; --chart-5: 27 87% 67%; --radius: 0.5rem; } .dark { --background: 0 0% 3.9%; --foreground: 0 0% 98%; --card: 0 0% 3.9%; --card-foreground: 0 0% 98%; --popover: 0 0% 3.9%; --popover-foreground: 0 0% 98%; --primary: 0 0% 98%; --primary-foreground: 0 0% 9%; --secondary: 0 0% 14.9%; --secondary-foreground: 0 0% 98%; --muted: 0 0% 14.9%; --muted-foreground: 0 0% 63.9%; --accent: 0 0% 14.9%; --accent-foreground: 0 0% 98%; --destructive: 0 62.8% 30.6%; --destructive-foreground: 0 0% 98%; --border: 0 0% 14.9%; --input: 0 0% 14.9%; --ring: 0 0% 83.1%; --chart-1: 220 70% 50%; --chart-2: 160 60% 45%; --chart-3: 30 80% 55%; --chart-4: 280 65% 60%; --chart-5: 340 75% 55%; } } `); // Create app.css await fs.writeFile(path.join(srcPath, 'styles/app.css'), ` @import './theme/variables.css'; @tailwind base; @tailwind components; @tailwind utilities; body { font-family: Arial, Helvetica, sans-serif; } @layer utilities { .text-balance { text-wrap: balance; } } @layer base { * { @apply border-border; } body { @apply bg-background text-foreground; } } `); // Create index.ts files const indexFiles = [ 'shared/components/index.ts', 'shared/components/ui/index.ts', 'shared/helpers/index.ts', 'shared/hooks/index.ts' ]; for (const file of indexFiles) { await fs.writeFile(path.join(srcPath, file), ''); } // Add new configuration file await fs.writeFile(path.join(srcPath, 'core/config/project-config.ts'), ` export const projectConfig = ${JSON.stringify(config, null, 2)} `); } async function createAdvancedStructure(projectDirectory, config) { const srcPath = path.join(projectDirectory, 'src'); await fs.ensureDir(srcPath); // Create advanced folder structure const folders = [ 'app/(routes)/about', 'components', 'core/config', 'core/types', 'features', 'server/db', 'server/queries', 'server/mutations', 'models', 'services', 'shared/components', 'shared/components/ui', 'shared/helpers', 'shared/hooks', 'styles/theme' ]; for (const folder of folders) { await fs.ensureDir(path.join(srcPath, folder)); } // Create .gitkeep files const gitkeepFolders = ['components', 'features', 'server/db', 'services']; for (const folder of gitkeepFolders) { await fs.writeFile(path.join(srcPath, folder, '.gitkeep'), ''); } // Create specific files await fs.writeFile(path.join(srcPath, 'core/config/site.ts'), ` export const siteConfig = { name: '${config.name}', description: 'Description for ${config.name}', url: 'https://example.com', ogImage: 'https://example.com/og.jpg', links: { twitter: 'https://twitter.com/yourusername', github: 'https://github.com/yourusername', }, }; `); await fs.writeFile(path.join(srcPath, 'core/types/global.d.ts'), ` import { ReactNode } from 'react'; declare global { type Children = { children: ReactNode; }; } `); await fs.writeFile(path.join(srcPath, 'server/queries/index.ts'), ''); await fs.writeFile(path.join(srcPath, 'server/mutations/index.ts'), ''); await fs.writeFile(path.join(srcPath, 'models/index.ts'), '// Zod schemas will be defined here'); // Create index.ts files for shared folders const sharedIndexFiles = [ 'shared/components/index.ts', 'shared/components/ui/index.ts', 'shared/helpers/index.ts', 'shared/hooks/index.ts' ]; for (const file of sharedIndexFiles) { await fs.writeFile(path.join(srcPath, file), ''); } // Create variables.css await fs.writeFile(path.join(srcPath, 'styles/theme/variables.css'), ` @layer base { :root { --background: 0 0% 100%; --foreground: 0 0% 3.9%; --card: 0 0% 100%; --card-foreground: 0 0% 3.9%; --popover: 0 0% 100%; --popover-foreground: 0 0% 3.9%; --primary: 0 0% 9%; --primary-foreground: 0 0% 98%; --secondary: 0 0% 96.1%; --secondary-foreground: 0 0% 9%; --muted: 0 0% 96.1%; --muted-foreground: 0 0% 45.1%; --accent: 0 0% 96.1%; --accent-foreground: 0 0% 9%; --destructive: 0 84.2% 60.2%; --destructive-foreground: 0 0% 98%; --border: 0 0% 89.8%; --input: 0 0% 89.8%; --ring: 0 0% 3.9%; --chart-1: 12 76% 61%; --chart-2: 173 58% 39%; --chart-3: 197 37% 24%; --chart-4: 43 74% 66%; --chart-5: 27 87% 67%; --radius: 0.5rem; } .dark { --background: 0 0% 3.9%; --foreground: 0 0% 98%; --card: 0 0% 3.9%; --card-foreground: 0 0% 98%; --popover: 0 0% 3.9%; --popover-foreground: 0 0% 98%; --primary: 0 0% 98%; --primary-foreground: 0 0% 9%; --secondary: 0 0% 14.9%; --secondary-foreground: 0 0% 98%; --muted: 0 0% 14.9%; --muted-foreground: 0 0% 63.9%; --accent: 0 0% 14.9%; --accent-foreground: 0 0% 98%; --destructive: 0 62.8% 30.6%; --destructive-foreground: 0 0% 98%; --border: 0 0% 14.9%; --input: 0 0% 14.9%; --ring: 0 0% 83.1%; --chart-1: 220 70% 50%; --chart-2: 160 60% 45%; --chart-3: 30 80% 55%; --chart-4: 280 65% 60%; --chart-5: 340 75% 55%; } } `); // Create app.css for shadcn/ui await fs.writeFile(path.join(srcPath, 'styles/app.css'), ` @import './theme/variables.css'; @tailwind base; @tailwind components; @tailwind utilities; body { font-family: Arial, Helvetica, sans-serif; } @layer utilities { .text-balance { text-wrap: balance; } } @layer base { * { @apply border-border; } body { @apply bg-background text-foreground; } } `); // Add new configuration file await fs.writeFile(path.join(srcPath, 'core/config/project-config.ts'), ` export const projectConfig = ${JSON.stringify(config, null, 2)} `); // Install additional dependencies await execa('pnpm', ['add', 'zod', 'framer-motion', 'zustand'], { cwd: projectDirectory }); // Ask about shadcn installation const { installShadcn } = await inquirer.prompt([ { type: 'confirm', name: 'installShadcn', message: 'Do you want to install shadcn/ui?', default: true, }, ]); if (installShadcn) { await setupShadcn(projectDirectory); } } async function setupShadcn(projectDirectory) { const srcPath = path.join(projectDirectory, 'src'); // Create shared/components/ui directory and index.ts file const uiPath = path.join(srcPath, 'shared', 'components', 'ui'); await fs.ensureDir(uiPath); await fs.writeFile(path.join(uiPath, 'index.ts'), ''); // Install shadcn await execa('pnpm', ['add', '-D', '@shadcn/ui'], { cwd: projectDirectory }); await execa('pnpm', ['dlx', 'shadcn-ui@latest', 'init'], { cwd: projectDirectory }); // Modify paths in components.json const componentsJsonPath = path.join(projectDirectory, 'components.json'); const componentsJson = await fs.readJson(componentsJsonPath); componentsJson.aliases = { '@/components': 'src/shared/components', '@/hooks': 'src/shared/hooks', '@/lib': 'src/shared/helpers', }; await fs.writeJson(componentsJsonPath, componentsJson, { spaces: 2 }); // Ask which components to install const { selectedComponents } = await inquirer.prompt([ { type: 'checkbox', name: 'selectedComponents', message: 'Select shadcn/ui components to install:', choices: ['button', 'card', 'dialog', 'alert', 'form', 'input', 'label', 'select', 'textarea'], }, ]); // Install selected components for (const component of selectedComponents) { await execa('pnpm', ['dlx', 'shadcn-ui@latest', 'add', component], { cwd: projectDirectory }); } // Update index.ts file const indexContent = selectedComponents.map(component => `export * from './${component}';`).join('\n'); await fs.writeFile(path.join(uiPath, 'index.ts'), indexContent); } module.exports = { createBasicStructure, createAdvancedStructure }; [V0_FILE]javascript:file="tailwind.config.js" isMerged="true" module.exports = { theme: { extend: { colors: { cyan: '#9cdbff', }, }, }, variants: { extend: { borderColor: ['focus-visible'], opacity: ['disabled'], }, }, plugins: [], } [V0_FILE]javascript:file="scripts/add-theme-color.js" isFixed="true" isQuickEdit="true" isMerged="true" const fs = require('fs').promises; const path = require('path'); const inquirer = require('inquirer'); const variablesPath = path.join(process.cwd(), 'src', 'styles', 'theme', 'variables.css'); const tailwindConfigPath = path.join(process.cwd(), 'tailwind.config.js'); async function promptForColor() { const { name, value } = await inquirer.prompt([ { type: 'input', name: 'name', message: 'Enter the color name:', validate: input => input.trim() !== '' || 'Color name cannot be empty', }, { type: 'input', name: 'value', message: 'Enter the color value (#RRGGBB or rgb/rgba):', validate: input => /^#[0-9A-Fa-f]{6}$|^rgb$$.*$$$|^rgba$$.*$$$/.test(input) || 'Invalid color format', }, ]); return { name: name.trim(), value }; } async function updateVariablesCSS(name, value) { let content = await fs.readFile(variablesPath, 'utf8'); const rootStart = content.indexOf(':root {'); const rootEnd = content.indexOf('}', rootStart); const newVariable = ` --${name}: ${value};\n`; content = content.slice(0, rootEnd) + newVariable + content.slice(rootEnd); await fs.writeFile(variablesPath, content, 'utf8'); } async function updateTailwindConfig(name) { let content = await fs.readFile(tailwindConfigPath, 'utf8'); // Find the theme section const themeStart = content.indexOf('theme:'); if (themeStart === -1) { // If theme doesn't exist, add it const configEnd = content.lastIndexOf('}'); const newTheme = ` theme: { extend: { colors: { ${name}: 'var(--${name})', }, }, },`; content = content.slice(0, configEnd) + newTheme + content.slice(configEnd); } else { // Find the extend section within theme const extendStart = content.indexOf('extend:', themeStart); if (extendStart === -1) { // If extend doesn't exist, add it const themeEnd = content.indexOf('}', themeStart); const newExtend = ` extend: { colors: { ${name}: 'var(--${name})', }, },`; content = content.slice(0, themeEnd) + newExtend + content.slice(themeEnd); } else { // Find the colors section within extend const colorsStart = content.indexOf('colors:', extendStart); if (colorsStart === -1) { // If colors doesn't exist, add it const extendEnd = content.indexOf('}', extendStart); const newColors = ` colors: { ${name}: 'var(--${name})', },`; content = content.slice(0, extendEnd) + newColors + content.slice(extendEnd); } else { // Add the new color to the existing colors object const colorsEnd = content.indexOf('}', colorsStart); const newColor = ` ${name}: 'var(--${name})',`; content = content.slice(0, colorsEnd) + newColor + content.slice(colorsEnd); } } } await fs.writeFile(tailwindConfigPath, content, 'utf8'); } async function addThemeColor() { try { const { name, value } = await promptForColor(); await updateVariablesCSS(name, value); await updateTailwindConfig(name); console.log(`\nSuccess! Added color '${name}' with value '${value}'.`); console.log(`You can now use it in your Tailwind classes like: bg-${name}, text-${name}, etc.\n`); const { addMore } = await inquirer.prompt({ type: 'confirm', name: 'addMore', message: 'Do you want to add another color?', default: false, }); if (addMore) { await addThemeColor(); } else { console.log('Finished adding colors. Happy styling!'); } } catch (error) { console.error('An error occurred:', error); } } addThemeColor(); [V0_FILE]shellscript:file="scripts/add-ui-component.sh" isMerged="true" #!/bin/bash # Check if a component name was provided if [ -z "$1" ]; then echo "Please provide a component name." exit 1 fi # Run the shadcn-ui add command pnpm dlx shadcn@latest add "$1" # Get the filename of the added component filename=$(echo "$1" | tr '[:upper:]' '[:lower:]') # Update the index.ts file echo "export * from './$filename';" >> src/shared/components/ui/index.ts echo "Component $1 added and index.ts updated." [V0_FILE]shellscript:file="scripts/manage-env.sh" isMerged="true" #!/bin/bash ENV_FILE=".env.local" # Function to add or update an environment variable update_env() { if grep -q "^$1=" "$ENV_FILE"; then sed -i "s/^$1=.*/$1=$2/" "$ENV_FILE" else echo "$1=$2" >> "$ENV_FILE" fi } # Check if .env.local exists, if not create it if [ ! -f "$ENV_FILE" ]; then touch "$ENV_FILE" fi # Main menu while true; do echo "Environment Variable Manager" echo "1. Add/Update environment variable" echo "2. View all environment variables" echo "3. Exit" read -p "Choose an option: " choice case $choice in 1) read -p "Enter variable name: " var_name read -p "Enter variable value: " var_value update_env "$var_name" "$var_value" echo "Environment variable updated." ;; 2) echo "Current environment variables:" cat "$ENV_FILE" ;; 3) echo "Exiting..." exit 0 ;; *) echo "Invalid option. Please try again." ;; esac echo done [V0_FILE]shellscript:file="scripts/setup-git-hooks.sh" isMerged="true" #!/bin/bash # Create a pre-commit hook cat > .git/hooks/pre-commit << EOL #!/bin/sh npm run lint npm run test EOL # Make the pre-commit hook executable chmod +x .git/hooks/pre-commit echo "Git hooks have been set up successfully." [V0_FILE]shellscript:file="scripts/generate-docs.sh" isMerged="true" #!/bin/bash # Run TypeDoc npx typedoc --entryPointStrategy expand ./src echo "API documentation has been generated." [V0_FILE]shellscript:file="scripts/setup-analytics.sh" isMerged="true" #!/bin/bash # Add Next.js Analytics to next.config.js cat >> next.config.js << EOL module.exports = { ...module.exports, experimental: { ...module.exports.experimental, webVitalsAttribution: ['CLS', 'LCP'] } } EOL echo "Next.js Analytics has been set up in next.config.js" [V0_FILE]shellscript:file="scripts/check-accessibility.sh" #!/bin/bash # Install axe-core if not already installed npm install --save-dev axe-core # Run accessibility checks npx axe --exit echo "Accessibility check completed." [V0_FILE]shellscript:file="scripts/setup-i18n.sh" #!/bin/bash # Install next-i18next npm install next-i18next # Create i18n configuration file cat > next-i18next.config.js << EOL module.exports = { i18n: { defaultLocale: 'en', locales: ['en', 'fr', 'es'], }, } EOL # Create locales directory and sample translation files mkdir -p public/locales/en mkdir -p public/locales/fr mkdir -p public/locales/es echo '{"hello": "Hello"}' > public/locales/en/common.json echo '{"hello": "Bonjour"}' > public/locales/fr/common.json echo '{"hello": "Hola"}' > public/locales/es/common.json echo "i18n has been set up with English, French, and Spanish locales." [V0_FILE]shellscript:file="scripts/setup-seo.sh" #!/bin/bash # Install next-seo npm install next-seo # Create SEO configuration file cat > next-seo.config.js << EOL export default { title: 'My Amazing App', description: 'This is a great app built with Next.js', openGraph: { type: 'website', locale: 'en_IE', url: 'https://www.myamazingapp.com/', site_name: 'My Amazing App', }, twitter: { handle: '@myamazingapp', site: '@myamazingapp', cardType: 'summary_large_image', }, }; EOL echo "Basic SEO configuration has been set up." [V0_FILE]typescriptreact:file="package.json" isEdit="true" { "scripts": { "start": "node index.js", "test": "jest", "test:watch": "jest --watch", "test:coverage": "jest --coverage", "test:unit": "jest -t 'unit'", "test:integration": "jest -t 'integration'", "test:e2e": "jest -t 'E2E'", "test:performance": "jest -t 'performance'", "lint": "eslint .", "format": "prettier --write .", "add-theme-color": "node scripts/add-theme-color.js", "ui": "bash scripts/add-ui-component.sh", "manage-env": "bash scripts/manage-env.sh", "setup-git-hooks": "bash scripts/setup-git-hooks.sh", "generate-docs": "bash scripts/generate-docs.sh", "setup-analytics": "bash scripts/setup-analytics.sh", "check-a11y": "bash scripts/check-accessibility.sh", "setup-i18n": "bash scripts/setup-i18n.sh", "setup-seo": "bash scripts/setup-seo.sh" }, "devDependencies": { "@types/fs-extra": "^9.0.13", "@types/inquirer": "^8.2.0", "axe-core": "^4.5.0", "eslint": "^7.32.0", "jest": "^27.0.6", "prettier": "^2.3.2", "typedoc": "^0.24.0" }, "dependencies": { "next-i18next": "^11.0.0", "next-seo": "^5.5.0", "pg": "^8.7.1", "sqlite3": "^5.0.2" }, "jest": { "testEnvironment": "node", "coverageThreshold": { "global": { "branches": 80, "functions": 80, "lines": 80, "statements": 80 } } } } [V0_FILE]typescriptreact:file="README.md" isEdit="true" # Create Custom Next.js App This is a CLI tool for creating customized Next.js applications with various configuration options and features. ## Features - Create basic or advanced Next.js project structures - Support for multiple database types (PostgreSQL, MySQL, MongoDB) - Authentication options (NextAuth.js) - State management options (Zustand) - Customizable UI components with shadcn/ui - Automatic setup of project structure and dependencies - Accessibility checking - Internationalization (i18n) setup - SEO optimization ## Installation To use this tool, you need to have Node.js and npm (or yarn, pnpm) installed on your system. 1. Clone this repository: \`\`\` git clone https://github.com/yourusername/create-custom-next-app.git \`\`\` 2. Navigate to the project directory: \`\`\` cd create-custom-next-app \`\`\` 3. Install dependencies: \`\`\` npm install \`\`\` ## Usage To create a new Next.js project using this tool, run: \`\`\` node index.js \`\`\` Replace `` with the name of the directory where you want to create your project. Follow the prompts to configure your project: - Project name - Project version (Basic or Advanced) - Database type - Authentication method - State management library - UI components (shadcn/ui) ## Features - **Project Structure**: Choose between Basic and Advanced project structures to suit your needs. - **Database Integration**: Support for PostgreSQL, MySQL, and MongoDB with easy setup. - **Authentication**: Option to integrate NextAuth.js for robust authentication. - **State Management**: Built-in support for Zustand, a lightweight state management solution. - **UI Components**: Integration with shadcn/ui for beautiful, customizable UI components. - **API Layer**: Automatic setup of an API layer with your chosen database. - **TypeScript**: Full TypeScript support for type-safe development. - **Tailwind CSS**: Pre-configured with Tailwind CSS for rapid UI development. - **Testing**: Includes Jest setup for unit and integration testing. - **Linting and Formatting**: ESLint and Prettier configured for code quality. - **Custom Scripts**: Helpful scripts for adding theme colors and managing the project. - **Docker Support**: Optional Docker setup for consistent development environments. - **Accessibility Checking**: Built-in accessibility checks using axe-core. - **Internationalization**: Easy setup for multi-language support using next-i18next. - **SEO Optimization**: Basic SEO configuration using next-seo. ## Available Scripts In the project directory, you can run: - `npm start`: Run the CLI tool - `npm test`: Run all tests - `npm run test:watch`: Run tests in watch mode - `npm run test:coverage`: Generate test coverage report - `npm run test:unit`: Run unit tests - `npm run test:integration`: Run integration tests - `npm run test:e2e`: Run end-to-end tests - `npm run test:performance`: Run performance tests - `npm run lint`: Run ESLint - `npm run format`: Run Prettier to format code - `npm run add-theme-color`: Run the script to add a new theme color - `npm run manage-env`: Manage environment variables - `npm run setup-git-hooks`: Set up Git hooks for code quality - `npm run generate-docs`: Generate API documentation - `npm run setup-analytics`: Set up Next.js Analytics for performance monitoring - `npm run check-a11y`: Run accessibility checks - `npm run setup-i18n`: Set up internationalization - `npm run setup-seo`: Set up basic SEO configuration ## Project Structure The generated project will have the following structure: \`\`\` project-root/ ├── src/ │ ├── app/ │ ├── components/ │ ├── core/ │ │ ├── config/ │ │ └── utils/ │ ├── shared/ │ │ ├── components/ │ │ │ └── ui/ │ │ ├── helpers/ │ │ └── hooks/ │ └── styles/ │ └── theme/ ├── public/ │ └── locales/ │ ├── en/ │ ├── fr/ │ └── es/ ├── .env.local ├── next.config.js ├── next-i18next.config.js ├── next-seo.config.js ├── package.json ├── README.md └── tsconfig.json \`\`\` ## License This project is licensed under the MIT License.