javascript.yml

name: JavaScript

on:
  push:
    branches:
      - main
  pull_request:
    types: [opened, synchronize, labeled, closed]
  release:
    types: [published]

permissions:
  actions: read
  contents: read

jobs:
  main:
    if: github.event.action != 'closed'
    env:
      GH_TOKEN: ${{ github.token }}

    runs-on: ubicloud-standard-2
    timeout-minutes: 10
    steps:
      - uses: actions/checkout@v4
        with:
          fetch-depth: 0

      - uses: actions/setup-node@v4
        with:
          node-version: 20
          cache: "yarn"

      - name: Add LLVM apt Repo
        run: |-
          wget -O - https://apt.llvm.org/llvm-snapshot.gpg.key | sudo apt-key add -
          sudo add-apt-repository "deb http://apt.llvm.org/$(lsb_release -cs)/ llvm-toolchain-$(lsb_release -cs)-21 main"
          sudo apt update

      - name: Install APT dependencies
        run: grep -v emscripten Aptfile | xargs sudo apt-get install -y --no-install-recommends

      - name: Setup Emscripten
        uses: mymindstorm/setup-emsdk@v14
        with:
          version: 5.0.2
          actions-cache-folder: emsdk-cache-javascript

      - name: Set up Ruby
        uses: ruby/setup-ruby@v1
        with:
          bundler-cache: true

      - name: bundle install
        run: bundle install

      - name: Render Templates
        run: bundle exec rake templates

      - uses: actions/setup-node@v4
        with:
          node-version: 20
          cache: "yarn"

      - name: yarn install
        run: yarn install --frozen-lockfile

      - name: Install Playwright browsers
        run: yarn playwright install

      - name: Build tailwind-class-sorter package
        env:
          RELEASE_BUILD: ${{ github.event_name == 'release' && 'true' || 'false' }}
        run: yarn nx build @herb-tools/tailwind-class-sorter

      - name: Run `build` for all NX packages
        env:
          RELEASE_BUILD: ${{ github.event_name == 'release' && 'true' || 'false' }}
          GITHUB_PR_NUMBER: ${{ github.event.pull_request.number }}
          GITHUB_PR_HEAD_SHA: ${{ github.event.pull_request.head.sha }}
        run: yarn build

      - name: Run `test` for all NX packages
        run: yarn test

      - name: Setup Deno
        uses: denoland/setup-deno@v2
        with:
          deno-version: v2.x

      - name: Run Deno smoke test
        run: deno run --allow-read --allow-env javascript/packages/node-wasm/test/deno_smoke.ts

      - name: Upload package artifacts
        uses: actions/upload-artifact@v4
        with:
          name: npm-packages
          path: javascript/packages/*/
          if-no-files-found: error
          retention-days: 1

      - name: Upload docs artifact
        if: github.event_name == 'pull_request'
        uses: actions/upload-artifact@v4
        with:
          name: docs-preview
          path: docs/.vitepress/dist
          if-no-files-found: error
          retention-days: 1

      # NX is not able to properly detect affected changes if things change in C source or the WASM build
      #
      # - name: Set NX SHAs
      #   uses: nrwl/nx-set-shas@v4
      #
      # # Nx Affected runs only tasks affected by the changes in this PR/commit. Learn more: https://nx.dev/ci/features/affected
      # - run: npx nx affected -t build
      # - run: npx nx affected -t test

  publish:
    name: Publish packages to npm
    if: github.event_name == 'release' && github.repository_owner == 'marcoroth'
    needs: main
    runs-on: ubuntu-latest
    timeout-minutes: 30

    permissions:
      contents: read
      id-token: write

    steps:
      - uses: actions/setup-node@v4
        with:
          node-version: 20
          registry-url: 'https://registry.npmjs.org'

      - name: Download package artifacts
        uses: actions/download-artifact@v4
        with:
          name: npm-packages
          path: javascript/packages/

      - name: Publish packages with provenance
        run: |
          for package_dir in javascript/packages/*; do
            if [ -d "$package_dir" ] && [ -f "$package_dir/package.json" ]; then
              package=$(basename "$package_dir")

              if [ "$package" = "vscode" ]; then
                echo "Skipping vscode package..."
                continue
              fi

              echo "Publishing $package..."
              (cd "$package_dir" && npm publish --provenance --access public --ignore-scripts)
            fi
          done

  preview-check:
    if: |
      (github.repository == 'marcoroth/herb' && github.event_name == 'pull_request' && github.event.pull_request.user.login == github.repository_owner) ||
      (github.repository == 'marcoroth/herb' && github.event_name == 'pull_request' && contains(github.event.pull_request.labels.*.name, 'release-preview')) ||
      (github.repository == 'marcoroth/herb' && github.event_name == 'push' && github.ref == 'refs/heads/main')

    runs-on: ubuntu-latest
    outputs:
      has-permissions: ${{ steps.check.outputs.require-result || steps.push-check.outputs.result }}

    steps:
      - name: Check permissions
        id: check
        if: github.event_name != 'push'
        uses: actions-cool/check-user-permission@v2
        with:
          require: write

      - name: Set permission for push events
        id: push-check
        if: github.event_name == 'push'
        run: echo "result=true" >> $GITHUB_OUTPUT

  preview:
    name: Publish preview packages
    needs: [main, preview-check]
    if: needs.preview-check.outputs.has-permissions == 'true'
    runs-on: ubuntu-latest

    permissions:
      contents: read
      pull-requests: write

    steps:
      - uses: actions/setup-node@v4
        with:
          node-version: 20

      - name: Download package artifacts
        uses: actions/download-artifact@v4
        with:
          name: npm-packages
          path: javascript/packages/

      - name: Publish preview packages
        run: npx pkg-pr-new@0.0.63 publish --compact --comment=update --bin --no-template './javascript/packages/formatter' './javascript/packages/linter' './javascript/packages/language-server'

  publish-vscode:
    name: Publish VSCode extension
    if: github.event_name == 'release' && github.repository_owner == 'marcoroth'
    needs: main
    runs-on: ubuntu-latest
    timeout-minutes: 10
    permissions:
      contents: read
    steps:
      - uses: actions/setup-node@v4
        with:
          node-version: 20

      - name: Download package artifacts
        uses: actions/download-artifact@v4
        with:
          name: npm-packages
          path: javascript/packages/

      - name: Publish to VS Code Marketplace
        env:
          VSCE_PAT: ${{ secrets.VSCE_PAT }}
        run: |
          cd javascript/packages/vscode
          npx @vscode/vsce publish --no-dependencies

      - name: Publish to Open VSX Registry
        env:
          OVSX_PAT: ${{ secrets.OVSX_PAT }}
        run: |
          cd javascript/packages/vscode
          npx ovsx publish --no-dependencies -p $OVSX_PAT

  deploy-preview:
    name: Deploy docs preview to Cloudflare Pages
    needs: [main, preview-check]
    if: |
      github.event_name == 'pull_request' &&
      needs.preview-check.outputs.has-permissions == 'true'
    runs-on: ubuntu-latest

    permissions:
      contents: read
      deployments: write
      pull-requests: write

    steps:
      - name: Download docs artifact
        uses: actions/download-artifact@v4
        with:
          name: docs-preview
          path: dist

      - name: Deploy to Cloudflare Pages
        id: deploy
        uses: cloudflare/pages-action@v1
        with:
          apiToken: ${{ secrets.CLOUDFLARE_API_TOKEN }}
          accountId: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
          projectName: herb-tools
          directory: dist
          gitHubToken: ${{ secrets.GITHUB_TOKEN }}

      - name: Add comment with preview URL
        uses: actions/github-script@v7
        with:
          script: |
            const previewUrl = '${{ steps.deploy.outputs.url }}';
            const comment = `### 🌿 Interactive Playground and Documentation Preview

            A preview deployment has been built for this pull request. Try out the changes live in the interactive playground:

            - **[Playground Preview](${previewUrl}/playground)**
            - **[Documentation Preview](${previewUrl})**
            - **[Website Preview](${previewUrl})**

            ---
            <sub>🌱 Grown from commit [\`${context.payload.pull_request.head.sha.substring(0, 7)}\`](https://github.com/${context.repo.owner}/${context.repo.repo}/commit/${context.payload.pull_request.head.sha})</sub>`;

            const { data: comments } = await github.rest.issues.listComments({
              owner: context.repo.owner,
              repo: context.repo.repo,
              issue_number: context.issue.number,
            });

            const botComment = comments.find(comment =>
              comment.user.type === 'Bot' &&
              comment.body.includes('🌿 Interactive Playground and Documentation Preview')
            );

            if (botComment) {
              await github.rest.issues.updateComment({
                owner: context.repo.owner,
                repo: context.repo.repo,
                comment_id: botComment.id,
                body: comment
              });
            } else {
              await github.rest.issues.createComment({
                owner: context.repo.owner,
                repo: context.repo.repo,
                issue_number: context.issue.number,
                body: comment
              });
            }

  cleanup-preview:
    name: Cleanup docs preview deployment
    if: github.event_name == 'pull_request' && github.event.action == 'closed'
    runs-on: ubuntu-latest

    permissions:
      pull-requests: write

    steps:
      - name: Delete Cloudflare Pages deployment
        env:
          CLOUDFLARE_ACCOUNT_ID: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
          CLOUDFLARE_API_TOKEN: ${{ secrets.CLOUDFLARE_API_TOKEN }}
          BRANCH_NAME: ${{ github.event.pull_request.head.ref }}
        run: |
          DEPLOYMENTS=$(curl -s -X GET \
            "https://api.cloudflare.com/client/v4/accounts/${CLOUDFLARE_ACCOUNT_ID}/pages/projects/herb-tools/deployments" \
            -H "Authorization: Bearer ${CLOUDFLARE_API_TOKEN}" \
            -H "Content-Type: application/json")

          DEPLOYMENT_ID=$(echo "$DEPLOYMENTS" | jq -r ".result[] | select(.deployment_trigger.metadata.branch == \"$BRANCH_NAME\") | .id" | head -n 1)

          if [ -n "$DEPLOYMENT_ID" ]; then
            echo "Deleting deployment $DEPLOYMENT_ID for branch $BRANCH_NAME"
            curl -X DELETE \
              "https://api.cloudflare.com/client/v4/accounts/${CLOUDFLARE_ACCOUNT_ID}/pages/projects/herb-tools/deployments/$DEPLOYMENT_ID" \
              -H "Authorization: Bearer ${CLOUDFLARE_API_TOKEN}" \
              -H "Content-Type: application/json"
          else
            echo "No deployment found for branch $BRANCH_NAME"
          fi

      - name: Update PR comment
        uses: actions/github-script@v7
        with:
          script: |
            const { data: comments } = await github.rest.issues.listComments({
              owner: context.repo.owner,
              repo: context.repo.repo,
              issue_number: context.issue.number,
            });

            const botComment = comments.find(comment =>
              comment.user.type === 'Bot' &&
              comment.body.includes('🌿 Interactive Playground and Documentation Preview')
            );

            if (botComment) {
              const updatedComment = botComment.body + '\n\n---\n\n✅ Preview deployment has been cleaned up.';
              await github.rest.issues.updateComment({
                owner: context.repo.owner,
                repo: context.repo.repo,
                comment_id: botComment.id,
                body: updatedComment
              });
            }