fix: set GHCS domain name and port visibility

.devcontainer/devcontainer.json

@@ -0,0 +1,35 @@
+// For format details, see https://aka.ms/devcontainer.json. For config options, see the
+// README at: https://github.com/devcontainers/templates/tree/main/src/javascript-node
+{
+	"name": "Node.js",
+	// Or use a Dockerfile or Docker Compose file. More info: https://containers.dev/guide/dockerfile
+	"image": "mcr.microsoft.com/devcontainers/javascript-node:1-18-bookworm",
+
+	// Use 'forwardPorts' to make a list of ports inside the container available locally.
+	"forwardPorts": [5173, 1317, 26657, 26656],
+	"portsAttributes": {
+      "5173": {
+        "label": "UI",
+        "onAutoForward": "openBrowser"
+      },
+      "1317": {
+        "label": "API",
+        "onAutoForward": "silent"
+      },
+      "26657": {
+          "label": "RPC",
+          "onAutoForward": "silent"
+      },
+      "26656": {
+        "label": "P2P",
+        "onAutoForward": "silent"
+      }
+	},
+	// Use 'postCreateCommand' to run commands after the container is created.
+	"postCreateCommand": "bash /workspaces/dapp-offer-up/make_ports_public.sh 26657 5173 1317",
+	"postStartCommand": "yarn install",
+	"features": {
+		"ghcr.io/devcontainers/features/docker-in-docker:2": {},
+		"ghcr.io/devcontainers/features/github-cli:1": {}
+	}
+}

make_ports_public.sh

@@ -0,0 +1,19 @@
+#!/bin/bash
+set -x
+
+# Function to change port visibility to public
+change_port_visibility() {
+  local port=$1
+  gh codespace ports visibility $port:public -c $CODESPACE_NAME
+}
+
+# Check if at least one port is provided
+if [ $# -eq 0 ]; then
+  echo "Usage: $0 <port1> [port2 ... portN]"
+  exit 1
+fi
+
+# Loop through each provided port and change its visibility to public
+for port in "$@"; do
+  change_port_visibility $port
+done

ui/package.json

@@ -4,7 +4,7 @@
   "version": "0.0.0",
   "type": "module",
   "scripts": {
-    "dev": "vite",
+    "dev": "export VITE_HOSTNAME=$CODESPACE_NAME && export VITE_GITHUB_CODESPACES_PORT_FORWARDING_DOMAIN=$GITHUB_CODESPACES_PORT_FORWARDING_DOMAIN && vite",
     "build": "tsc && vite build",
     "test": "vitest spec",
     "test:e2e": "SKIP_EXTENSION_SETUP=true EXTENSION=keplr synpress run --configFile=test/e2e/synpress.config.cjs",

ui/src/App.tsx

@@ -25,6 +25,14 @@ const ENDPOINTS = {
   API: 'http://localhost:1317',
 };
 
+const codeSpaceHostName = import.meta.env.VITE_HOSTNAME;
+const codeSpaceDomain = import.meta.env.VITE_GITHUB_CODESPACES_PORT_FORWARDING_DOMAIN;
+
+if (codeSpaceHostName) {
+  ENDPOINTS.API = `https://${codeSpaceHostName}-1317.${codeSpaceDomain}`;
+  ENDPOINTS.RPC = `https://${codeSpaceHostName}-26657.${codeSpaceDomain}`;
+}
+
 const watcher = makeAgoricChainStorageWatcher(ENDPOINTS.API, 'agoriclocal');
 
 interface AppState {