fix(explorer): world address cli option as hex (#3155)

Co-authored-by: Kevin Ingersoll <[email protected]>

.changeset/itchy-trees-retire.md

@@ -0,0 +1,5 @@
+---
+"@latticexyz/explorer": patch
+---
+
+Fixed an issue with `--worldAddress` CLI flag being incorrectly interpreted as a number rather a hex string. Additionally, added `--hostname` option for specifying the hostname on which to start the application.

package.json

@@ -58,10 +58,5 @@
   "engines": {
     "node": "^18.20.1",
     "pnpm": "^9.6.0"
-  },
-  "pnpm": {
-    "patchedDependencies": {
-      "[email protected]": "patches/[email protected]"
-    }
   }
 }

packages/explorer/README.md

@@ -45,6 +45,7 @@ The World Explorer accepts the following CLI arguments:
 | `indexerDatabase` | Path to your SQLite indexer database                                | "indexer.db"  |
 | `chainId`         | The chain ID of the network                                         | 31337         |
 | `port`            | The port on which to run the World Explorer                         | 13690         |
+| `hostname`        | The host on which to run the World Explorer                         | 0.0.0.0       |
 | `dev`             | Run the World Explorer in development mode                          | false         |
 
 ## Contributing

packages/explorer/bin/explorer.ts

@@ -1,46 +1,93 @@
 #!/usr/bin/env node
 import { watchFile } from "fs";
 import { readFile } from "fs/promises";
-import minimist from "minimist";
 import path from "path";
 import process from "process";
 import { fileURLToPath } from "url";
+import yargs from "yargs";
 import { ChildProcess, spawn } from "child_process";
 
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = path.dirname(__filename);
 
-const argv = minimist(process.argv.slice(2));
-const port = argv.port || process.env.PORT || 13690;
-const chainId = argv.chainId || process.env.CHAIN_ID || 31337;
-const indexerDatabase = argv.indexerDatabase || process.env.INDEXER_DATABASE || "indexer.db";
-const worldsFile = argv.worldsFile || process.env.WORLDS_FILE || "worlds.json";
-const isDev = !!argv.dev;
+const argv = yargs(process.argv.slice(2))
+  .options({
+    port: {
+      alias: "p",
+      description: "Port number for the server",
+      type: "number",
+      default: process.env.PORT || 13690,
+    },
+    hostname: {
+      alias: "H",
+      description: "Host for the server",
+      type: "string",
+    },
+    chainId: {
+      alias: "c",
+      description: "Chain ID",
+      type: "number",
+      default: process.env.CHAIN_ID || 31337,
+    },
+    indexerDatabase: {
+      alias: "i",
+      description: "Path to the indexer database",
+      type: "string",
+      default: process.env.INDEXER_DATABASE || "indexer.db",
+    },
+    worldsFile: {
+      alias: "w",
+      description: "Path to the worlds.json file",
+      type: "string",
+      default: process.env.WORLDS_FILE || "worlds.json",
+    },
+    dev: {
+      alias: "D",
+      description: "Run in development mode",
+      type: "boolean",
+      default: false,
+    },
+    worldAddress: {
+      alias: "a",
+      description: "World address",
+      type: "string",
+      default: process.env.WORLD_ADDRESS,
+    },
+  })
+  .parseSync();
 
-let worldAddress = argv.worldAddress || process.env.WORLD_ADDRESS || null;
+const { port, hostname, chainId, indexerDatabase, worldsFile, dev } = argv;
+let worldAddress = argv.worldAddress;
 let explorerProcess: ChildProcess;
 
 async function startExplorer() {
-  let command, args;
-
-  if (isDev) {
-    command = "pnpm";
-    args = ["dev"];
+  const env = {
+    ...process.env,
+    WORLD_ADDRESS: worldAddress?.toString(),
+    INDEXER_DATABASE: path.join(process.cwd(), indexerDatabase),
+  };
+
+  if (dev) {
+    explorerProcess = spawn(
+      "node_modules/.bin/next",
+      ["dev", "--port", port.toString(), ...(hostname ? ["--hostname", hostname] : [])],
+      {
+        cwd: path.join(__dirname, ".."),
+        stdio: "inherit",
+        env,
+      },
+    );
   } else {
-    command = "pnpm";
-    args = ["start"];
+    explorerProcess = spawn("node", [".next/standalone/packages/explorer/server.js"], {
+      cwd: path.join(__dirname, ".."),
+      stdio: "inherit",
+      env: {
+        ...env,
+        PORT: port.toString(),
+        HOSTNAME: hostname,
+      },
+    });
   }
-
-  explorerProcess = spawn(command, args, {
-    cwd: __dirname,
-    stdio: "inherit",
-    env: {
-      ...process.env,
-      PORT: port,
-      WORLD_ADDRESS: worldAddress,
-      INDEXER_DATABASE: path.join(process.cwd(), indexerDatabase),
-    },
-  });
 }
 
 async function readWorldsJson() {

packages/explorer/package.json

@@ -45,7 +45,6 @@
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.1.1",
     "lucide-react": "^0.408.0",
-    "minimist": "^1.2.8",
     "next": "14.2.5",
     "query-string": "^9.1.0",
     "react": "^18",
@@ -56,6 +55,7 @@
     "tsup": "^6.7.0",
     "viem": "catalog:",
     "wagmi": "^2.11.1",
+    "yargs": "^17.7.1",
     "zod": "3.23.8",
     "zustand": "^4.3.7"
   },
@@ -66,6 +66,7 @@
     "@types/node": "^18.15.11",
     "@types/react": "18.2.22",
     "@types/react-dom": "18.2.7",
+    "@types/yargs": "^17.0.10",
     "eslint-config-next": "14.2.3",
     "postcss": "^8",
     "prettier": "3.2.5",