on_pull_request.yml

name: PR Checks

on:
  pull_request:
    types: [opened, synchronize, reopened, ready_for_review]

jobs:
  build:
    name: Build system packages
    runs-on: ubuntu-latest

    steps:
      - name: Checkout Repo
        uses: actions/checkout@v3

      - name: Setup Node.js 16.13
        uses: actions/setup-node@v3
        with:
          node-version: 16.13.x

      - name: Get yarn cache directory path
        id: yarn-cache-dir-path
        run: echo "dir=$(yarn config get cacheFolder)" >> $GITHUB_OUTPUT

      - name: Load Yarn cache
        uses: actions/cache@v3
        id: yarn_cache_id
        with:
          path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
          key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
          restore-keys: |
            ${{ runner.os }}-yarn

      - name: Node modules cache
        uses: actions/cache@v3
        id: node_modules_cache_id
        with:
          path: |
            node_modules
            */*/node_modules
          key: ${{ runner.os }}-${{ hashFiles('**/yarn.lock') }}

      - name: Install Dependencies
        if: steps.yarn_cache_id.outputs.cache-hit != 'true' || steps.node_modules_cache_id.outputs.cache-hit != 'true'
        run: yarn install --immutable

      - name: Build packages
        run: yarn build

      - name: Store build artifacts
        uses: actions/upload-artifact@v3
        with:
          name: compiled-js-and-types
          path: |
            packages/**/dist/**/*
            packages/paste-core/core-bundle/**/*
            packages/paste-icons/cjs/**/*
            packages/paste-icons/esm/**/*
            packages/paste-design-tokens/types/**/*
            packages/paste-codemods/tools/.cache/mappings.json

  type_check:
    name: Type check
    needs: build
    runs-on: ubuntu-latest
    steps:
      - name: Checkout Repo
        uses: actions/checkout@v3

      - name: Setup Node.js 16.13
        uses: actions/setup-node@v3
        with:
          node-version: 16.13.x

      - name: Get yarn cache directory path
        id: yarn-cache-dir-path
        run: echo "dir=$(yarn config get cacheFolder)" >> $GITHUB_OUTPUT

      - name: Load Yarn cache
        uses: actions/cache@v3
        id: yarn_cache_id
        with:
          path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
          key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
          restore-keys: |
            ${{ runner.os }}-yarn

      - name: Node modules cache
        uses: actions/cache@v3
        id: node_modules_cache_id
        with:
          path: |
            node_modules
            */*/node_modules
          key: ${{ runner.os }}-${{ hashFiles('**/yarn.lock') }}

      - name: Install Dependencies
        if: steps.yarn_cache_id.outputs.cache-hit != 'true' || steps.node_modules_cache_id.outputs.cache-hit != 'true'
        run: yarn install --immutable

      - name: Download build artifacts
        uses: actions/download-artifact@v3
        with:
          name: compiled-js-and-types
          path: packages/

      - name: Run type checker
        run: yarn type-check

  eslint:
    name: Lint repository
    needs: build
    runs-on: ubuntu-latest
    steps:
      - name: Checkout Repo
        uses: actions/checkout@v3

      - name: Setup Node.js 16.13
        uses: actions/setup-node@v3
        with:
          node-version: 16.13.x

      - name: Get yarn cache directory path
        id: yarn-cache-dir-path
        run: echo "dir=$(yarn config get cacheFolder)" >> $GITHUB_OUTPUT

      - name: Load Yarn cache
        uses: actions/cache@v3
        id: yarn_cache_id
        with:
          path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
          key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
          restore-keys: |
            ${{ runner.os }}-yarn

      - name: Node modules cache
        uses: actions/cache@v3
        id: node_modules_cache_id
        with:
          path: |
            node_modules
            */*/node_modules
          key: ${{ runner.os }}-${{ hashFiles('**/yarn.lock') }}

      - name: Install Dependencies
        if: steps.yarn_cache_id.outputs.cache-hit != 'true' || steps.node_modules_cache_id.outputs.cache-hit != 'true'
        run: yarn install --immutable

      - name: Download build artifacts
        uses: actions/download-artifact@v3
        with:
          name: compiled-js-and-types
          path: packages/

      - name: Run eslint
        run: yarn lint

  tests:
    name: Test repository using React 18
    needs: build
    runs-on: ubuntu-latest
    steps:
      - name: Checkout Repo
        uses: actions/checkout@v3

      - name: Setup Node.js 16.13
        uses: actions/setup-node@v3
        with:
          node-version: 16.13.x

      - name: Get yarn cache directory path
        id: yarn-cache-dir-path
        run: echo "dir=$(yarn config get cacheFolder)" >> $GITHUB_OUTPUT

      - name: Load Yarn cache
        uses: actions/cache@v3
        id: yarn_cache_id
        with:
          path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
          key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
          restore-keys: |
            ${{ runner.os }}-yarn

      - name: Node modules cache
        uses: actions/cache@v3
        id: node_modules_cache_id
        with:
          path: |
            node_modules
            */*/node_modules
          key: ${{ runner.os }}-${{ hashFiles('**/yarn.lock') }}

      - name: Install Dependencies
        if: steps.yarn_cache_id.outputs.cache-hit != 'true' || steps.node_modules_cache_id.outputs.cache-hit != 'true'
        run: yarn install --immutable

      - name: Download build artifacts
        uses: actions/download-artifact@v3
        with:
          name: compiled-js-and-types
          path: packages/

      - name: Run tests
        run: yarn test

  react17_tests:
    name: Test repository using React 17
    needs: build
    runs-on: ubuntu-latest
    steps:
      - name: Checkout Repo
        uses: actions/checkout@v2

      - name: Setup Node.js 16.13
        uses: actions/setup-node@v3
        with:
          node-version: 16.13.x

      - name: Get yarn cache directory path
        id: yarn-cache-dir-path
        run: echo "dir=$(yarn config get cacheFolder)" >> $GITHUB_OUTPUT

      - name: Load Yarn cache
        uses: actions/cache@v3
        id: yarn_cache_id
        with:
          path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
          key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
          restore-keys: |
            ${{ runner.os }}-yarn

      # Note: Yarn cache has been removed from the following step
      # since we need to change the React version installed
      - name: Install Dependencies
        run: yarn install --immutable

      - name: Install React 17
        run: |
          yarn add @types/react@^17.0.0 react@^17.0.2 react-dom@^17.0.2
          yarn set resolution react@npm:^18.0.0 ^17.0.2
          yarn set resolution @types/react@npm:^18.0.0 ^17.0.31
          yarn set resolution react-dom@npm:^18.0.0 ^17.0.2
          yarn set resolution @testing-library/react@npm:^13.4.0 ^12.1.4

      - name: Download build artifacts
        uses: actions/download-artifact@v3
        with:
          name: compiled-js-and-types
          path: packages/

      - name: Run tests
        run: yarn test

  react16_tests:
    name: Test repository using React 16
    needs: build
    runs-on: ubuntu-latest
    steps:
      - name: Checkout Repo
        uses: actions/checkout@v3

      - name: Setup Node.js 16.13
        uses: actions/setup-node@v3
        with:
          node-version: 16.13.x

      - name: Get yarn cache directory path
        id: yarn-cache-dir-path
        run: echo "dir=$(yarn config get cacheFolder)" >> $GITHUB_OUTPUT

      - name: Load Yarn cache
        uses: actions/cache@v3
        id: yarn_cache_id
        with:
          path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
          key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
          restore-keys: |
            ${{ runner.os }}-yarn

      # Note: Yarn cache has been removed from the following step
      # since we need to change the React version installed
      - name: Install Dependencies
        run: yarn install --immutable

      - name: Install React 16
        run: |
          yarn add @types/react@^16.0.0 react@^16.8.6 react-dom@^16.8.6
          yarn set resolution react@npm:^18.0.0 ^16.8.6
          yarn set resolution @types/react@npm:^18.0.0 ^16.0.0
          yarn set resolution react-dom@npm:^18.0.0 ^16.8.6
          yarn set resolution @testing-library/react@npm:^13.4.0 ^12.1.4

      - name: Download build artifacts
        uses: actions/download-artifact@v3
        with:
          name: compiled-js-and-types
          path: packages/

      - name: Run tests
        run: yarn test

  storybook_tests:
    name: Storybook test runner
    needs: build
    runs-on: ubuntu-latest
    strategy:
      matrix:
        shard: [1/4, 2/4, 3/4, 4/4]
    steps:
      - name: Checkout Repo
        uses: actions/checkout@v3

      - name: Setup Node.js 16.13
        uses: actions/setup-node@v3
        with:
          node-version: 16.13.x

      - name: Get yarn cache directory path
        id: yarn-cache-dir-path
        run: echo "dir=$(yarn config get cacheFolder)" >> $GITHUB_OUTPUT

      - name: Load Yarn cache
        uses: actions/cache@v3
        id: yarn_cache_id
        with:
          path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
          key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
          restore-keys: |
            ${{ runner.os }}-yarn

      - name: Node modules cache
        uses: actions/cache@v3
        id: node_modules_cache_id
        with:
          path: |
            node_modules
            */*/node_modules
          key: ${{ runner.os }}-${{ hashFiles('**/yarn.lock') }}

      - name: Get playwright version
        id: pw-version
        run: echo "version=$(yarn playwright --version)" >> $GITHUB_OUTPUT

      - name: Cache playwright binaries
        uses: actions/cache@v3
        id: playwright-cache
        with:
          path: "~/.cache/ms-playwright"
          key: cache-playwright-${{ runner.os }}-${{ steps.pw-version.outputs.version }}

      - name: Install Dependencies
        if: steps.yarn_cache_id.outputs.cache-hit != 'true' || steps.node_modules_cache_id.outputs.cache-hit != 'true'
        run: yarn install --immutable

      - name: Download build artifacts
        uses: actions/download-artifact@v3
        with:
          name: compiled-js-and-types
          path: packages/

      - name: Install Playwright
        if: steps.playwright-cache.outputs.cache-hit != 'true'
        run: npx playwright install --with-deps

      - name: Run Storybook test runner
        run: yarn start-server-and-test 'NODE_ENV=test yarn start:storybook' http://localhost:9001 'yarn test:storybook --shard=${{ matrix.shard }}'

  prettier:
    name: Prettier checks
    needs: build
    runs-on: ubuntu-latest
    steps:
      - name: Checkout Repo
        uses: actions/checkout@v3

      - name: Setup Node.js 16.13
        uses: actions/setup-node@v3
        with:
          node-version: 16.13.x

      - name: Get yarn cache directory path
        id: yarn-cache-dir-path
        run: echo "dir=$(yarn config get cacheFolder)" >> $GITHUB_OUTPUT

      - name: Load Yarn cache
        uses: actions/cache@v3
        id: yarn_cache_id
        with:
          path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
          key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
          restore-keys: |
            ${{ runner.os }}-yarn

      - name: Node modules cache
        uses: actions/cache@v3
        id: node_modules_cache_id
        with:
          path: |
            node_modules
            */*/node_modules
          key: ${{ runner.os }}-${{ hashFiles('**/yarn.lock') }}

      - name: Install Dependencies
        if: steps.yarn_cache_id.outputs.cache-hit != 'true' || steps.node_modules_cache_id.outputs.cache-hit != 'true'
        run: yarn install --immutable

      - name: Download build artifacts
        uses: actions/download-artifact@v3
        with:
          name: compiled-js-and-types
          path: packages/

      - name: Run prettier
        run: yarn prettier

  chromatic:
    name: Component Visual regression tests
    needs: build
    runs-on: ubuntu-latest
    if: github.event.pull_request.draft == false

    steps:
      - name: Checkout Repo
        uses: actions/checkout@v3
        with:
          # Chromatic needs the full git history to work
          fetch-depth: 0

      - name: Setup Node.js 16.13
        uses: actions/setup-node@v3
        with:
          node-version: 16.13.x

      - name: Get yarn cache directory path
        id: yarn-cache-dir-path
        run: echo "dir=$(yarn config get cacheFolder)" >> $GITHUB_OUTPUT

      - name: Load Yarn cache
        uses: actions/cache@v3
        id: yarn_cache_id
        with:
          path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
          key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
          restore-keys: |
            ${{ runner.os }}-yarn

      - name: Node modules cache
        uses: actions/cache@v3
        id: node_modules_cache_id
        with:
          path: |
            node_modules
            */*/node_modules
          key: ${{ runner.os }}-${{ hashFiles('**/yarn.lock') }}

      - name: Install Dependencies
        if: steps.yarn_cache_id.outputs.cache-hit != 'true' || steps.node_modules_cache_id.outputs.cache-hit != 'true'
        run: yarn install --immutable

      - name: Download build artifacts
        uses: actions/download-artifact@v3
        with:
          name: compiled-js-and-types
          path: packages/

      - name: Run Chromatic
        uses: chromaui/action@v1
        with:
          projectToken: ${{ secrets.CHROMA_APP_CODE }}
          token: ${{ secrets.GITHUB_TOKEN }}
          buildScriptName: "build:storybook"
          autoAcceptChanges: "main"
          exitOnceUploaded: true
          onlyChanged: true
          externals: |
            - 'packages/paste-design-tokens/tokens/**'
            - 'packages/paste-icons/src/**'
            - '.storybook/static/**'
        env:
          STORYBOOK_GITHUB_SHA: ${{ github.event.pull_request.head.sha }}
          # https://github.com/storybookjs/builder-vite/issues/409#issuecomment-1199236279
          NODE_OPTIONS: --max-old-space-size=6144

  pr-categorizer:
    name: Categorize the PR using labels
    runs-on: ubuntu-latest
    steps:
      - name: Checkout Repo
        uses: actions/checkout@v3

      - name: Setup Node.js 16.13
        uses: actions/setup-node@v3
        with:
          node-version: 16.13.x

      - name: Get yarn cache directory path
        id: yarn-cache-dir-path
        run: echo "dir=$(yarn config get cacheFolder)" >> $GITHUB_OUTPUT

      - name: Load Yarn cache
        uses: actions/cache@v3
        id: yarn_cache_id
        with:
          path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
          key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
          restore-keys: |
            ${{ runner.os }}-yarn

      - name: Node modules cache
        uses: actions/cache@v3
        id: node_modules_cache_id
        with:
          path: |
            node_modules
            */*/node_modules
          key: ${{ runner.os }}-${{ hashFiles('**/yarn.lock') }}

      - name: Install Dependencies
        if: steps.yarn_cache_id.outputs.cache-hit != 'true' || steps.node_modules_cache_id.outputs.cache-hit != 'true'
        run: yarn install --immutable

      - uses: actions/labeler@v4
        with:
          repo-token: "${{ secrets.GITHUB_TOKEN }}"
          sync-labels: true

  danger:
    name: Danger checks
    runs-on: ubuntu-latest
    steps:
      - name: Checkout Repo
        uses: actions/checkout@v3

      - name: Setup Node.js 16.13
        uses: actions/setup-node@v3
        with:
          node-version: 16.13.x

      - name: Get yarn cache directory path
        id: yarn-cache-dir-path
        run: echo "dir=$(yarn config get cacheFolder)" >> $GITHUB_OUTPUT

      - name: Load Yarn cache
        uses: actions/cache@v3
        id: yarn_cache_id
        with:
          path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
          key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
          restore-keys: |
            ${{ runner.os }}-yarn

      - name: Node modules cache
        uses: actions/cache@v3
        id: node_modules_cache_id
        with:
          path: |
            node_modules
            */*/node_modules
          key: ${{ runner.os }}-${{ hashFiles('**/yarn.lock') }}

      - name: Install Dependencies
        if: steps.yarn_cache_id.outputs.cache-hit != 'true' || steps.node_modules_cache_id.outputs.cache-hit != 'true'
        run: yarn install --immutable

      - name: Run DangerJS
        run: yarn danger ci
        env:
          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}