preview.yml

name: Preview Environment

on:
  issue_comment:
    types: [created]
  workflow_dispatch:
    inputs:
      pr_number:
        description: "PR number to deploy"
        required: true
        type: number

permissions:
  contents: read
  pull-requests: write

concurrency:
  group: preview-${{ github.event.issue.number || inputs.pr_number }}
  cancel-in-progress: true

jobs:
  deploy-preview:
    runs-on: ubuntu-latest
    if: |
      (github.event_name == 'issue_comment' &&
       github.event.issue.pull_request &&
       contains(github.event.comment.body, '/deploy-preview')) ||
      github.event_name == 'workflow_dispatch'
    env:
      CLOUDFLARE_ACCOUNT_ID: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
      CLOUDFLARE_API_TOKEN: ${{ secrets.CLOUDFLARE_API_TOKEN }}
      CLOUDFLARE_DATABASE_ID: ${{ secrets.CLOUDFLARE_DATABASE_ID }}
      PR_NUMBER: ${{ github.event_name == 'workflow_dispatch' && inputs.pr_number || github.event.issue.number }}
    steps:
      - name: Add reaction to comment
        if: github.event_name == 'issue_comment'
        uses: actions/github-script@v7
        with:
          script: |
            github.rest.reactions.createForIssueComment({
              owner: context.repo.owner,
              repo: context.repo.repo,
              comment_id: context.payload.comment.id,
              content: 'rocket'
            });

      - name: Get PR branch
        id: pr-branch
        uses: actions/github-script@v7
        with:
          script: |
            const pr = await github.rest.pulls.get({
              owner: context.repo.owner,
              repo: context.repo.repo,
              pull_number: process.env.PR_NUMBER
            });
            core.setOutput('ref', pr.data.head.ref);
            core.setOutput('sha', pr.data.head.sha);

      - name: Checkout PR branch
        uses: actions/checkout@v4
        with:
          ref: ${{ steps.pr-branch.outputs.sha }}

      - name: Setup PNPM
        uses: pnpm/action-setup@v4

      - name: Setup Node.js
        uses: actions/setup-node@v4
        with:
          node-version: 22
          cache: pnpm

      - name: Install dependencies
        run: pnpm install --frozen-lockfile

      - name: Generate wrangler.toml from example
        run: |
          cp wrangler.toml.example wrangler.toml
          sed -i "s/PLACEHOLDER_DATABASE_ID/${CLOUDFLARE_DATABASE_ID}/g" wrangler.toml

      - name: Generate API wrangler.toml from example
        working-directory: apps/api
        run: |
          cp wrangler.toml.example wrangler.toml
          sed -i "s/PLACEHOLDER_DATABASE_ID/${CLOUDFLARE_DATABASE_ID}/g" wrangler.toml

      - name: Deploy API to preview environment
        working-directory: apps/api
        run: |
          WORKER_NAME="tabitabi-api-preview-pr-${PR_NUMBER}"
          pnpm wrangler deploy --name ${WORKER_NAME} --env preview

      - name: Get API preview URL
        id: api-url
        run: |
          echo "url=https://tabitabi-api-preview-pr-${PR_NUMBER}.oranda.workers.dev/api/v1" >> $GITHUB_OUTPUT

      - name: Build web with preview API URL
        run: pnpm run build
        env:
          VITE_API_URL: ${{ steps.api-url.outputs.url }}

      - name: Deploy Web to Pages preview
        id: pages-deploy
        working-directory: apps/web
        run: |
          BRANCH_NAME="preview-pr-${PR_NUMBER}"
          OUTPUT=$(pnpm wrangler pages deploy .svelte-kit/cloudflare --project-name=tabitabi --branch=${BRANCH_NAME})
          echo "$OUTPUT"
          URL=$(echo "$OUTPUT" | grep -oP 'https://[a-z0-9-]+\.tabitabi\.pages\.dev' | head -1)
          echo "url=${URL}" >> $GITHUB_OUTPUT

      - name: Comment PR with preview URLs
        uses: actions/github-script@v7
        with:
          script: |
            const apiUrl = '${{ steps.api-url.outputs.url }}';
            const webUrl = '${{ steps.pages-deploy.outputs.url }}';

            const comment = `## 🚀 Preview Environment Ready

            Your preview environment has been deployed:

            - **Web App**: ${webUrl}
            - **API**: ${apiUrl}

            The Web app is configured to access the preview API automatically.
            To update this preview, comment \`/deploy-preview\` again.

            > **Note**: Preview environments share the same database as production.`;

            github.rest.issues.createComment({
              issue_number: process.env.PR_NUMBER,
              owner: context.repo.owner,
              repo: context.repo.repo,
              body: comment
            });