Generated by Spark: > github-copilot-usage-analyzer@1.0.0 build

rajbos · rajbos · commit 90a0d1c6b804 · 2025-06-17T12:06:32.000Z
&gt; vite build

vite v5.4.19 building for production...
transforming...
✓ 3 modules transformed.
x Build failed in 91ms
error during build:
[vite]: Rollup failed to resolve import "@github/spark/spark" from "/home/runner/work/github-copilot-usage/github-copilot-usage/src/main.tsx".
This is most likely unintended because it can break your application at runtime.
If you do want to externalize this module explicitly add it to
`build.rollupOptions.external`
    at viteWarn (file:///home/runner/work/github-copilot-usage/github-copilot-usage/node_modules/vite/dist/node/chunks/dep-C6uTJdX2.js:65839:17)
    at onwarn (file:///home/runner/work/github-copilot-usage/github-copilot-usage/node_modules/@vitejs/plugin-react/dist/index.mjs:282:9)
    at onRollupWarning (file:///home/runner/work/github-copilot-usage/github-copilot-usage/node_modules/vite/dist/node/chunks/dep-C6uTJdX2.js:65869:5)
    at onwarn (file:///home/runner/work/github-copilot-usage/github-copilot-usage/node_modules/vite/dist/node/chunks/dep-C6uTJdX2.js:65534:7)
    at file:///home/runner/work/github-copilot-usage/github-copilot-usage/node_modules/rollup/dist/es/shared/node-entry.js:20557:13
    at Object.logger [as onLog] (file:///home/runner/work/github-copilot-usage/github-copilot-usage/node_modules/rollup/dist/es/shared/node-entry.js:22286:9)
    at ModuleLoader.handleInvalidResolvedId (file:///home/runner/work/github-copilot-usage/github-copilot-usage/node_modules/rollup/dist/es/shared/node-entry.js:21169:26)
    at file:///home/runner/work/github-copilot-usage/github-copilot-usage/node_modules/rollup/dist/es/shared/node-entry.js:21127:26
diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml
@@ -1,68 +1,34 @@
-name: Deploy to GitHub Pages
+name: Deploy GitHub Copilot Usage Analyzer
 
 on:
-  # Runs on pushes targeting the default branch
   push:
-    branches: ['main']
+    branches:
+      - main
 
-  # Allows you to run this workflow manually from the Actions tab
-  workflow_dispatch:
-
-# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
 permissions:
-  contents: read
-  pages: write
-  id-token: write
-
-# Allow only one concurrent deployment
-concurrency:
-  group: "pages"
-  cancel-in-progress: true
+  contents: write
 
 jobs:
-  build:
+  build-and-deploy:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout
-        uses: actions/checkout@v4
+        uses: actions/checkout@v3
+
       - name: Setup Node.js
-        uses: actions/setup-node@v4
+        uses: actions/setup-node@v3
         with:
-          node-version: '20'
+          node-version: 18
           cache: 'npm'
-      - name: Install Dependencies
+
+      - name: Install dependencies
         run: npm ci
-      - name: Create Github Pages Build Setup
-        run: |
-          # Copy the custom main file for GitHub Pages
-          cp src/main-github-pages.tsx src/main.tsx
-          # Create .nojekyll file
-          touch .nojekyll
-          # Update package.json homepage to match repository
-          REPO_NAME="${GITHUB_REPOSITORY#*/}"
-          USERNAME="${GITHUB_REPOSITORY_OWNER}"
-          sed -i "s|https://github.com/pages/\[your-username\]/github-copilot-usage/|https://$USERNAME.github.io/$REPO_NAME/|" package.json
+
       - name: Build
-        run: |
-          # Set NODE_ENV for proper base path
-          export NODE_ENV=production
-          npm run build
-      - name: Upload artifact
-        uses: actions/upload-pages-artifact@v3
-        with:
-          path: './dist'
-          # Add .nojekyll file
-          artifacts: |
-            ./dist
-            ./.nojekyll
+        run: npm run build:pages
 
-  deploy:
-    environment:
-      name: github-pages
-      url: ${{ steps.deployment.outputs.page_url }}
-    runs-on: ubuntu-latest
-    needs: build
-    steps:
       - name: Deploy to GitHub Pages
-        id: deployment
-        uses: actions/deploy-pages@v4
+        uses: JamesIves/github-pages-deploy-action@v4
+        with:
+          folder: dist
+          branch: gh-pages
diff --git a/DEPLOYMENT.md b/DEPLOYMENT.md
@@ -0,0 +1,61 @@
+# Deploying GitHub Copilot Usage Analyzer to GitHub Pages
+
+This document explains how to deploy the GitHub Copilot Usage Analyzer application to GitHub Pages.
+
+## Automatic Deployment with GitHub Actions
+
+This repository includes a GitHub Actions workflow that will automatically build and deploy the application to GitHub Pages whenever changes are pushed to the `main` branch.
+
+### Setup
+
+1. Make sure your repository has GitHub Pages enabled:
+   - Go to your repository on GitHub
+   - Navigate to Settings > Pages
+   - For the Source, select "GitHub Actions"
+
+2. Push your code to the `main` branch:
+   ```bash
+   git add .
+   git commit -m "Ready for deployment"
+   git push origin main
+   ```
+
+3. The GitHub Actions workflow will automatically:
+   - Build the application using the GitHub Pages configuration
+   - Deploy the built files to the `gh-pages` branch
+   - Publish the site to GitHub Pages
+
+4. Once deployed, your site will be available at `https://[your-username].github.io/[repo-name]/`
+
+## Manual Deployment
+
+You can also deploy manually using the npm scripts:
+
+1. Install dependencies if you haven't already:
+   ```bash
+   npm install
+   ```
+
+2. Build and deploy:
+   ```bash
+   npm run deploy
+   ```
+
+This will:
+- Build the application using the GitHub Pages specific configuration
+- Deploy the built files to the `gh-pages` branch
+
+## Configuration
+
+- The application uses a special Vite configuration for GitHub Pages deployment (`vite.github-pages.config.ts`)
+- It uses a special version of the main.tsx file without Spark-specific dependencies
+- Base URL is set to `'./'` to allow relative paths on GitHub Pages
+
+## Troubleshooting
+
+If you encounter deployment issues:
+
+1. Check the GitHub Actions workflow run for error messages
+2. Verify that GitHub Pages is properly configured in your repository settings
+3. Make sure all dependencies are properly installed
+4. Confirm that the GitHub Pages branch (gh-pages) is correctly set as the publishing source
diff --git a/README.md b/README.md
@@ -1,75 +1,76 @@
 # GitHub Copilot Usage Analyzer
 
-A web application that visualizes GitHub Copilot premium request usage to help teams monitor and optimize their AI resource consumption.
+A single-page application that visualizes GitHub Copilot premium request usage data from CSV exports. This tool helps you understand your team's Copilot usage patterns.
 
 ## Features
 
-- Upload GitHub Copilot usage CSV exports
-- View stacked line graph of compliant vs. exceeding requests
-- See daily usage patterns by model
-- Analyze model-specific usage statistics
-- Interactive visualizations with tooltips for detailed information
+- Upload and parse GitHub Copilot usage CSV data
+- Visualize usage over time with interactive charts
+- See request distribution by model
+- Track compliant vs. exceeding quota requests
+- Analyze usage patterns with daily breakdown charts
 
 ## Getting Started
 
-### Development
+### Prerequisites
 
-1. Clone this repository
-2. Install dependencies: `npm install`
-3. Start development server: `npm run dev`
-4. Open your browser to http://localhost:5000
+- Node.js 16+ and npm
 
-### Build
+### Installation
 
-To build the application for production:
+1. Clone this repository:
+   ```bash
+   git clone https://github.com/[your-username]/github-copilot-usage.git
+   cd github-copilot-usage
+   ```
 
-```bash
-npm run build
-```
-
-## Deployment
-
-### GitHub Pages Deployment
+2. Install dependencies:
+   ```bash
+   npm install
+   ```
 
-The project includes a GitHub Actions workflow that will automatically build and deploy the application to GitHub Pages whenever changes are pushed to the main branch.
+3. Start the development server:
+   ```bash
+   npm run dev
+   ```
 
-#### How to Deploy to GitHub Pages
+4. Open http://localhost:5000 in your browser
 
-1. Push your changes to the `main` branch
-2. The GitHub Actions workflow will automatically:
-   - Create a simplified build without Spark dependencies
-   - Deploy to GitHub Pages
+## CSV Format
 
-3. Alternatively, you can manually trigger the deployment:
-   - Go to the "Actions" tab in your repository
-   - Select "Deploy to GitHub Pages" workflow
-   - Click "Run workflow" on the main branch
+The application expects a CSV export from GitHub Copilot premium requests with the following format:
 
-4. Your application will be available at:
-   `https://[your-github-username].github.io/[repo-name]/`
+```
+"Timestamp","User","Model","Requests Used","Exceeds Monthly Quota","Total Monthly Quota"
+"2025-06-11T05:13:27.8766440Z","UserName","gpt-4.1-2025-04-14","1","False","Unlimited"
+```
 
-#### Setting Up GitHub Pages for Your Repository
+## Deployment
 
-To enable GitHub Pages deployment:
+### GitHub Pages
 
-1. Go to your repository on GitHub
-2. Click on "Settings"
-3. Navigate to "Pages" in the left sidebar
-4. Under "Build and deployment" > "Source", select "GitHub Actions"
+This project is configured for easy deployment to GitHub Pages. See [DEPLOYMENT.md](DEPLOYMENT.md) for detailed instructions.
 
-For more detailed instructions and troubleshooting, see [GITHUB_PAGES_DEPLOY.md](GITHUB_PAGES_DEPLOY.md).
+Quick deploy:
+```bash
+npm run deploy
+```
 
-## How It Works
+## Built With
 
-The GitHub Pages deployment handles the fact that GitHub Spark dependencies are not available outside the Spark environment. The workflow:
+- React
+- TypeScript
+- Vite
+- Recharts
+- shadcn/ui components
+- Tailwind CSS
 
-1. Creates a simplified build configuration
-2. Implements localStorage-based alternatives to Spark's useKV hooks
-3. Builds a fully client-side version of the application
-4. Deploys it to GitHub Pages
+## License
 
-This approach ensures your application can be shared and accessed outside the Spark development environment.
+This project is licensed under the MIT License - see the LICENSE file for details.
 
-## License
+## Acknowledgments
 
-The Spark Template files and resources from GitHub are licensed under the terms of the MIT license, Copyright GitHub, Inc.
+- GitHub Copilot for helping with development
+- The shadcn/ui team for the beautiful components
+- Recharts for the charting library
diff --git a/package.json b/package.json
@@ -2,7 +2,7 @@
     "name": "github-copilot-usage-analyzer",
     "private": true,
     "version": "1.0.0",
-    "homepage": "https://github.com/pages/[your-username]/github-copilot-usage/",
+    "homepage": "./",
     "type": "module",
     "scripts": {
         "dev": "vite",
@@ -11,7 +11,7 @@
         "lint": "eslint .",
         "optimize": "vite optimize",
         "preview": "vite preview",
-        "build:pages": "cp src/main-github-pages.tsx src/main.tsx && vite build && git checkout src/main.tsx",
+        "build:pages": "cp src/main-github-pages.tsx src/main.tsx && vite build --config vite.github-pages.config.ts && git checkout src/main.tsx",
         "predeploy": "npm run build:pages",
         "deploy": "gh-pages -d dist"
     },
diff --git a/vite.github-pages.config.ts b/vite.github-pages.config.ts
@@ -0,0 +1,25 @@
+import { defineConfig } from "vite";
+import tailwindcss from "@tailwindcss/vite";
+import react from "@vitejs/plugin-react";
+import { resolve } from 'path';
+
+// Simple Vite config for GitHub Pages deployment
+export default defineConfig({
+  plugins: [
+    react(),
+    tailwindcss(),
+  ],
+  build: {
+    outDir: 'dist',
+    // Set external dependencies that shouldn't be bundled
+    rollupOptions: {
+      external: ['@github/spark/spark']
+    }
+  },
+  resolve: {
+    alias: {
+      '@': resolve(__dirname, 'src')
+    }
+  },
+  base: './' // Set base for GitHub Pages
+});
