Pass branch name to React component

Integrates the current Git branch name into the React component's environment variables.
liam-hq · Dec 20, 2024 · a672599 · a672599
1 parent ff3b794
commit a672599
Show file tree

Hide file tree

Showing 4 changed files with 14 additions and 1 deletion.
diff --git a/.github/workflows/vercel-deploy-erd-sample.yml b/.github/workflows/vercel-deploy-erd-sample.yml
@@ -73,7 +73,6 @@ jobs:
       - name: Update index.html content
         run:  pnpm --filter ${{ matrix.apps.name }} update_dist_content
         working-directory: frontend
-        # if: ${{ main }}
       - name: Build Project Artifacts
         run: vercel build ${{ needs.setup-deployment.outputs.environment == 'production' && '--prod' || '' }}
       - name: Deploy Project Artifacts to Vercel

diff --git a/frontend/packages/cli/src/App.tsx b/frontend/packages/cli/src/App.tsx
@@ -28,6 +28,7 @@ loadSchemaContent()
 const cliVersionData = {
   version: import.meta.env.VITE_CLI_VERSION_VERSION,
   gitHash: import.meta.env.VITE_CLI_VERSION_GIT_HASH,
+  gitBranch: import.meta.env.VITE_CLI_VERSION_GIT_BRANCH,
   isReleasedGitHash:
     import.meta.env.VITE_CLI_VERSION_IS_RELEASED_GIT_HASH === '1',
   date: import.meta.env.VITE_CLI_VERSION_DATE,

diff --git a/frontend/packages/cli/vite-plugins/set-env.ts b/frontend/packages/cli/vite-plugins/set-env.ts
@@ -6,6 +6,7 @@ import { type Plugin, loadEnv } from 'vite'
  * - VITE_CLI_VERSION_VERSION: The current version of the package from package.json.
  * - VITE_CLI_VERSION_IS_RELEASED_GIT_HASH: A flag indicating whether the current GIT hash corresponds to a released tag.
  * - VITE_CLI_VERSION_GIT_HASH: The current GIT commit hash.
+ * - VITE_CLI_VERSION_GIT_BRANCH: The current GIT branch.
  * - VITE_CLI_VERSION_DATE: The commit date of the latest commit.
  *
  * These variables are essential for maintaining version consistency and tracking within the deployment environment.
@@ -20,6 +21,15 @@ export function setEnvPlugin(): Plugin {
     }
   }
 
+  const fetchGitBranch = () => {
+    try {
+      return execSync('git rev-parse --abbrev-ref HEAD').toString().trim()
+    } catch (error) {
+      console.error('Failed to get git branch:', error)
+      return ''
+    }
+  }
+
   const date = () => {
     try {
       const gitDate = execSync('git log -1 --format=%ci').toString().trim()
@@ -56,12 +66,14 @@ export function setEnvPlugin(): Plugin {
 
       const packageJsonVersion = env.npm_package_version
       const gitHash = fetchGitHash()
+      const gitBranch = fetchGitBranch()
 
       process.env.VITE_CLI_VERSION_VERSION = packageJsonVersion
       process.env.VITE_CLI_VERSION_IS_RELEASED_GIT_HASH = JSON.stringify(
         isReleasedGitHash(gitHash, packageJsonVersion),
       )
       process.env.VITE_CLI_VERSION_GIT_HASH = gitHash
+      process.env.VITE_CLI_VERSION_GIT_BRANCH = gitBranch
       process.env.VITE_CLI_VERSION_DATE = date()
     },
   }

diff --git a/frontend/packages/erd-core/src/schemas/cliVersion/schemas.ts b/frontend/packages/erd-core/src/schemas/cliVersion/schemas.ts
@@ -3,6 +3,7 @@ import * as v from 'valibot'
 export const cliVersionSchema = v.object({
   version: v.string(),
   gitHash: v.string(),
+  gitBranch: v.string(),
   isReleasedGitHash: v.boolean(),
   date: v.string(),
 })