Conversation
PR 검증 결과❌ TypeScript: 실패 |
|
Important Review skippedAuto reviews are disabled on base/target branches other than the default branch. Please check the settings in the CodeRabbit UI or the You can disable this status message by setting the Use the checkbox below for a quick retry:
📝 WalkthroughWalkthrough관리자 영역을 위한 레이아웃 구조를 새로 구성합니다. 메인 레이아웃에 Header와 LNB(좌측 네비게이션 바) 컴포넌트를 추가하며, 현재 경로에 따라 페이지 메타데이터와 네비게이션 상태를 동적으로 표시합니다. Changes
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~25 minutes Poem
🚥 Pre-merge checks | ✅ 2 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (2 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Comment |
There was a problem hiding this comment.
Actionable comments posted: 6
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@src/app/`(private)/admin/layout.tsx:
- Around line 13-16: Replace the unauthorized background token class on the
admin layout's main element: in the JSX where <main
className="bg-container-neutral-alternative flex-1 overflow-auto"> is rendered
(the layout component that renders Header and {children}), swap out
bg-container-neutral-alternative for one of the approved design token classes
(e.g., bg-container-neutral or bg-container-neutral-interaction) to comply with
the style guide; ensure only the background token is changed and preserve the
remaining classes (flex-1 overflow-auto).
In `@src/components/admin/layout/Header.tsx`:
- Around line 43-44: Replace the disallowed background token on the Logout
button: in Header.tsx find the button with the class string containing
"hover:bg-button-neutral-interaction" and swap that token for an allowed design
token, e.g., "hover:bg-container-neutral-interaction" (keeping the rest of the
classes intact) so the class becomes "... bg-button-neutral
hover:bg-container-neutral-interaction ml-auto ...".
In `@src/components/admin/layout/LNB.tsx`:
- Line 63: The div in LNB.tsx using className "flex items-center gap-300 px-300
pt-[8px]" uses a hardcoded pt-[8px] value; replace that arbitrary pixel value
with the appropriate spacing design token (e.g., pt-100 or another p-100~500
value matching 8px) and ensure spacing tokens are used for gap (gap-100~400) and
padding (p-100~500); update the className on the same div element to remove
pt-[8px] and use the correct tokenized class.
- Around line 111-117: In the manual-link branch inside the LNB component (the
id === 'manual' block using navItemClass) avoid using window.open(path,
'_blank') alone; either render an anchor with target="_blank" and rel="noopener
noreferrer" or, if keeping window.open, call window.open(path, '_blank',
'noopener,noreferrer') or immediately null out the opener on the returned window
(const w = window.open(...); if (w) w.opener = null;) so the opened tab cannot
access the opener and prevent tab-napping.
- Around line 7-13: The build fails because the imported SVG modules (logoIcon,
userIcon, checkIcon, penaltyIcon, arrowIcon, manualIcon) cannot be resolved;
verify each import path/name in src/components/admin/layout/LNB.tsx matches the
actual files under assets/icons (fix typos or move/rename files), and if
TypeScript is blocking imports add a module declaration for SVGs (e.g., declare
module '*.svg') in your global d.ts or include SVG types in tsconfig so imports
of *.svg are recognized by the compiler; then re-run the build to confirm
resolution.
- Around line 34-42: The NavIcon component is using unapproved background
tokens; update the className logic inside NavIcon (function NavIcon) to replace
'bg-brand-primary' with the approved 'bg-button-primary' for the active state
and replace 'bg-text-alternative' with 'bg-container-neutral-interaction' for
the inactive state so the ternary in the cn call uses the approved tokens.
ℹ️ Review info
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (25)
src/assets/icons/admin/ic_admin_absence.svgis excluded by!**/*.svgsrc/assets/icons/admin/ic_admin_attendance.svgis excluded by!**/*.svgsrc/assets/icons/admin/ic_admin_backarrow.svgis excluded by!**/*.svgsrc/assets/icons/admin/ic_admin_cardinal.svgis excluded by!**/*.svgsrc/assets/icons/admin/ic_admin_change.svgis excluded by!**/*.svgsrc/assets/icons/admin/ic_admin_check.svgis excluded by!**/*.svgsrc/assets/icons/admin/ic_admin_checkbox.svgis excluded by!**/*.svgsrc/assets/icons/admin/ic_admin_circle_check.svgis excluded by!**/*.svgsrc/assets/icons/admin/ic_admin_close.svgis excluded by!**/*.svgsrc/assets/icons/admin/ic_admin_column_meatball.svgis excluded by!**/*.svgsrc/assets/icons/admin/ic_admin_due.svgis excluded by!**/*.svgsrc/assets/icons/admin/ic_admin_manual.svgis excluded by!**/*.svgsrc/assets/icons/admin/ic_admin_meatball.svgis excluded by!**/*.svgsrc/assets/icons/admin/ic_admin_penalty.svgis excluded by!**/*.svgsrc/assets/icons/admin/ic_admin_plus.svgis excluded by!**/*.svgsrc/assets/icons/admin/ic_admin_receipt.svgis excluded by!**/*.svgsrc/assets/icons/admin/ic_admin_search.svgis excluded by!**/*.svgsrc/assets/icons/admin/ic_admin_service_transfer.svgis excluded by!**/*.svgsrc/assets/icons/admin/ic_admin_uncheckbox.svgis excluded by!**/*.svgsrc/assets/icons/admin/ic_admin_user.svgis excluded by!**/*.svgsrc/assets/icons/logo/logo_full_Origin.svgis excluded by!**/*.svgsrc/assets/icons/logo/logo_full_Spring.svgis excluded by!**/*.svgsrc/assets/icons/logo/logo_full_Xmas.svgis excluded by!**/*.svgsrc/assets/icons/logo/logo_initial_Origin.svgis excluded by!**/*.svgsrc/assets/icons/logo/logo_initial_Xmas.svgis excluded by!**/*.svg
📒 Files selected for processing (3)
src/app/(private)/admin/layout.tsxsrc/components/admin/layout/Header.tsxsrc/components/admin/layout/LNB.tsx
| import logoIcon from '@/assets/icons/logo/logo_initial_Origin.svg'; | ||
| import userIcon from '@/assets/icons/admin/ic_admin_user.svg'; | ||
| import checkIcon from '@/assets/icons/admin/ic_admin_attendance.svg'; | ||
| import penaltyIcon from '@/assets/icons/admin/ic_admin_penalty.svg'; | ||
| // import dueIcon from '@/assets/icons/admin/ic_admin_due.svg'; | ||
| import arrowIcon from '@/assets/icons/admin/ic_admin_service_transfer.svg'; | ||
| import manualIcon from '@/assets/icons/admin/ic_admin_manual.svg'; |
There was a problem hiding this comment.
SVG 아이콘 모듈 누락으로 빌드 실패
CI에서 해당 SVG 모듈을 찾지 못해 빌드가 실패하고 있습니다. 아이콘 파일 경로/이름을 확인하고, 필요 시 *.svg 모듈 선언을 추가해 주세요.
🧰 Tools
🪛 GitHub Actions: CI
[error] 7-7: TypeScript: Cannot find module '@/assets/icons/logo/logo_initial_Origin.svg' or its corresponding type declarations.
🪛 GitHub Check: Lint & Build
[failure] 13-13:
Cannot find module '@/assets/icons/admin/ic_admin_manual.svg' or its corresponding type declarations.
[failure] 12-12:
Cannot find module '@/assets/icons/admin/ic_admin_service_transfer.svg' or its corresponding type declarations.
[failure] 10-10:
Cannot find module '@/assets/icons/admin/ic_admin_penalty.svg' or its corresponding type declarations.
[failure] 9-9:
Cannot find module '@/assets/icons/admin/ic_admin_attendance.svg' or its corresponding type declarations.
[failure] 8-8:
Cannot find module '@/assets/icons/admin/ic_admin_user.svg' or its corresponding type declarations.
[failure] 7-7:
Cannot find module '@/assets/icons/logo/logo_initial_Origin.svg' or its corresponding type declarations.
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.
In `@src/components/admin/layout/LNB.tsx` around lines 7 - 13, The build fails
because the imported SVG modules (logoIcon, userIcon, checkIcon, penaltyIcon,
arrowIcon, manualIcon) cannot be resolved; verify each import path/name in
src/components/admin/layout/LNB.tsx matches the actual files under assets/icons
(fix typos or move/rename files), and if TypeScript is blocking imports add a
module declaration for SVGs (e.g., declare module '*.svg') in your global d.ts
or include SVG types in tsconfig so imports of *.svg are recognized by the
compiler; then re-run the build to confirm resolution.
nabbang6
left a comment
There was a problem hiding this comment.
확인했습니다~! 나중에 navItems 부분은 별도 파일로 분리해서 관리해도 좋을 것 같은데 지금 단계에선 쭉 진행해주셔도 될 것 같아용!! 👍👍 고생하셨습니닷 최고최고,,,
There was a problem hiding this comment.
아 이거 확인햇는데 프리티어 이그노어에 안 들어잇는 파일들이 잇어서.. 이번 이슈에서 해결햇는데 파일 체인지가 46개 추가 되어서 두 분 pr 확인 하시면 머지하려고 대기 중입니다!
woneeeee
left a comment
There was a problem hiding this comment.
수고하셨습니다!! 어드민 타이포는 그대로 사용해도 따로 잘 적용이 되던가욤...?!!ㅎㅎ

✅ PR 유형
어떤 변경 사항이 있었나요?
📌 관련 이슈번호
✅ Key Changes
LNB컴포넌트 구현: 사이드 네비게이션 바 추가Header컴포넌트 구현: 현재 경로(usePathname)를 기반으로 페이지 제목 및 설명을 동적으로 표시하는 상단 헤더 추가mask-image로 렌더링하는NavIcon컴포넌트 구현 — 활성 상태에 따라 아이콘 색상(bg-brand-primary/bg-text-alternative) 전환📸 스크린샷 or 실행영상
🎸 기타 사항 or 추가 코멘트
NavIcon은 SVG를<img>가 아닌 마스크 방식으로 처리하므로, 향후 다크모드 대응 시 색상 토큰 교체만으로 아이콘 색 변경 가능Summary by CodeRabbit
새로운 기능