feat: add PR preview deployments for demo app (#330)

# Add PR Preview Deployments for Demo App

This PR enhances our CI/CD pipeline to support preview deployments for the demo app on pull requests. Key changes include:

- Modified the `deploy-demo` job to run on both PRs and main branch pushes
- Added dynamic environment selection (`preview` or `production`) based on the event type
- Replaced hardcoded Supabase credentials with environment variables from GitHub secrets
- Added conditional deployment logic to deploy to preview URLs for PRs and production for main branch
- Updated the deployment comment action to include preview URLs for PR deployments
- Added environment variable inputs to build configurations in project.json files to ensure proper cache invalidation when environment variables change

These changes will allow reviewers to see live previews of the demo app for each PR before merging to main.

Author: jumski

.github/workflows/ci.yml

@@ -185,16 +185,13 @@ jobs:
   deploy-demo:
     needs: [build-and-test, edge-worker-e2e]
     runs-on: ubuntu-latest
-    # Only run on main branch pushes (production) - skip PRs for now
-    if: github.event_name == 'push' && github.ref == 'refs/heads/main'
-    environment: production
+    environment: ${{ github.event_name == 'pull_request' && 'preview' || 'production' }}
     env:
       NX_CLOUD_ACCESS_TOKEN: ${{ secrets.NX_CLOUD_ACCESS_TOKEN }}
       CLOUDFLARE_API_TOKEN: ${{ secrets.CLOUDFLARE_API_TOKEN }}
       CLOUDFLARE_ACCOUNT_ID: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
-      # Hardcoded for testing - these are public values
-      VITE_SUPABASE_URL: https://bsgbmmbmlmcmdnheuwmt.supabase.co
-      VITE_SUPABASE_ANON_KEY: eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6ImJzZ2JtbWJtbG1jbWRuaGV1d210Iiwicm9sZSI6ImFub24iLCJpYXQiOjE3NjIzNDA2NzIsImV4cCI6MjA3NzkxNjY3Mn0.Uoy8iqxycrqd4b6LPMMXWWSYrP1BDRMrJVgM2_vtl6o
+      VITE_SUPABASE_URL: ${{ github.event_name == 'pull_request' && secrets.DEMO_PREVIEW_SUPABASE_URL || secrets.DEMO_PRODUCTION_SUPABASE_URL }}
+      VITE_SUPABASE_ANON_KEY: ${{ github.event_name == 'pull_request' && secrets.DEMO_PREVIEW_SUPABASE_ANON_KEY || secrets.DEMO_PRODUCTION_SUPABASE_ANON_KEY }}
     steps:
       - uses: actions/checkout@v4
         with:
@@ -208,19 +205,7 @@ jobs:
       - name: Verify NX_BASE and NX_HEAD are set
         run: echo "BASE=$NX_BASE HEAD=$NX_HEAD"
 
-      - name: Check if demo is affected
-        id: check-affected
-        run: |
-          if pnpm nx show projects --affected -t build --base="$NX_BASE" --head="$NX_HEAD" | grep -q "^demo$"; then
-            echo "affected=true" >> $GITHUB_OUTPUT
-            echo "Demo is affected by changes"
-          else
-            echo "affected=false" >> $GITHUB_OUTPUT
-            echo "Demo is not affected by changes - skipping deployment"
-          fi
-
       - name: Validate Supabase environment variables
-        if: steps.check-affected.outputs.affected == 'true'
         run: |
           if [ -z "$VITE_SUPABASE_URL" ]; then
             echo "❌ Error: VITE_SUPABASE_URL is not set"
@@ -239,18 +224,22 @@ jobs:
           fi
           echo "✅ Supabase environment variables are valid"
 
-      - name: Deploy demo to production
+      - name: Deploy demo
         id: deploy-demo
-        if: steps.check-affected.outputs.affected == 'true'
+        env:
+          PREVIEW_NAME: pr-${{ github.event.pull_request.number }}
         run: |
-          echo "Deploying demo to production (demo.pgflow.dev)..."
-          pnpm nx run demo:deploy --skip-nx-cache
+          if [[ "${{ github.event_name }}" == "pull_request" ]]; then
+            pnpm nx affected -t deploy:preview --projects=demo --base="$NX_BASE" --head="$NX_HEAD"
+          else
+            pnpm nx affected -t deploy --projects=demo --base="$NX_BASE" --head="$NX_HEAD"
+          fi
 
       - name: Post deployment comment
-        if: always()
+        if: success()
         uses: ./.github/actions/deployment-comment
         with:
           project-name: Demo
+          preview-url: https://pr-${{ github.event.pull_request.number }}-pgflow-demo.jumski.workers.dev
           production-url: https://demo.pgflow.dev
-          # No preview URL - we only deploy production from main branch
 

apps/demo/project.json

@@ -26,7 +26,16 @@
 				"command": "vite build",
 				"cwd": "apps/demo"
 			},
-			"outputs": ["{projectRoot}/.svelte-kit"]
+			"outputs": ["{projectRoot}/.svelte-kit"],
+			"inputs": [
+				"{projectRoot}/wrangler.toml",
+				{
+					"env": "VITE_SUPABASE_URL"
+				},
+				{
+					"env": "VITE_SUPABASE_ANON_KEY"
+				}
+			]
 		},
 		"preview": {
 			"executor": "nx:run-commands",

apps/demo/supabase/migrations/20251107224748_setup_extensions.sql

@@ -0,0 +1,18 @@
+-- Create extensions and required schemas for pgflow demo
+
+-- Enable pg_cron extension
+CREATE EXTENSION IF NOT EXISTS pg_cron WITH SCHEMA pg_catalog;
+
+-- Enable pg_net extension
+CREATE EXTENSION IF NOT EXISTS pg_net;
+
+-- Create cron schema if it doesn't exist
+CREATE SCHEMA IF NOT EXISTS cron;
+
+-- Create net schema if it doesn't exist
+CREATE SCHEMA IF NOT EXISTS net;
+
+-- Grant permissions to postgres role
+GRANT USAGE ON SCHEMA cron TO postgres;
+GRANT USAGE ON SCHEMA net TO postgres;
+GRANT ALL PRIVILEGES ON ALL TABLES IN SCHEMA cron TO postgres;

apps/demo/supabase/seeds/watchdog_article_worker.sql

@@ -1,11 +1,3 @@
--- Enable required extensions
-CREATE EXTENSION IF NOT EXISTS pg_cron;
-CREATE EXTENSION IF NOT EXISTS pg_net;
-
--- Grant necessary permissions
-GRANT USAGE ON SCHEMA cron TO postgres;
-GRANT USAGE ON SCHEMA net TO postgres;
-
 -- Remove existing job if it exists to prevent duplicates
 SELECT cron.unschedule(jobname)
 FROM cron.job

pkgs/website/project.json

@@ -9,7 +9,13 @@
       "executor": "nx:run-commands",
       "inputs": [
         "default",
-        "^production"
+        "^production",
+        {
+          "env": "VITE_SUPABASE_URL"
+        },
+        {
+          "env": "VITE_SUPABASE_ANON_KEY"
+        }
       ],
       "outputs": ["{options.outputPath}"],
       "options": {