CI/CD 入門：GitHub Actions
自動化你的測試與部署流程

# 這個 Workflow 負責 Continuous Integration
name: CI

# 觸發條件：push 到 main/develop，或任何 PR
on:
  push:
    branches: [main, develop]
  pull_request:
    branches: [main, develop]

jobs:
  test:
    name: Lint, Type-check & Test
    runs-on: ubuntu-latest   # GitHub 提供的免費 Linux Runner

    strategy:
      matrix:
        node-version: [20.x]  # 可設多個版本同時測試

    steps:
      # 1. 把程式碼 checkout 出來
      - name: Checkout code
        uses: actions/checkout@v4

      # 2. 設定 Node.js 版本
      - name: Setup Node.js
        uses: actions/setup-node@v4
        with:
          node-version: ${{ matrix.node-version }}
          cache: 'npm'  # 快取 node_modules，加速後續執行

      # 3. 安裝依賴
      - name: Install dependencies
        run: npm ci  # 比 npm install 更嚴格，使用 package-lock.json

      # 4. 執行 ESLint
      - name: Run ESLint
        run: npm run lint

      # 5. TypeScript 型別檢查
      - name: Type check
        run: npx tsc --noEmit

      # 6. 跑單元測試，並輸出 coverage 報告
      - name: Run tests
        run: npm test -- --coverage --watchAll=false

      # 7. 上傳 coverage 報告（可選）
      - name: Upload coverage
        uses: codecov/codecov-action@v4
        if: always()  # 就算測試失敗也上傳
        with:
          token: ${{ secrets.CODECOV_TOKEN }}

name: Deploy to Vercel

on:
  push:
    branches: [main]  # 只有 main 合併才部署 production

jobs:
  # 先跑 CI（重用前面的概念）
  ci:
    name: Run CI checks
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with:
          node-version: '20'
          cache: 'npm'
      - run: npm ci
      - run: npm run lint
      - run: npx tsc --noEmit
      - run: npm test -- --watchAll=false

  # CI 通過才執行 deploy
  deploy:
    name: Deploy to Production
    needs: ci          # 等 ci job 成功才執行
    runs-on: ubuntu-latest
    environment: production  # GitHub Environment，可設 reviewers 審核

    steps:
      - uses: actions/checkout@v4

      - uses: actions/setup-node@v4
        with:
          node-version: '20'
          cache: 'npm'

      - run: npm ci

      # 安裝 Vercel CLI
      - name: Install Vercel CLI
        run: npm install -g vercel@latest

      # Pull Vercel 專案設定
      - name: Pull Vercel Environment
        run: vercel pull --yes --environment=production --token=${{ secrets.VERCEL_TOKEN }}
        env:
          VERCEL_ORG_ID: ${{ secrets.VERCEL_ORG_ID }}
          VERCEL_PROJECT_ID: ${{ secrets.VERCEL_PROJECT_ID }}

      # Build
      - name: Build
        run: vercel build --prod --token=${{ secrets.VERCEL_TOKEN }}
        env:
          VERCEL_ORG_ID: ${{ secrets.VERCEL_ORG_ID }}
          VERCEL_PROJECT_ID: ${{ secrets.VERCEL_PROJECT_ID }}

      # Deploy 預建好的產物
      - name: Deploy to Production
        run: vercel deploy --prebuilt --prod --token=${{ secrets.VERCEL_TOKEN }}
        env:
          VERCEL_ORG_ID: ${{ secrets.VERCEL_ORG_ID }}
          VERCEL_PROJECT_ID: ${{ secrets.VERCEL_PROJECT_ID }}

name: Preview Deploy

on:
  pull_request:
    types: [opened, synchronize, reopened]

jobs:
  preview:
    runs-on: ubuntu-latest
    permissions:
      pull-requests: write  # 需要權限才能留 PR 留言

    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with:
          node-version: '20'
          cache: 'npm'
      - run: npm ci

      - name: Install Vercel CLI
        run: npm install -g vercel@latest

      - name: Deploy Preview
        id: deploy
        run: |
          vercel pull --yes --environment=preview --token=${{ secrets.VERCEL_TOKEN }}
          vercel build --token=${{ secrets.VERCEL_TOKEN }}
          PREVIEW_URL=$(vercel deploy --prebuilt --token=${{ secrets.VERCEL_TOKEN }})
          echo "url=$PREVIEW_URL" >> $GITHUB_OUTPUT
        env:
          VERCEL_ORG_ID: ${{ secrets.VERCEL_ORG_ID }}
          VERCEL_PROJECT_ID: ${{ secrets.VERCEL_PROJECT_ID }}

      # 把 Preview URL 自動留言在 PR 上
      - name: Comment Preview URL on PR
        uses: actions/github-script@v7
        with:
          script: |
            github.rest.issues.createComment({
              issue_number: context.issue.number,
              owner: context.repo.owner,
              repo: context.repo.repo,
              body: `## 🚀 Preview 環境已部署\n\n**URL**: ${{ steps.deploy.outputs.url }}\n\n> 此 Preview 會在 PR 關閉後自動刪除`
            })