Implement UI build pipeline

.github/workflows/development-cleanup.yml

@@ -0,0 +1,87 @@
+name: Cleanup Dev
+
+on:
+  pull_request:
+    types: [closed]
+
+jobs:
+  cleanup-ui-pr-preview:
+    permissions:
+      contents: write
+      id-token: 'write'
+      issues: write
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Check out gh-pages branch
+        uses: actions/checkout@v3
+        with:
+          ref: gh-pages
+          fetch-depth: 1
+
+      - name: Check if preview directory exists
+        id: check-preview
+        run: |
+          if [ -d "ui/pr/${{ github.event.pull_request.number }}" ]; then
+            echo "preview_exists=true" >> $GITHUB_OUTPUT
+            echo "Preview directory exists for PR #${{ github.event.pull_request.number }}"
+          else
+            echo "preview_exists=false" >> $GITHUB_OUTPUT
+            echo "No preview directory found for PR #${{ github.event.pull_request.number }}"
+          fi
+
+      - name: Create an empty directory for cleanup
+        if: steps.check-preview.outputs.preview_exists == 'true'
+        run: mkdir -p empty
+
+      - name: Remove GitHub Pages Build
+        if: steps.check-preview.outputs.preview_exists == 'true'
+        uses: peaceiris/actions-gh-pages@v3
+        with:
+          github_token: ${{ secrets.GITHUB_TOKEN }}
+          publish_dir: ./empty
+          destination_dir: ui/pr/${{ github.event.pull_request.number }}
+          keep_files: false
+          user_name: ${{ github.actor }}
+          user_email: ${{ github.actor }}@users.noreply.github.com
+          publish_branch: gh-pages
+          commit_message: 'chore: Clean up preview for PR #${{ github.event.pull_request.number }}'
+
+      - name: Log Cleanup Completion
+        run: echo "Cleanup completed for PR \#${{ github.event.pull_request.number }}"
+
+  update-preview-comment:
+    needs: [cleanup-ui-pr-preview]
+    name: Update PR Comment
+    permissions:
+      pull-requests: write
+      issues: write
+    runs-on: ubuntu-latest
+    steps:
+      - name: Update PR comment to reflect cleanup
+        uses: peter-evans/find-comment@v2
+        id: find-comment
+        with:
+          token: ${{ secrets.GITHUB_TOKEN }}
+          issue-number: ${{ github.event.pull_request.number }}
+          body-includes: '<!-- pr-preview-comment -->'
+
+      - name: Update PR comment to reflect cleanup
+        if: steps.find-comment.outputs.comment-id != ''
+        uses: peter-evans/create-or-update-comment@v3
+        with:
+          token: ${{ secrets.GITHUB_TOKEN }}
+          comment-id: ${{ steps.find-comment.outputs.comment-id }}
+          issue-number: ${{ github.event.pull_request.number }}
+          edit-mode: replace
+          body: |
+            <!-- pr-preview-comment -->
+            🧹 The live preview for this PR has been removed.
+
+      - name: Log comment update status
+        run: |
+          if [ "${{ steps.find-comment.outputs.comment-id }}" != "" ]; then
+            echo "Updated existing preview comment"
+          else
+            echo "No preview comment found to update"
+          fi

.github/workflows/development.yml

@@ -1,7 +1,7 @@
 name: Development
 
 on:
-  pull_request_target:
+  pull_request:
     types: [opened, synchronize, reopened]
 
 jobs:
@@ -29,6 +29,11 @@ jobs:
       - name: Check out code
         uses: actions/checkout@v3
 
+      - name: Set up Node.js 22
+        uses: actions/setup-node@v4
+        with:
+          node-version: '22'
+
       - name: Install dependencies
         run: npm ci
 
@@ -59,6 +64,11 @@ jobs:
       - name: Check out code
         uses: actions/checkout@v3
 
+      - name: Set up Node.js 22
+        uses: actions/setup-node@v4
+        with:
+          node-version: '22'
+
       - name: Install dependencies
         run: npm ci
 
@@ -81,14 +91,19 @@ jobs:
       - name: Run pre-commit checks
         run: SKIP=ruff-format pre-commit run --all-files
 
-  ui-precommit-check:
+  ui-precommit-checks:
     permissions:
       contents: "read"
     runs-on: ubuntu-latest
     steps:
       - name: Check out code
         uses: actions/checkout@v3
 
+      - name: Set up Node.js 22
+        uses: actions/setup-node@v4
+        with:
+          node-version: '22'
+
       - name: Install dependencies
         run: npm ci
 
@@ -119,6 +134,11 @@ jobs:
       - name: Check out code
         uses: actions/checkout@v3
 
+      - name: Set up Node.js 22
+        uses: actions/setup-node@v4
+        with:
+          node-version: '22'
+
       - name: Install dependencies
         run: npm ci
 
@@ -149,6 +169,11 @@ jobs:
       - name: Check out code
         uses: actions/checkout@v3
 
+      - name: Set up Node.js 22
+        uses: actions/setup-node@v4
+        with:
+          node-version: '22'
+
       - name: Install dependencies
         run: npm ci
 
@@ -205,3 +230,102 @@ jobs:
               They will be retained for **up to 30 days**.
               `
             })
+
+  ui-pr-preview:
+    needs: [ui-quality-checks, ui-precommit-checks, ui-unit-tests, ui-integration-tests]
+    permissions:
+      contents: write
+      pull-requests: write
+      issues: write
+    runs-on: ubuntu-latest
+    steps:
+      - name: Check out code
+        uses: actions/checkout@v3
+        with:
+          fetch-depth: 0
+
+      - name: Check if UI-related files changed
+        id: check-changes
+        run: |
+          BASE_BRANCH=${{ github.event.pull_request.base.ref }}
+          CHANGED_FILES=$(git diff --name-only origin/$BASE_BRANCH...HEAD)
+          SHOULD_BUILD=false
+
+          if echo "$CHANGED_FILES" | grep -q "^src/ui/"; then
+            echo "UI source files changed"
+            SHOULD_BUILD=true
+          fi
+
+          echo "should_build=$SHOULD_BUILD" >> $GITHUB_OUTPUT
+          echo "Should build: $SHOULD_BUILD"
+
+      - name: Install dependencies
+        if: steps.check-changes.outputs.should_build == 'true'
+        run: npm ci
+
+      - name: Build app to root
+        if: steps.check-changes.outputs.should_build == 'true'
+        id: build
+        run: |
+          # Export vars to ensure they are loaded before build
+          export $(grep -v '^#' .env.development | xargs)
+
+          PR_NUMBER=${{ github.event.pull_request.number }}
+          echo "pr_number=${PR_NUMBER}" >> $GITHUB_OUTPUT
+
+          # Set asset prefix and base path with PR number
+          ASSET_PREFIX=https://neuralmagic.github.io/guidellm/ui/pr/${PR_NUMBER}
+          USE_MOCK_DATA=true
+          BASE_PATH=/ui/pr/${PR_NUMBER}
+          GIT_SHA=${{ github.sha }}
+          export ASSET_PREFIX=${ASSET_PREFIX}
+          export BASE_PATH=${BASE_PATH}
+          export GIT_SHA=${GIT_SHA}
+          export USE_MOCK_DATA=${USE_MOCK_DATA}
+          npm run build
+
+      - name: Deploy to GitHub Pages
+        if: steps.check-changes.outputs.should_build == 'true'
+        uses: peaceiris/actions-gh-pages@v3
+        with:
+          github_token: ${{ secrets.GITHUB_TOKEN }}
+          publish_dir: ./src/ui/out
+          destination_dir: ui/pr/${{ steps.build.outputs.pr_number }}
+          keep_files: false
+          user_name: ${{ github.actor }}
+          user_email: ${{ github.actor }}@users.noreply.github.com
+          publish_branch: gh-pages
+          commit_message: 'build: Deploy preview build for PR #${{ github.event.pull_request.number }}'
+
+      - name: Set deployment url
+        if: steps.check-changes.outputs.should_build == 'true'
+        id: deploy
+        run: |
+          DEPLOY_URL=https://neuralmagic.github.io/guidellm/ui/pr/${{ steps.build.outputs.pr_number }}
+          echo "url=${DEPLOY_URL}" >> $GITHUB_OUTPUT
+
+      - name: Find PR comment
+        if: steps.check-changes.outputs.should_build == 'true'
+        uses: peter-evans/find-comment@v2
+        id: find-comment
+        with:
+          token: ${{ secrets.GITHUB_TOKEN }}
+          issue-number: ${{ github.event.pull_request.number }}
+          body-includes: '<!-- pr-preview-comment -->'
+
+      - name: Post Deployment URL to PR
+        if: steps.check-changes.outputs.should_build == 'true'
+        uses: peter-evans/create-or-update-comment@v3
+        with:
+          token: ${{ secrets.GITHUB_TOKEN }}
+          comment-id: ${{ steps.find-comment.outputs.comment-id }}
+          issue-number: ${{ github.event.pull_request.number }}
+          edit-mode: replace
+          body: |
+            <!-- pr-preview-comment -->
+            🎉 **Live Preview:** [Click here to view the live version](${{ steps.deploy.outputs.url }})
+            *Last updated: ${{ github.sha }}*
+
+      - name: Skip build notification
+        if: steps.check-changes.outputs.should_build == 'false'
+        run: echo "Skipping UI preview build - no relevant files changed"