chore: add static mock deployment

- Add GitHub Pages workflow to build and deploy MSW mock dashboard
- Make MSW worker URL and API base URL respect Vite BASE_URL for subpath hosting
- Document GitHub Pages and Vercel mock deployment steps

Author: falcolee

.github/workflows/pages-mock.yml

@@ -0,0 +1,47 @@
+name: Deploy Mock (GitHub Pages)
+
+on:
+  push:
+    branches: ["main"]
+  workflow_dispatch: {}
+
+permissions:
+  contents: read
+  pages: write
+  id-token: write
+
+concurrency:
+  group: pages
+  cancel-in-progress: true
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: pnpm/action-setup@v4
+        with:
+          version: 9
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: pnpm
+      - run: pnpm install --frozen-lockfile
+      - run: pnpm build -- --base="/${{ github.event.repository.name }}/"
+        env:
+          VITE_USE_MOCKS: "true"
+          VITE_API_BASE_URL: "/${{ github.event.repository.name }}/api/v1/admin"
+      - uses: actions/upload-pages-artifact@v3
+        with:
+          path: dist
+
+  deploy:
+    needs: build
+    runs-on: ubuntu-latest
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+    steps:
+      - id: deployment
+        uses: actions/deploy-pages@v4
+

README.md

@@ -182,6 +182,26 @@ e-commerce-dashboard/
 2. `?mock=1`
 3. `localStorage.USE_MOCKS === "1"`
 
+## Deploy Mock (Static)
+
+This repo can be deployed as a fully-static “mock” dashboard (no backend) using MSW.
+
+### GitHub Pages (automatic)
+
+1. In GitHub, open **Settings → Pages** and set **Build and deployment** to **GitHub Actions**.
+2. Push to `main` (or run the workflow manually).
+
+Workflow: `.github/workflows/pages-mock.yml`.
+
+### Vercel (automatic)
+
+1. Import the repo in Vercel (Framework preset: Vite).
+2. Set environment variables:
+   - `VITE_USE_MOCKS=true`
+   - (optional) `VITE_API_BASE_URL=/api/v1/admin`
+3. Build command: `pnpm build` (or `npm run build`)
+4. Output directory: `dist`
+
 ## API Documentation
 
 - OpenAPI YAML: `docs/swagger.yaml`

src/lib/api.ts

@@ -61,11 +61,16 @@ import type {
 import { QueryParams, buildQueryParams, validateQueryParams } from './queryBuilder';
 import { transformResponse } from './transformers';
 import type { ErrorResponse } from '@/types/api';
+import { shouldEnableMocks } from '@/mocks/config';
 
 // Accepts plain objects (typed form values) or FormData payloads
 type UnknownRecord = Record<string, unknown> | FormData;
 
-const API_BASE_URL = import.meta.env.VITE_API_BASE_URL || 'http://localhost:3000/api/v1/admin';
+const API_BASE_URL =
+  import.meta.env.VITE_API_BASE_URL ||
+  (shouldEnableMocks()
+    ? `${import.meta.env.BASE_URL}api/v1/admin`
+    : 'http://localhost:3000/api/v1/admin');
 
 const api = axios.create({
   baseURL: API_BASE_URL,

src/mocks/browser.ts

@@ -8,7 +8,8 @@ export async function startMockWorker() {
   if (!config.enabled) return;
 
   const apiBaseUrl =
-    import.meta.env.VITE_API_BASE_URL ?? "http://localhost:3000/api/v1/admin";
+    import.meta.env.VITE_API_BASE_URL ??
+    `${import.meta.env.BASE_URL}api/v1/admin`;
   const handlers = createHandlers({
     spec: mockSpec,
     apiBaseUrl,
@@ -23,7 +24,7 @@ export async function startMockWorker() {
 
   await worker.start({
     onUnhandledRequest: "bypass",
-    serviceWorker: { url: "/mockServiceWorker.js" },
+    serviceWorker: { url: `${import.meta.env.BASE_URL}mockServiceWorker.js` },
     // Ensure the worker is ready before continuing
     quiet: false,
   });