feat(workflows): setup netlify config and update workflows (#3218)

.github/actions/artifact-download/action.yaml

@@ -1,14 +1,5 @@
 ###
 #
-# If you need to do some changes in a local-action used in this
-# workflow, make sure you change the action-flag to your working
-# branch-name to get the latest action functionality.
-#
-# Example: swisspost/design-system/.github/actions/setup-environment-pnpm@my-working-branch-name
-#
-# Don't forget to change the action-flag back to 'main',
-# once you have finished your work on the local-action!
-#
 # https://docs.github.com/en/actions/creating-actions/about-custom-actions#using-release-management-for-actions
 #
 ###

.github/actions/artifact-upload/action.yaml

@@ -1,14 +1,5 @@
 ###
 #
-# If you need to do some changes in a local-action used in this
-# workflow, make sure you change the action-flag to your working
-# branch-name to get the latest action functionality.
-#
-# Example: swisspost/design-system/.github/actions/setup-environment-pnpm@my-working-branch-name
-#
-# Don't forget to change the action-flag back to 'main',
-# once you have finished your work on the local-action!
-#
 # https://docs.github.com/en/actions/creating-actions/about-custom-actions#using-release-management-for-actions
 #
 ###

.github/actions/deploy-to-netlify/action.yaml

@@ -1,17 +1,6 @@
 ###
 #
-# This action needs a proper node and pnpm setup before!
-#
-# If you need to do some changes in a local-action used in this
-# workflow, make sure you change the action-flag to your working
-# branch-name to get the latest action functionality.
-#
-# Example: swisspost/design-system/.github/actions/setup-pnpm@my-working-branch-name
-#
-# Don't forget to change the action-flag back to 'main',
-# once you have finished your work on the local-action!
-#
-# https://docs.github.com/en/actions/creating-actions/about-custom-actions#using-release-management-for-actions
+# DEPRECATED: This Action can be removed, as soon as we remove deploy-demo.yaml
 #
 ###
 
@@ -47,16 +36,16 @@ runs:
   steps:
     - name: Install netlify-cli
       shell: bash
-      run: pnpm i -g netlify-cli@16
+      run: pnpm i -g netlify-cli
 
     - name: Deploy preview environment to netlify
       id: netlify_deploy
       shell: bash
       env:
         NETLIFY_AUTH_TOKEN: ${{ inputs.netlify_auth_token }}
+        NETLIFY_SITE_ID: ${{ inputs.netlify_site_id }}
       # run command taken from https://gist.github.com/oneohthree/f528c7ae1e701ad990e6, shortened to 28 chars, prepended with build-number
-      # edited for netifly v16
       run: |
         url_alias=`echo "preview-${{ inputs.id }}" | iconv -t ascii//TRANSLIT | sed -E 's/[~\^]+//g' | sed -E 's/[^a-zA-Z0-9]+/-/g' | sed -E 's/^-+\|-+$//g' | sed -E 's/^-+//g' | sed -E 's/-+$//g' | tr A-Z a-z`
-        netlify deploy --alias $url_alias --build false --dir ${{ inputs.folder }} --site ${{ inputs.netlify_site_id }} --filter ${{inputs.package_name}}
         echo "url_alias=$url_alias" >> $GITHUB_OUTPUT
+        netlify deploy --filter ${{inputs.package_name}} --build false --dir ${{ inputs.folder }} --alias $url_alias

.github/actions/setup-netlify-cli/action.yaml

@@ -0,0 +1,15 @@
+###
+#
+# NOTE: We've created this action to ensure, we are using the same Netlify-CLI version everywhere
+#
+###
+
+name: Setup Netlify CLI
+description: Provides node and pnpm in a specific version.
+
+runs:
+  using: composite
+  steps:
+    - name: Install netlify-cli
+      shell: bash
+      run: pnpm i -g netlify-cli@17

.github/actions/setup-pnpm/action.yaml

@@ -5,15 +5,6 @@
 # separate terms of service, privacy policy, and support
 # documentation.
 #
-# If you need to do some changes in a local-action used in this
-# workflow, make sure you change the action-flag to your working
-# branch-name to get the latest action functionality.
-#
-# Example: swisspost/design-system/.github/actions/setup-pnpm@my-working-branch-name
-#
-# Don't forget to change the action-flag back to 'main',
-# once you have finished your work on the local-action!
-#
 # https://docs.github.com/en/actions/creating-actions/about-custom-actions#using-release-management-for-actions
 #
 # NOTE: pnpm caching support requires pnpm version >= 6.10.0
@@ -26,11 +17,9 @@ description: Provides node and pnpm in a specific version.
 inputs:
   node_version:
     description: Specify the node version to install
-    default: 20
     type: string
   pnpm_version:
     description: Specify the pnpm version to install
-    default: 9
     type: string
   use_cache:
     description: Specify wether to use the pnpm cache or not
@@ -40,13 +29,38 @@ inputs:
 runs:
   using: composite
   steps:
+    - name: Detect wanted version
+      id: wanted-versions
+      uses: actions/github-script@v7
+      with:
+        script: |
+          const fs = require('fs')
+          const pkg = JSON.parse(fs.readFileSync('package.json', 'utf8'))
+
+          return {
+            node: pkg.engines?.node,
+            pnpm: pkg.packageManager
+          }
+
     - name: Install pnpm
-      uses: pnpm/action-setup@v3
+      uses: pnpm/action-setup@v4
       with:
-        version: ${{ inputs.pnpm_version }}
+        # If input.pnpm_version is NOT defined,
+        # the action automatically uses the "packageManager" field from the package.json file
+        # If input.pnpm_version is defined, we need to point to another package.json file, without the "packageManager" field,
+        # so we do not end up with a "Multiple versions of pnpm specified" error
+        package_json_file: ${{ inputs.pnpm_version && 'packages/documentation/package.json' || 'package.json' }}
+        version: ${{ inputs.pnpm_version || null }}
 
-    - name: Install node with pnpm cache
+    - name: Install node
       uses: actions/setup-node@v4
       with:
-        node-version: ${{ inputs.node_version }}
+        node-version: ${{ inputs.node_version || fromJSON(steps.wanted-versions.outputs.result).node }}
         cache: ${{ inputs.use_cache == 'true' && 'pnpm' || '' }}
+
+    - name: Summary
+      shell: bash
+      run: |
+        echo "Installed versions:"
+        echo "- node: ${{ inputs.node_version || fromJSON(steps.wanted-versions.outputs.result).node }}"
+        echo "- pnpm: ${{ inputs.pnpm_version || fromJSON(steps.wanted-versions.outputs.result).pnpm }}"

.github/workflows/build-demo.yaml

@@ -1,13 +1,6 @@
 ###
 #
-# Build the demo app and all dependencies
-#
-# This workflow does not have secrets access
-# when run from a fork. Artifacts are uploaded
-# and used in a subsequent workflow with more
-# privileges which does not run unsafe commands.
-#
-# https://securitylab.github.com/research/github-actions-preventing-pwn-requests/
+# DEPRECATED: This Action can be removed as soon as we start working on V2/V9
 #
 ###
 
@@ -36,15 +29,15 @@ jobs:
           access-token: ${{ secrets.SWISSPOSTDEVS_ACCESS_TOKEN }}
 
       - name: Setup
-        uses: swisspost/design-system/.github/actions/setup-pnpm@main
+        uses: ./.github/actions/setup-pnpm
 
       - name: Bootstrap & Build Design System
         run: |
           pnpm --filter design-system-demo... install
           pnpm --filter design-system-demo... build
 
       - name: Upload build artifacts
-        uses: swisspost/design-system/.github/actions/artifact-upload@main
+        uses: ./.github/actions/artifact-upload
         with:
           name: design-system-demo
           folder: packages/demo/dist/demo

.github/workflows/build-documentation.yaml

@@ -19,8 +19,8 @@ on:
 
 jobs:
   build:
+    name: Build Documentation
     runs-on: ubuntu-latest
-
     steps:
       - name: Checkout
         uses: actions/checkout@v4
@@ -31,7 +31,7 @@ jobs:
           access-token: ${{ secrets.SWISSPOSTDEVS_ACCESS_TOKEN }}
 
       - name: Setup
-        uses: swisspost/design-system/.github/actions/setup-pnpm@main
+        uses: ./.github/actions/setup-pnpm
 
       - name: Install documentation & dependencies
         run: pnpm --filter design-system-documentation... install

.github/workflows/deploy-demo.yaml

@@ -1,8 +1,6 @@
 ###
 #
-# Deploys a pre-built demo app to netlify
-#
-# https://securitylab.github.com/research/github-actions-preventing-pwn-requests/
+# DEPRECATED: This Action can be removed as soon as we start working on V2/V9
 #
 ###
 
@@ -25,10 +23,10 @@ jobs:
         uses: actions/checkout@v4
 
       - name: Setup
-        uses: swisspost/design-system/.github/actions/setup-pnpm@main
+        uses: ./.github/actions/setup-pnpm
 
       - name: Download build artifacts
-        uses: swisspost/design-system/.github/actions/artifact-download@main
+        uses: ./.github/actions/artifact-download
         id: build
         with:
           name: design-system-demo
@@ -37,7 +35,7 @@ jobs:
       - run: ls -R
 
       - name: Deploy demo app to netlify
-        uses: swisspost/design-system/.github/actions/deploy-to-netlify@main
+        uses: ./.github/actions/deploy-to-netlify
         id: deploy
         with:
           id: ${{ steps.build.outputs.id }}

.github/workflows/deploy-documentation.yaml

@@ -1,28 +1,23 @@
-###
-#
-# Deploy a pre-built documentation to netilfy
-#
-# https://securitylab.github.com/research/github-actions-preventing-pwn-requests/
-#
-###
-
-name: Deploy Documentation Preview to Netlify
+name: Deploy Documentation Preview
 on:
   workflow_run:
     workflows: ['Build Documentation']
     types: [completed]
 
 jobs:
   deploy:
+    name: Deploy Documentation Preview
     runs-on: ubuntu-latest
     if: ${{ github.event.workflow_run.event == 'pull_request' && github.event.workflow_run.conclusion == 'success' }}
-
     steps:
       - name: Checkout
         uses: actions/checkout@v4
 
-      - name: Setup
-        uses: swisspost/design-system/.github/actions/setup-pnpm@main
+      - name: Setup pnpm & node
+        uses: ./.github/actions/setup-pnpm
+
+      - name: Setup netlify-cli
+        uses: ./.github/actions/setup-netlify-cli
 
       - name: Download build artifacts
         uses: ./.github/actions/artifact-download
@@ -31,20 +26,41 @@ jobs:
           name: design-system-documentation
           folder: build-output
 
-      - name: Deploy documentation to netlify
-        uses: ./.github/actions/deploy-to-netlify
-        id: deploy
+      - name: Get netlify config
+        id: netlify-config
+        uses: actions/github-script@v7
         with:
-          id: ${{ steps.build.outputs.id }}
-          netlify_auth_token: ${{ secrets.NETLIFY_AUTH_TOKEN }}
-          netlify_site_id: ${{ secrets.NEXT_NETLIFY_SITE_ID }}
-          netlify_site_url: swisspost-design-system-next.netlify.app
-          folder: ${{ steps.build.outputs.folder }}
-          package_name: '@swisspost/design-system-documentation'
+          script: |
+            const fs = require('fs')
+            return JSON.parse(fs.readFileSync('./packages/documentation/netlify.config.json', 'utf8'))
+
+      - name: Deploy Documentation Preview
+        id: deploy
+        env:
+          NETLIFY_AUTH_TOKEN: ${{ secrets.NETLIFY_AUTH_TOKEN }}
+          NETLIFY_SITE_ID: ${{ fromJSON(steps.netlify-config.outputs.result).siteId }}
+        # run command taken from https://gist.github.com/oneohthree/f528c7ae1e701ad990e6, shortened to 28 chars, prepended with build-number
+        run: |
+          url_alias=`echo "preview-${{ steps.build.outputs.id }}" | iconv -t ascii//TRANSLIT | sed -E 's/[~\^]+//g' | sed -E 's/[^a-zA-Z0-9]+/-/g' | sed -E 's/^-+\|-+$//g' | sed -E 's/^-+//g' | sed -E 's/-+$//g' | tr A-Z a-z`
+          echo "site-url=https://$url_alias--${{ fromJSON(steps.netlify-config.outputs.result).siteUrl }}" >> $GITHUB_OUTPUT
+          netlify deploy --filter @swisspost/design-system-documentation --build false --dir ${{ steps.build.outputs.folder }} --alias $url_alias
 
       - name: Update preview message
         uses: ./.github/actions/preview/message/update
         with:
           access-token: ${{ secrets.SWISSPOSTDEVS_ACCESS_TOKEN }}
           issue-number: ${{ steps.build.outputs.id }}
-          preview-url: ${{ steps.deploy.outputs.preview-url }}
+          preview-url: ${{ steps.deploy.outputs.site-url }}
+
+      - name: Create Summary
+        id: summary
+        uses: actions/github-script@v7
+        with:
+          script: |
+            return `# Deployed Documentation Preview
+            - SiteId: <code>${{ fromJSON(steps.netlify-config.outputs.result).siteId }}</code>
+            - SiteUrl: ${{ steps.deploy.outputs.site-url }}
+            `
+
+      - name: Output Summary
+        run: echo -e ${{ steps.summary.outputs.result }} >> $GITHUB_STEP_SUMMARY

.github/workflows/e2e-tests.yaml

@@ -20,7 +20,7 @@ jobs:
           fetch-depth: 0
 
       - name: Setup
-        uses: swisspost/design-system/.github/actions/setup-pnpm@main
+        uses: ./.github/actions/setup-pnpm
         with:
           use_cache: false
 

.github/workflows/fetch-icons.yaml

@@ -32,7 +32,7 @@ jobs:
           fetch-depth: 0
 
       - name: Setup
-        uses: swisspost/design-system/.github/actions/setup-pnpm@main
+        uses: ./.github/actions/setup-pnpm
 
       - name: Get Date
         id: current-date

.github/workflows/lint.yaml

@@ -19,7 +19,7 @@ jobs:
           fetch-depth: 0
 
       - name: Setup
-        uses: swisspost/design-system/.github/actions/setup-pnpm@main
+        uses: ./.github/actions/setup-pnpm
 
       - name: Install dependencies of changed packages
         run: pnpm install

.github/workflows/release-demo.yaml

@@ -1,6 +1,6 @@
 ###
 #
-# Release the demo app whenever it's package json changes on the main branch
+# DEPRECATED: This Action can be removed as soon as we start working on V2/V9
 #
 ###
 
@@ -33,7 +33,7 @@ jobs:
 
       - name: Setup
         if: steps.check.outputs.changed == 'true'
-        uses: swisspost/design-system/.github/actions/setup-pnpm@main
+        uses: ./.github/actions/setup-pnpm
 
       # Install changesets locally
       - name: Install demo app & dependencies