Adding cloudflare preview builds #822
Conversation
|
""" WalkthroughA new GitHub Actions workflow file named Changes
Sequence Diagram(s)sequenceDiagram
participant GitHub PR as GitHub PR (to master)
participant Actions as GitHub Actions Runner
participant Cloudflare as Cloudflare Pages
participant PR as Pull Request
GitHub PR->>Actions: Trigger workflow on PR to master
Actions->>Actions: Checkout code, cache dependencies
Actions->>Actions: Setup Node.js & Yarn, install dependencies
Actions->>Actions: Build project (yarn build)
Actions->>Cloudflare: Deploy build output (src/dist)
Cloudflare-->>Actions: Return deployment URL
Actions->>PR: Comment with deployment URL and add reactions
Poem
📜 Recent review detailsConfiguration used: CodeRabbit UI 📒 Files selected for processing (1)
🚧 Files skipped from review as they are similar to previous changes (1)
🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 2
🧹 Nitpick comments (1)
.github/workflows/deploy-preview.yml (1)
20-25: Leveragesetup-nodebuilt-in caching
Instead of manually cachingnode_modules, you can combine Node.js setup and Yarn cache:- name: Install node.js (with cache) uses: actions/setup-node@v4 with: node-version-file: '.nvmrc' cache: 'yarn' cache-dependency-path: yarn.lockThis simplifies the workflow and speeds up dependency installs.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
.github/workflows/deploy-preview.yml(1 hunks)
🔇 Additional comments (6)
.github/workflows/deploy-preview.yml (6)
1-1: Workflow name is clear
Thename: 'Preview Deployment'succinctly describes this workflow.
2-5: Verify use of pull_request_target
Usingpull_request_targetgrants access to secrets but runs the workflow against the base branch code. Ensure this is intentional and that no untrusted PR code can modify the workflow or exfiltrate secrets.
14-15: No action required for runner and timeout
Theruns-on: ubuntu-latestandtimeout-minutes: 5settings are reasonable defaults; adjust only if your build routinely exceeds 5 minutes.
26-33: No action required for Node.js and Yarn installation
The steps to install Node.js via.nvmrcand then globally install Yarn are standard. Pinning Yarn to a specific version or using built-in cache flags is optional.
35-42: Verify build output path
Confirm that your build actually emits files tosrc/dist. If the output directory differs (e.g., a top-leveldist/), update the deploy command accordingly:- pages deploy src/dist --project-name=... + pages deploy dist --project-name=...
43-51: No action required for comment step
Usingactions-comment-pull-requestwith reactions andmode: recreateis a solid approach for surfacing the preview URL.
| - name: Checkout code | ||
| uses: actions/checkout@v4 | ||
|
|
There was a problem hiding this comment.
Checkout PR head commit on pull_request_target
By default, actions/checkout in a pull_request_target event checks out the base branch. To build the PR changes, specify the head ref:
- - uses: actions/checkout@v4
+ - uses: actions/checkout@v4
+ with:
+ ref: ${{ github.event.pull_request.head.sha }}📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| - name: Checkout code | |
| uses: actions/checkout@v4 | |
| - name: Checkout code | |
| uses: actions/checkout@v4 | |
| with: | |
| ref: ${{ github.event.pull_request.head.sha }} |
| permissions: | ||
| actions: read | ||
| contents: read | ||
| deployments: write | ||
| pull-requests: write |
There was a problem hiding this comment.
🛠️ Refactor suggestion
Add issues: write permission for PR comments
To allow the comment action to post deployment URLs on the pull request, include the issues: write permission under permissions.
permissions:
actions: read
contents: read
deployments: write
+ issues: write
pull-requests: write📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| permissions: | |
| actions: read | |
| contents: read | |
| deployments: write | |
| pull-requests: write | |
| permissions: | |
| actions: read | |
| contents: read | |
| deployments: write | |
| issues: write | |
| pull-requests: write |
| with: | ||
| message: | | ||
| Preview URL: ${{ steps.deploy.outputs.deployment-url }} | ||
| reactions: eyes, rocket |
There was a problem hiding this comment.
| reactions: eyes, rocket |
There was a problem hiding this comment.
@blckmn - this was requested by @nerdCopter
There was a problem hiding this comment.
Yes this updates the single comment (recreation mode) issue.
I'm keeping the emojis though :)
|
This pull request introduces a new GitHub Actions workflow to automate preview deployments for pull requests targeting the
masterbranch. The workflow includes steps for building the project, deploying to Cloudflare, and commenting the preview URL back on the pull request.New GitHub Actions Workflow for Preview Deployments:
.github/workflows/deploy-preview.yml: Added a new workflow namedPreview Deploymentthat triggers on pull requests targeting themasterbranch. The workflow includes steps for caching dependencies, installing Node.js, building the project with Yarn, deploying to Cloudflare using the Wrangler action, and commenting the preview URL on the pull request.Summary by CodeRabbit