Skip to content

Commit 0bd0c8e

Browse files
colorize the prompts
1 parent cf4ecff commit 0bd0c8e

File tree

6 files changed

+160
-56
lines changed

6 files changed

+160
-56
lines changed

.changeset/stupid-masks-rest.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
"create-better-t-stack": patch
3+
---
4+
5+
colorize the prompts

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

Lines changed: 51 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,14 @@
11
import path from "node:path";
22
import { confirm, select } from "@inquirer/prompts";
3+
import chalk from "chalk";
34
import { $ } from "execa";
45
import fs from "fs-extra";
56
import ora from "ora";
6-
import { DEFAULT_CONFIG } from "./consts";
7-
import { setupTurso } from "./helpers/db-setup";
8-
import type { PackageManager, ProjectConfig } from "./types";
9-
import { getUserPkgManager } from "./utils/get-package-manager";
10-
import { logger } from "./utils/logger";
7+
import { DEFAULT_CONFIG } from "../consts";
8+
import type { PackageManager, ProjectConfig } from "../types";
9+
import { getUserPkgManager } from "../utils/get-package-manager";
10+
import { logger } from "../utils/logger";
11+
import { setupTurso } from "./db-setup";
1112

1213
export async function createProject(options: ProjectConfig) {
1314
const spinner = ora("Creating project directory...").start();
@@ -16,23 +17,27 @@ export async function createProject(options: ProjectConfig) {
1617
try {
1718
await fs.ensureDir(projectDir);
1819
spinner.succeed();
20+
console.log();
1921

2022
spinner.start("Cloning template repository...");
2123
await $`npx degit https://github.com/AmanVarshney01/Better-T-Stack.git ${projectDir}`;
2224
spinner.succeed();
25+
console.log();
2326

2427
const initGit = await confirm({
25-
message: "Initialize a git repository?",
28+
message: chalk.blue.bold("🔄 Initialize a git repository?"),
2629
default: true,
2730
}).catch((error) => {
2831
spinner.stop();
32+
console.log();
2933
throw error;
3034
});
3135

3236
if (initGit) {
3337
spinner.start("Initializing git repository...");
3438
await $`git init ${projectDir}`;
3539
spinner.succeed();
40+
console.log();
3641
}
3742

3843
let packageManager = options.packageManager;
@@ -41,7 +46,11 @@ export async function createProject(options: ProjectConfig) {
4146
const detectedPackageManager = getUserPkgManager();
4247

4348
const useDetectedPackageManager = await confirm({
44-
message: `Use detected package manager (${detectedPackageManager})?`,
49+
message: chalk.blue.bold(
50+
`📦 Use detected package manager (${chalk.cyan(
51+
detectedPackageManager,
52+
)})?`,
53+
),
4554
default: true,
4655
}).catch((error) => {
4756
spinner.stop();
@@ -51,13 +60,34 @@ export async function createProject(options: ProjectConfig) {
5160
if (useDetectedPackageManager) {
5261
packageManager = detectedPackageManager;
5362
} else {
63+
console.log();
5464
packageManager = await select<PackageManager>({
55-
message: "Select package manager:",
65+
message: chalk.blue.bold("📦 Select package manager:"),
5666
choices: [
57-
{ value: "npm", name: "npm" },
58-
{ value: "yarn", name: "yarn" },
59-
{ value: "pnpm", name: "pnpm" },
60-
{ value: "bun", name: "bun" },
67+
{
68+
value: "npm",
69+
name: chalk.yellow("npm"),
70+
description: chalk.dim("Node Package Manager"),
71+
},
72+
{
73+
value: "yarn",
74+
name: chalk.blue("yarn"),
75+
description: chalk.dim(
76+
"Fast, reliable, and secure dependency management",
77+
),
78+
},
79+
{
80+
value: "pnpm",
81+
name: chalk.magenta("pnpm"),
82+
description: chalk.dim(
83+
"Fast, disk space efficient package manager",
84+
),
85+
},
86+
{
87+
value: "bun",
88+
name: chalk.cyan("bun"),
89+
description: chalk.dim("All-in-one JavaScript runtime & toolkit"),
90+
},
6191
],
6292
}).catch((error) => {
6393
spinner.stop();
@@ -66,16 +96,22 @@ export async function createProject(options: ProjectConfig) {
6696
}
6797
}
6898

99+
console.log();
100+
69101
const installDeps = await confirm({
70-
message: `Install dependencies using ${packageManager}?`,
102+
message: chalk.blue.bold(
103+
`📦 Install dependencies using ${chalk.cyan(packageManager)}?`,
104+
),
71105
default: true,
72106
}).catch((error) => {
73107
spinner.stop();
74108
throw error;
75109
});
76110

111+
console.log();
112+
77113
if (installDeps) {
78-
spinner.start(`Installing dependencies using ${packageManager}...`);
114+
spinner.start(`📦 Installing dependencies using ${packageManager}...`);
79115
switch (packageManager ?? DEFAULT_CONFIG.packageManager) {
80116
case "npm":
81117
await $`npm install ${projectDir}`;
@@ -93,6 +129,7 @@ export async function createProject(options: ProjectConfig) {
93129
throw new Error("Unsupported package manager");
94130
}
95131
spinner.succeed();
132+
console.log();
96133
}
97134

98135
if (options.database === "libsql") {

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

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import os from "node:os";
22
import path from "node:path";
33
import { confirm, input } from "@inquirer/prompts";
4+
import chalk from "chalk";
45
import { $ } from "execa";
56
import fs from "fs-extra";
67
import ora, { type Ora } from "ora";
@@ -17,6 +18,7 @@ async function loginToTurso(spinner: Ora) {
1718
spinner.start("Logging in to Turso...");
1819
await $`turso auth login`;
1920
spinner.succeed("Logged in to Turso successfully!");
21+
console.log();
2022
} catch (error) {
2123
spinner.fail("Failed to log in to Turso");
2224
throw error;
@@ -25,6 +27,7 @@ async function loginToTurso(spinner: Ora) {
2527

2628
async function installTursoCLI(isMac: boolean, spinner: Ora) {
2729
try {
30+
console.log();
2831
spinner.start("Installing Turso CLI...");
2932

3033
if (isMac) {
@@ -36,6 +39,7 @@ async function installTursoCLI(isMac: boolean, spinner: Ora) {
3639
}
3740

3841
spinner.succeed("Turso CLI installed successfully!");
42+
console.log();
3943
} catch (error) {
4044
if (error instanceof Error && error.message.includes("User force closed")) {
4145
spinner.stop();
@@ -108,7 +112,7 @@ export async function setupTurso(projectDir: string) {
108112

109113
if (!isCliInstalled) {
110114
const shouldInstall = await confirm({
111-
message: "Would you like to install Turso CLI?",
115+
message: chalk.blue.bold("🔧 Would you like to install Turso CLI?"),
112116
default: true,
113117
}).catch((error) => {
114118
spinner.stop();
@@ -130,8 +134,9 @@ export async function setupTurso(projectDir: string) {
130134
}
131135

132136
const defaultDbName = path.basename(projectDir);
137+
133138
let dbName = await input({
134-
message: `Enter database name (default: ${defaultDbName}):`,
139+
message: chalk.blue.bold("💾 Enter database name:"),
135140
default: defaultDbName,
136141
}).catch((error) => {
137142
spinner.stop();
@@ -141,6 +146,7 @@ export async function setupTurso(projectDir: string) {
141146
let success = false;
142147
while (!success) {
143148
try {
149+
console.log();
144150
spinner.start(`Creating Turso database "${dbName}"...`);
145151
const config = await createTursoDatabase(dbName);
146152
await writeEnvFile(projectDir, config);

apps/cli/src/index.ts

Lines changed: 56 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import { checkbox, confirm, input, select } from "@inquirer/prompts";
22
import chalk from "chalk";
33
import { Command } from "commander";
44
import { DEFAULT_CONFIG } from "./consts";
5-
import { createProject } from "./create-project";
5+
import { createProject } from "./helpers/create-project";
66
import { renderTitle } from "./render-title";
77
import type {
88
PackageManager,
@@ -36,59 +36,65 @@ async function gatherConfig(
3636
config.projectName =
3737
flags.projectName ??
3838
(await input({
39-
message: "Project name:",
39+
message: chalk.blue.bold("📝 Project name:"),
4040
default: "my-better-t-app",
4141
}));
4242

43+
console.log();
44+
4345
if (flags.database) {
4446
config.database = flags.database;
4547
} else {
4648
config.database = await select<ProjectDatabase>({
47-
message: chalk.cyan("Select database:"),
49+
message: chalk.blue.bold("💾 Select database:"),
4850
choices: [
4951
{
5052
value: "libsql",
51-
name: "libSQL",
53+
name: chalk.green("libSQL"),
5254
description: chalk.dim(
53-
"(Recommended) - Turso's embedded SQLite database",
55+
"(Recommended) - Turso's embedded SQLite database",
5456
),
5557
},
5658
{
5759
value: "postgres",
58-
name: "PostgreSQL",
59-
description: chalk.dim("Traditional relational database"),
60+
name: chalk.yellow("PostgreSQL"),
61+
description: chalk.dim("🐘 Traditional relational database"),
6062
},
6163
],
6264
});
6365
}
6466

67+
console.log();
68+
6569
config.auth =
6670
flags.auth ??
6771
(await confirm({
68-
message: "Add authentication with Better-Auth?",
72+
message: chalk.blue.bold("🔐 Add authentication with Better-Auth?"),
6973
default: true,
7074
}));
7175

76+
console.log();
77+
7278
if (flags.features) {
7379
config.features = flags.features;
7480
} else {
7581
config.features = await checkbox<ProjectFeature>({
76-
message: chalk.cyan("Select additional features:"),
82+
message: chalk.blue.bold("🎯 Select additional features:"),
7783
choices: [
7884
{
7985
value: "docker",
80-
name: "Docker setup",
81-
description: chalk.dim("Containerize your application"),
86+
name: chalk.cyan("Docker setup"),
87+
description: chalk.dim("🐳 Containerize your application"),
8288
},
8389
{
8490
value: "github-actions",
85-
name: "GitHub Actions",
86-
description: chalk.dim("CI/CD workflows"),
91+
name: chalk.magenta("GitHub Actions"),
92+
description: chalk.dim("CI/CD workflows"),
8793
},
8894
{
8995
value: "SEO",
90-
name: "Basic SEO setup",
91-
description: chalk.dim("Search engine optimization configuration"),
96+
name: chalk.green("Basic SEO setup"),
97+
description: chalk.dim("🔍 Search engine optimization configuration"),
9298
},
9399
],
94100
});
@@ -100,8 +106,7 @@ async function gatherConfig(
100106
async function main() {
101107
try {
102108
renderTitle();
103-
logger.info("\n🚀 Creating a new Better-T Stack project...\n");
104-
109+
logger.info(chalk.bold(" Creating a new Better-T Stack project...\n"));
105110
program
106111
.name("create-better-t-stack")
107112
.description("Create a new Better-T Stack project")
@@ -140,8 +145,40 @@ async function main() {
140145
: await gatherConfig(flagConfig);
141146

142147
if (options.yes) {
143-
logger.info("Using default configuration");
144-
logger.info(JSON.stringify(config, null, 2));
148+
logger.info(chalk.blue.bold("\n📦 Using default configuration:"));
149+
const colorizedConfig = {
150+
projectName: chalk.green(config.projectName),
151+
database: chalk.yellow(config.database),
152+
auth: chalk.cyan(config.auth),
153+
features: config.features.map((feature) => chalk.magenta(feature)),
154+
git: chalk.cyan(config.git),
155+
};
156+
157+
console.log();
158+
console.log(
159+
chalk.dim("├─") +
160+
chalk.blue(" Project Name: ") +
161+
colorizedConfig.projectName,
162+
);
163+
console.log(
164+
chalk.dim("├─") + chalk.blue(" Database: ") + colorizedConfig.database,
165+
);
166+
console.log(
167+
chalk.dim("├─") +
168+
chalk.blue(" Authentication: ") +
169+
colorizedConfig.auth,
170+
);
171+
console.log(
172+
chalk.dim("├─") +
173+
chalk.blue(" Features: ") +
174+
(colorizedConfig.features.length
175+
? colorizedConfig.features.join(", ")
176+
: chalk.gray("none")),
177+
);
178+
console.log(
179+
chalk.dim("└─") + chalk.blue(" Git Init: ") + colorizedConfig.git,
180+
);
181+
console.log();
145182
}
146183

147184
await createProject(config);
Lines changed: 14 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import chalk from "chalk";
12
import { DEFAULT_CONFIG } from "../consts";
23
import type { ProjectConfig } from "../types";
34
import { getUserPkgManager } from "./get-package-manager";
@@ -7,23 +8,29 @@ export function generateReproducibleCommand(config: ProjectConfig): string {
78
const defaultPackageManager = getUserPkgManager();
89

910
if (config.database !== DEFAULT_CONFIG.database) {
10-
flags.push(`--database ${config.database}`);
11+
flags.push(chalk.cyan(`--database ${config.database}`));
1112
}
13+
1214
if (config.auth !== DEFAULT_CONFIG.auth) {
13-
flags.push("--no-auth");
15+
flags.push(chalk.yellow("--no-auth"));
1416
}
17+
1518
if (
1619
config.packageManager &&
1720
config.packageManager !== defaultPackageManager
1821
) {
19-
flags.push(`--package-manager ${config.packageManager}`);
22+
flags.push(chalk.magenta(`--package-manager ${config.packageManager}`));
2023
}
2124

2225
for (const feature of config.features) {
23-
flags.push(`--${feature}`);
26+
flags.push(chalk.green(`--${feature}`));
2427
}
2528

26-
return `npx create-better-t-stack${
27-
config.projectName ? ` ${config.projectName}` : ""
28-
}${flags.length > 0 ? ` ${flags.join(" ")}` : ""}`;
29+
const baseCommand = chalk.bold("npx create-better-t-stack");
30+
const projectName = config.projectName
31+
? chalk.blue(` ${config.projectName}`)
32+
: "";
33+
const flagString = flags.length > 0 ? ` ${flags.join(" ")}` : "";
34+
35+
return `${baseCommand}${projectName}${flagString}`;
2936
}

0 commit comments

Comments
 (0)