From 14a6a0f35052d79fe10e60f1e5d176dda6704eac Mon Sep 17 00:00:00 2001
From: Arturo Reuschenbach <reuschenbach@gmail.com>
Date: Wed, 7 Aug 2024 14:41:22 +0200
Subject: [PATCH] feat(workflows): Storybook pr preview on github pages (#183)

* correct runs-on target

* renamings

* preview storybook PRs

* trigger changes on ui-components

* just trigger if ui-componets have changed

* test new colors in pr preview

* fix file colors

* revert changes. There were just to check.

* ignore checks or deploy PRs if just markdown files are touched

* add new line

* do not run checks for github checks

* remove test

* add colons

* add new line

* move this change to a different pr

* ignore github after changing settings

* move to another pr
---
 .github/workflows/ci-checks.yaml           | 14 ++++----
 .github/workflows/deploy-github-pages.yaml |  4 +--
 .github/workflows/deploy-pr-preview.yaml   | 42 ++++++++++++++++++++++
 .github/workflows/release.yaml             |  2 +-
 4 files changed, 52 insertions(+), 10 deletions(-)
 create mode 100644 .github/workflows/deploy-pr-preview.yaml

diff --git a/.github/workflows/ci-checks.yaml b/.github/workflows/ci-checks.yaml
index 5b235596a..7138cee8c 100644
--- a/.github/workflows/ci-checks.yaml
+++ b/.github/workflows/ci-checks.yaml
@@ -14,7 +14,7 @@ on:
     
 jobs:
   install-dependencies:
-    runs-on: ubuntu-latest
+    runs-on: [default]
     steps:
       - uses: actions/checkout@v4
       - name: Use Node.js
@@ -34,7 +34,7 @@ jobs:
         run: npm ci      
 
   reuse-compliance:
-    runs-on: [ubuntu-latest]
+    runs-on: [default]
     steps:
       - name: Checkout
         uses: actions/checkout@v4
@@ -44,7 +44,7 @@ jobs:
         uses: fsfe/reuse-action@v3
 
   license-headers:
-    runs-on: [ubuntu-latest]
+    runs-on: [default]
     steps:
       - name: Checkout
         uses: actions/checkout@v4
@@ -61,7 +61,7 @@ jobs:
 
   allowed-licenses:
     needs: install-dependencies
-    runs-on: ubuntu-latest
+    runs-on: [default]
     steps:
       - uses: actions/checkout@v4
       - name: Use Node.js
@@ -85,7 +85,7 @@ jobs:
 
   lint:
     needs: install-dependencies
-    runs-on: ubuntu-latest
+    runs-on: [default]
     steps:
       - uses: actions/checkout@v4
       - name: Use Node.js
@@ -108,7 +108,7 @@ jobs:
 
   format:
     needs: install-dependencies
-    runs-on: ubuntu-latest
+    runs-on: [default]
     steps:
       - uses: actions/checkout@v4
       - name: Use Node.js
@@ -131,7 +131,7 @@ jobs:
 
   test:
     needs: install-dependencies
-    runs-on: ubuntu-latest
+    runs-on: [default]
     steps:
       - uses: actions/checkout@v4
       - name: Use Node.js
diff --git a/.github/workflows/deploy-github-pages.yaml b/.github/workflows/deploy-github-pages.yaml
index c4ed27fac..986036074 100644
--- a/.github/workflows/deploy-github-pages.yaml
+++ b/.github/workflows/deploy-github-pages.yaml
@@ -8,7 +8,7 @@
 #     `{"pull_request": {"number": <PR number>, "head": {"ref": "<PR branch name>", "sha": "PR commit sha"}, "base": {"ref": "main"}}, "repository": {"name": "juno", "owner": {"login": "cloudoperators"}}}`
 #  2. Run the following command:
 #     `act push --container-architecture linux/amd64 -P default=catthehacker/ubuntu:act-latest  -e act_push.json -W .github/workflows/deploy-github-pages.yaml`
-name: Storybook
+name: Storybook to GitHub Pages
 
 on:
   push:
@@ -24,7 +24,7 @@ permissions:
 
 jobs:
   build-and-deploy:
-    concurrency: ci-${{ github.ref }} # Recommended if you intend to make multiple deployments in quick succession.
+    concurrency: deploy-gh-pages-${{ github.ref }} # Recommended if you intend to make multiple deployments in quick succession.
     runs-on: [default]
     steps:
       - uses: actions/checkout@v4
diff --git a/.github/workflows/deploy-pr-preview.yaml b/.github/workflows/deploy-pr-preview.yaml
new file mode 100644
index 000000000..7251ca17c
--- /dev/null
+++ b/.github/workflows/deploy-pr-preview.yaml
@@ -0,0 +1,42 @@
+name: Storybook PR Preview
+
+on:
+  pull_request:
+    types:
+      - opened
+      - reopened
+      - synchronize
+      - closed
+    paths:
+      - "packages/ui-components/**"
+    # The paths-ignore option only prevents the workflow from running if all the changed files match the ignore patterns
+    paths-ignore:
+      - '**.md'  
+
+# Limit the concurrency of entire workflow
+concurrency: deploy-pr-preview-${{ github.ref }}
+
+jobs:
+  deploy-preview:
+    runs-on: [default]
+    steps:
+      - uses: actions/checkout@v4
+
+      - uses: actions/setup-node@v4
+        with:
+          node-version: "20.x"      
+
+      - name: Install dependencies
+        if: github.event.action != 'closed'
+        run: |
+          npm install --force         
+
+      - name: Build storybook
+        run: npm -w @cloudoperators/juno-ui-components run build-storybook          
+
+      - uses: rossjrw/pr-preview-action@v1
+        with:
+          source-dir: packages/ui-components/storybook-static
+          preview-branch: gh-pages
+          umbrella-dir: pr-preview
+          action: auto
diff --git a/.github/workflows/release.yaml b/.github/workflows/release.yaml
index cd6bcc621..ba9860a29 100644
--- a/.github/workflows/release.yaml
+++ b/.github/workflows/release.yaml
@@ -14,7 +14,7 @@ permissions:
 jobs:
   release:
     name: Release
-    runs-on: ubuntu-latest
+    runs-on: [default]
     steps:
       - name: Checkout Repo
         uses: actions/checkout@v3