build-and-deploy-staging.yml

name: Build staging and Deploy to Cloudflare Pages

on:
    push:
        branches:
            - 'main'

concurrency:
    group: cloudflare-pages-build-staging
    cancel-in-progress: true

jobs:
    build_to_cloudflare_pages:
        timeout-minutes: 30
        runs-on: ubuntu-latest
        environment: staging
        steps:
            - name: Checkout to main branch
              uses: actions/checkout@v3

            - name: Setup node
              uses: actions/setup-node@v3
              with:
                  node-version: 18.x
                  cache: 'npm'

            - name: Get cached dependencies
              id: cache-npm
              uses: actions/cache/restore@e12d46a63a90f2fae62d114769bbf2a179198b5c
              with:
                  path: node_modules
                  key: npm-${{ hashFiles('./package-lock.json') }}

            - name: Install dependencies
              if: ${{ steps.cache-npm.outputs.cache-hit != 'true' }}
              run: npm ci
              shell: bash

            - name: Build staging
              run: npm run build

            - name: Run tests for Eslint
              run: npm run test:lint

            - name: Run unit tests and coverage report
              run: npm run test

            - name: Publish to Cloudflare Pages
              id: publish-to-pages
              env:
                  CLOUDFLARE_API_TOKEN: ${{ secrets.CLOUDFLARE_API_TOKEN }}
                  CLOUDFLARE_ACCOUNT_ID: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
                  HEAD_BRANCH: ${{ github.head_ref }}
              run: |
                  echo "Installing Wrangler CLI"
                  npm i -g wrangler
                  echo "Deploying build to Cloudflare Pages"
                  directory='public'
                  projectName=${{ secrets.CLOUDFLARE_PROJECT_NAME }}
                  branch=$(echo "$HEAD_BRANCH" | head -c 20 | sed 's/[\/_\.]/-/g; s/[^a-zA-Z0-9]$/1/')
                  cf_preview_url=$(wrangler pages deploy $directory --project-name=$projectName --branch=$branch > log.txt 2>&1; echo $?)
                  echo "------"
                  preview_url=https://$branch.$projectName.pages.dev
                  cat log.txt
                  if grep -q "Deployment complete" log.txt; then
                    echo "preview_url=$preview_url" >> "$GITHUB_OUTPUT"
                    echo $preview_url > .pr/PREVIEW_URL
                  else
                    echo "Deployment to Cloudflare Pages failed."
                    exit 1
                  fi