feat(gh-bin): download progress (#275)

Author: hi-ogawa

packages/gh-bin/CHANGELOG.md

@@ -0,0 +1,5 @@
+# Changelog
+
+## v0.1.2 (2025-05-27)
+
+- feat(gh-bin): download progress

packages/gh-bin/README.md

@@ -19,7 +19,7 @@ $ npx gh-bin --help
 
 ```txt
 $ npx gh-bin --help
-gh-bin@0.1.1
+gh-bin@0.1.2
 
 Usage:
   npx gh-bin https://github.com/<owner>/<repo>

packages/gh-bin/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gh-bin",
-  "version": "0.1.1",
+  "version": "0.1.2",
   "homepage": "https://github.com/hi-ogawa/js-utils/tree/main/packages/gh-bin",
   "repository": {
     "type": "git",

packages/gh-bin/src/cli.ts

@@ -61,36 +61,64 @@ async function main() {
 
   // prompt which files to download from assets
   // TODO: reorder by matching arch/os/platform
-  const selectedAsset = await prompts.select<string>({
+  const selectedAssetMeta = await prompts.select<{
+    name: string;
+    browser_download_url: string;
+  }>({
     message: "Select an asset to download",
     options: assets.map((asset: any) => ({
       label: asset.name,
-      value: asset.browser_download_url,
+      value: asset,
     })),
   });
-  if (prompts.isCancel(selectedAsset)) {
+  if (prompts.isCancel(selectedAssetMeta)) {
     return;
   }
 
   // download a selected asset
+  const selectedAsset = selectedAssetMeta.name;
+  const selectedAssetUrl = selectedAssetMeta.browser_download_url;
   const downloadSpinner = prompts.spinner();
   downloadSpinner.start(`Downloading ${selectedAsset}`);
   let tmpAssetPath = path.join(
     os.tmpdir(),
     `gh-bin-asset-${owner}-${repo}${path.extname(selectedAsset)}`
   );
   try {
-    const res = await fetch(selectedAsset);
+    const res = await fetch(selectedAssetUrl);
     if (!res.ok || !res.body) {
-      console.error(`[ERROR] Failed to download '${selectedAsset}'\n`);
+      console.error(`[ERROR] Failed to download '${selectedAssetUrl}'\n`);
       process.exit(1);
     }
-    await fs.promises.writeFile(
-      tmpAssetPath,
-      Readable.fromWeb(res.body as any)
+    const contentLength = res.headers.get("content-length");
+    const total = contentLength ? Number(contentLength) : null;
+    let current = 0;
+    const stream = res.body.pipeThrough(
+      new TransformStream({
+        transform(chunk, controller) {
+          controller.enqueue(chunk);
+          current += chunk.byteLength;
+          if (total) {
+            downloadSpinner.message(
+              `Downloading ${selectedAsset} (${prettyBytes(total)} - ${((100 * current) / total!).toFixed(2)}%)`
+            );
+          } else {
+            downloadSpinner.message(
+              `Downloading ${selectedAsset} (${prettyBytes(current)})`
+            );
+          }
+        },
+        flush() {
+          downloadSpinner.stop(
+            `Download success ${selectedAsset} (${prettyBytes(current)})`
+          );
+        },
+      })
     );
-  } finally {
-    downloadSpinner.stop(`Downloaded ${selectedAsset}`);
+    await fs.promises.writeFile(tmpAssetPath, Readable.fromWeb(stream as any));
+  } catch (e) {
+    downloadSpinner.stop(`Failed to download '${selectedAssetUrl}'`);
+    throw e;
   }
 
   let defaultBinName = repo;
@@ -166,6 +194,12 @@ async function main() {
   console.log(`Executable is installed in ${destPath}`);
 }
 
+function prettyBytes(bytes: number): string {
+  return bytes > 1024
+    ? `${(bytes / (1024 * 1024)).toFixed(2)} MB`
+    : `${(bytes / 1024).toFixed(2)} KB`;
+}
+
 async function fetchGhApi(url: string) {
   const res = await fetch(url, {
     headers: {