[FIX] 설정 태그 생성 개수 제한 추가#245
Merged
Merged
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Walkthrough커스텀 태그 최대 생성 수를 4개로 통합했습니다. 기본 태그를 제외해 한도를 검사하며, 초과 시 생성 흐름을 중단하고 동적 개수가 포함된 토스트를 표시합니다. Changes설정 커스텀 태그 제한
Estimated code review effort: 3 (Moderate) | ~20 minutes Possibly related PRs
Suggested labels: Suggested reviewers: 🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✨ Finishing Touches🧪 Generate unit tests (beta)
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. Comment |
Timo Performance ReportBundle Size — timo-web
Lighthouse — timo-web
Image Optimization — timo-web
측정 커밋: |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 2
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In
`@apps/timo-web/app/`[locale]/(main)/settings/_containers/account/SettingsTagsSectionContainer.tsx:
- Around line 62-69: Review the canAddTag condition in
SettingsTagsSectionContainer and keep the “태그 추가” PillButton rendered when the
custom-tag limit is reached. Ensure onAddTag remains responsible for showing the
limit-exceeded toast on click, while preserving the existing enabled behavior
when tags can still be added.
In
`@apps/timo-web/app/`[locale]/(main)/settings/_hooks/account/use-settings-profile.ts:
- Around line 30-31: 중복 선언된 MAX_SETTING_CUSTOM_TAG_COUNT를 단일 공유 상수로 통합하세요.
apps/timo-web/app/[locale]/(main)/settings/_hooks/account/use-settings-profile.ts:30-31에서는
해당 상자를 export하고,
apps/timo-web/app/[locale]/(main)/settings/_containers/account/SettingsTagsSectionContainer.tsx:14-15와
apps/timo-web/app/[locale]/(main)/settings/_containers/account/SettingsProfileContainer.tsx:13-14에서는
로컬 선언을 제거한 뒤 훅 파일의 상수를 import하여 사용하세요.
🪄 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 Plus
Run ID: 495d55a9-3864-4943-be44-a93eab92eb58
📒 Files selected for processing (5)
apps/timo-web/app/[locale]/(main)/settings/_containers/account/SettingsProfileContainer.tsxapps/timo-web/app/[locale]/(main)/settings/_containers/account/SettingsTagsSectionContainer.tsxapps/timo-web/app/[locale]/(main)/settings/_hooks/account/use-settings-profile.tsapps/timo-web/messages/en.jsonapps/timo-web/messages/ko.json
…to fix/web/242-setting-tag-count
ehye1
reviewed
Jul 16, 2026
ehye1
left a comment
ehye1
left a comment
Contributor
There was a problem hiding this comment.
현재 토스트가 뜨지 않아서 코드래빗 내용 한 번 확인해주세요!
…am-Timo/Timo-client into fix/web/242-setting-tag-count
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In
`@apps/timo-web/app/`[locale]/(main)/settings/_containers/account/SettingsProfileContainer.tsx:
- Around line 95-101: Remove the TagLimitToastContainer import and replace its
usage in SettingsProfileContainer with the already-used AnimatedToast,
preserving the isTagLimitToastOpen visibility state,
MAX_SETTING_CUSTOM_TAG_COUNT message/count, and close behavior via
setIsTagLimitToastOpen(false).
🪄 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 Plus
Run ID: 69e2a85a-a52f-407e-9822-3515a911aa3c
📒 Files selected for processing (7)
apps/timo-web/app/[locale]/(main)/(with-time-sidebar)/home/_containers/toast/TagLimitToastContainer.tsxapps/timo-web/app/[locale]/(main)/settings/_containers/account/SettingsProfileContainer.tsxapps/timo-web/app/[locale]/(main)/settings/_hooks/account/use-settings-profile.tsapps/timo-web/components/todo-modal/create/CreateTodoModalContent.tsxapps/timo-web/components/todo-modal/detail/DetailTodoModalContent.tsxapps/timo-web/messages/en.jsonapps/timo-web/messages/ko.json
Comment on lines
+95
to
+101
| {isTagLimitToastOpen && ( | ||
| <TagLimitToastContainer | ||
| count={MAX_SETTING_CUSTOM_TAG_COUNT} | ||
| onClose={() => setIsTagLimitToastOpen(false)} | ||
| /> | ||
| )} | ||
|
|
There was a problem hiding this comment.
📐 Maintainability & Code Quality | 🟠 Major | ⚡ Quick win
도메인 간 직접 임포트를 피하고 AnimatedToast를 직접 활용해 보세요!
home 도메인에 있는 TagLimitToastContainer를 settings 도메인에서 직접 가져와 사용하는 것은 도메인 간 강결합을 유발합니다. 아키텍처 규칙("도메인 간 직접 import 금지")에 위배되기도 해요.
대신 이 파일 하단에서 이미 사용 중인 AnimatedToast를 직접 활용해 토스트를 렌더링하는 것을 추천합니다. 이렇게 하면 상태(state)가 이중으로 관리되는 문제도 예방할 수 있어 코드가 훨씬 깔끔해진답니다. React 공식 문서의 컴포넌트 독립성 유지를 참고해 보세요! ✨
♻️ 도메인 의존성을 제거하는 수정 제안
- {isTagLimitToastOpen && (
- <TagLimitToastContainer
- count={MAX_SETTING_CUSTOM_TAG_COUNT}
- onClose={() => setIsTagLimitToastOpen(false)}
- />
- )}
+ <AnimatedToast
+ isOpen={isTagLimitToastOpen}
+ onClose={() => setIsTagLimitToastOpen(false)}
+ message={
+ <p className="mb-0">
+ {tToast.rich("tagLimit", {
+ count: MAX_SETTING_CUSTOM_TAG_COUNT,
+ blue: (chunks) => (
+ <span className="text-timo-blue-300">{chunks}</span>
+ ),
+ })}
+ </p>
+ }
+ />파일 상단의 TagLimitToastContainer 임포트도 함께 제거해 주세요:
// 7번 라인의 다음 코드를 삭제합니다.
import { TagLimitToastContainer } from "`@/app/`[locale]/(main)/(with-time-sidebar)/home/_containers/toast/TagLimitToastContainer";🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In
`@apps/timo-web/app/`[locale]/(main)/settings/_containers/account/SettingsProfileContainer.tsx
around lines 95 - 101, Remove the TagLimitToastContainer import and replace its
usage in SettingsProfileContainer with the already-used AnimatedToast,
preserving the isTagLimitToastOpen visibility state,
MAX_SETTING_CUSTOM_TAG_COUNT message/count, and close behavior via
setIsTagLimitToastOpen(false).
Source: Path instructions
There was a problem hiding this comment.
♻️ Duplicate comments (1)
apps/timo-web/app/[locale]/(main)/settings/_containers/account/SettingsProfileContainer.tsx (1)
93-96: 📐 Maintainability & Code Quality | 🟠 Major | ⚡ Quick win도메인 간 직접 임포트를 피하고
AnimatedToast를 일관되게 활용해 보세요!이전 리뷰에서도 안내해 드렸듯이,
home도메인의TagLimitToastContainer를 다른 도메인(settings,todo-modal등)에서 임포트하여 사용하는 것은 도메인 간 강결합을 유발합니다. 또한 토스트를&&로 조건부 렌더링하면 부모와 자식 컴포넌트 간에isOpen상태 관리가 이중으로 발생하여 일관된 사용 패턴을 해치게 됩니다.기존 코드의 에러 토스트처럼 각 컴포넌트 내부에서
AnimatedToast를 직접 렌더링해 보세요. 상태 관리가 단일화되고 애니메이션 종료 처리도 훨씬 자연스러워집니다. React 공식 문서의 컴포넌트 독립성 유지도 참고해 보세요! ✨
apps/timo-web/app/[locale]/(main)/settings/_containers/account/SettingsProfileContainer.tsx#L93-L96:TagLimitToastContainer임포트 및 조건부 렌더링을 제거하고,AnimatedToast를 직접 렌더링하세요.apps/timo-web/components/todo-modal/create/CreateTodoModalContent.tsx#L218-L220:TagLimitToastContainer대신MAX_CUSTOM_TAG_COUNT를 임포트하고,AnimatedToast를 사용해 토스트를 렌더링하세요.apps/timo-web/components/todo-modal/detail/DetailTodoModalContent.tsx#L296-L298:TagLimitToastContainer대신MAX_CUSTOM_TAG_COUNT를 임포트하고,AnimatedToast를 사용해 토스트를 렌더링하세요.As per path instructions, ensure the toast component and any state/interaction logic live in the appropriate container/hook layer within the same domain path rather than being placed in unrelated global locations.
💡 `AnimatedToast` 적용 예시 (SettingsProfileContainer 기준)
- {isTagLimitToastOpen && ( - <TagLimitToastContainer onClose={() => setIsTagLimitToastOpen(false)} /> - )} + <AnimatedToast + isOpen={isTagLimitToastOpen} + onClose={() => setIsTagLimitToastOpen(false)} + message={ + <p className="mb-0"> + {tToast.rich("tagLimit", { + count: MAX_CUSTOM_TAG_COUNT, + blue: (chunks) => ( + <span className="text-timo-blue-300">{chunks}</span> + ), + })} + </p> + } + />🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@apps/timo-web/app/`[locale]/(main)/settings/_containers/account/SettingsProfileContainer.tsx around lines 93 - 96, Remove the cross-domain TagLimitToastContainer imports and conditional rendering, and render AnimatedToast directly with single-source isOpen/onClose state handling. In apps/timo-web/app/[locale]/(main)/settings/_containers/account/SettingsProfileContainer.tsx lines 93-96, update SettingsProfileContainer accordingly; in apps/timo-web/components/todo-modal/create/CreateTodoModalContent.tsx lines 218-220 and apps/timo-web/components/todo-modal/detail/DetailTodoModalContent.tsx lines 296-298, replace TagLimitToastContainer with AnimatedToast and import MAX_CUSTOM_TAG_COUNT for the existing limit message. Keep each toast’s state and interaction logic within its respective component or hook layer.Source: Path instructions
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Duplicate comments:
In
`@apps/timo-web/app/`[locale]/(main)/settings/_containers/account/SettingsProfileContainer.tsx:
- Around line 93-96: Remove the cross-domain TagLimitToastContainer imports and
conditional rendering, and render AnimatedToast directly with single-source
isOpen/onClose state handling. In
apps/timo-web/app/[locale]/(main)/settings/_containers/account/SettingsProfileContainer.tsx
lines 93-96, update SettingsProfileContainer accordingly; in
apps/timo-web/components/todo-modal/create/CreateTodoModalContent.tsx lines
218-220 and
apps/timo-web/components/todo-modal/detail/DetailTodoModalContent.tsx lines
296-298, replace TagLimitToastContainer with AnimatedToast and import
MAX_CUSTOM_TAG_COUNT for the existing limit message. Keep each toast’s state and
interaction logic within its respective component or hook layer.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: ASSERTIVE
Plan: Pro Plus
Run ID: 64505dee-92e7-4c2a-9b7a-00f7f70ea229
📒 Files selected for processing (7)
apps/timo-web/app/[locale]/(main)/(with-time-sidebar)/home/_containers/toast/TagLimitToastContainer.tsxapps/timo-web/app/[locale]/(main)/settings/_containers/account/SettingsProfileContainer.tsxapps/timo-web/app/[locale]/(main)/settings/_hooks/account/use-settings-profile.tsapps/timo-web/components/todo-modal/create/CreateTodoModalContent.tsxapps/timo-web/components/todo-modal/detail/DetailTodoModalContent.tsxapps/timo-web/hooks/todo-modal/common/use-tag-field.tsxapps/timo-web/schemas/tag/tag-schema.ts
5 tasks
Merged
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
3 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
ISSUE 🔗
close #242
What is this PR? 🔍
설정 화면에서 사용자 생성 태그가 최대 4개까지만 생성되도록 제한했습니다.
To Reviewers
기본 태그는 삭제할 수 없는 태그라서, 최대 생성 개수는
isDefault === false인 사용자 생성 태그 기준으로 계산했습니다.Screenshot 📷
Test Checklist ✔
pnpm lint:web를 통과했습니다pnpm check-types:web를 통과했습니다