front.yaml

# This is a basic workflow to help you get started with Actions

name: CI/CD For the Frontend

# Controls when the action will run.
on:
  # Triggers the workflow on push or pull request events but only for the main branch
  push:
    paths:
      - "front/**"
      - .github/workflows/front.yaml
      - ./pnpm-lock.yaml
    branches:
      - main

  # Allows you to run this  workflow manually from the Actions tab+1
  workflow_dispatch:

# A workflow run is made up of one or more jobs that can run sequentially or in parallel
jobs:
  build:
    runs-on: ubuntu-latest
    environment: prod

    steps:
      - uses: actions/checkout@v2

      - name: Setup pnpm
        uses: pnpm/action-setup@646cdf48217256a3d0b80361c5a50727664284f2
        with:
          version: 7.1.0

      - name: Setup Node version
        uses: actions/setup-node@v2
        with:
          node-version: 16.x
          cache: "pnpm"

      - name: Install dependencies
        run: FORCE_COLOR=true pnpm install --frozen-lockfile  --prefix front

      - name: Build the frontend
        run: |
          FORCE_COLOR=true pnpm run --prefix shared build
          NODE_ENV=production VITE_WS_URL=kiss-cam.live VITE_SUPABASE_URL=$SUPABASE_URL VITE_SUPABASE_ANON_KEY=$SUPABASE_ANON_KEY VITE_STRIPE_PUBLIC_KEY=$STRIPE_PUBLIC_KEY FORCE_COLOR=true pnpm run --prefix front build
        env:
          SUPABASE_URL: ${{ secrets.SUPABASE_URL }}
          SUPABASE_ANON_KEY: ${{ secrets.SUPABASE_ANON_KEY }}
          STRIPE_PUBLIC_KEY: ${{ secrets.STRIPE_PUBLIC_KEY }}

      - name: Cache Build Output
        uses: actions/upload-artifact@v2
        with:
          name: kisscam-front-build-output
          path: front/dist

  deploy:
    # The type of runner that the job will run on
    needs:
      - build
    runs-on: ubuntu-latest
    environment: prod

    # Steps represent a sequence of tasks that will be executed as part of the job
    steps:
      - uses: actions/checkout@v2

      - name: Download Build Artifact
        uses: actions/download-artifact@v2
        with:
          name: kisscam-front-build-output
          path: dist

      - name: Install SSH key
        uses: shimataro/ssh-key-action@v2
        with:
          key: ${{ secrets.SSH_SERVER_KEY }}
          name: id_rsa # optional
          known_hosts: ${{ secrets.KNOWN_HOSTS }}

      - name: Deploy to Server
        run: rsync -arvzP -e "ssh -p $DEPLOY_PORT" ./dist/ $DEPLOY_USER@$DEPLOY_DOMAIN:$DEPLOY_DIR/front
        env:
          DEPLOY_DIR: ${{ secrets.DEPLOY_DIR }}
          DEPLOY_PORT: ${{ secrets.DEPLOY_PORT }}
          DEPLOY_DOMAIN: ${{ secrets.DEPLOY_DOMAIN }}
          DEPLOY_USER: ${{ secrets.DEPLOY_USER }}