finops-toolkit
finops-toolkit copied to clipboard
Add GitHub Pages workflow for UX deployment
🛠️ Description
Added a new GitHub Actions workflow to automatically deploy the UX application to GitHub Pages. This workflow builds and deploys the web application whenever changes are pushed to the pages-action-ux branch or when manually triggered.
Changes
- Created new workflow file ux-pages.yml for GitHub Pages deployment
- Set up proper permissions for GitHub Pages deployment
- Configured workflow to:
- Install dependencies
- Build the application
- Deploy to GitHub Pages environment
- Added concurrency settings to prevent concurrent deployments
- updated the vite.config.yml to set the base to /finops-toolkit/ branch
- updated the router basename configuration for GitHub Pages support
- Fixed an issue where the background image in the Showcase component wasn't loading properly in the production build. The problem was caused by an incorrect relative path reference to the image asset.
Implementation Details
- Uses Node.js 20 for the build process
- Builds from the web directory
- Uploads the built artifacts from dist
- Includes debugging step to list build output before deployment
Usage
Prequisite to run the workflow:
- Workflow yml file (under .github) needs to be merged to the main branch
- Github actions need to be activated and source set to "Github Actions". Go to settings->Pages
- Features/ux branch needs to be allowed to deploy at pages. Set from Settings->Environments-> Deployment branches and tags.
The workflow can be triggered by:
- Pushing to the
features/uxbranch - Manually from the Actions tab in GitHub
The deployed site will be available at the URL provided in the workflow run output.
📷 Screenshots
📋 Checklist
🔬 How did you test this change?
- [ ] 🤏 Lint tests
- [ ] 🤞 PS -WhatIf / az validate
- [x] 👍 Manually deployed + verified
- [ ] 💪 Unit tests
- [ ] 🙌 Integration tests
- [ ] 🚨 This is a breaking change.
- [ ] 🤏 The change is less than 20 lines of code.
📑 Did you update docs/changelog.md?
- [ ] ✅ Updated changelog (required for
devPRs)- [x] ➡️ Will add log in a future PR (feature branch PRs only)
- [ ] ❎ Log not needed (small/internal change)
📖 Did you update documentation?
- [ ] ✅ Public docs in
docs(required fordev)- [ ] ✅ Internal dev docs in
src(required fordev)- [x] ➡️ Will add docs in a future PR (feature branch PRs only)
- [ ] ❎ Docs not needed (small/internal change)
@Ivanmtta can you please review?