Skip to content

[CHORE] CI 워크 플로우 추가#395

Merged
keemsebin merged 9 commits into
mainfrom
chore/#394-ci
Mar 31, 2026
Merged

[CHORE] CI 워크 플로우 추가#395
keemsebin merged 9 commits into
mainfrom
chore/#394-ci

Conversation

@keemsebin

@keemsebin keemsebin commented Mar 30, 2026

Copy link
Copy Markdown
Collaborator

🔥 연관 이슈

🚀 작업 내용

문제 상황

Vercel 배포 시 계정이 공동 계정이 아닌 개인 계정이라 build 에러가 발생해도 팀원들이 에러 메시지를 확인할 수 없는 문제가 있었습니다.
로컬에서 매번 build를 돌리고 PR을 작성하는 건 번거롭고, Vercel build failed 이후 에러를 파악하고 수정하기까지 시간이 걸려 비효율적이었습니다. 이를 해결하기 위해 GitHub Actions CI에서 build 로그를 바로 확인할 수 있도록 워크플로우를 구성했습니다.

action.yml에 pnpm 기반 build 스크립트를 공통으로 명시해두었습니다. 나중에 다른 워크플로우 사용 시 참고해서 사용하면 좋을 것 같습니다~

Summary by CodeRabbit

릴리스 노트

  • New Features

    • PR 대상 브랜치용 CI 워크플로우 추가(린트·타입검사·빌드).
    • 재사용 가능한 로컬 설정 액션 추가(Node 및 패키지 설치 자동화).
  • Chores

    • 워크플로우의 설치/캐시/종속성 설치 단일화로 설정 간소화.
    • 린트 자동수정 스크립트 추가.
  • Style

    • 다수 UI 파일의 import 정렬 일괄 정리.
  • Bug Fixes

    • 패키지별 컴파일 설정 파일 삭제로 구성 단순화.

@github-actions github-actions Bot added the chore 패키지 매니저 수정, 그 외 기타 수정 ex) .gitignore label Mar 30, 2026
@coderabbitai

coderabbitai Bot commented Mar 30, 2026

Copy link
Copy Markdown

Warning

Rate limit exceeded

@keemsebin has exceeded the limit for the number of commits that can be reviewed per hour. Please wait 15 minutes and 31 seconds before requesting another review.

Your organization is not enrolled in usage-based pricing. Contact your admin to enable usage-based pricing to continue reviews beyond the rate limit, or try again in 15 minutes and 31 seconds.

⌛ How to resolve this issue?

After the wait time has elapsed, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

We recommend that you space out your commits to avoid hitting the rate limit.

🚦 How do rate limits work?

CodeRabbit enforces hourly rate limits for each developer per organization.

Our paid plans have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout.

Please see our FAQ for further information.

ℹ️ Review info
⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: ASSERTIVE

Plan: Pro

Run ID: edd9de80-b1ef-4825-951d-c0eb3b6ddc3e

📥 Commits

Reviewing files that changed from the base of the PR and between a17b4a1 and cf83002.

📒 Files selected for processing (1)
  • .github/workflows/ci.yml

Walkthrough

GitHub Actions에 재사용 가능한 pnpm & Node 설정 액션을 추가하고 PR 대상 CI 워크플로(린트·타입체크·빌드)를 도입했으며, 이미지 타입 선언 및 navItems의 image 타입을 확장하고 패키지별 tsconfig를 삭제, 다수 UI 컴포넌트에서 import 순서를 재정렬했습니다.

Changes

Cohort / File(s) Summary
GitHub Actions
/.github/actions/setup/action.yml, /.github/workflows/ci.yml, /.github/workflows/deploy-storybook.yaml, /.github/workflows/preview-storybook.yaml
로컬 composite 액션 Setup pnpm & Node 추가 및 CI 워크플로(PR 대상 main/develop, jobs: lint/type-check/build)에 해당 액션 적용. 기존 Storybook 워크플로의 설치/설정 단계들을 이 액션으로 대체.
이미지 타입 및 navItems
apps/web/global.d.ts, apps/web/app/_constants/navItems.ts
`*.webp
Next.js 설정
apps/web/next.config.js
staticPageGenerationTimeout: 120 설정 추가.
패키지 설정/스크립트
packages/eslint-config/tsconfig.json (삭제), packages/shared/package.json
패키지 전용 tsconfig 삭제. packages/sharedlint:fix 스크립트 추가.
UI 컴포넌트 import 순서 조정
packages/shared/ui/.../*.tsx
예: Button/Button.tsx, Carousel/Carousel.tsx, DoubleButton/DoubleButton.tsx, Header/..., Icon/Icon.tsx, ImageGallery/..., Input/Input.tsx, MediaUpload/MediaUpload.tsx, Modal/Modal.tsx, Pagination/Pagination.tsx, Select/..., Table/..., TextArea/TextArea.tsx, Tooltip/Tooltip.tsx
다수 파일에서 cn 및 일부 로컬 import의 위치를 재배치(임포트 순서 변경만, 기능/타입/로직 불변).

Sequence Diagram(s)

sequenceDiagram
  participant GitHub as GitHub
  participant Runner as Runner (ubuntu-latest)
  participant Checkout as Checkout Action
  participant Setup as Local Setup Action (./.github/actions/setup)
  participant PnpmSetup as pnpm/action-setup
  participant NodeSetup as actions/setup-node
  participant PnpmInstall as pnpm install

  GitHub->>Runner: PR 이벤트 발생
  Runner->>Checkout: repository 체크아웃
  Runner->>Setup: 실행 (composite action)
  Setup->>PnpmSetup: pnpm 설치 (pnpm/action-setup)
  Setup->>NodeSetup: Node 설정 (.nvmrc, pnpm cache)
  Setup->>PnpmInstall: `pnpm install --frozen-lockfile`
  PnpmInstall-->>Runner: 의존성 설치 완료
  Runner->>Runner: `pnpm lint` / `pnpm check-types` / `pnpm build` 실행
Loading

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Possibly related PRs

Suggested labels

infra, 🌍 인프라

Suggested reviewers

  • ujinsim
  • JangYEhoon00
🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check name Status Explanation
Title check ✅ Passed PR 제목은 '[CHORE] CI 워크 플로우 추가'로 실제 변경사항인 GitHub Actions CI 워크플로우 추가와 일치하며 명확하고 간결합니다.
Description check ✅ Passed PR 설명에 '🔥 연관 이슈' 섹션에서 #394를 명시하고, '🚀 작업 내용'에서 문제 상황과 해결책을 상세히 설명했으나, 템플릿의 '🤔 고민했던 내용'과 '💬 리뷰 중점사항' 섹션이 누락되었습니다.
Linked Issues check ✅ Passed PR 변경사항들이 #394의 '빌드, 타입체크 CI 구성' 목표를 충족합니다. CI 워크플로우 추가, 공통 setup 액션 정의, 타입 선언 추가, 린트 명령어 추가, 타입 오류 수정 등 모든 변경이 목표와 일치합니다.
Out of Scope Changes check ✅ Passed import 순서 정렬이나 next.config.js의 timeout 설정 추가 등 일부 부가적인 변경이 있지만, 모두 CI 워크플로우 적용에 필요한 범위 내 변경입니다.
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch chore/#394-ci

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

@vercel

vercel Bot commented Mar 30, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
ddingdong-fe Ready Ready Preview, Comment Mar 30, 2026 3:45pm

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 2

🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.

Inline comments:
In @.github/workflows/ci.yml:
- Around line 3-5: The workflow currently triggers only on the pull_request
event (pull_request with branches: [main, develop]); add a push trigger so CI
also runs for direct pushes to main/develop by adding a push section mirroring
the pull_request branches (e.g., push: branches: [main, develop]) in the
top-level on: block, ensuring both push and pull_request events are declared.
- Around line 38-49: Update the CI workflow to only expose environment variables
actually needed at build: verify and remove unused declarations in turbo.json
(or implement usage) for NEXT_PUBLIC_API_URL and confirm SENTRY_AUTH_TOKEN’s
scope; if SENTRY_AUTH_TOKEN is required at build time, add it to the CI env,
otherwise remove it from CI/turbo.json; ensure NEXT_PUBLIC_GA_ID is added to the
CI workflow env (use the secret NEXT_PUBLIC_GA_ID) so the Build step (the Build
job/step in .github/workflows/ci.yml) has the runtime value available during
pnpm build.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: ASSERTIVE

Plan: Pro

Run ID: d05f32e6-5fe3-4613-9eb7-563c3ad35e3a

📥 Commits

Reviewing files that changed from the base of the PR and between c8b6be5 and 8e9ed23.

📒 Files selected for processing (3)
  • .github/actions/setup/action.yml
  • .github/workflows/ci.yml
  • packages/eslint-config/tsconfig.json
💤 Files with no reviewable changes (1)
  • packages/eslint-config/tsconfig.json

Comment thread .github/workflows/ci.yml
Comment on lines +3 to +5
on:
pull_request:
branches: [main, develop]

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🧹 Nitpick | 🔵 Trivial

push 이벤트도 트리거에 추가하는 것을 고려하세요.

현재 pull_request 이벤트에만 CI가 실행되도록 설정되어 있습니다. main이나 develop 브랜치에 직접 push하는 경우(예: hotfix, 긴급 수정)에는 CI가 실행되지 않습니다. 브랜치에 직접 push할 가능성이 있다면 push 이벤트도 추가하는 것을 권장합니다.

🔄 push 이벤트 추가 제안
 on:
   pull_request:
     branches: [main, develop]
+  push:
+    branches: [main, develop]
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
on:
pull_request:
branches: [main, develop]
on:
pull_request:
branches: [main, develop]
push:
branches: [main, develop]
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In @.github/workflows/ci.yml around lines 3 - 5, The workflow currently triggers
only on the pull_request event (pull_request with branches: [main, develop]);
add a push trigger so CI also runs for direct pushes to main/develop by adding a
push section mirroring the pull_request branches (e.g., push: branches: [main,
develop]) in the top-level on: block, ensuring both push and pull_request events
are declared.

Comment thread .github/workflows/ci.yml
Comment on lines +38 to +49
build:
name: Build
runs-on: ubuntu-latest
steps:
- name: Checkout
uses: actions/checkout@v4

- name: Setup
uses: ./.github/actions/setup

- name: Build
run: pnpm build

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🟠 Major

🧩 Analysis chain

🏁 Script executed:

#!/bin/bash
# Description: Check how environment variables are used in Next.js config and build scripts

# Find Next.js config files that might reference env vars
fd -e js -e ts -e mjs 'next.config' --exec cat {}

# Search for references to the env vars in source code
rg -n 'NEXT_PUBLIC_API_URL|NEXT_PUBLIC_GA_ID|SENTRY_AUTH_TOKEN' -g '!node_modules' -g '!.next' -C2

Repository: COW-dev/ddingdong-fe

Length of output: 1980


🏁 Script executed:

# Check the actual CI workflow file
cat -n .github/workflows/ci.yml

Repository: COW-dev/ddingdong-fe

Length of output: 1265


🏁 Script executed:

# Search more thoroughly for NEXT_PUBLIC_API_URL usage
rg -n 'NEXT_PUBLIC_API_URL' --type-list | head -20
rg 'NEXT_PUBLIC_API_URL' -g '!node_modules' -g '!.next'

Repository: COW-dev/ddingdong-fe

Length of output: 560


🏁 Script executed:

# Look for environment variable configuration files
fd -e env -e example -e sample '.*env'

Repository: COW-dev/ddingdong-fe

Length of output: 46


🏁 Script executed:

# Check the setup action to see what it configures
cat -n .github/actions/setup/action.yml

Repository: COW-dev/ddingdong-fe

Length of output: 654


🏁 Script executed:

# Search for how these variables might be used in the build process
rg -n 'SENTRY_AUTH_TOKEN' -g '!node_modules' -g '!.next' -C2

Repository: COW-dev/ddingdong-fe

Length of output: 337


🏁 Script executed:

# Search comprehensively for NEXT_PUBLIC_API_URL actual usage
rg 'NEXT_PUBLIC_API_URL' -g '!node_modules' -g '!.next'

Repository: COW-dev/ddingdong-fe

Length of output: 153


🏁 Script executed:

# Check for .env files in the repo more thoroughly
find . -name '.env*' -o -name '*.env*' 2>/dev/null | head -20

Repository: COW-dev/ddingdong-fe

Length of output: 46


🏁 Script executed:

# Look at turbo.json build configuration more carefully
cat -n turbo.json | head -30

Repository: COW-dev/ddingdong-fe

Length of output: 1002


🏁 Script executed:

# Check package.json build script to understand build process
rg '"build"' package.json -A 2

Repository: COW-dev/ddingdong-fe

Length of output: 153


🏁 Script executed:

# Verify if there are any conditional env var checks
rg 'process\.env\.(NEXT_PUBLIC_API_URL|SENTRY_AUTH_TOKEN)' -g '!node_modules'

Repository: COW-dev/ddingdong-fe

Length of output: 46


CI 워크플로우에서 실제로 사용되는 환경 변수만 전달해야 합니다.

검증 결과, turbo.json에 선언된 환경 변수 중 NEXT_PUBLIC_GA_ID만 실제로 코드에서 사용되고 있습니다(apps/web/app/layout.tsx, apps/web/app/_lib/gtag.ts).

반면 NEXT_PUBLIC_API_URLSENTRY_AUTH_TOKENturbo.json에만 선언되어 있고 실제 코드에서는 사용되지 않습니다. 따라서 다음 사항을 명확히 하세요:

  1. NEXT_PUBLIC_API_URL은 현재 미사용 상태입니다 - 향후 사용 계획이 있다면 구현을 진행하고, 없다면 turbo.json에서 제거하세요
  2. SENTRY_AUTH_TOKEN의 용도를 확인하세요 - 빌드 시 필요하다면 CI에 추가하고, 런타임에만 필요하다면 제거하세요
  3. NEXT_PUBLIC_GA_ID는 CI 워크플로우에 추가해야 합니다
env:
  NEXT_PUBLIC_GA_ID: ${{ secrets.NEXT_PUBLIC_GA_ID }}
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In @.github/workflows/ci.yml around lines 38 - 49, Update the CI workflow to
only expose environment variables actually needed at build: verify and remove
unused declarations in turbo.json (or implement usage) for NEXT_PUBLIC_API_URL
and confirm SENTRY_AUTH_TOKEN’s scope; if SENTRY_AUTH_TOKEN is required at build
time, add it to the CI env, otherwise remove it from CI/turbo.json; ensure
NEXT_PUBLIC_GA_ID is added to the CI workflow env (use the secret
NEXT_PUBLIC_GA_ID) so the Build step (the Build job/step in
.github/workflows/ci.yml) has the runtime value available during pnpm build.

@github-actions

github-actions Bot commented Mar 30, 2026

Copy link
Copy Markdown

Update: 2026년 03월 31일 00시 45분 39초
Storybook 미리보기: https://69ca943d51248ba5e1094fac-tfoitnbteq.chromatic.com/

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 19

🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.

Inline comments:
In `@apps/web/app/_constants/navItems.ts`:
- Line 7: The nav item `image` type was expanded to `string | { src: string;
height: number; width: number }` but NavigationItems (component/variable named
NavigationItems in NavigationItems.tsx) narrows it to `image?: string`, creating
an unsafe assertion; update the shared type so both sides agree (e.g., change
the `image` type in apps/web/app/_constants/navItems.ts to include Next.js
StaticImageData or a union that matches the object shape) or update
NavigationItems.tsx to accept and branch on both variants (string vs object with
src/height/width) where the `image` prop is used so runtime handling matches the
declared union type.

In `@apps/web/global.d.ts`:
- Around line 3-28: The '*.svg' module declaration in global.d.ts currently
defines SVGs as static {src,height,width} objects which conflicts with
`@svgr/webpack`; update the '*.svg' declaration so the default export is a React
component (use React.FunctionComponent with React.SVGProps<SVGSVGElement> & {
title?: string }) instead of the object shape, leaving the existing '*.png' and
'*.webp' declarations unchanged; locate the '*.svg' block in global.d.ts and
replace its type accordingly so imports like import Icon from './icon.svg'
type-check as a React component.

In `@packages/shared/ui/Button/Button.tsx`:
- Around line 5-6: Move the internal import of '@/shared/lib/core' above the
sibling import '../Icon' to follow the project's import group ordering
(external, builtin, internal, parent, sibling, index); update the import
statements in Button.tsx so the cn import appears before the Icon import (ensure
groups remain separated by a newline).

In `@packages/shared/ui/Carousel/Carousel.tsx`:
- Around line 8-9: The import from the internal module "cn" (import { cn } from
'@/shared/lib/core') is placed after parent/sibling imports; reorder imports to
follow the project's grouping (external, builtin, internal, parent, sibling,
index, object, type) by moving the '@/shared/lib/core' import into the internal
group (i.e., above any parent/sibling imports) so the import ordering in
Carousel.tsx matches the guideline.

In `@packages/shared/ui/DoubleButton/DoubleButton.tsx`:
- Around line 5-6: Import order in DoubleButton.tsx is wrong: place external
imports (e.g., react/React) first, then internal imports (e.g.,
'@/shared/lib/core' which exports cn), then parent/sibling/index imports; update
the import block in DoubleButton.tsx so React is imported before the '@/...'
import and any parent imports follow after, preserving a blank line between
groups to match the "external, internal, parent" grouping.

In `@packages/shared/ui/Header/Header.tsx`:
- Around line 5-6: Reorder the import groups in Header.tsx so internal imports
come before parent imports: move the import of cn from '@/shared/lib/core' above
any parent-level imports; ensure imports follow the project's grouping rule
(external, builtin, internal, parent, sibling, index, object, type) and keep a
blank line between groups.

In `@packages/shared/ui/Header/MenuItem.tsx`:
- Around line 11-12: The import for the internal module cn from
'@/shared/lib/core' is in the wrong group; move that import in MenuItem.tsx so
internal imports appear before parent/sibling imports and ensure groups are
separated by newlines following the rule (external, builtin, internal, parent,
sibling, index, object, type); update the import order so the line importing cn
is placed in the internal group with a blank line between it and the
parent/sibling imports.

In `@packages/shared/ui/Icon/Icon.tsx`:
- Around line 3-4: The import ordering in Icon.tsx is incorrect: move the
internal imports (e.g., COLORS, IconColor from '@/shared/lib/colors') so they
appear before parent imports, following the project's import group order
(external, builtin, internal, parent, sibling, index, object, type); update the
import block so internal imports are placed above any parent-level imports to
match the linter/coding guideline and keep the same symbols (COLORS, IconColor)
intact.

In `@packages/shared/ui/ImageGallery/ImageGallery.tsx`:
- Around line 6-7: Reorder the imports in ImageGallery.tsx so internal imports
like the cn utility are placed before parent/sibling imports and follow the
project's import ordering (external, builtin, internal, parent, sibling, index,
object, type); specifically move the import of cn (import { cn } from
'@/shared/lib/core') above any parent/sibling imports in the file so it resides
in the internal group.

In `@packages/shared/ui/Input/Input.tsx`:
- Around line 6-7: The import ordering in Input.tsx is incorrect: the internal
import of cn from '@/shared/lib/core' must appear in the "internal" group above
any parent imports; reorder the import statements so groups follow the guideline
(external, builtin, internal, parent, sibling, index, object, type) and place
the line importing cn into the internal group above parent imports to restore
the correct order.

In `@packages/shared/ui/MediaUpload/MediaUpload.tsx`:
- Around line 9-10: The internal import of cn from '@/shared/lib/core' is
currently placed with sibling imports; move that import into the internal
imports group at the top of the file so import order follows the project's rule
(external, builtin, internal, parent, sibling, index, object, type). Locate the
import statement "import { cn } from '@/shared/lib/core';" in MediaUpload.tsx
and relocate it above the sibling imports (separated by a newline) to be in the
internal group.

In `@packages/shared/ui/Modal/Modal.tsx`:
- Around line 7-8: Reorder the import statements in Modal.tsx so internal
imports come before parent imports: move the internal import of cn from
'@/shared/lib/core' above the parent imports like ../Flex and ../Portal; update
the import block in the Modal component (referencing the symbol cn and the
modules ../Flex and ../Portal) to follow the project's import ordering rules
(external, builtin, internal, parent, sibling, index) with blank lines
separating groups.

In `@packages/shared/ui/Pagination/Pagination.tsx`:
- Around line 3-4: The import ordering in Pagination.tsx is reversed: move the
internal import "import { cn } from '@/shared/lib/core';" to appear before the
parent import (e.g., "../Icon") so imports follow the project's grouping rule
(external, builtin, internal, parent, sibling, index); ensure groups are
separated by a newline and update any other nearby imports in Pagination.tsx to
match this ordering.

In `@packages/shared/ui/Select/Option.tsx`:
- Around line 5-6: The import ordering in Option.tsx is incorrect: internal
imports (e.g., imports starting with '@/...') must appear before sibling imports
(e.g., './...'); update the import group order so the internal import that
brings in cn comes before any sibling imports in this file, ensuring imports
follow the project rule (external, builtin, internal, parent, sibling, index,
object, type).

In `@packages/shared/ui/Select/OptionList.tsx`:
- Around line 5-6: Move the internal import of cn from '@/shared/lib/core' so it
appears in the "internal" group above sibling imports in OptionList.tsx; locate
the import statement importing cn and reposition it to the internal group
(separated by a blank line from external/builtin and before sibling imports) to
follow the project's import ordering convention.

In `@packages/shared/ui/Select/SelectButton.tsx`:
- Around line 4-5: The import ordering in SelectButton.tsx is wrong: the
internal import "cn" (import { cn } from '@/shared/lib/core') must be placed in
the internal group before any parent-group imports; update the import block so
groups are separated by newlines and follow the sequence external, builtin,
internal (where "cn" belongs), parent, sibling, index, object, type to match the
project's import ordering guideline.

In `@packages/shared/ui/Table/TableHead.tsx`:
- Around line 5-6: The import in TableHead.tsx is in the wrong group order; move
the parent import(s) after internal imports so imports follow the project's
grouping: external, builtin, internal, parent, sibling, index, object, type;
specifically, ensure the current "import { cn } from '@/shared/lib/core';" (and
any other '@/' or parent imports) are placed in the internal group and that
parent-level imports come after internal ones, with blank lines separating each
group and no other changes to identifiers or export usage.

In `@packages/shared/ui/TextArea/TextArea.tsx`:
- Around line 6-7: Reorder the imports in TextArea.tsx so the internal import
"cn" from '@/shared/lib/core' is placed in the internal group before any parent
imports, following the project's import ordering (external, builtin, internal,
parent, sibling, index); ensure groups are separated by a blank line and that
the import of cn sits in the internal section.

In `@packages/shared/ui/Tooltip/Tooltip.tsx`:
- Around line 11-12: The import order in Tooltip.tsx is incorrect: move the
internal import of the helper `cn` so it appears in the "internal" group above
any parent/sibling imports; locate the line importing `cn` and reposition it
above imports from parent/sibling modules (keeping groups separated by a blank
line) to match the project's import ordering rule (external, builtin, internal,
parent, sibling, index, object, type).
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: ASSERTIVE

Plan: Pro

Run ID: b49dae8a-e5e0-462f-b2a3-d78f761e6711

📥 Commits

Reviewing files that changed from the base of the PR and between 8e9ed23 and a17b4a1.

📒 Files selected for processing (24)
  • .github/workflows/deploy-storybook.yaml
  • .github/workflows/preview-storybook.yaml
  • apps/web/app/_constants/navItems.ts
  • apps/web/global.d.ts
  • apps/web/next.config.js
  • packages/shared/package.json
  • packages/shared/ui/Button/Button.tsx
  • packages/shared/ui/Carousel/Carousel.tsx
  • packages/shared/ui/DoubleButton/DoubleButton.tsx
  • packages/shared/ui/Header/Header.tsx
  • packages/shared/ui/Header/MenuItem.tsx
  • packages/shared/ui/Icon/Icon.tsx
  • packages/shared/ui/ImageGallery/ImageGallery.tsx
  • packages/shared/ui/Input/Input.tsx
  • packages/shared/ui/MediaUpload/MediaUpload.tsx
  • packages/shared/ui/Modal/Modal.tsx
  • packages/shared/ui/Pagination/Pagination.tsx
  • packages/shared/ui/Select/Option.tsx
  • packages/shared/ui/Select/OptionList.tsx
  • packages/shared/ui/Select/SelectButton.tsx
  • packages/shared/ui/Table/TableCell.tsx
  • packages/shared/ui/Table/TableHead.tsx
  • packages/shared/ui/TextArea/TextArea.tsx
  • packages/shared/ui/Tooltip/Tooltip.tsx

Comment thread apps/web/app/_constants/navItems.ts
Comment thread apps/web/global.d.ts
Comment on lines +3 to +28
declare module '*.webp' {
const content: {
src: string;
height: number;
width: number;
};
export default content;
}

declare module '*.png' {
const content: {
src: string;
height: number;
width: number;
};
export default content;
}

declare module '*.svg' {
const content: {
src: string;
height: number;
width: number;
};
export default content;
}

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🟠 Major

🧩 Analysis chain

🏁 Script executed:

#!/bin/bash
# SVG import 사용 패턴 점검: .src 접근형인지 컴포넌트 렌더링형인지 확인
rg -nP --type=ts --type=tsx "from\\s+['\"][^'\"]+\\.svg['\"]" apps/web packages
rg -nP --type=tsx "\\.src\\b" apps/web packages
rg -nP --type=tsx "<[A-Z][A-Za-z0-9_]*\\b[^>]*>" apps/web packages

# Expected:
# - SVG import 후 `.src`만 사용하면 현재 선언 유지 가능성이 높음.
# - SVG import를 JSX 컴포넌트로 렌더링하는 패턴이 있으면 `declare module '*.svg'` 타입 재설계 필요.

Repository: COW-dev/ddingdong-fe

Length of output: 147


🏁 Script executed:

#!/bin/bash
# Fix: Use extension patterns instead of unrecognized file types
# Search for SVG imports
echo "=== SVG imports ==="
rg "from\s+['\"][^'\"]+\.svg['\"]" --type ts -A 2

echo ""
echo "=== Image/asset declarations in global.d.ts ==="
head -n 30 apps/web/global.d.ts

echo ""
echo "=== Next.js config check ==="
find apps/web -maxdepth 2 -name "next.config.*" -o -name "*.config.js" | xargs cat 2>/dev/null | head -n 50

echo ""
echo "=== SVG usage patterns (.src accessor) ==="
rg "\.src\b" --type ts | head -n 20

Repository: COW-dev/ddingdong-fe

Length of output: 6791


🏁 Script executed:

#!/bin/bash
# Check if there are any SVGR or similar configurations
echo "=== Package.json scripts and dependencies ==="
if [ -f "apps/web/package.json" ]; then
  cat apps/web/package.json | jq '.dependencies, .devDependencies' 2>/dev/null | grep -i svg
fi

echo ""
echo "=== tsconfig check for asset imports ==="
if [ -f "apps/web/tsconfig.json" ]; then
  cat apps/web/tsconfig.json | jq '.compilerOptions' 2>/dev/null | head -n 30
fi

Repository: COW-dev/ddingdong-fe

Length of output: 662


SVGR 설정과 충돌하는 SVG 모듈 타입 선언을 수정하세요.

@svgr/webpack이 설치되어 있고 실제로 SVG를 React 컴포넌트로 import하여 사용하고 있으나, global.d.ts*.svg 선언이 정적 객체 형태로 되어 있습니다. 현재 타입 선언은 SVG를 { src, height, width } 객체로 정의하지만, SVGR은 기본적으로 React 컴포넌트를 export합니다.

declare module '*.svg' {
  const SVG: React.FunctionComponent<
    React.SVGProps<SVGSVGElement> & { title?: string }
  >;
  export default SVG;
}

*.webp*.png 선언은 Next.js 이미지 import 패턴에 맞아 유지해도 됩니다.

🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@apps/web/global.d.ts` around lines 3 - 28, The '*.svg' module declaration in
global.d.ts currently defines SVGs as static {src,height,width} objects which
conflicts with `@svgr/webpack`; update the '*.svg' declaration so the default
export is a React component (use React.FunctionComponent with
React.SVGProps<SVGSVGElement> & { title?: string }) instead of the object shape,
leaving the existing '*.png' and '*.webp' declarations unchanged; locate the
'*.svg' block in global.d.ts and replace its type accordingly so imports like
import Icon from './icon.svg' type-check as a React component.

Comment thread packages/shared/ui/Button/Button.tsx
Comment thread packages/shared/ui/Carousel/Carousel.tsx
Comment thread packages/shared/ui/DoubleButton/DoubleButton.tsx
Comment thread packages/shared/ui/Select/OptionList.tsx
Comment thread packages/shared/ui/Select/SelectButton.tsx
Comment thread packages/shared/ui/Table/TableHead.tsx
Comment thread packages/shared/ui/TextArea/TextArea.tsx
Comment thread packages/shared/ui/Tooltip/Tooltip.tsx

@ujinsim ujinsim left a comment

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

에러 메세지가 안떠서 번거로웠는데 작업 감사합니다!!

Comment thread apps/web/next.config.js
],
},
reactStrictMode: true,
staticPageGenerationTimeout: 120,

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

이 부분을 추가하신 이유가 궁금합니다!

Copy link
Copy Markdown
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

timeout 60초가 기본인데, 메인 home페이지 isr 구조에서 빌드가 60초 넘는 경우가 있어 timeout시간을 120초로 늘려준겁니다~

@keemsebin keemsebin merged commit 0ebdde0 into main Mar 31, 2026
9 checks passed
@keemsebin keemsebin deleted the chore/#394-ci branch March 31, 2026 10:42
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

chore 패키지 매니저 수정, 그 외 기타 수정 ex) .gitignore

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[CHORE] 빌드, 타입체크 CI

2 participants