Ci/improve previews and preview ux

.github/workflows/pr-build-preview.yml

@@ -27,6 +27,21 @@ jobs:
         with:
           submodules: recursive
 
+      - name: Extract PR URL
+        id: get-pr-url
+        run: |
+          PR_URL=$(jq -r '.pull_request.html_url' "$GITHUB_EVENT_PATH")
+          echo "PR_URL=$PR_URL" >> $GITHUB_ENV
+          PR_LINK_TEXT=${PR_URL#https://}
+          echo "PR_LINK_TEXT=$PR_LINK_TEXT" >> $GITHUB_ENV
+
+      - name: Append preview snippet to header file
+        run: |
+          PREVIEW_HTML="<p style='color: rgba(var(--color-primary-600), 1); text-align: center;'>
+            This site is a preview for <a href='${{ env.PR_URL }}' style='text-decoration: underline;'>${{ env.PR_LINK_TEXT }}</a>
+          </p>"
+          echo "$PREVIEW_HTML" >> layouts/partials/header/basic.html
+
       - name: Build website with Hugo
         env:
           # For maximum backward compatibility with Hugo modules

.github/workflows/prw-deploy-preview.yml

@@ -66,12 +66,40 @@ jobs:
         with:
           github-token: ${{ secrets.GITHUB_TOKEN }}
           script: |
-            github.rest.issues.createComment({
-              issue_number: ${{ env.PR_NUMBER }},
-              owner: context.repo.owner,
-              repo: context.repo.repo,
-              body: `🎉 A preview for this PR is available at: ${{ env.HUGO_BASEURL }}pr${{ env.PR_NUMBER }}/`
-            });
+            try {
+              const { data: comments } = await github.rest.issues.listComments({
+                issue_number: ${{ env.PR_NUMBER }},
+                owner: context.repo.owner,
+                repo: context.repo.repo
+              });
+
+              // Define the comment body
+              const commentBody = `🎉 A preview for this PR is available at: ${{ env.HUGO_BASEURL }}pr${{ env.PR_NUMBER }}/`;
+
+              // Look for an existing comment containing the specific text
+              const existingComment = comments.find(comment =>
+                comment.body.includes("🎉 A preview for this PR is available at:")
+              );
+
+              if (existingComment) {
+                // Delete the existing comment
+                await github.rest.issues.deleteComment({
+                  comment_id: existingComment.id,
+                  owner: context.repo.owner,
+                  repo: context.repo.repo
+                });
+              }
+
+              // Create a new comment
+              await github.rest.issues.createComment({
+                issue_number: ${{ env.PR_NUMBER }},
+                owner: context.repo.owner,
+                repo: context.repo.repo,
+                body: commentBody
+              });
+            } catch (error) {
+              core.setFailed(`Failed to manage PR comment: ${error.message}`);
+            }
 
       - name: Invalidate CloudFront cache for PR
         uses: chetan/invalidate-cloudfront-action@v2

content/_index.md

@@ -15,7 +15,7 @@ cascade:
 {{< article link="/blog/2024/10/what-is-the-esp-registry/" >}}
 
 <br>
-{{< button href="#button" target="_self" href=/blog/ >}}
+{{< button href="blog/" target="_self" >}}
 More Articles
 {{< /button >}}
 
@@ -26,7 +26,7 @@ Dive into our latest workshops and master the skills you need to maximize the po
 {{< article link="/workshops/esp-idf-with-esp32-c6/introduction/" >}}
 
 <br>
-{{< button href="#button" target="_self" href=/workshops/ >}}
+{{< button href="workshops/" target="_self" >}}
 More Workshops
 {{< /button >}}
 
@@ -37,6 +37,6 @@ Here you can follow the current status of the new chip support in various Espres
 {{< article link="/pages/chip-support-status/esp32c61/" >}}
 
 <br>
-{{< button href="#button" target="_self" href=/events/ >}}
+{{< button href="events/" target="_self" >}}
 More Events
 {{< /button >}}