From e2cc995fe524fe0ac63aec6c950008b2e58bfadb Mon Sep 17 00:00:00 2001
From: Aaron Klinker <aklinker1@users.noreply.github.com>
Date: Fri, 23 Jun 2023 14:05:24 -0500
Subject: [PATCH] feat: Good looking console output

---
 src/cli/utils/defineCommand.ts |  5 +++--
 src/cli/utils/printHeader.ts   |  2 +-
 src/index.ts                   | 14 +++++++++++++-
 src/types/external.ts          |  1 +
 src/utils/printBuildSummary.ts | 17 ++++++++++++++---
 src/utils/printTable.ts        |  2 +-
 6 files changed, 33 insertions(+), 8 deletions(-)

diff --git a/src/cli/utils/defineCommand.ts b/src/cli/utils/defineCommand.ts
index 698640e3..29acd3b2 100644
--- a/src/cli/utils/defineCommand.ts
+++ b/src/cli/utils/defineCommand.ts
@@ -9,9 +9,10 @@ export function defineCommand(cb: (...args: any[]) => void | Promise<void>) {
 
       await cb(...args);
 
-      consola.success(`Done in ${Date.now() - startTime} ms`);
+      consola.success(`Finished in ${Date.now() - startTime} ms`);
     } catch (err) {
-      consola.fail(`Command failed after ${Date.now() - startTime} ms`, err);
+      consola.fail(`Command failed after ${Date.now() - startTime} ms`);
+      consola.error(err);
       process.exit(1);
     }
   };
diff --git a/src/cli/utils/printHeader.ts b/src/cli/utils/printHeader.ts
index 91c0a789..d82278f0 100644
--- a/src/cli/utils/printHeader.ts
+++ b/src/cli/utils/printHeader.ts
@@ -3,5 +3,5 @@ import { version } from '../..';
 import { consola } from 'consola';
 
 export function printHeader() {
-  consola.log(`\n${pc.dim('Exvite')} ${pc.dim(pc.bold(version))}`);
+  consola.log(`\n${pc.gray('Exvite')} ${pc.gray(pc.bold(version))}`);
 }
diff --git a/src/index.ts b/src/index.ts
index ea0903ce..81c0cf39 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -10,22 +10,34 @@ import { generateTypesDir } from './utils/generateTypesDir';
 export { version } from '../package.json';
 export * from './types/external';
 export * from './utils/defineConfig';
+import pc from 'picocolors';
 
 /**
  * Bundles the extension for production. Returns a promise of the build result.
  */
 export async function build(config: InlineConfig): Promise<BuildOutput> {
   const internalConfig = await getInternalConfig(config, 'build');
+  const verb = internalConfig.command === 'serve' ? 'Prerendering' : 'Building';
+  const target = `${internalConfig.browser}-mv${internalConfig.manifestVersion}`;
+  internalConfig.logger.info(
+    `${verb} ${pc.cyan(target)} for ${pc.cyan(internalConfig.mode)}`,
+  );
+
+  // Cleanup
   await fs.rm(internalConfig.outDir, { recursive: true, force: true });
   await fs.ensureDir(internalConfig.outDir);
 
+  // Build
   const entrypoints = await findEntrypoints(internalConfig);
   await generateTypesDir(entrypoints, internalConfig);
   const output = await buildEntrypoints(entrypoints, internalConfig);
 
+  // Write manifest
   const manifest = await generateMainfest(entrypoints, output, internalConfig);
-  await writeManifest(manifest, internalConfig);
+  await writeManifest(manifest, output, internalConfig);
 
+  // Post-build
+  internalConfig.logger.success('Entrypoints built');
   await printBuildSummary(output, internalConfig);
 
   return output;
diff --git a/src/types/external.ts b/src/types/external.ts
index 6b177617..6bcd4510 100644
--- a/src/types/external.ts
+++ b/src/types/external.ts
@@ -42,6 +42,7 @@ export interface Logger {
   warn(...args: any[]): void;
   error(...args: any[]): void;
   fatal(...args: any[]): void;
+  success(...args: any[]): void;
 }
 
 export interface BaseEntrypoint {
diff --git a/src/utils/printBuildSummary.ts b/src/utils/printBuildSummary.ts
index 05e6a8ab..cca3dc21 100644
--- a/src/utils/printBuildSummary.ts
+++ b/src/utils/printBuildSummary.ts
@@ -17,21 +17,32 @@ export async function printBuildSummary(
     return lWeight - rWeight;
   });
 
+  let totalSize = 0;
+
   const chunkRows: string[][] = await Promise.all(
-    chunks.map(async (chunk) => {
+    chunks.map(async (chunk, i) => {
       const file = [
         relative(process.cwd(), config.outDir) + path.sep,
         chunk.fileName,
       ];
       const ext = extname(chunk.fileName);
+      const prefix = i === chunks.length - 1 ? '  └─' : '  ├─';
       const color = CHUNK_COLORS[ext] ?? DEFAULT_COLOR;
       const stats = await fs.lstat(resolve(config.outDir, chunk.fileName));
+      totalSize += stats.size;
       const size = String(filesize(stats.size));
-      return [`${pc.dim(file[0])}${color(file[1])}`, pc.dim(size)];
+      return [
+        `${pc.gray(prefix)} ${pc.dim(file[0])}${color(file[1])}`,
+        pc.dim(size),
+      ];
     }),
   );
 
-  printTable(config.logger.log, [['Chunks'], ...chunkRows]);
+  printTable(config.logger.log, chunkRows);
+
+  config.logger.log(
+    `${pc.cyan('Σ Total size:')} ${String(filesize(totalSize))}`,
+  );
 }
 
 const DEFAULT_SORT_WEIGHT = 100;
diff --git a/src/utils/printTable.ts b/src/utils/printTable.ts
index 986bd2d8..f01737af 100644
--- a/src/utils/printTable.ts
+++ b/src/utils/printTable.ts
@@ -21,7 +21,7 @@ export function printTable(
       str += col.padEnd(columnWidths[j], ' ');
       if (j !== row.length - 1) str += ''.padEnd(gap, ' ');
     });
-    str += '\n';
+    if (i !== rows.length - 1) str += '\n';
   });
 
   log(str);