feat(tooling-ci): Improved explorer release process

.github/workflows/_vercel_deploy.yml

@@ -40,14 +40,16 @@ jobs:
     secrets: inherit
     with:
       isProd: false
+      isStaging: false
 
-  explorer-prod:
-    name: Vercel Explorer Production
+  explorer-staging:
+    name: Vercel Explorer Staging
     if: inputs.isDevelop
     uses: ./.github/workflows/apps_explorer_deploy.yml
     secrets: inherit
     with:
-      isProd: true
+      isProd: false
+      isStaging: true
 
   ui-kit-preview:
     name: Vercel UI Kit Preview

.github/workflows/apps_explorer_deploy.yml

@@ -3,14 +3,25 @@ name: Deploy for Explorer
 env:
   VERCEL_ORG_ID: ${{ secrets.VERCEL_ORG_ID }}
   VERCEL_PROJECT_ID: ${{ secrets.EXPLORER_VERCEL_PROJECT_ID }}
+  EXPLORER_VERCEL_PROJECT_STAGING_URL: ${{ secrets.EXPLORER_VERCEL_PROJECT_STAGING_URL }}
 
 on:
   workflow_dispatch:
+    inputs:
+      isProd:
+        type: boolean
+        required: true
+      isStaging:
+        type: boolean
+        required: true
   workflow_call:
     inputs:
       isProd:
         type: boolean
         required: true
+      isStaging:
+        type: boolean
+        required: true
 
 jobs:
   deploy:
@@ -64,6 +75,9 @@ jobs:
         id: deploy_url
         if: ${{ inputs.isProd == false }}
         run: echo "DEPLOY_URL=$(cat vercel_output.txt | awk 'END{print}')" >> $GITHUB_OUTPUT
+      - name: Alias Staging deploy
+        if: ${{ inputs.isStaging }}
+        run: vercel alias ${{ steps.deploy_url.outputs.DEPLOY_URL }} $EXPLORER_VERCEL_PROJECT_STAGING_URL --token=${{ secrets.VERCEL_TOKEN }}
       - name: Comment on pull request
         if: ${{ inputs.isProd == false }}
         uses: actions/github-script@60a0d83039c74a4aee543508d2ffcb1c3799cdea # pin@v7

apps/explorer/src/components/footer/Footer.tsx

@@ -45,6 +45,7 @@ function Footer(): JSX.Element {
             <div className="mt-4 flex justify-center pt-5 text-neutral-10 md:hidden md:self-start">
                 <IotaLogoWeb width={137} height={36} />
             </div>
+            <p className="mt-8 w-full text-center text-body-sm text-neutral-40">{EXPLORER_REV}</p>
         </footer>
     );
 }

apps/explorer/src/vite-env.d.ts

@@ -4,3 +4,5 @@
 
 /// <reference types="vite/client" />
 /// <reference types="vite-plugin-svgr/client" />
+
+declare const EXPLORER_REV: string;

apps/explorer/vite.config.ts

@@ -4,11 +4,13 @@
 
 /// <reference types="vitest" />
 import react from '@vitejs/plugin-react';
+import { execSync } from 'child_process';
 import { defineConfig } from 'vite';
 import svgr from 'vite-plugin-svgr';
 import { configDefaults } from 'vitest/config';
 
 process.env.VITE_VERCEL_ENV = process.env.VERCEL_ENV || 'development';
+const EXPLORER_REV = execSync('git rev-parse HEAD').toString().trim().toString();
 
 // https://vitejs.dev/config/
 export default defineConfig({
@@ -30,4 +32,7 @@ export default defineConfig({
             '~': new URL('./src', import.meta.url).pathname,
         },
     },
+    define: {
+        EXPLORER_REV: JSON.stringify(EXPLORER_REV),
+    },
 });