Skip to content

fix(components): fix primarybutton and alt primarybutton styling issue #17428

fix(components): fix primarybutton and alt primarybutton styling issue

fix(components): fix primarybutton and alt primarybutton styling issue #17428

# Run tests, build components bundle, and deploy it to sandbox
name: 'Components test, build, and deploy'
on:
pull_request:
paths:
- Makefile
- 'package.json'
- '.github/workflows/components-test-build-deploy.yaml'
- '**.stories.*'
- 'components/**'
- 'app/src/atoms/**'
- 'app/src/molecules/**'
- 'protocol-designer/src/components/**'
- 'scripts/static-deploy/**'
- 'vitest.config.*'
push:
branches:
- 'edge'
- 'release'
- 'chore_release*'
tags:
- 'components*'
workflow_dispatch:
concurrency:
group: ${{ github.workflow }}-${{ github.event.pull_request.number || github.ref }}-${{ github.ref_name != 'edge' || github.run_id}}-${{ github.ref_type != 'tag' || github.run_id }}
cancel-in-progress: true
defaults:
run:
shell: bash
env:
CI: true
RELATIVE_ARTIFACT_DIR: '../../dist'
jobs:
determine-deploy-config:
name: Determine Deployment Configuration
runs-on: ubuntu-24.04
outputs:
application: ${{ steps.deploy-config.outputs.APPLICATION }}
environment: ${{ steps.deploy-config.outputs.ENVIRONMENT }}
sandbox_prefix: ${{ steps.deploy-config.outputs.SANDBOX_PREFIX }}
relative_artifact_dir: ${{ steps.deploy-config.outputs.RELATIVE_ARTIFACT_DIR }}
steps:
- name: Checkout Repository
uses: actions/checkout@v5
- uses: ./.github/actions/git/resolve-tag
- name: Setup UV
uses: astral-sh/setup-uv@v6
with:
python-version: '3.10'
- name: Setup Deploy Dependencies
working-directory: scripts/static-deploy
run: make setup
- name: Determine Deployment Configuration
id: deploy-config
working-directory: scripts/static-deploy
run: make resolve-ci
js-unit-test:
name: 'components unit tests'
timeout-minutes: 30
runs-on: 'ubuntu-24.04'
steps:
- uses: 'actions/checkout@v4'
- uses: ./.github/actions/js/setup
- name: 'run components unit tests'
run: make -C components test-cov
- name: 'Upload coverage report'
uses: codecov/codecov-action@v3
with:
files: ./coverage/lcov.info
flags: components
build-components-storybook:
name: 'build components artifact'
runs-on: 'ubuntu-24.04'
needs: ['determine-deploy-config', 'js-unit-test']
steps:
- uses: 'actions/checkout@v4'
- uses: ./.github/actions/js/setup
- name: 'build components'
run: make -C components
- name: 'upload github artifact'
uses: actions/upload-artifact@v4
with:
name: 'components-artifact'
path: storybook-static
deploy-components:
name: 'deploy components storybook artifact to S3'
runs-on: 'ubuntu-24.04'
needs:
['determine-deploy-config', 'js-unit-test', 'build-components-storybook']
if: always() && needs.build-components-storybook.result == 'success' && needs.determine-deploy-config.result == 'success'
permissions:
id-token: write
contents: read
steps:
- name: Configure AWS Credentials
uses: aws-actions/configure-aws-credentials@v4
with:
role-to-assume: ${{ secrets.STATIC_DEPLOYMENT_ROLE }}
aws-region: us-east-2
- name: Checkout Repository
uses: actions/checkout@v5
with:
fetch-depth: 0
- id: resolve-tag
uses: ./.github/actions/git/resolve-tag
- name: Setup UV
uses: astral-sh/setup-uv@v6
with:
python-version: '3.10'
- name: Setup Deploy Dependencies
working-directory: scripts/static-deploy
run: |
make setup
- name: 'download components build'
uses: 'actions/download-artifact@v4'
with:
name: components-artifact
path: ./dist
- name: Deploy to S3
working-directory: scripts/static-deploy
run: make deploy \
APPLICATION=${{ needs.determine-deploy-config.outputs.application }} \
ENVIRONMENT=${{ needs.determine-deploy-config.outputs.environment }} \
SANDBOX_PREFIX=${{ needs.determine-deploy-config.outputs.sandbox_prefix }} \
RELATIVE_ARTIFACT_DIR=${{ needs.determine-deploy-config.outputs.relative_artifact_dir }}
publish-components:
name: 'publish components package to npm'
runs-on: 'ubuntu-latest'
needs: ['js-unit-test']
if: startsWith(github.ref, 'refs/tags/components')
steps:
- uses: 'actions/checkout@v4'
# https://github.com/actions/checkout/issues/290
- name: 'Fix actions/checkout odd handling of tags'
if: startsWith(github.ref, 'refs/tags')
run: |
git fetch -f origin ${{ github.ref }}:${{ github.ref }}
git checkout ${{ github.ref }}
- uses: ./.github/actions/js/setup
- name: 'build typescript types'
run: make -C components build-ts
# replace package.json stub version number with version from tag
- name: 'set version number'
run: |
npm install -g json
VERSION_STRING=$(echo ${{ github.ref }} | sed 's/refs\/tags\/components@//')
json -I -f ./components/package.json -e "this.version=\"$VERSION_STRING\""
json -I -f ./components/package.json -e "this.dependencies['@opentrons/shared-data']=\"$VERSION_STRING\""
json -I -f ./components/package.json -e "delete this.dependencies['@opentrons/step-generation']"
- uses: 'actions/setup-node@v6'
with:
node-version: '22.12.0'
registry-url: 'https://registry.npmjs.org'
- name: 'publish to npm registry'
env:
NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
run: |
cd ./components
echo "//registry.npmjs.org/:_authToken=${NODE_AUTH_TOKEN}" > ./.npmrc
ls -R # Debug: View contents of ./components
npm publish --access public
# Notification jobs for tagged builds
notify-success:
name: 'Notify Build Success'
runs-on: 'ubuntu-latest'
needs:
[
js-unit-test,
build-components-storybook,
deploy-components,
publish-components,
]
if: always() && github.event_name == 'push' && startsWith(github.ref, 'refs/tags/') && needs.js-unit-test.result == 'success' && needs.build-components-storybook.result == 'success' && needs.deploy-components.result == 'success' && needs.publish-components.result == 'success'
steps:
- name: Checkout Repository
uses: actions/checkout@v5
- name: 'Send success alert'
uses: ./.github/actions/simple-build-alert
with:
status: 'success'
workflow_name: 'Components test, build, and deploy'
webhook_url: ${{ secrets.OT_APP_RELEASE_SLACK_NOTIFICATION_WEBHOOK_URL }}
notify-failure:
name: 'Notify Build Failure'
runs-on: 'ubuntu-latest'
needs:
[
js-unit-test,
build-components-storybook,
deploy-components,
publish-components,
]
if: always() && github.event_name == 'push' && startsWith(github.ref, 'refs/tags/') && (needs.js-unit-test.result == 'failure' || needs.build-components-storybook.result == 'failure' || needs.deploy-components.result == 'failure' || needs.publish-components.result == 'failure')
steps:
- name: Checkout Repository
uses: actions/checkout@v5
- name: 'Determine failed jobs'
id: failed-jobs
shell: bash
run: |
failed_jobs=()
if [[ "${{ needs.js-unit-test.result }}" == "failure" ]]; then
failed_jobs+=("js-unit-test")
fi
if [[ "${{ needs.build-components-storybook.result }}" == "failure" ]]; then
failed_jobs+=("build-components-storybook")
fi
if [[ "${{ needs.deploy-components.result }}" == "failure" ]]; then
failed_jobs+=("deploy-components")
fi
if [[ "${{ needs.publish-components.result }}" == "failure" ]]; then
failed_jobs+=("publish-components")
fi
IFS=','
echo "failed_jobs=${failed_jobs[*]}" >> $GITHUB_OUTPUT
- name: 'Send failure alert'
uses: ./.github/actions/simple-build-alert
with:
status: 'failure'
workflow_name: 'Components test, build, and deploy'
failed_jobs: ${{ steps.failed-jobs.outputs.failed_jobs }}
webhook_url: ${{ secrets.OT_APP_RELEASE_SLACK_NOTIFICATION_WEBHOOK_URL }}
notify-cancelled:
name: 'Notify Build Cancelled'
runs-on: 'ubuntu-latest'
needs:
[
js-unit-test,
build-components-storybook,
deploy-components,
publish-components,
]
if: always() && github.event_name == 'push' && startsWith(github.ref, 'refs/tags/') && (needs.js-unit-test.result == 'cancelled' || needs.build-components-storybook.result == 'cancelled' || needs.deploy-components.result == 'cancelled' || needs.publish-components.result == 'cancelled')
steps:
- name: Checkout Repository
uses: actions/checkout@v5
- name: 'Send cancelled alert'
uses: ./.github/actions/simple-build-alert
with:
status: 'cancelled'
workflow_name: 'Components test, build, and deploy'
webhook_url: ${{ secrets.OT_APP_RELEASE_SLACK_NOTIFICATION_WEBHOOK_URL }}