docs: add MVP demo frames#13
Conversation
|
Note Reviews pausedIt looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the Use the following commands to manage reviews:
Use the checkboxes below for quick actions:
📝 WalkthroughWalkthroughFlutter Widgetbook와 React Storybook에 7개의 MVP 화면 프레임(Ziggle 그룹/공지 상세/프로필, Potg 메인 리스트/검색 빈 상태/필터 다이얼로그/시간 선택)을 추가하고, 카드·버튼·다이얼로그·플로팅 버튼의 그림자 제거 및 반지름 확대, 버튼 아이콘 색상·크기 전달 메커니즘을 조정한다. ChangesMVP 프레임과 공통 시각 스타일 정렬
🎯 3 (Moderate) | ⏱️ ~25 minutes Possibly related PRs
Suggested reviewers
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ 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 |
There was a problem hiding this comment.
🧹 Nitpick comments (1)
packages/flutter/example/lib/components/mvp_frames_usecase.dart (1)
134-134: 💤 Low value탭 바 높이를 하드코딩하지 않는 것이 좋습니다.
49는IdsTabs의 탭 바 높이를 가정한 매직 넘버입니다. 탭 바 높이가 변경되면 레이아웃이 깨질 수 있습니다. 데모 코드이므로 현재 상태로도 동작하지만, 더 견고한 구현을 원한다면LayoutBuilder내부에서 탭 바의 실제 높이를 측정하거나 상수로 추출하는 것을 고려하세요.🤖 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 `@packages/flutter/example/lib/components/mvp_frames_usecase.dart` at line 134, Replace the hardcoded "49" used to compute panelHeight with a real tab-bar height value: either extract a named constant from the IdsTabs widget (e.g., IdsTabs.tabBarHeight) or measure the IdsTabs actual height inside the LayoutBuilder (assign a GlobalKey to the IdsTabs, read key.currentContext.size.height or RenderBox.size.height) and use that measured value in the panelHeight calculation instead of the magic number; update the code that computes panelHeight (where constraints.maxHeight - 49 is used) to reference the constant or measured variable.
🤖 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.
Nitpick comments:
In `@packages/flutter/example/lib/components/mvp_frames_usecase.dart`:
- Line 134: Replace the hardcoded "49" used to compute panelHeight with a real
tab-bar height value: either extract a named constant from the IdsTabs widget
(e.g., IdsTabs.tabBarHeight) or measure the IdsTabs actual height inside the
LayoutBuilder (assign a GlobalKey to the IdsTabs, read
key.currentContext.size.height or RenderBox.size.height) and use that measured
value in the panelHeight calculation instead of the magic number; update the
code that computes panelHeight (where constraints.maxHeight - 49 is used) to
reference the constant or measured variable.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: 97b99357-ec56-40c7-a5bc-ba58f3c183ac
📒 Files selected for processing (3)
packages/flutter/example/lib/components/mvp_frames_usecase.dartpackages/flutter/example/lib/main.dartpackages/flutter/lib/src/components/card/ids_card.dart
🚧 Files skipped from review as they are similar to previous changes (1)
- packages/flutter/example/lib/main.dart
There was a problem hiding this comment.
🧹 Nitpick comments (2)
packages/flutter/example/lib/components/mvp_frames_usecase.dart (2)
1311-1325: ⚡ Quick win다크 모드를 고려한 폴백 색상 개선이 필요합니다.
IconTheme이 제공되지 않을 때 하드코딩된 검정색(Color(0xFF000000))을 폴백으로 사용하고 있습니다. 다크 모드 환경에서는 검정색 배경에 검정색 아이콘이 렌더링되어 보이지 않을 수 있습니다.
ThemeProvider.of(context)를 통해 테마 색상(예:theme.onSurface)을 폴백으로 사용하는 것이 더 안전합니다.♻️ 테마 기반 폴백 색상 적용 제안
class _HugeIcon extends StatelessWidget { const _HugeIcon(this.icon); final List<List<dynamic>> icon; `@override` Widget build(BuildContext context) { final iconTheme = IconTheme.of(context); + final theme = ThemeProvider.of(context); return HugeIcon( icon: icon, - color: iconTheme.color ?? const Color(0xFF000000), + color: iconTheme.color ?? theme.onSurface, size: iconTheme.size ?? 24, ); } }🤖 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 `@packages/flutter/example/lib/components/mvp_frames_usecase.dart` around lines 1311 - 1325, The current _HugeIcon.build uses IconTheme.of(context) and falls back to a hardcoded Color(0xFF000000); change the fallback to use the app theme's onSurface color via ThemeProvider.of(context) so icons remain visible in dark mode: get theme = ThemeProvider.of(context) (or null-safe chain), then pass color: iconTheme.color ?? theme?.theme?.onSurface ?? const Color(0xFF000000) into the HugeIcon constructor (keep size fallback as-is) so IconTheme, ThemeProvider.of(context), theme.onSurface and HugeIcon are the referenced symbols to update.
838-847: ⚖️ Poor tradeoff
IdsText에 텍스트 오버플로우 지원 추가를 고려해보세요.경로 레이블에서 텍스트 말줄임 처리가 필요해
Text위젯을 직접 사용하고 있습니다. 이는 현재 작동하지만,IdsText가maxLines및overflow속성을 지원한다면 컴포넌트 추상화를 일관되게 유지할 수 있습니다.향후
IdsText에 이러한 속성을 추가하면 코드베이스 전반에서 일관된 텍스트 처리가 가능합니다.🤖 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 `@packages/flutter/example/lib/components/mvp_frames_usecase.dart` around lines 838 - 847, The Text here is using maxLines and overflow directly; add optional maxLines (int?) and overflow (TextOverflow?) parameters to the IdsText widget (in its constructor and class fields), ensure they are forwarded to the internal Text widget (preserving existing style merging and other props), and then replace this direct Text usage with IdsText(..., maxLines: 1, overflow: TextOverflow.ellipsis) so the component abstraction remains consistent (look for the IdsText class and this path label usage to update).
🤖 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.
Nitpick comments:
In `@packages/flutter/example/lib/components/mvp_frames_usecase.dart`:
- Around line 1311-1325: The current _HugeIcon.build uses IconTheme.of(context)
and falls back to a hardcoded Color(0xFF000000); change the fallback to use the
app theme's onSurface color via ThemeProvider.of(context) so icons remain
visible in dark mode: get theme = ThemeProvider.of(context) (or null-safe
chain), then pass color: iconTheme.color ?? theme?.theme?.onSurface ?? const
Color(0xFF000000) into the HugeIcon constructor (keep size fallback as-is) so
IconTheme, ThemeProvider.of(context), theme.onSurface and HugeIcon are the
referenced symbols to update.
- Around line 838-847: The Text here is using maxLines and overflow directly;
add optional maxLines (int?) and overflow (TextOverflow?) parameters to the
IdsText widget (in its constructor and class fields), ensure they are forwarded
to the internal Text widget (preserving existing style merging and other props),
and then replace this direct Text usage with IdsText(..., maxLines: 1, overflow:
TextOverflow.ellipsis) so the component abstraction remains consistent (look for
the IdsText class and this path label usage to update).
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: e9df3b3b-ff12-4e30-a999-9f9528f2a1fa
📒 Files selected for processing (4)
packages/flutter/example/lib/components/mvp_frames_usecase.dartpackages/flutter/example/lib/main.dartpackages/flutter/lib/src/components/empty/ids_empty.dartpackages/flutter/lib/src/components/floating_button/ids_floating_button.dart
💤 Files with no reviewable changes (1)
- packages/flutter/example/lib/main.dart
✅ Files skipped from review due to trivial changes (1)
- packages/flutter/lib/src/components/floating_button/ids_floating_button.dart
Summary
Test Plan
packages/flutter)packages/flutter/example)Summary by CodeRabbit
릴리스 노트
New Features
Style