chromatic.yml

name: 'Chromatic Publish'

on:
  pull_request:
    branches:
      - develop

permissions: write-all

jobs:
  storybook:
    runs-on: ubuntu-latest

    steps:
      - name: Checkout Repository
        uses: actions/checkout@v4
        with:
          fetch-depth: 0

      - name: Setup Node.js
        uses: actions/setup-node@v4
        with:
          node-version: 20

      - name: Install PNPM
        run: npm i -g pnpm

      - name: Cache node modules
        id: cache-node
        uses: actions/cache@v3
        with:
          path: |
            **/node_modules
          key: ${{ runner.os }}-node-${{ hashFiles('**/pnpm-lock.yaml') }}
          restore-keys: |
            ${{ runner.os }}-node-

      - name: Install Dependencies
        if: steps.cache-node.outputs.cache-hit != 'true'
        run: pnpm install --frozen-lockfile

      - name: Build Storybook for design system(pds)
        run: pnpm --filter @pinback/design-system run build:storybook

      - name: Publish to Chromatic
        id: chromatic
        uses: chromaui/action@latest
        with:
          projectToken: ${{ secrets.CHROMATIC_PROJECT_TOKEN }}
          workingDir: packages/design-system
          buildScriptName: build:storybook
          onlyChanged: true
          autoAcceptChanges: true
          exitOnceUploaded: true
        env:
          CHROMATIC_TEMP_DIR: './.chromatic-tmp'
      - name: Clean storybook cache
        run: rm -rf packages/design-system/node_modules/.cache/storybook

      - name: Comment PR on Success
        if: success() && github.event_name == 'pull_request'
        uses: thollander/actions-comment-pull-request@v2
        with:
          comment_tag: ${{ github.event.number }}-storybook
          message: |
            ✅ Storybook chromatic 배포 확인:
            🐿️ [storybook](${{ steps.chromatic.outputs.storybookUrl }})

      - name: Comment PR on Failure
        if: failure() && github.event_name == 'pull_request'
        uses: thollander/actions-comment-pull-request@v2
        with:
          comment_tag: ${{ github.event.number }}-storybook
          message: |
            🚨 Storybook 배포 실패
            : Github Actions 로그를 확인해주세요.