Skip to content

Commit 64ae552

Browse files
thinhphoenixthinhphoenix
committed
Setup GitHub Pages deployment
1 parent cfa6f5e commit 64ae552

1 file changed

Lines changed: 53 additions & 59 deletions

File tree

‎npm/index.ts‎

Lines changed: 53 additions & 59 deletions
Original file line numberDiff line numberDiff line change
@@ -7,79 +7,74 @@ import { select as inquirerSelect, input as inquirerInput } from '@inquirer/prom
77
const WORKFLOW_CONTENT_URL = 'https://cdn.jsdelivr.net/gh/ThinhPhoenix/github-pages@main/.github/workflows/deploy.yml';
88
const WORKFLOW_PATH = '.github/workflows/deploy.yml';
99

10-
// Modern color palette - better contrast and cleaner look
10+
// Vite CLI colors
1111
const reset = '\x1b[0m';
1212
const bold = '\x1b[1m';
1313
const dim = '\x1b[2m';
14-
const red = '\x1b[38;5;203m'; // Soft red
15-
const green = '\x1b[38;5;149m'; // Soft green
16-
const yellow = '\x1b[38;5;221m'; // Soft yellow
17-
const blue = '\x1b[38;5;117m'; // Soft blue
18-
const purple = '\x1b[38;5;183m'; // Soft purple
19-
const cyan = '\x1b[38;5;159m'; // Soft cyan
20-
const pink = '\x1b[38;5;218m'; // Soft pink
14+
const red = '\x1b[31m';
15+
const green = '\x1b[32m';
16+
const yellow = '\x1b[33m';
17+
const blue = '\x1b[34m';
18+
const cyan = '\x1b[36m';
19+
const gray = '\x1b[90m';
2120

22-
// Color wrapper functions
2321
const c = {
2422
red: (t: string) => `${red}${t}${reset}`,
2523
green: (t: string) => `${green}${t}${reset}`,
2624
yellow: (t: string) => `${yellow}${t}${reset}`,
2725
blue: (t: string) => `${blue}${t}${reset}`,
28-
purple: (t: string) => `${purple}${t}${reset}`,
2926
cyan: (t: string) => `${cyan}${t}${reset}`,
30-
pink: (t: string) => `${pink}${t}${reset}`,
27+
gray: (t: string) => `${gray}${t}${reset}`,
3128
dim: (t: string) => `${dim}${t}${reset}`,
3229
bold: (t: string) => `${bold}${t}${reset}`,
3330
};
3431

35-
// Modern UI symbols
36-
const symbols = {
32+
const s = {
33+
diamond: '◆',
34+
diamondOutline: '◇',
35+
line: '│',
36+
branch: '└',
3737
check: '✓',
3838
cross: '✗',
3939
arrow: '→',
40-
bullet: '•',
41-
ellipsis: '⋯',
42-
line: '─',
43-
corner: {
44-
tl: '╭',
45-
tr: '╮',
46-
bl: '╰',
47-
br: '╯',
48-
pipe: '│',
49-
}
5040
};
5141

52-
// UI helper functions
53-
function header(text: string) {
54-
const width = 42;
55-
const contentWidth = text.length;
56-
const padding = width - contentWidth - 4;
57-
console.log(`\n ${c.cyan(symbols.corner.tl)}${c.dim(symbols.line.repeat(width))}${c.cyan(symbols.corner.tr)}`);
58-
console.log(` ${c.cyan(symbols.corner.pipe)} ${c.bold(text)}${' '.repeat(padding)} ${c.cyan(symbols.corner.pipe)}`);
59-
console.log(` ${c.cyan(symbols.corner.bl)}${c.dim(symbols.line.repeat(width))}${c.cyan(symbols.corner.br)}`);
42+
let currentStep = 0;
43+
44+
function step(title: string) {
45+
currentStep++;
46+
if (currentStep > 1) {
47+
console.log(`${c.gray(s.line)}`);
48+
}
49+
console.log(`${c.blue(s.diamondOutline)} ${c.bold(title)}`);
6050
}
6151

62-
function success(msg: string) {
63-
console.log(` ${c.green(symbols.check)} ${msg}`);
52+
function item(label: string, value?: string) {
53+
if (value) {
54+
console.log(`${c.gray(s.line)} ${c.dim(label)}`);
55+
console.log(`${c.gray(s.line)} ${c.cyan(value)}`);
56+
} else {
57+
console.log(`${c.gray(s.line)} ${label}`);
58+
}
6459
}
6560

66-
function error(msg: string) {
67-
console.error(`\n ${c.red(symbols.cross)} ${c.bold(msg)}`);
61+
function success(msg: string) {
62+
console.log(`${c.gray(s.line)} ${c.green(s.check)} ${msg}`);
6863
}
6964

70-
function warning(msg: string) {
71-
console.log(` ${c.yellow(symbols.bullet)} ${msg}`);
65+
function error(msg: string) {
66+
console.error(`\n${c.red(s.cross)} ${c.bold(msg)}`);
7267
}
7368

7469
function info(msg: string) {
75-
console.log(` ${c.dim(symbols.ellipsis)} ${msg}`);
70+
console.log(`${c.gray(s.line)} ${c.dim(msg)}`);
7671
}
7772

78-
function step(msg: string) {
79-
console.log(`\n ${c.cyan(symbols.arrow)} ${c.bold(c.cyan(msg))}`);
73+
function end(msg: string) {
74+
console.log(`${c.gray(s.branch)} ${msg}`);
8075
}
8176

82-
// Modern spinner
77+
// Spinner
8378
class Spinner {
8479
private intval: NodeJS.Timeout | null = null;
8580
private frames = ['⠋', '⠙', '⠸', '⠴', '⠦', '⠇'];
@@ -88,18 +83,18 @@ class Spinner {
8883

8984
start(text: string) {
9085
this.text = text;
91-
process.stdout.write(` ${c.dim(this.frames[0])} ${text}`);
86+
process.stdout.write(`${c.gray(s.line)} ${c.dim(this.frames[0])} ${text}`);
9287
this.intval = setInterval(() => {
9388
this.i = (this.i + 1) % this.frames.length;
94-
process.stdout.write(`\r ${c.dim(this.frames[this.i])} ${this.text}`);
89+
process.stdout.write(`\r${c.gray(s.line)} ${c.dim(this.frames[this.i])} ${this.text}`);
9590
}, 80);
9691
}
9792

9893
stop(finalText: string, ok = true) {
9994
if (this.intval) clearInterval(this.intval);
10095
this.intval = null;
101-
const symbol = ok ? c.green(symbols.check) : c.red(symbols.cross);
102-
process.stdout.write(`\r ${symbol} ${finalText}\n`);
96+
const symbol = ok ? c.green(s.check) : c.red(s.cross);
97+
process.stdout.write(`\r${c.gray(s.line)} ${symbol} ${finalText}\n`);
10398
}
10499
}
105100

@@ -152,7 +147,7 @@ function createWorkflow(content: string) {
152147
const dir = '.github/workflows';
153148
if (!existsSync(dir)) mkdirSync(dir, { recursive: true });
154149
writeFileSync(WORKFLOW_PATH, content, 'utf-8');
155-
success(`Created workflow at ${c.blue(WORKFLOW_PATH)}`);
150+
success(`Created workflow at ${c.cyan(WORKFLOW_PATH)}`);
156151
}
157152

158153
async function handleSecrets() {
@@ -164,7 +159,7 @@ async function handleSecrets() {
164159
if (envExists) {
165160
const content = readFileSync(envPath, 'utf-8');
166161
const count = content.split('\n').filter(l => l.trim() && !l.startsWith('#')).length;
167-
info(`Found ${c.purple(count.toString())} secrets in ${c.blue('.env')}`);
162+
item('Found secrets:', `${count} in ${c.cyan('.env')}`);
168163
} else {
169164
info('No .env file detected');
170165
}
@@ -175,13 +170,12 @@ async function handleSecrets() {
175170
]);
176171

177172
if (choice === 'skip') {
178-
info('Skipped. Set manually with:');
173+
end('Skipped. Set manually with:');
179174
console.log(` ${c.dim('$')} ${c.yellow('gh secret set -f .env')}`);
180175
console.log(` ${c.dim('$')} ${c.yellow('gh secret set KEY_NAME')}`);
181176
return;
182177
}
183178

184-
// choice === 'auto'
185179
if (!envExists) {
186180
info('Creating .env template...');
187181
writeFileSync(envPath, '# GitHub Actions Secrets\n# Add secrets below (one per line):\n# EXAMPLE_KEY=example_value\n\n', 'utf-8');
@@ -191,7 +185,7 @@ async function handleSecrets() {
191185
}
192186

193187
if (!existsSync(envPath) || readFileSync(envPath, 'utf-8').trim().length === 0) {
194-
warning('.env is empty, skipping secret upload');
188+
end('⚠ .env is empty, skipping secret upload');
195189
return;
196190
}
197191

@@ -224,7 +218,7 @@ async function handleGit() {
224218
return;
225219
}
226220

227-
info(`Working on branch ${c.purple(branch)}`);
221+
item('Branch:', c.cyan(branch));
228222
exec('git status --short', false);
229223

230224
const msg = await prompt('Commit message?', 'Setup GitHub Pages deployment');
@@ -262,13 +256,13 @@ async function waitForBuild() {
262256
}
263257
} catch {}
264258

265-
process.stdout.write(`\r ${c.dim(symbols.ellipsis)} Elapsed: ${c.dim((i * 5) + 's')}`);
259+
process.stdout.write(`\r${c.gray(s.line)} ${c.dim('⋯')} Elapsed: ${c.dim((i * 5) + 's')}`);
266260
await new Promise(r => setTimeout(r, 5000));
267261
}
268262

269263
process.stdout.write('\r\x1b[K');
270-
warning('Timeout after 5 minutes');
271-
info(`Check status manually: ${c.blue(`https://github.com/${repo}/actions`)}`);
264+
end('⚠ Timeout after 5 minutes');
265+
info(`Check status manually: ${c.cyan(`https://github.com/${repo}/actions`)}`);
272266
return false;
273267
}
274268

@@ -292,7 +286,7 @@ async function enablePages() {
292286

293287
try {
294288
const url = exec(`gh api repos/${repo}/pages --jq .html_url`, true).trim();
295-
console.log(`\n ${c.green(symbols.arrow)} Live URL: ${c.cyan(c.bold(url))}`);
289+
console.log(`\n${c.gray(s.line)} ${c.green(s.arrow)} Live URL: ${c.cyan(c.bold(url))}`);
296290
} catch {
297291
info('Site URL will be available shortly');
298292
}
@@ -311,7 +305,7 @@ async function main() {
311305
// Checks
312306
try { exec('gh --version', true); } catch {
313307
error('GitHub CLI (gh) not found');
314-
info('Install: ' + c.blue('https://cli.github.com'));
308+
info('Install: ' + c.cyan('https://cli.github.com'));
315309
process.exit(1);
316310
}
317311

@@ -365,18 +359,18 @@ async function main() {
365359
const makeLine = (content: string) => {
366360
const visibleLen = stripAnsi(content).length;
367361
const padding = innerWidth - visibleLen;
368-
return ` ${c.green(symbols.corner.pipe)} ${content}${' '.repeat(Math.max(0, padding))} ${c.green(symbols.corner.pipe)}`;
362+
return ` ${c.green('│')} ${content}${' '.repeat(Math.max(0, padding))} ${c.green('│')}`;
369363
};
370364

371365
console.log('');
372-
console.log(` ${c.green(symbols.corner.tl)}${c.green(symbols.line.repeat(innerWidth + 2))}${c.green(symbols.corner.tr)}`);
366+
console.log(` ${c.green('╭')}${c.green('─'.repeat(innerWidth + 2))}${c.green('╮')}`);
373367
console.log(makeLine(''));
374368
console.log(makeLine(`${c.bold('Setup Complete!')} 🎉`));
375369
console.log(makeLine(''));
376370
console.log(makeLine('Your site is being deployed'));
377371
console.log(makeLine('and will be live shortly'));
378372
console.log(makeLine(''));
379-
console.log(` ${c.green(symbols.corner.bl)}${c.green(symbols.line.repeat(innerWidth + 2))}${c.green(symbols.corner.br)}`);
373+
console.log(` ${c.green('╰')}${c.green('─'.repeat(innerWidth + 2))}${c.green('╯')}`);
380374
console.log('');
381375

382376
} catch (err: any) {

0 commit comments

Comments
 (0)