Skip to content

Commit c00c75a

Browse files
rajbosrajbos
committed
Generated by Spark: can you create a workflow to publish the SPA into github pages for me
1 parent ed0149f commit c00c75a

5 files changed

Lines changed: 242 additions & 16 deletions

File tree

‎.github/workflows/deploy-to-pages.yml‎

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
name: Deploy to GitHub Pages
2+
3+
on:
4+
# Runs on pushes targeting the default branch
5+
push:
6+
branches: ["main"]
7+
8+
# Allows you to run this workflow manually from the Actions tab
9+
workflow_dispatch:
10+
11+
# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
12+
permissions:
13+
contents: read
14+
pages: write
15+
id-token: write
16+
17+
# Allow only one concurrent deployment
18+
concurrency:
19+
group: "pages"
20+
cancel-in-progress: true
21+
22+
jobs:
23+
# Build job
24+
build:
25+
runs-on: ubuntu-latest
26+
steps:
27+
- name: Checkout
28+
uses: actions/checkout@v4
29+
30+
- name: Setup Node
31+
uses: actions/setup-node@v4
32+
with:
33+
node-version: "22"
34+
cache: 'npm'
35+
36+
- name: Install dependencies
37+
run: npm ci
38+
39+
- name: Update Vite config for GitHub Pages
40+
run: |
41+
# Add base path to vite.config.ts for GitHub Pages
42+
sed -i 's/build: {/build: {\n base: "\/spark-template\/",/' vite.config.ts
43+
44+
- name: Build
45+
run: npm run build
46+
47+
- name: Setup Pages
48+
uses: actions/configure-pages@v4
49+
50+
- name: Upload artifact
51+
uses: actions/upload-pages-artifact@v3
52+
with:
53+
path: './dist'
54+
55+
# Deployment job
56+
deploy:
57+
environment:
58+
name: github-pages
59+
url: ${{ steps.deployment.outputs.page_url }}
60+
runs-on: ubuntu-latest
61+
needs: build
62+
steps:
63+
- name: Deploy to GitHub Pages
64+
id: deployment
65+
uses: actions/deploy-pages@v4

‎GITHUB_PAGES_DEPLOY.md‎

Lines changed: 72 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
# Deploying to GitHub Pages
2+
3+
This document explains how to deploy the GitHub Copilot Usage Analyzer to GitHub Pages.
4+
5+
## Automated Deployment
6+
7+
This project includes a GitHub Actions workflow that automatically builds and deploys the application to GitHub Pages whenever changes are pushed to the `main` branch.
8+
9+
### How It Works
10+
11+
1. The workflow `.github/workflows/deploy-to-pages.yml` is triggered on pushes to the `main` branch or manually from the Actions tab.
12+
2. It builds the application and configures it for GitHub Pages deployment with the correct base path.
13+
3. The built application is deployed to GitHub Pages automatically.
14+
15+
### Setting Up GitHub Pages
16+
17+
To enable GitHub Pages deployment for this repository:
18+
19+
1. Go to your repository on GitHub
20+
2. Click on "Settings"
21+
3. Navigate to "Pages" in the left sidebar
22+
4. Under "Build and deployment" > "Source", select "GitHub Actions"
23+
5. The workflow will now be able to deploy to GitHub Pages
24+
25+
## Manual Deployment
26+
27+
If you prefer to deploy manually or need to test locally first:
28+
29+
1. Update the base path in `vite.config.ts`:
30+
31+
```typescript
32+
build: {
33+
outDir: process.env.OUTPUT_DIR || 'dist',
34+
base: "/spark-template/" // Add this line (replace with your repo name)
35+
}
36+
```
37+
38+
2. Build the application:
39+
40+
```bash
41+
npm run build
42+
```
43+
44+
3. Test the build locally:
45+
46+
```bash
47+
npm run preview
48+
```
49+
50+
4. Deploy the contents of the `dist` directory to GitHub Pages using your preferred method.
51+
52+
## Accessing Your Deployed Application
53+
54+
Once deployed, your application will be available at:
55+
`https://[your-github-username].github.io/spark-template/`
56+
57+
## Troubleshooting
58+
59+
If you encounter any issues with the deployment:
60+
61+
1. Check the GitHub Actions logs for any error messages
62+
2. Ensure GitHub Pages is properly configured in your repository settings
63+
3. Verify that the base path in the Vite configuration matches your repository name
64+
4. Check that the repository has proper permissions set for GitHub Pages deployment
65+
66+
## Note About App Functionality
67+
68+
When deployed to GitHub Pages, be aware that:
69+
70+
1. The application is entirely client-side - all data processing happens in the browser
71+
2. No data is sent to any server when using the CSV upload feature
72+
3. If your CSV files are large, performance will depend on the user's device capabilities

‎README.md‎

Lines changed: 35 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,42 @@
1-
# ✨ Welcome to Your Spark Template!
2-
You've just launched your brand-new Spark Template Codespace — everything’s fired up and ready for you to explore, build, and create with Spark!
1+
# GitHub Copilot Usage Analyzer
32

4-
This template is your blank canvas. It comes with a minimal setup to help you get started quickly with Spark development.
3+
A web application that visualizes GitHub Copilot premium request usage to help teams monitor and optimize their AI resource consumption.
54

6-
🚀 What's Inside?
7-
- A clean, minimal Spark environment
8-
- Pre-configured for local development
9-
- Ready to scale with your ideas
10-
11-
🧠 What Can You Do?
5+
## Features
126

13-
Right now, this is just a starting point — the perfect place to begin building and testing your Spark applications.
7+
- Upload GitHub Copilot usage CSV exports
8+
- View stacked line graph of compliant vs. exceeding requests
9+
- See daily usage patterns by model
10+
- Analyze model-specific usage statistics
11+
- Interactive visualizations with tooltips for detailed information
1412

15-
🧹 Just Exploring?
16-
No problem! If you were just checking things out and don’t need to keep this code:
13+
## Getting Started
1714

18-
- Simply delete your Spark.
19-
- Everything will be cleaned up — no traces left behind.
15+
### Development
2016

21-
📄 License For Spark Template Resources
17+
1. Clone this repository
18+
2. Install dependencies: `npm install`
19+
3. Start development server: `npm run dev`
20+
4. Open your browser to http://localhost:5000
2221

23-
The Spark Template files and resources from GitHub are licensed under the terms of the MIT license, Copyright GitHub, Inc.
22+
### Build
23+
24+
To build the application for production:
25+
26+
```bash
27+
npm run build
28+
```
29+
30+
## Deployment
31+
32+
This project is configured for automatic deployment to GitHub Pages.
33+
34+
### GitHub Pages Deployment
35+
36+
The project includes a GitHub Actions workflow that will automatically build and deploy the application whenever changes are pushed to the main branch.
37+
38+
For detailed instructions on setting up and using GitHub Pages deployment, please see [GITHUB_PAGES_DEPLOY.md](GITHUB_PAGES_DEPLOY.md).
39+
40+
## License
41+
42+
The Spark Template files and resources from GitHub are licensed under the terms of the MIT license, Copyright GitHub, Inc.

‎deploy-to-pages.sh‎

Lines changed: 69 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,69 @@
1+
#!/bin/bash
2+
3+
# Script to deploy the GitHub Copilot Usage Analyzer to GitHub Pages manually
4+
5+
# Exit on error
6+
set -e
7+
8+
# Variables - update these
9+
GITHUB_USERNAME=$(git config user.name)
10+
REPO_NAME="spark-template"
11+
12+
# Check if git is installed
13+
if ! command -v git &> /dev/null; then
14+
echo "Error: git is not installed."
15+
exit 1
16+
fi
17+
18+
# Check if we're in a git repository
19+
if ! git rev-parse --is-inside-work-tree &> /dev/null; then
20+
echo "Error: Not in a git repository."
21+
exit 1
22+
fi
23+
24+
# Build the application with correct base path
25+
echo "Building application for GitHub Pages..."
26+
export VITE_BASE_PATH="/${REPO_NAME}/"
27+
28+
# Create a temporary build config with the base path
29+
cat > temp-vite.config.ts <<EOF
30+
$(cat vite.config.ts | sed "s/build: {/build: {\n base: '\/${REPO_NAME}\/',/")
31+
EOF
32+
33+
# Build with temporary config
34+
mv temp-vite.config.ts vite.config.ts
35+
npm run build
36+
git checkout -- vite.config.ts
37+
38+
echo "Build completed successfully."
39+
40+
# Create or navigate to gh-pages branch
41+
if git show-ref --quiet refs/heads/gh-pages; then
42+
echo "Checking out existing gh-pages branch..."
43+
git checkout gh-pages
44+
# Remove all files except .git
45+
find . -mindepth 1 -maxdepth 1 -not -name .git -exec rm -rf {} \;
46+
else
47+
echo "Creating new gh-pages branch..."
48+
git checkout --orphan gh-pages
49+
git rm -rf .
50+
fi
51+
52+
# Copy the build files
53+
echo "Copying build files..."
54+
cp -r dist/* .
55+
touch .nojekyll
56+
57+
# Commit and push
58+
echo "Committing changes..."
59+
git add .
60+
git commit -m "Deploy to GitHub Pages: $(date)"
61+
62+
echo "Pushing to GitHub..."
63+
git push -u origin gh-pages
64+
65+
# Return to the main branch
66+
git checkout main
67+
68+
echo "Deployment complete!"
69+
echo "Your application should be available at: https://${GITHUB_USERNAME}.github.io/${REPO_NAME}/"

‎src/prd.md‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -116,6 +116,7 @@
116116
- **Scalability Needs**: Potential for additional chart types or filtering options in the future
117117
- **Testing Focus**: Validate with various CSV formats and sizes
118118
- **Critical Questions**: How to optimize performance for large datasets?
119+
- **Deployment Strategy**: Configured for GitHub Pages deployment to enable simple sharing and access without requiring server infrastructure
119120

120121
## Reflection
121122
- This approach uniquely focuses on simplicity and clarity for a technical audience needing quick insights.

0 commit comments

Comments
 (0)