-
Notifications
You must be signed in to change notification settings - Fork 0
[feature/#40] HomeHashtag 컴포넌트 구현 #41
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Changes from 3 commits
82caa39
2bda682
f155b8a
7f15b1f
d3cf5cc
529a724
7e03658
3c54f66
fe29abf
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,46 @@ | ||
| package com.gildongmu.dduru.presentation.feature.home.component | ||
|
|
||
| import androidx.compose.foundation.background | ||
| import androidx.compose.foundation.layout.Box | ||
| import androidx.compose.foundation.layout.padding | ||
| import androidx.compose.foundation.shape.RoundedCornerShape | ||
| import androidx.compose.material3.Text | ||
| import androidx.compose.runtime.Composable | ||
| import androidx.compose.ui.Alignment | ||
| import androidx.compose.ui.Modifier | ||
| import androidx.compose.ui.draw.clip | ||
| import androidx.compose.ui.tooling.preview.Preview | ||
| import androidx.compose.ui.unit.dp | ||
| import com.gildongmu.dduru.core.designsystem.theme.DduruTheme | ||
|
|
||
| @Composable | ||
| fun HomeHashtag( | ||
| text: String, | ||
| modifier: Modifier = Modifier | ||
| ) { | ||
| Box( | ||
| modifier = modifier | ||
| .clip(shape = RoundedCornerShape(size = 99.dp)) | ||
| .background(color = DduruTheme.colors.gray300.copy(alpha = 0.3f)) | ||
| .padding(horizontal = 12.dp, vertical = 8.dp), | ||
| contentAlignment = Alignment.Center | ||
| ) { | ||
| Text( | ||
| text = "#$text", | ||
| color = DduruTheme.colors.gray300, | ||
| style = DduruTheme.typography.Caption2 | ||
| ) | ||
| } | ||
| } | ||
|
|
||
| @Preview(name = "HomeHashtag - Default") | ||
| @Composable | ||
| private fun HomeHashtagDefaultPreview() { | ||
| HomeHashtag(text = "사진") | ||
| } | ||
|
|
||
| @Preview(name = "HomeHashtag - LongText") | ||
| @Composable | ||
| private fun HomeHashtagLongTextPreview() { | ||
| HomeHashtag(text = "카페투어") | ||
| } | ||
| Original file line number | Diff line number | Diff line change | ||||||||||||||||||||||||||||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| @@ -0,0 +1,54 @@ | ||||||||||||||||||||||||||||||||||||||||||
| package com.gildongmu.dduru.presentation.feature.home.component | ||||||||||||||||||||||||||||||||||||||||||
|
|
||||||||||||||||||||||||||||||||||||||||||
| import androidx.compose.foundation.clickable | ||||||||||||||||||||||||||||||||||||||||||
| import androidx.compose.foundation.layout.Arrangement | ||||||||||||||||||||||||||||||||||||||||||
| import androidx.compose.foundation.layout.Row | ||||||||||||||||||||||||||||||||||||||||||
| import androidx.compose.foundation.layout.fillMaxWidth | ||||||||||||||||||||||||||||||||||||||||||
| import androidx.compose.foundation.layout.padding | ||||||||||||||||||||||||||||||||||||||||||
| import androidx.compose.material.icons.Icons | ||||||||||||||||||||||||||||||||||||||||||
| import androidx.compose.material.icons.automirrored.filled.KeyboardArrowRight | ||||||||||||||||||||||||||||||||||||||||||
| import androidx.compose.material3.Icon | ||||||||||||||||||||||||||||||||||||||||||
| import androidx.compose.material3.Text | ||||||||||||||||||||||||||||||||||||||||||
| import androidx.compose.runtime.Composable | ||||||||||||||||||||||||||||||||||||||||||
| import androidx.compose.ui.Alignment | ||||||||||||||||||||||||||||||||||||||||||
| import androidx.compose.ui.Modifier | ||||||||||||||||||||||||||||||||||||||||||
| import androidx.compose.ui.tooling.preview.Preview | ||||||||||||||||||||||||||||||||||||||||||
| import androidx.compose.ui.unit.dp | ||||||||||||||||||||||||||||||||||||||||||
| import com.gildongmu.dduru.core.designsystem.theme.DduruTheme | ||||||||||||||||||||||||||||||||||||||||||
|
|
||||||||||||||||||||||||||||||||||||||||||
| @Composable | ||||||||||||||||||||||||||||||||||||||||||
| fun HomeSectionTrailingAction( | ||||||||||||||||||||||||||||||||||||||||||
| text: String, | ||||||||||||||||||||||||||||||||||||||||||
| onClick: () -> Unit, | ||||||||||||||||||||||||||||||||||||||||||
| modifier: Modifier = Modifier | ||||||||||||||||||||||||||||||||||||||||||
| ) { | ||||||||||||||||||||||||||||||||||||||||||
| Row( | ||||||||||||||||||||||||||||||||||||||||||
| modifier = modifier | ||||||||||||||||||||||||||||||||||||||||||
| .fillMaxWidth() | ||||||||||||||||||||||||||||||||||||||||||
| .clickable(onClick = onClick) | ||||||||||||||||||||||||||||||||||||||||||
| .padding(vertical = 4.dp), | ||||||||||||||||||||||||||||||||||||||||||
|
Comment on lines
+24
to
+27
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 🧩 Analysis chain🏁 Script executed: find . -name "HomeSectionTrailingAction.kt" -type fRepository: ddu-ru/ddu-ru-android Length of output: 169 🏁 Script executed: cat -n ./app/src/main/java/com/gildongmu/dduru/presentation/feature/home/component/HomeSectionTrailingAction.ktRepository: ddu-ru/ddu-ru-android Length of output: 2059 🏁 Script executed: # Check the design system theme to understand Body4 text style dimensions
fd -t f "theme" "app/src/main/java/com/gildongmu/dduru/core/designsystem" | head -20Repository: ddu-ru/ddu-ru-android Length of output: 135 🏁 Script executed: # Let's look at the Typography definitions to understand Body4 dimensions
rg "Body4|body4" app/src/main/java/com/gildongmu/dduru/core/designsystem -A 2 -B 2 -t ktRepository: ddu-ru/ddu-ru-android Length of output: 91 🏁 Script executed: cat -n app/src/main/java/com/gildongmu/dduru/core/designsystem/theme/Theme.kt | head -100Repository: ddu-ru/ddu-ru-android Length of output: 2492 🏁 Script executed: fd -t f "Typography" app/src/main/java/com/gildongmu/dduru/core/designsystem/typographyRepository: ddu-ru/ddu-ru-android Length of output: 47 🏁 Script executed: rg "Body4" app/src/main/java/com/gildongmu/dduru/core/designsystem -A 3 -B 1Repository: ddu-ru/ddu-ru-android Length of output: 1051 🏁 Script executed: cat -n app/src/main/java/com/gildongmu/dduru/core/designsystem/typography/Type.ktRepository: ddu-ru/ddu-ru-android Length of output: 5511 🏁 Script executed: # Check if there are any size/dimension constants defined for touch targets
rg "48.dp|minHeight|touchTarget" app/src/main/java/com/gildongmu/dduru --max-count 20Repository: ddu-ru/ddu-ru-android Length of output: 280 🏁 Script executed: # Check if there are any other similar components that define minimum touch target sizes
rg "sizeIn|minHeight|minWidth" app/src/main/java/com/gildongmu/dduru/presentation -A 1 -B 1 | head -40Repository: ddu-ru/ddu-ru-android Length of output: 47 🏁 Script executed: # Verify Material Design guidelines for touch targets by checking Android documentation context
# Also check if this component is used in a context where touch target size might be constrained
rg "HomeSectionTrailingAction" app/src/main/java/com/gildongmu/dduru/presentation -B 2 -A 2Repository: ddu-ru/ddu-ru-android Length of output: 1564 🏁 Script executed: # Check Icon default size in Material3
rg "Icon" app/src/main/java/com/gildongmu/dduru/presentation/feature/home/component/HomeSectionTrailingAction.kt -A 5Repository: ddu-ru/ddu-ru-android Length of output: 623 🏁 Script executed: # Verify how other clickable components in the app handle touch targets
fd "Button" app/src/main/java/com/gildongmu/dduru/core/designsystem/component -type fRepository: ddu-ru/ddu-ru-android Length of output: 235 🏁 Script executed: # Check the exact usage location of this component to see if it's constrained
rg "HomeSectionTrailingAction" app/src/main/java/com/gildongmu/dduru/presentation/feature/home -B 5 -A 5Repository: ddu-ru/ddu-ru-android Length of output: 3022 🏁 Script executed: # Verify Icon default size by checking Material3 documentation context in the codebase
rg "Icon\(" app/src/main/java/com/gildongmu/dduru --max-count 10 -A 3 | head -50Repository: ddu-ru/ddu-ru-android Length of output: 646 최소 터치 영역 48.dp를 보장하도록 명시하세요. 현재 코드에서 Row의 높이는 Body4 텍스트(약 17.6.sp 라인 높이)와 기본 아이콘 크기(24.dp)에 상하 패딩 8.dp만 더해져 약 32dp에 불과합니다. 이는 Material Design 3의 권장 최소 터치 영역 48.dp에 미치지 못합니다. 🔧 제안하는 수정 import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.sizeIn
...
Row(
modifier = modifier
+ .sizeIn(minHeight = 48.dp)
.clickable(onClick = onClick)
.padding(vertical = 4.dp),📝 Committable suggestion
Suggested change
🤖 Prompt for AI Agents
Collaborator
Author
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 굳이? |
||||||||||||||||||||||||||||||||||||||||||
| verticalAlignment = Alignment.CenterVertically, | ||||||||||||||||||||||||||||||||||||||||||
| horizontalArrangement = Arrangement.spacedBy(8.dp) | ||||||||||||||||||||||||||||||||||||||||||
| ) { | ||||||||||||||||||||||||||||||||||||||||||
| Text( | ||||||||||||||||||||||||||||||||||||||||||
| text = text, | ||||||||||||||||||||||||||||||||||||||||||
| style = DduruTheme.typography.Body4, | ||||||||||||||||||||||||||||||||||||||||||
| color = DduruTheme.colors.gray600 | ||||||||||||||||||||||||||||||||||||||||||
| ) | ||||||||||||||||||||||||||||||||||||||||||
|
|
||||||||||||||||||||||||||||||||||||||||||
| Icon( | ||||||||||||||||||||||||||||||||||||||||||
| imageVector = Icons.AutoMirrored.Filled.KeyboardArrowRight, | ||||||||||||||||||||||||||||||||||||||||||
| contentDescription = null, | ||||||||||||||||||||||||||||||||||||||||||
| tint = DduruTheme.colors.gray600 | ||||||||||||||||||||||||||||||||||||||||||
| ) | ||||||||||||||||||||||||||||||||||||||||||
|
Comment on lines
+37
to
+41
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 클릭 가능한 Row에 접근성(semantics) 레이블 누락
♿ 접근성 개선 제안 Row(
modifier = modifier
.fillMaxWidth()
- .clickable(onClick = onClick)
+ .clickable(
+ onClick = onClick,
+ onClickLabel = text
+ )
.padding(vertical = 4.dp),📝 Committable suggestion
Suggested change
🤖 Prompt for AI Agents |
||||||||||||||||||||||||||||||||||||||||||
| } | ||||||||||||||||||||||||||||||||||||||||||
| } | ||||||||||||||||||||||||||||||||||||||||||
|
|
||||||||||||||||||||||||||||||||||||||||||
| @Preview | ||||||||||||||||||||||||||||||||||||||||||
| @Composable | ||||||||||||||||||||||||||||||||||||||||||
| private fun HomeSectionTrailingActionPreview() { | ||||||||||||||||||||||||||||||||||||||||||
| HomeSectionTrailingAction( | ||||||||||||||||||||||||||||||||||||||||||
| text = "전체보기", | ||||||||||||||||||||||||||||||||||||||||||
| onClick = {} | ||||||||||||||||||||||||||||||||||||||||||
| ) | ||||||||||||||||||||||||||||||||||||||||||
coderabbitai[bot] marked this conversation as resolved.
Outdated
Show resolved
Hide resolved
|
||||||||||||||||||||||||||||||||||||||||||
| } | ||||||||||||||||||||||||||||||||||||||||||
Uh oh!
There was an error while loading. Please reload this page.