enso/.github/workflows/storybook.yml

106 lines
3.3 KiB
YAML

# This file is not auto-generated. Feel free to edit it.
name: Storybook Chromatic Deployment
on: workflow_call
# Cancel in-progress workflows if a new one is started
concurrency:
group: ${{ github.workflow }}-${{ github.ref }}-chromatic
cancel-in-progress: true
permissions:
contents: read # Read-only access to repository contents
issues: write # Write access to issues
pull-requests: write # Write access to pull requests
statuses: write # Write access to commit statuses
env:
ENSO_BUILD_SKIP_VERSION_CHECK: "true"
PLAYWRIGHT_SKIP_BROWSER_DOWNLOAD: 1
jobs:
deploy-chromatic-react:
name: 🚀 Deploy React to Chromatic
runs-on: ubuntu-latest
outputs:
dashboardUrl: ${{ steps.publish_chromatic.outputs.url }}
dashboardStorybookUrl: ${{ steps.publish_chromatic.outputs.storybookUrl }}
env:
CHROMATIC_RETRIES: 3
CHROMATIC_PROJECT_TOKEN: ${{ secrets.DASHBOARD_CHROMATIC_PROJECT_TOKEN }}
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
steps:
- uses: actions/checkout@v4
name: Checkout
with:
fetch-depth: 0
ref: ${{ github.event.pull_request.head.ref }}
fetch-tags: false
- name: 📦 Setup pnpm
uses: pnpm/action-setup@v4
- uses: actions/setup-node@v4
name: ⎔ Setup Node
with:
node-version-file: .node-version
cache: "pnpm"
- if: startsWith(runner.name, 'GitHub Actions') || startsWith(runner.name, 'Hosted Agent')
name: Installing wasm-pack
uses: jetli/wasm-pack-action@v0.4.0
with:
version: v0.12.1
- name: 📦 Install dependencies
run: pnpm install --frozen-lockfile
- name: 📥 Download storybook cache
uses: actions/cache@v4
with:
key: ${{ runner.os }}-gui-${{ github.run_id }}
path: app/gui/node_modules/.cache/
restore-keys: |
${{ runner.os }}-gui
- name: 🚀 Deploy to Chromatic
id: publish_chromatic
uses: chromaui/action@v11
with:
workingDir: app/gui
autoAcceptChanges: develop
exitZeroOnChanges: true
exitOnceUploaded: true
configFile: "chromatic.config.json"
comment-on-pr:
name: 💬 Comment on PR
runs-on: ubuntu-latest
if: github.event_name == 'pull_request'
needs: deploy-chromatic-react
steps:
- uses: actions/checkout@v4
- uses: actions/setup-node@v4
with:
node-version-file: .node-version
- name: 💬 Comment on PR
uses: actions/github-script@v7
with:
github-token: ${{ secrets.GITHUB_TOKEN }}
script: |
const { setMessage } = await import('${{ github.workspace }}/app/gui/scripts/ci/set-message.js')
await setMessage({
header: "## 🧪 Storybook is successfully deployed!",
body: `
### 📊 Dashboard:
- 👀 Review changes: ${{ needs.deploy-chromatic-react.outputs.dashboardUrl }}
- 👨‍🎨 Preview storybook: ${{ needs.deploy-chromatic-react.outputs.dashboardStorybookUrl }}
`,
github,
repo: context.repo,
prNumber: context.payload.pull_request.number
})