diff --git a/.github/workflows/chromatic.yml b/.github/workflows/chromatic.yml index 7f8bd10eea..703bde61db 100644 --- a/.github/workflows/chromatic.yml +++ b/.github/workflows/chromatic.yml @@ -2,15 +2,14 @@ name: 'Chromatic' on: pull_request: - branches: [ "main" ] + branches: ['main'] types: [opened, synchronize, reopened, closed, ready_for_review] push: - branches: [ "main" ] + branches: ['main'] workflow_dispatch: env: - FIGMA_TOKEN: ${{ secrets.FIGMA_AUTH_TOKEN }} FONT_AWESOME_AUTH_TOKEN: ${{ secrets.FONT_AWESOME_AUTH_TOKEN }} TOKENS_STUDIO_API_KEY: ${{ secrets.TOKENS_STUDIO_2_API_KEY }} @@ -24,7 +23,7 @@ jobs: fetch-depth: 0 - uses: actions/setup-node@v4 with: - node-version: 22 + node-version: 24 cache: 'yarn' - name: Install dependencies run: yarn install --immutable diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml index 1a2cd10210..5a5bfa4e48 100644 --- a/.github/workflows/ci.yml +++ b/.github/workflows/ci.yml @@ -2,16 +2,14 @@ name: CI on: push: - branches: [ "main" ] + branches: ['main'] pull_request: - branches: [ "main" ] + branches: ['main'] # Allows you to run this workflow manually from the Actions tab workflow_dispatch: env: - CHROMATIC_PROJECT_TOKEN: ${{ secrets.CHROMATIC_PROJECT_TOKEN }} - FIGMA_TOKEN: ${{ secrets.FIGMA_AUTH_TOKEN }} FONT_AWESOME_AUTH_TOKEN: ${{ secrets.FONT_AWESOME_AUTH_TOKEN }} HUSKY: 0 TOKENS_STUDIO_API_KEY: ${{ secrets.TOKENS_STUDIO_2_API_KEY }} @@ -21,13 +19,16 @@ jobs: runs-on: ubuntu-latest steps: - uses: actions/checkout@v4 + - uses: actions/setup-node@v4 with: - node-version: 22 + node-version: 24 cache: 'yarn' - # Set up GitHub Actions caching for Wireit. - uses: google/wireit@setup-github-actions-caching/v2 + - run: yarn install --immutable + - run: yarn build + - run: yarn test diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml index 34248e6b7e..76076d5dae 100644 --- a/.github/workflows/release.yml +++ b/.github/workflows/release.yml @@ -6,7 +6,6 @@ on: - main env: - FIGMA_TOKEN: ${{ secrets.FIGMA_AUTH_TOKEN }} FONT_AWESOME_AUTH_TOKEN: ${{ secrets.FONT_AWESOME_AUTH_TOKEN }} HUSKY: 0 TOKENS_STUDIO_API_KEY: ${{ secrets.TOKENS_STUDIO_2_API_KEY }} @@ -30,7 +29,7 @@ jobs: - uses: actions/setup-node@v4 with: - node-version: 22 + node-version: 24 cache: 'yarn' registry-url: 'https://npm.pkg.github.com' scope: '@sl-design-system' diff --git a/.github/workflows/storybook.yml b/.github/workflows/storybook.yml index 6311a8b3ee..7e2bc02a92 100644 --- a/.github/workflows/storybook.yml +++ b/.github/workflows/storybook.yml @@ -15,9 +15,7 @@ on: workflow_dispatch: env: - CHROMATIC_PROJECT_TOKEN: ${{ secrets.CHROMATIC_PROJECT_TOKEN }} FONT_AWESOME_AUTH_TOKEN: ${{ secrets.FONT_AWESOME_AUTH_TOKEN }} - FIGMA_TOKEN: ${{ secrets.FIGMA_AUTH_TOKEN }} HUSKY: 0 TOKENS_STUDIO_API_KEY: ${{ secrets.TOKENS_STUDIO_2_API_KEY }} @@ -35,25 +33,67 @@ jobs: - uses: actions/setup-node@v4 with: - node-version: 22 + node-version: 24 cache: 'yarn' - # Set up GitHub Actions caching for Wireit. - uses: google/wireit@setup-github-actions-caching/v2 - run: yarn install --immutable - run: yarn storybook - - uses: azure/static-web-apps-deploy@v1 - id: deploy + - uses: aws-actions/configure-aws-credentials@v6 with: - azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN }} - action: upload - app_location: dist - production_branch: main - skip_api_build: true - skip_app_build: true + aws-access-key-id: ${{ secrets.AWS_ACCESS_KEY_ID }} + aws-secret-access-key: ${{ secrets.AWS_SECRET_ACCESS_KEY }} + aws-region: ${{ secrets.AWS_REGION }} + + - name: Set branch name + id: branch + run: | + if [ "${{ github.event_name }}" == "pull_request" ]; then + echo "name=storybook-${{ github.event.pull_request.number }}" >> "$GITHUB_OUTPUT" + else + echo "name=main" >> "$GITHUB_OUTPUT" + fi + + - name: Ensure Amplify branch exists + if: github.event_name == 'pull_request' + run: | + if aws amplify get-branch \ + --app-id "${{ secrets.AWS_AMPLIFY_APP_ID }}" \ + --branch-name "${{ steps.branch.outputs.name }}" >/dev/null 2>&1; then + echo "Amplify branch '${{ steps.branch.outputs.name }}' already exists." + else + aws amplify create-branch \ + --app-id "${{ secrets.AWS_AMPLIFY_APP_ID }}" \ + --branch-name "${{ steps.branch.outputs.name }}" + fi + + - name: Deploy to AWS Amplify + id: deploy + run: | + DEPLOYMENT=$(aws amplify create-deployment \ + --app-id "${{ secrets.AWS_AMPLIFY_APP_ID }}" \ + --branch-name "${{ steps.branch.outputs.name }}" \ + --output json) + + JOB_ID=$(echo "$DEPLOYMENT" | jq -r '.jobId') + ZIP_URL=$(echo "$DEPLOYMENT" | jq -r '.zipUploadUrl') + + cd dist && zip -qr ../deployment.zip . && cd .. + curl -sSf -T deployment.zip "$ZIP_URL" + + aws amplify start-deployment \ + --app-id "${{ secrets.AWS_AMPLIFY_APP_ID }}" \ + --branch-name "${{ steps.branch.outputs.name }}" \ + --job-id "$JOB_ID" + + DEFAULT_DOMAIN=$(aws amplify get-app \ + --app-id "${{ secrets.AWS_AMPLIFY_APP_ID }}" \ + --query 'app.defaultDomain' \ + --output text) + echo "preview_url=https://${{ steps.branch.outputs.name }}.${DEFAULT_DOMAIN}" >> "$GITHUB_OUTPUT" - if: github.event_name == 'pull_request' uses: peter-evans/find-comment@v3 @@ -61,16 +101,37 @@ jobs: with: issue-number: ${{ github.event.pull_request.number }} comment-author: 'github-actions[bot]' - body-includes: Storybook preview + body-includes: '### 🕸 Preview deploys' + + - if: github.event_name == 'pull_request' + name: Build comment body + id: comment + env: + EXISTING_BODY: ${{ steps.fc.outputs.comment-body }} + PREVIEW_URL: ${{ steps.deploy.outputs.preview_url }} + run: | + BODY="### 🕸 Preview deploys" + BODY="$BODY + - **Storybook:** $PREVIEW_URL" + + WEBSITE_LINE=$(echo "$EXISTING_BODY" | grep '^- \*\*Website:\*\*' || true) + if [ -n "$WEBSITE_LINE" ]; then + BODY="$BODY + $WEBSITE_LINE" + fi + + { + echo "body<> "$GITHUB_OUTPUT" - if: github.event_name == 'pull_request' uses: peter-evans/create-or-update-comment@v4 with: comment-id: ${{ steps.fc.outputs.comment-id }} issue-number: ${{ github.event.pull_request.number }} - body: | - ### 🕸 Storybook preview - You can view a preview [here](${{ steps.deploy.outputs.static_web_app_url }}) (commit [`${{ github.event.pull_request.head.sha }}`](https://github.com/sl-design-system/components/commit/${{ github.event.pull_request.head.sha }})). + body: ${{ steps.comment.outputs.body }} edit-mode: replace cleanup: @@ -78,7 +139,14 @@ jobs: runs-on: ubuntu-latest name: Cleanup steps: - - uses: azure/static-web-apps-deploy@v1 + - uses: aws-actions/configure-aws-credentials@v6 with: - azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN }} - action: close + aws-access-key-id: ${{ secrets.AWS_ACCESS_KEY_ID }} + aws-secret-access-key: ${{ secrets.AWS_SECRET_ACCESS_KEY }} + aws-region: ${{ secrets.AWS_REGION }} + + - name: Delete PR branch from Amplify + run: | + aws amplify delete-branch \ + --app-id "${{ secrets.AWS_AMPLIFY_APP_ID }}" \ + --branch-name "storybook-${{ github.event.pull_request.number }}" diff --git a/.github/workflows/website.yml b/.github/workflows/website.yml index c0bced118a..8b9a8aae21 100644 --- a/.github/workflows/website.yml +++ b/.github/workflows/website.yml @@ -16,9 +16,7 @@ on: workflow_dispatch: env: - FIGMA_TOKEN: ${{ secrets.FIGMA_AUTH_TOKEN }} FONT_AWESOME_AUTH_TOKEN: ${{ secrets.FONT_AWESOME_AUTH_TOKEN }} - GITHUB_API_TOKEN: ${{ secrets.GITHUB_TOKEN }} HUSKY: 0 TOKENS_STUDIO_API_KEY: ${{ secrets.TOKENS_STUDIO_2_API_KEY }} @@ -38,16 +36,22 @@ jobs: runs-on: ubuntu-latest steps: - uses: actions/checkout@v4 + - uses: actions/setup-node@v4 with: - node-version: 22 + node-version: 24 cache: 'yarn' + - run: yarn install --immutable + - run: NODE_ENV=production yarn website + - uses: actions/configure-pages@v5 + - uses: actions/upload-pages-artifact@v3 with: path: 'website/dist' + - id: deployment uses: actions/deploy-pages@v4 @@ -56,21 +60,68 @@ jobs: runs-on: ubuntu-latest steps: - uses: actions/checkout@v4 + - uses: actions/setup-node@v4 with: - node-version: 22 + node-version: 24 cache: 'yarn' + - run: yarn install --immutable + - run: NODE_ENV=production yarn website - - uses: azure/static-web-apps-deploy@v1 - id: deploy + + - uses: aws-actions/configure-aws-credentials@v6 with: - azure_static_web_apps_api_token: ${{ secrets.WEBSITE_AZURE_STATIC_WEB_APPS_API_TOKEN }} - action: upload - app_location: website/dist - production_branch: main - skip_api_build: true - skip_app_build: true + aws-access-key-id: ${{ secrets.AWS_ACCESS_KEY_ID }} + aws-secret-access-key: ${{ secrets.AWS_SECRET_ACCESS_KEY }} + aws-region: ${{ secrets.AWS_REGION }} + + - name: Set branch name + id: branch + run: | + if [ "${{ github.event_name }}" == "pull_request" ]; then + echo "name=website-${{ github.event.pull_request.number }}" >> "$GITHUB_OUTPUT" + else + echo "name=main" >> "$GITHUB_OUTPUT" + fi + + - name: Ensure Amplify branch exists + if: github.event_name == 'pull_request' + run: | + if aws amplify get-branch \ + --app-id "${{ secrets.AWS_AMPLIFY_APP_ID }}" \ + --branch-name "${{ steps.branch.outputs.name }}" >/dev/null 2>&1; then + echo "Amplify branch '${{ steps.branch.outputs.name }}' already exists." + else + aws amplify create-branch \ + --app-id "${{ secrets.AWS_AMPLIFY_APP_ID }}" \ + --branch-name "${{ steps.branch.outputs.name }}" + fi + + - name: Deploy to AWS Amplify + id: deploy + run: | + DEPLOYMENT=$(aws amplify create-deployment \ + --app-id "${{ secrets.AWS_AMPLIFY_APP_ID }}" \ + --branch-name "${{ steps.branch.outputs.name }}" \ + --output json) + + JOB_ID=$(echo "$DEPLOYMENT" | jq -r '.jobId') + ZIP_URL=$(echo "$DEPLOYMENT" | jq -r '.zipUploadUrl') + + cd website/dist && zip -qr ../../deployment.zip . && cd ../.. + curl -sSf -T deployment.zip "$ZIP_URL" + + aws amplify start-deployment \ + --app-id "${{ secrets.AWS_AMPLIFY_APP_ID }}" \ + --branch-name "${{ steps.branch.outputs.name }}" \ + --job-id "$JOB_ID" + + DEFAULT_DOMAIN=$(aws amplify get-app \ + --app-id "${{ secrets.AWS_AMPLIFY_APP_ID }}" \ + --query 'app.defaultDomain' \ + --output text) + echo "preview_url=https://${{ steps.branch.outputs.name }}.${DEFAULT_DOMAIN}" >> "$GITHUB_OUTPUT" - if: github.event_name == 'pull_request' uses: peter-evans/find-comment@v3 @@ -78,23 +129,52 @@ jobs: with: issue-number: ${{ github.event.pull_request.number }} comment-author: 'github-actions[bot]' - body-includes: Website preview + body-includes: '### 🕸 Preview deploys' + + - if: github.event_name == 'pull_request' + name: Build comment body + id: comment + env: + EXISTING_BODY: ${{ steps.fc.outputs.comment-body }} + PREVIEW_URL: ${{ steps.deploy.outputs.preview_url }} + run: | + BODY="### 🕸 Preview deploys" + + STORYBOOK_LINE=$(echo "$EXISTING_BODY" | grep '^- \*\*Storybook:\*\*' || true) + if [ -n "$STORYBOOK_LINE" ]; then + BODY="$BODY + $STORYBOOK_LINE" + fi + + BODY="$BODY + - **Website:** $PREVIEW_URL" + + { + echo "body<> "$GITHUB_OUTPUT" - if: github.event_name == 'pull_request' uses: peter-evans/create-or-update-comment@v4 with: comment-id: ${{ steps.fc.outputs.comment-id }} issue-number: ${{ github.event.pull_request.number }} - body: | - ### 🕸 Website preview - You can view a preview [here](${{ steps.deploy.outputs.static_web_app_url }}) (commit [`${{ github.event.pull_request.head.sha }}`](https://github.com/sl-design-system/components/commit/${{ github.event.pull_request.head.sha }})). + body: ${{ steps.comment.outputs.body }} edit-mode: replace cleanup: if: github.event_name == 'pull_request' && github.event.action == 'closed' runs-on: ubuntu-latest steps: - - uses: azure/static-web-apps-deploy@v1 + - uses: aws-actions/configure-aws-credentials@v6 with: - azure_static_web_apps_api_token: ${{ secrets.WEBSITE_AZURE_STATIC_WEB_APPS_API_TOKEN }} - action: close + aws-access-key-id: ${{ secrets.AWS_ACCESS_KEY_ID }} + aws-secret-access-key: ${{ secrets.AWS_SECRET_ACCESS_KEY }} + aws-region: ${{ secrets.AWS_REGION }} + + - name: Delete PR branch from Amplify + run: | + aws amplify delete-branch \ + --app-id "${{ secrets.AWS_AMPLIFY_APP_ID }}" \ + --branch-name "website-${{ github.event.pull_request.number }}"