ci-pr.yml

name: ci-pr

on:
  pull_request:
    types:
      - opened
      - reopened
      - synchronize
    branches:
      - v2

permissions:
  contents: write

jobs:
  build:
    runs-on: ubuntu-latest
    # https://docs.github.com/en/actions/using-workflows/workflow-syntax-for-github-actions#jobsjob_idoutputs
    outputs:
      TONIC_UI_REACT_DOCS_VERSION: ${{ steps.step_setup_env.outputs.TONIC_UI_REACT_DOCS_VERSION }}
    steps:
      - name: Checkout code
        uses: actions/checkout@v4
        with:
          # Fetch the entire Git history to access the latest tag release
          fetch-depth: 0

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

      - name: Check installed versions
        run: |
          git --version
          node --version
          npm --version
          yarn --version

      - name: Configure environment variables
        id: step_setup_env
        run: |
          TONIC_UI_REACT_VERSION=pr-${{ github.event.number }}
          echo "CI_BRANCH=${{ github.ref_name }}" >> $GITHUB_ENV
          echo "CI_COMMIT=${{ github.event.pull_request.head.sha }}" >> $GITHUB_ENV
          echo "CI_PULL_REQUEST_NUMBER=${{ github.event.number }}" >> $GITHUB_ENV
          echo "MATOMO_URL=//matomo.xdr.trendmicro.com" >> $GITHUB_ENV
          echo "MATOMO_CONTAINER_ID=N8rpl9LU" >> $GITHUB_ENV
          echo "TONIC_UI_REACT_DOCS_BASE_PATH=/tonic-ui-demo/react/${TONIC_UI_REACT_VERSION}" >> $GITHUB_ENV
          echo "TONIC_UI_REACT_DOCS_VERSION=${TONIC_UI_REACT_VERSION}" >> $GITHUB_ENV

          # $GITHUB_OUTPUT is shared between all steps in a job
          echo "TONIC_UI_REACT_DOCS_VERSION=${TONIC_UI_REACT_VERSION}" >> $GITHUB_OUTPUT

      - name: Install packages
        run: |
          yarn up
          yarn install

      - name: Build & Test
        run: |
          yarn build
          yarn lint
          yarn test

      - name: Upload coverage to Codecov
        uses: codecov/codecov-action@v4
        env:
          CODECOV_TOKEN: ${{ secrets.CODECOV_TOKEN }}
        with:
          files: |
            ./packages/changelog-github/coverage/lcov.info
            ./packages/codemod/coverage/lcov.info
            ./packages/react/coverage/lcov.info
            ./packages/react-base/coverage/lcov.info
            ./packages/react-hooks/coverage/lcov.info
            ./packages/react-icons/coverage/lcov.info
            ./packages/styled-system/coverage/lcov.info
            ./packages/theme/coverage/lcov.info
            ./packages/utils/coverage/lcov.info

      - name: Prepare artifact
        run: |
          mkdir -p ${{ github.workspace }}/artifact
          tar -zcvf ${{ github.workspace }}/artifact/react-docs.tar.gz --dereference --directory packages/react-docs/dist .
          cp -af scripts/github-issue-comment-cli ${{ github.workspace }}/artifact/
        continue-on-error: true

      - name: Upload artifact
        uses: actions/upload-artifact@v4
        with:
          name: ci-artifact
          path: |
            artifact/react-docs.tar.gz
            artifact/github-issue-comment-cli
          if-no-files-found: error

  deploy:
    needs: build
    runs-on: ubuntu-latest
    steps:
      - name: Checkout code
        uses: actions/checkout@v4
        with:
          repository: trendmicro-frontend/tonic-ui-demo
          ref: gh-pages
          ssh-key: ${{ secrets.TONIC_UI_DEMO_SSH_PRIVATE_KEY }}

      - name: git config
        run: |
          git config user.name "github-actions[bot]"
          git config user.email "github-actions[bot]@users.noreply.github.com"

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

      - name: Configure environment variables
        env:
          TONIC_UI_REACT_DOCS_VERSION: ${{ needs.build.outputs.TONIC_UI_REACT_DOCS_VERSION }}
        run: |
          echo "CI_COMMIT=${{ github.event.pull_request.head.sha }}" >> $GITHUB_ENV
          echo "CI_PULL_REQUEST_NUMBER=${{ github.event.number }}" >> $GITHUB_ENV
          echo "TONIC_UI_DEMO_PAGES_URL=https://trendmicro-frontend.github.io/tonic-ui-demo" >> $GITHUB_ENV
          echo "TONIC_UI_REACT_DOCS_VERSION=${TONIC_UI_REACT_DOCS_VERSION}" >> $GITHUB_ENV

      - name: Download artifact
        uses: actions/download-artifact@v4
        with:
          name: ci-artifact
          path: artifact

      - name: Extract artifact
        run: |
          mkdir -p artifact/react-docs
          tar -zxvf artifact/react-docs.tar.gz --directory artifact/react-docs

      - name: Deploy to gh-pages
        run: |
          rm -rf "react/${TONIC_UI_REACT_DOCS_VERSION}"
          mkdir -p "react/${TONIC_UI_REACT_DOCS_VERSION}"
          cp -af artifact/react-docs/** "react/${TONIC_UI_REACT_DOCS_VERSION}/"
          git add "react/${TONIC_UI_REACT_DOCS_VERSION}"
          git commit -m "Deploy ${TONIC_UI_REACT_DOCS_VERSION} to gh-pages [skip ci]"
          git push origin gh-pages
          GIT_LOG_LAST_COMMIT_DATE=`git log --pretty=%ci -n 1`
          yarn add file:./artifact/github-issue-comment-cli
          npx github-issue-comment-cli \
            --token ${{ secrets.TONIC_UI_PR_ACCESS_TOKEN }} \
            --pattern "## Tonic UI Demo" \
            --owner trendmicro-frontend \
            --repo tonic-ui \
            --issue-number ${CI_PULL_REQUEST_NUMBER} \
            --comment "## Tonic UI Demo\nOn ${GIT_LOG_LAST_COMMIT_DATE}, PR #${CI_PULL_REQUEST_NUMBER} (${CI_COMMIT}) was successfully deployed. You can view it at the following link:\n${TONIC_UI_DEMO_PAGES_URL}/react/${TONIC_UI_REACT_DOCS_VERSION}/\n"