feat: implement version bump workflow and display app version on DashboardPage

.github/workflows/bump-version.yml

@@ -0,0 +1,60 @@
+name: Bump Frontend Version
+
+on:
+  workflow_dispatch:
+    inputs:
+      bump:
+        description: Version bump type
+        required: true
+        default: patch
+        type: choice
+        options:
+          - patch
+          - minor
+          - major
+
+permissions:
+  contents: write
+
+jobs:
+  bump-version:
+    name: Bump frontend package version
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+
+      - name: Set up Node 20
+        uses: actions/setup-node@v4
+        with:
+          node-version: "20"
+
+      - name: Bump frontend version
+        working-directory: frontend
+        run: npm version ${{ inputs.bump }} --no-git-tag-version
+
+      - name: Commit and push version update
+        run: |
+          git config user.name "github-actions[bot]"
+          git config user.email "41898282+github-actions[bot]@users.noreply.github.com"
+          git add frontend/package.json
+          if [ -f frontend/package-lock.json ]; then
+            git add frontend/package-lock.json
+          fi
+          if git diff --cached --quiet; then
+            echo "No version changes to commit"
+            exit 0
+          fi
+          NEW_VERSION=$(node -p "require('./frontend/package.json').version")
+          TAG_NAME="frontend-v${NEW_VERSION}"
+          git commit -m "chore(frontend): bump version to ${NEW_VERSION}"
+          if git rev-parse "${TAG_NAME}" >/dev/null 2>&1; then
+            echo "Tag ${TAG_NAME} already exists"
+            exit 1
+          fi
+          git tag -a "${TAG_NAME}" -m "Frontend ${NEW_VERSION}"
+          git push
+          git push origin "${TAG_NAME}"

frontend/src/__tests__/pages/DashboardPage.test.tsx

@@ -0,0 +1,11 @@
+import { render, screen } from '@testing-library/react'
+import { describe, expect, it } from 'vitest'
+import DashboardPage from '@/pages/DashboardPage'
+
+describe('DashboardPage', () => {
+  it('should_display_app_version_when_rendered', () => {
+    render(<DashboardPage />)
+
+    expect(screen.getByText(/version 0.1.0/i)).toBeInTheDocument()
+  })
+})

frontend/src/pages/DashboardPage.tsx

@@ -1,8 +1,11 @@
 export default function DashboardPage() {
+  const appVersion = __APP_VERSION__
+
   return (
     <div className="p-8">
       <h1 className="text-2xl font-bold text-gray-900">Dashboard</h1>
       <p className="mt-2 text-sm text-gray-500">Dashboard — coming in Step 11.</p>
+      <p className="mt-2 text-xs text-gray-400">Version {appVersion}</p>
     </div>
   )
 }

frontend/src/vite-env.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="vite/client" />
+
+declare const __APP_VERSION__: string

frontend/vite.config.ts

@@ -1,10 +1,14 @@
 import { defineConfig } from 'vite'
 import react from '@vitejs/plugin-react'
 import path from 'path'
+import packageJson from './package.json'
 
 // https://vitejs.dev/config/
 export default defineConfig({
   plugins: [react()],
+  define: {
+    __APP_VERSION__: JSON.stringify(packageJson.version),
+  },
   resolve: {
     alias: {
       '@': path.resolve(__dirname, './src'),