fix(dropdown): fix mobile view and add backdrop #448
Workflow file for this run
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
name: Deploy affected storybook(s) [PR] | |
on: | |
pull_request: | |
jobs: | |
check: | |
runs-on: ubuntu-latest | |
outputs: | |
status: ${{ steps.check-updated-storybooks.outputs.any }} | |
steps: | |
- name: Check updated storybooks | |
uses: dorny/paths-filter@v2 | |
id: check-updated-storybooks | |
with: | |
filters: | | |
any: | |
- libs/** | |
core: | |
- libs/core/** | |
chlorophyll: | |
- libs/chlorophyll/** | |
react: | |
- libs/react/** | |
react-charts: | |
- libs/react-charts/** | |
angular: | |
- libs/angular/** | |
angular-charts: | |
- libs/angular-charts/** | |
build: | |
runs-on: ubuntu-latest | |
needs: check | |
if: needs.check.outputs.status == 'true' | |
steps: | |
- name: Check updated storybooks | |
uses: dorny/paths-filter@v2 | |
id: check-updated-storybooks | |
with: | |
filters: | | |
any: | |
- libs/** | |
core: | |
- libs/core/** | |
chlorophyll: | |
- libs/chlorophyll/** | |
react: | |
- libs/react/** | |
react-charts: | |
- libs/react-charts/** | |
angular: | |
- libs/angular/** | |
angular-charts: | |
- libs/angular-charts/** | |
- uses: actions/checkout@v4 | |
with: | |
fetch-depth: 0 | |
- name: Use Node.js | |
uses: actions/setup-node@v3 | |
with: | |
node-version: lts/* | |
- name: Get yarn cache directory path | |
id: yarn-cache-dir-path | |
run: echo "dir=$(yarn cache dir)" >> "$GITHUB_OUTPUT" | |
- uses: actions/cache@v3 | |
id: yarn-cache # use this to check for `cache-hit` (`steps.yarn-cache.outputs.cache-hit != 'true'`) | |
with: | |
path: ${{ steps.yarn-cache-dir-path.outputs.dir }} | |
key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }} | |
restore-keys: | | |
${{ runner.os }}-yarn- | |
- name: Install dependencies | |
run: yarn install --prefer-offline --frozen-lockfile --silent | |
- name: Get branch name | |
shell: bash | |
run: echo "branch=${GITHUB_REF}" >> "$GITHUB_OUTPUT" | |
id: branch | |
- name: Determine deploy target | |
shell: bash | |
run: | | |
if [[ "${{ steps.branch.outputs.branch }}" == "main" ]]; then | |
echo "target=latest" >> "$GITHUB_OUTPUT" | |
elif [[ "${{ steps.branch.outputs.branch }}" == "alpha" ]]; then | |
echo "target=alpha" >> "$GITHUB_OUTPUT" | |
else | |
echo "target=pr-${{ github.event.number }}" >> "$GITHUB_OUTPUT" | |
fi | |
id: target | |
- name: Build storybook | |
run: yarn run nx affected --target build-storybook --base=origin/main | |
- name: Deploy built storybooks to GitHub Pages | |
if: steps.check-updated-storybooks.outputs.any == 'true' | |
uses: JamesIves/[email protected] | |
with: | |
token: ${{ secrets.GITHUB_TOKEN }} | |
branch: gh-pages # The branch the action should deploy to. | |
folder: dist/storybook # The folder the action should deploy. | |
target-folder: ${{ steps.target.outputs.target }} # The folder the action should deploy to. | |
- name: Add Storybook link to pull request | |
uses: actions/github-script@v5 | |
if: github.event.action == 'opened' && steps.check-updated-storybooks.outputs.any == 'true' | |
with: | |
github-token: ${{ secrets.GITHUB_TOKEN }} | |
script: | | |
// Storybooks | |
const storybooks = { | |
'core': ${{steps.check-updated-storybooks.outputs.core}}, | |
'chlorophyll': ${{steps.check-updated-storybooks.outputs.chlorophyll}}, | |
'react': ${{steps.check-updated-storybooks.outputs.react}}, | |
'react-charts': ${{steps.check-updated-storybooks.outputs.react-charts}}, | |
'angular': ${{steps.check-updated-storybooks.outputs.angular}}, | |
'angular-charts': ${{steps.check-updated-storybooks.outputs.angular-charts}} | |
} | |
// Filter updated storybooks (based on file changes not affected storybooks) | |
const updatedStorybooks = Object.keys(storybooks) | |
.filter((storybook) => storybooks[storybook]); | |
// Create link list | |
const links = '<ul>' + updatedStorybooks | |
.reduce((initial, storybook) => (initial + `<li><a target="_blank" href="https://sebgroup.github.io/green/${{ steps.target.outputs.target }}/${storybook}/">${storybook}</a></li>`),'') + '</ul>'; | |
// Create comment body | |
const body = `👋 Thanks for creating a pull request! 🚀 Checkout the ${updatedStorybooks.length > 1 ? 'storybooks' : 'storybook'} we've created for it: ${links}`; | |
github.rest.issues.createComment({ | |
issue_number: context.issue.number, | |
owner: context.repo.owner, | |
repo: context.repo.repo, | |
body | |
}); |