colorize the prompts

apps/cli/src/helpers/create-project.ts

@@ -1,13 +1,14 @@
 import path from "node:path";
 import { confirm, select } from "@inquirer/prompts";
+import chalk from "chalk";
 import { $ } from "execa";
 import fs from "fs-extra";
 import ora from "ora";
-import { DEFAULT_CONFIG } from "./consts";
-import { setupTurso } from "./helpers/db-setup";
-import type { PackageManager, ProjectConfig } from "./types";
-import { getUserPkgManager } from "./utils/get-package-manager";
-import { logger } from "./utils/logger";
+import { DEFAULT_CONFIG } from "../consts";
+import type { PackageManager, ProjectConfig } from "../types";
+import { getUserPkgManager } from "../utils/get-package-manager";
+import { logger } from "../utils/logger";
+import { setupTurso } from "./db-setup";
 
 export async function createProject(options: ProjectConfig) {
 	const spinner = ora("Creating project directory...").start();
@@ -16,16 +17,19 @@ export async function createProject(options: ProjectConfig) {
 	try {
 		await fs.ensureDir(projectDir);
 		spinner.succeed();
+		console.log();
 
 		spinner.start("Cloning template repository...");
 		await $`npx degit https://github.com/AmanVarshney01/Better-T-Stack.git ${projectDir}`;
 		spinner.succeed();
+		console.log();
 
 		const initGit = await confirm({
-			message: "Initialize a git repository?",
+			message: chalk.blue.bold("🔄 Initialize a git repository?"),
 			default: true,
 		}).catch((error) => {
 			spinner.stop();
+			console.log();
 			throw error;
 		});
 
@@ -33,6 +37,7 @@ export async function createProject(options: ProjectConfig) {
 			spinner.start("Initializing git repository...");
 			await $`git init ${projectDir}`;
 			spinner.succeed();
+			console.log();
 		}
 
 		let packageManager = options.packageManager;
@@ -41,7 +46,11 @@ export async function createProject(options: ProjectConfig) {
 			const detectedPackageManager = getUserPkgManager();
 
 			const useDetectedPackageManager = await confirm({
-				message: `Use detected package manager (${detectedPackageManager})?`,
+				message: chalk.blue.bold(
+					`📦 Use detected package manager (${chalk.cyan(
+						detectedPackageManager,
+					)})?`,
+				),
 				default: true,
 			}).catch((error) => {
 				spinner.stop();
@@ -51,13 +60,34 @@ export async function createProject(options: ProjectConfig) {
 			if (useDetectedPackageManager) {
 				packageManager = detectedPackageManager;
 			} else {
+				console.log();
 				packageManager = await select<PackageManager>({
-					message: "Select package manager:",
+					message: chalk.blue.bold("📦 Select package manager:"),
 					choices: [
-						{ value: "npm", name: "npm" },
-						{ value: "yarn", name: "yarn" },
-						{ value: "pnpm", name: "pnpm" },
-						{ value: "bun", name: "bun" },
+						{
+							value: "npm",
+							name: chalk.yellow("npm"),
+							description: chalk.dim("Node Package Manager"),
+						},
+						{
+							value: "yarn",
+							name: chalk.blue("yarn"),
+							description: chalk.dim(
+								"Fast, reliable, and secure dependency management",
+							),
+						},
+						{
+							value: "pnpm",
+							name: chalk.magenta("pnpm"),
+							description: chalk.dim(
+								"Fast, disk space efficient package manager",
+							),
+						},
+						{
+							value: "bun",
+							name: chalk.cyan("bun"),
+							description: chalk.dim("All-in-one JavaScript runtime & toolkit"),
+						},
 					],
 				}).catch((error) => {
 					spinner.stop();
@@ -66,16 +96,22 @@ export async function createProject(options: ProjectConfig) {
 			}
 		}
 
+		console.log();
+
 		const installDeps = await confirm({
-			message: `Install dependencies using ${packageManager}?`,
+			message: chalk.blue.bold(
+				`📦 Install dependencies using ${chalk.cyan(packageManager)}?`,
+			),
 			default: true,
 		}).catch((error) => {
 			spinner.stop();
 			throw error;
 		});
 
+		console.log();
+
 		if (installDeps) {
-			spinner.start(`Installing dependencies using ${packageManager}...`);
+			spinner.start(`📦 Installing dependencies using ${packageManager}...`);
 			switch (packageManager ?? DEFAULT_CONFIG.packageManager) {
 				case "npm":
 					await $`npm install ${projectDir}`;
@@ -93,6 +129,7 @@ export async function createProject(options: ProjectConfig) {
 					throw new Error("Unsupported package manager");
 			}
 			spinner.succeed();
+			console.log();
 		}
 
 		if (options.database === "libsql") {

apps/cli/src/helpers/db-setup.ts

@@ -1,6 +1,7 @@
 import os from "node:os";
 import path from "node:path";
 import { confirm, input } from "@inquirer/prompts";
+import chalk from "chalk";
 import { $ } from "execa";
 import fs from "fs-extra";
 import ora, { type Ora } from "ora";
@@ -17,6 +18,7 @@ async function loginToTurso(spinner: Ora) {
 		spinner.start("Logging in to Turso...");
 		await $`turso auth login`;
 		spinner.succeed("Logged in to Turso successfully!");
+		console.log();
 	} catch (error) {
 		spinner.fail("Failed to log in to Turso");
 		throw error;
@@ -25,6 +27,7 @@ async function loginToTurso(spinner: Ora) {
 
 async function installTursoCLI(isMac: boolean, spinner: Ora) {
 	try {
+		console.log();
 		spinner.start("Installing Turso CLI...");
 
 		if (isMac) {
@@ -36,6 +39,7 @@ async function installTursoCLI(isMac: boolean, spinner: Ora) {
 		}
 
 		spinner.succeed("Turso CLI installed successfully!");
+		console.log();
 	} catch (error) {
 		if (error instanceof Error && error.message.includes("User force closed")) {
 			spinner.stop();
@@ -108,7 +112,7 @@ export async function setupTurso(projectDir: string) {
 
 		if (!isCliInstalled) {
 			const shouldInstall = await confirm({
-				message: "Would you like to install Turso CLI?",
+				message: chalk.blue.bold("🔧 Would you like to install Turso CLI?"),
 				default: true,
 			}).catch((error) => {
 				spinner.stop();
@@ -130,8 +134,9 @@ export async function setupTurso(projectDir: string) {
 		}
 
 		const defaultDbName = path.basename(projectDir);
+
 		let dbName = await input({
-			message: `Enter database name (default: ${defaultDbName}):`,
+			message: chalk.blue.bold("💾 Enter database name:"),
 			default: defaultDbName,
 		}).catch((error) => {
 			spinner.stop();
@@ -141,6 +146,7 @@ export async function setupTurso(projectDir: string) {
 		let success = false;
 		while (!success) {
 			try {
+				console.log();
 				spinner.start(`Creating Turso database "${dbName}"...`);
 				const config = await createTursoDatabase(dbName);
 				await writeEnvFile(projectDir, config);

apps/cli/src/index.ts

@@ -2,7 +2,7 @@ import { checkbox, confirm, input, select } from "@inquirer/prompts";
 import chalk from "chalk";
 import { Command } from "commander";
 import { DEFAULT_CONFIG } from "./consts";
-import { createProject } from "./create-project";
+import { createProject } from "./helpers/create-project";
 import { renderTitle } from "./render-title";
 import type {
 	PackageManager,
@@ -36,59 +36,65 @@ async function gatherConfig(
 	config.projectName =
 		flags.projectName ??
 		(await input({
-			message: "Project name:",
+			message: chalk.blue.bold("📝 Project name:"),
 			default: "my-better-t-app",
 		}));
 
+	console.log();
+
 	if (flags.database) {
 		config.database = flags.database;
 	} else {
 		config.database = await select<ProjectDatabase>({
-			message: chalk.cyan("Select database:"),
+			message: chalk.blue.bold("💾 Select database:"),
 			choices: [
 				{
 					value: "libsql",
-					name: "libSQL",
+					name: chalk.green("libSQL"),
 					description: chalk.dim(
-						"(Recommended) - Turso's embedded SQLite database",
+						"✨ (Recommended) - Turso's embedded SQLite database",
 					),
 				},
 				{
 					value: "postgres",
-					name: "PostgreSQL",
-					description: chalk.dim("Traditional relational database"),
+					name: chalk.yellow("PostgreSQL"),
+					description: chalk.dim("🐘 Traditional relational database"),
 				},
 			],
 		});
 	}
 
+	console.log();
+
 	config.auth =
 		flags.auth ??
 		(await confirm({
-			message: "Add authentication with Better-Auth?",
+			message: chalk.blue.bold("🔐 Add authentication with Better-Auth?"),
 			default: true,
 		}));
 
+	console.log();
+
 	if (flags.features) {
 		config.features = flags.features;
 	} else {
 		config.features = await checkbox<ProjectFeature>({
-			message: chalk.cyan("Select additional features:"),
+			message: chalk.blue.bold("🎯 Select additional features:"),
 			choices: [
 				{
 					value: "docker",
-					name: "Docker setup",
-					description: chalk.dim("Containerize your application"),
+					name: chalk.cyan("Docker setup"),
+					description: chalk.dim("🐳 Containerize your application"),
 				},
 				{
 					value: "github-actions",
-					name: "GitHub Actions",
-					description: chalk.dim("CI/CD workflows"),
+					name: chalk.magenta("GitHub Actions"),
+					description: chalk.dim("⚡ CI/CD workflows"),
 				},
 				{
 					value: "SEO",
-					name: "Basic SEO setup",
-					description: chalk.dim("Search engine optimization configuration"),
+					name: chalk.green("Basic SEO setup"),
+					description: chalk.dim("🔍 Search engine optimization configuration"),
 				},
 			],
 		});
@@ -100,8 +106,7 @@ async function gatherConfig(
 async function main() {
 	try {
 		renderTitle();
-		logger.info("\n🚀 Creating a new Better-T Stack project...\n");
-
+		logger.info(chalk.bold(" Creating a new Better-T Stack project...\n"));
 		program
 			.name("create-better-t-stack")
 			.description("Create a new Better-T Stack project")
@@ -140,8 +145,40 @@ async function main() {
 			: await gatherConfig(flagConfig);
 
 		if (options.yes) {
-			logger.info("Using default configuration");
-			logger.info(JSON.stringify(config, null, 2));
+			logger.info(chalk.blue.bold("\n📦 Using default configuration:"));
+			const colorizedConfig = {
+				projectName: chalk.green(config.projectName),
+				database: chalk.yellow(config.database),
+				auth: chalk.cyan(config.auth),
+				features: config.features.map((feature) => chalk.magenta(feature)),
+				git: chalk.cyan(config.git),
+			};
+
+			console.log();
+			console.log(
+				chalk.dim("├─") +
+					chalk.blue(" Project Name: ") +
+					colorizedConfig.projectName,
+			);
+			console.log(
+				chalk.dim("├─") + chalk.blue(" Database: ") + colorizedConfig.database,
+			);
+			console.log(
+				chalk.dim("├─") +
+					chalk.blue(" Authentication: ") +
+					colorizedConfig.auth,
+			);
+			console.log(
+				chalk.dim("├─") +
+					chalk.blue(" Features: ") +
+					(colorizedConfig.features.length
+						? colorizedConfig.features.join(", ")
+						: chalk.gray("none")),
+			);
+			console.log(
+				chalk.dim("└─") + chalk.blue(" Git Init: ") + colorizedConfig.git,
+			);
+			console.log();
 		}
 
 		await createProject(config);

apps/cli/src/utils/generate-reproducible-command.ts

@@ -1,3 +1,4 @@
+import chalk from "chalk";
 import { DEFAULT_CONFIG } from "../consts";
 import type { ProjectConfig } from "../types";
 import { getUserPkgManager } from "./get-package-manager";
@@ -7,23 +8,29 @@ export function generateReproducibleCommand(config: ProjectConfig): string {
 	const defaultPackageManager = getUserPkgManager();
 
 	if (config.database !== DEFAULT_CONFIG.database) {
-		flags.push(`--database ${config.database}`);
+		flags.push(chalk.cyan(`--database ${config.database}`));
 	}
+
 	if (config.auth !== DEFAULT_CONFIG.auth) {
-		flags.push("--no-auth");
+		flags.push(chalk.yellow("--no-auth"));
 	}
+
 	if (
 		config.packageManager &&
 		config.packageManager !== defaultPackageManager
 	) {
-		flags.push(`--package-manager ${config.packageManager}`);
+		flags.push(chalk.magenta(`--package-manager ${config.packageManager}`));
 	}
 
 	for (const feature of config.features) {
-		flags.push(`--${feature}`);
+		flags.push(chalk.green(`--${feature}`));
 	}
 
-	return `npx create-better-t-stack${
-		config.projectName ? ` ${config.projectName}` : ""
-	}${flags.length > 0 ? ` ${flags.join(" ")}` : ""}`;
+	const baseCommand = chalk.bold("npx create-better-t-stack");
+	const projectName = config.projectName
+		? chalk.blue(` ${config.projectName}`)
+		: "";
+	const flagString = flags.length > 0 ? ` ${flags.join(" ")}` : "";
+
+	return `${baseCommand}${projectName}${flagString}`;
 }