chore(github-action): updated deploy-documentation workflow

.github/actions/preview/message/create/action.yaml

@@ -5,48 +5,71 @@ inputs:
   access-token:
     description: The access token to use for commenting.
     required: true
+  issue-number:
+    description: The issue number from the caller workflow.
+    required: true
 
 runs:
   using: composite
   steps:
     - uses: actions/github-script@v7
-      with:
-        github-token: ${{ inputs.access-token }}
-        script: |
-          const commentTitle = '**Related Previews**'
-          const commentInitialBody = 'Preview URLs will be added here, once they are ready... ![loader](https://github.com/swisspost/design-system/assets/9716662/49a75898-7093-4ffb-9460-071ff194459d)'
-
-          let comments
-          let previewComment
-
-          await getPreviewComment()
-
-          if (!previewComment) {
-            await github.rest.issues.createComment({
-              repo: context.repo.repo,
-              owner: context.repo.owner,
-              issue_number: context.issue.number,
-              body: `${commentTitle}\n${commentInitialBody}`
-            })
-
-            await getPreviewComment()
-
-            github.rest.reactions.createForIssueComment({
-              repo: context.repo.repo,
-              owner: context.repo.owner,
-              comment_id: previewComment.id,
-              content: 'eyes'
-            })
-          } else {
-            console.info('Skipped action, because preview comment already existed.')
-          }
-
-          async function getPreviewComment () {
-            comments = (await github.rest.issues.listComments({
-              repo: context.repo.repo,
-              owner: context.repo.owner,
-              issue_number: context.issue.number
-            })).data || []
-
-            previewComment = comments.find(c => c.user.login === 'swisspost-bot' && c.body.includes(commentTitle))
-          }
+  env:
+    ISSUE_NUMBER: ${{ inputs.issue-number }}
+  with:
+    github-token: ${{ inputs.access-token }}
+    script: |
+      const { ISSUE_NUMBER } = process.env
+      const commentTitle = '**Related Previews**'
+      const commentInitialBody = 'Preview URLs will be added here, once they are ready... ![loader](https://github.com/swisspost/design-system/assets/9716662/49a75898-7093-4ffb-9460-071ff194459d)'
+
+      console.log(`Fetching comments for PR #${ISSUE_NUMBER}...`)
+
+      let comments
+      let previewComment
+
+      await getPreviewComment()
+
+      if (!previewComment) {
+        console.log(`No preview comment found. Creating a new one.`)
+        await github.rest.issues.createComment({
+          repo: context.repo.repo,
+          owner: context.repo.owner,
+          issue_number: Number(ISSUE_NUMBER),
+          body: `${commentTitle}\n${commentInitialBody}`
+        })
+
+        console.log(`Comment created. Fetching it again for reactions...`)
+        await getPreviewComment()
+
+        if (previewComment) {
+          console.log(`Adding "eyes" reaction to the comment.`)
+          await github.rest.reactions.createForIssueComment({
+            repo: context.repo.repo,
+            owner: context.repo.owner,
+            comment_id: previewComment.id,
+            content: 'eyes'
+          })
+        } else {
+          console.error(`Failed to fetch the newly created preview comment.`)
+        }
+      } else {
+        console.info('Skipped action, because preview comment already existed.')
+      }
+
+      async function getPreviewComment () {
+        console.log(`Retrieving comments for PR #${ISSUE_NUMBER}.`)
+        comments = (await github.rest.issues.listComments({
+          repo: context.repo.repo,
+          owner: context.repo.owner,
+          issue_number: Number(ISSUE_NUMBER)
+        })).data || []
+
+        console.log(`Total comments retrieved: ${comments.length}`)
+        previewComment = comments.find(c => c.user.login === 'swisspost-bot' && c.body.includes(commentTitle))
+
+        if (previewComment) {
+          console.log(`Preview comment found with ID: ${previewComment.id}`)
+        } else {
+          console.log(`No preview comment matching the criteria.`)
+        }
+      }

.github/actions/preview/message/update/action.yaml

@@ -16,59 +16,75 @@ runs:
   using: composite
   steps:
     - uses: actions/github-script@v7
-      env:
-        ISSUE_NUMBER: ${{ inputs.issue-number }}
-        PREVIEW_URL: ${{ inputs.preview-url }}
-      with:
-        github-token: ${{ inputs.access-token }}
-        script: |
-          const { ISSUE_NUMBER, PREVIEW_URL } = process.env
+  env:
+    ISSUE_NUMBER: ${{ inputs.issue-number }}
+    PREVIEW_URL: ${{ inputs.preview-url }}
+  with:
+    github-token: ${{ inputs.access-token }}
+    script: |
+      const { ISSUE_NUMBER, PREVIEW_URL } = process.env
 
-          const commentTitle = '**Related Previews**'
-          const commentInitialBody = 'Preview URLs will be added here, once they are ready... ![loader](https://github.com/swisspost/design-system/assets/9716662/49a75898-7093-4ffb-9460-071ff194459d)'
+      const commentTitle = '**Related Previews**'
+      const commentInitialBody = 'Preview URLs will be added here, once they are ready... ![loader](https://github.com/swisspost/design-system/assets/9716662/49a75898-7093-4ffb-9460-071ff194459d)'
 
-          const comments = (await github.rest.issues.listComments({
+      console.log(`Fetching comments for PR #${ISSUE_NUMBER}...`)
+      const comments = (await github.rest.issues.listComments({
+        repo: context.repo.repo,
+        owner: context.repo.owner,
+        issue_number: Number(ISSUE_NUMBER)
+      })).data || []
+
+      console.log(`Total comments retrieved: ${comments.length}`)
+      const previewComment = comments.find(c => c.user.login === 'swisspost-bot' && c.body.includes(commentTitle))
+
+      if (previewComment) {
+        console.log(`Preview comment found with ID: ${previewComment.id}`)
+
+        if (!previewComment.body.includes(PREVIEW_URL)) {
+          console.log(`Adding preview URL to the comment: ${PREVIEW_URL}`)
+          await github.rest.issues.updateComment({
+            repo: context.repo.repo,
+            owner: context.repo.owner,
+            comment_id: previewComment.id,
+            body: previewComment.body
+              .replace(commentInitialBody, '')
+              .concat(`- ${PREVIEW_URL}\n`)
+          })
+
+          console.log(`Updating reactions for the comment.`)
+          const reactions = (await github.rest.reactions.listForIssueComment({
             repo: context.repo.repo,
             owner: context.repo.owner,
-            issue_number: Number(ISSUE_NUMBER)
+            comment_id: previewComment.id,
           })).data || []
-          const previewComment = comments.find(c => c.user.login === 'swisspost-bot' && c.body.includes(commentTitle))
 
-          if (previewComment && !previewComment.body.includes(PREVIEW_URL)) {
-            github.rest.issues.updateComment({
+          console.log(`Total reactions found: ${reactions.length}`)
+
+          const createReaction = reactions.find(r => r.user.login === 'swisspost-bot' && r.content === 'eyes')
+          const updateReaction = reactions.find(r => r.user.login === 'swisspost-bot' && r.content === 'rocket')
+
+          if (createReaction) {
+            console.log(`Removing "eyes" reaction.`)
+            await github.rest.reactions.deleteForIssueComment({
               repo: context.repo.repo,
               owner: context.repo.owner,
               comment_id: previewComment.id,
-              body: previewComment.body
-                .replace(commentInitialBody, '')
-                .concat(`- ${PREVIEW_URL}\n`)
+              reaction_id: createReaction.id
             })
+          }
 
-            const reactions = (await github.rest.reactions.listForIssueComment({
+          if (!updateReaction) {
+            console.log(`Adding "rocket" reaction.`)
+            await github.rest.reactions.createForIssueComment({
               repo: context.repo.repo,
               owner: context.repo.owner,
               comment_id: previewComment.id,
-            })).data || []
-            const createReaction = reactions.find(r => r.user.login === 'swisspost-bot' && r.content === 'eyes')
-            const updateReaction = reactions.find(r => r.user.login === 'swisspost-bot' && r.content === 'rocket')
-
-            if (createReaction) {
-              github.rest.reactions.deleteForIssueComment({
-                repo: context.repo.repo,
-                owner: context.repo.owner,
-                comment_id: previewComment.id,
-                reaction_id: createReaction.id
-              })
-            }
-
-            if (!updateReaction) {
-              github.rest.reactions.createForIssueComment({
-                repo: context.repo.repo,
-                owner: context.repo.owner,
-                comment_id: previewComment.id,
-                content: 'rocket'
-              })
-            }
-          } else {
-            console.warn('Skipped action, because preview comment could not be found!')
+              content: 'rocket'
+            })
           }
+        } else {
+          console.log(`Preview URL is already present in the comment.`)
+        }
+      } else {
+        console.warn(`Skipped action, because preview comment could not be found!`)
+      }

.github/workflows/build-documentation.yaml

@@ -25,11 +25,6 @@ jobs:
       - name: Checkout
         uses: actions/checkout@v4
 
-      - name: Create preview message
-        uses: ./.github/actions/preview/message/create
-        with:
-          access-token: ${{ secrets.SWISSPOSTDEVS_ACCESS_TOKEN }}
-
       - name: Setup
         uses: ./.github/actions/setup-pnpm
 

.github/workflows/deploy-documentation.yaml

@@ -26,6 +26,12 @@ jobs:
           name: design-system-documentation
           folder: build-output
 
+      - name: Create preview message
+        uses: ./.github/actions/preview/message/create
+        with:
+          access-token: ${{ secrets.SWISSPOSTDEVS_ACCESS_TOKEN }}
+          issue-number: ${{ github.event.workflow_run.pull_requests[0].number }}
+
       - name: Get netlify config
         id: netlify-config
         uses: actions/github-script@v7

packages/components/src/components/post-breadcrumb-item/post-breadcrumb-item.tsx

@@ -24,6 +24,7 @@ export class PostBreadcrumbItem {
   validateUrl() {
     try {
       this.validUrl = this.constructUrl(this.url);
+      return this.validUrl;
     } catch (error) {
       this.validUrl = undefined;
     }