From a69eaba636dabeee597de39442f9f6aa8b9debdd Mon Sep 17 00:00:00 2001
From: choiseona <tjsdk617@naver.com>
Date: Tue, 12 Nov 2024 04:25:44 +0900
Subject: [PATCH] feat: Add Storybook preview workflow

- Setup automatic preview deployment for PRs
- Configure preview cleanup on PR close
---
 .github/workflows/storybook-preview-ci-cd.yml | 93 +++++++++++++++++++
 1 file changed, 93 insertions(+)
 create mode 100644 .github/workflows/storybook-preview-ci-cd.yml

diff --git a/.github/workflows/storybook-preview-ci-cd.yml b/.github/workflows/storybook-preview-ci-cd.yml
new file mode 100644
index 00000000..f4545cda
--- /dev/null
+++ b/.github/workflows/storybook-preview-ci-cd.yml
@@ -0,0 +1,93 @@
+name: Deploy Storybook Preview
+
+on:
+  pull_request:
+    types:
+      - opened
+      - synchronize
+      - reopened
+      - closed
+    branches:
+      - main
+      - develop
+    paths:
+      - client/**
+
+defaults:
+  run:
+    working-directory: ./client
+
+jobs:
+  deploy-preview:
+    if: github.event.action != 'closed'
+    runs-on: ubuntu-latest
+    permissions:
+      contents: write
+      pull-requests: write
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Setup pnpm
+        uses: pnpm/action-setup@v2
+        with:
+          version: 8
+          run_install: false
+
+      - name: Setup Node
+        uses: actions/setup-node@v4
+        with:
+          node-version: 18
+          cache: "pnpm"
+          cache-dependency-path: "./client/pnpm-lock.yaml"
+
+      - name: Install dependencies
+        run: pnpm install
+
+      - name: Build storybook
+        run: pnpm run build-storybook
+
+      - name: Deploy
+        uses: peaceiris/actions-gh-pages@v3
+        with:
+          github_token: ${{ secrets.GITHUB_TOKEN }}
+          publish_dir: ./client/storybook-static
+          destination_dir: storybook/preview/pr-${{ github.event.number }}
+
+      - name: Comment Preview URL
+        uses: actions/github-script@v6
+        with:
+          script: |
+            const previewUrl = `https://${context.repo.owner}.github.io/${context.repo.repo}/storybook/preview/pr-${context.issue.number}`
+            github.rest.issues.createComment({
+              issue_number: context.issue.number,
+              owner: context.repo.owner,
+              repo: context.repo.repo,
+              body: `📚 Storybook preview deployed to: [${previewUrl}](${previewUrl})`
+            })
+
+  cleanup-preview:
+    if: github.event.action == 'closed'
+    runs-on: ubuntu-latest
+    permissions:
+      contents: write
+      pull-requests: write
+    steps:
+      - name: Delete preview from gh-pages
+        uses: peaceiris/actions-gh-pages@v3
+        with:
+          github_token: ${{ secrets.GITHUB_TOKEN }}
+          publish_dir: ./client/storybook-static
+          destination_dir: storybook/preview/pr-${{ github.event.number }}
+          keep_files: false
+
+      - name: Comment Cleanup Notification
+        uses: actions/github-script@v6
+        with:
+          script: |
+            github.rest.issues.createComment({
+              issue_number: context.issue.number,
+              owner: context.repo.owner,
+              repo: context.repo.repo,
+              body: `🧹 Storybook preview for PR #${context.issue.number} has been removed.`
+            })