Skip to content

[feat/#14] Community UI #15

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.

Sign up for GitHub

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

Merged
vvan2 merged 8 commits into from
Nov 1, 2025
Merged

[feat/#14] Community UI #15

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
ac5e753
feat/#14: Navigation 수정
vvan2 Nov 1, 2025
f56cbb6
feat/#14: asset,패키징
vvan2 Nov 1, 2025
d6f7346
feat/#14: 공통 컴포넌트 수정
vvan2 Nov 1, 2025
88fd6bb
feat/#14: community component
vvan2 Nov 1, 2025
16e97b7
feat/#14: community/post component
vvan2 Nov 1, 2025
39902ed
feat/#14: community/write component
vvan2 Nov 1, 2025
0674e78
feat/#14: community navigation
vvan2 Nov 1, 2025
ae6a5a2
feat/#14: community screen
vvan2 Nov 1, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
24 changes: 24 additions & 0 deletions .idea/caches/deviceStreaming.xml
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

4 changes: 0 additions & 4 deletions app/src/main/java/com/hsLink/hslink/core/DummyComponent.kt
View file
Open in desktop

This file was deleted.

Empty file removed app/src/main/java/com/hsLink/hslink/core/designsystem/.gitkeep
View file
Open in desktop
Empty file.
110 changes: 110 additions & 0 deletions app/src/main/java/com/hsLink/hslink/core/designsystem/component/HsLinkDialog.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,110 @@
package com.hsLink.hslink.core.designsystem.component

import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import androidx.compose.ui.window.Dialog
import com.hsLink.hslink.core.designsystem.theme.HsLinkTheme
import com.hsLink.hslink.core.util.noRippleClickable

@Composable
fun HsLinkDialog(
title: String,
message: String,
confirmText: String,
dismissText: String,
onConfirm: () -> Unit,
onDismiss: () -> Unit,
modifier: Modifier = Modifier,
) {
Dialog(onDismissRequest = onDismiss) {
Column(
modifier = modifier
.fillMaxWidth()
.background(
color = HsLinkTheme.colors.Common,
shape = RoundedCornerShape(12.dp)
)
.padding(24.dp),
verticalArrangement = Arrangement.spacedBy(16.dp)
) {
Text(
text = title,
color = HsLinkTheme.colors.Grey700,
style = HsLinkTheme.typography.title_20Strong
)

Text(
text = message,
color = HsLinkTheme.colors.Grey500,
style = HsLinkTheme.typography.body_14Normal
)

Row(
modifier = Modifier.fillMaxWidth(),
horizontalArrangement = Arrangement.Center
) {
Box(
modifier = Modifier
.background(
color = HsLinkTheme.colors.Grey100,
shape = RoundedCornerShape(8.dp)
)
.noRippleClickable(onClick = onDismiss)
.padding(vertical = 12.dp, horizontal = 40.dp)
) {
Text(
text = dismissText,
color = HsLinkTheme.colors.Grey500,
style = HsLinkTheme.typography.btm_M,
)
}

Spacer(modifier = Modifier.width(8.dp))

Box(
modifier = Modifier
.background(
color = HsLinkTheme.colors.DeepBlue500,
shape = RoundedCornerShape(8.dp)
)
.noRippleClickable(onClick = onConfirm)
.padding(vertical = 12.dp, horizontal = 40.dp)
) {
Text(
text = confirmText,
color = HsLinkTheme.colors.Common,
style = HsLinkTheme.typography.btm_M,
)
}
}
Comment on lines +55 to +92
Copy link

@coderabbitai coderabbitai bot Nov 1, 2025

Choose a reason for hiding this comment

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

🛠️ Refactor suggestion | 🟠 Major

🧩 Analysis chain

Verify touch target sizes meet accessibility guidelines.

The action buttons use 12.dp vertical padding. Depending on the btm_M typography's line height, the total touch target might fall short of the recommended 48dp minimum for accessibility.

Additionally, consider adding semantic properties to improve accessibility support, such as content descriptions or button roles.

Run the following script to check the btm_M typography definition and verify the touch target will be sufficient:

Alternatively, consider using Material3 Button or TextButton components, which provide built-in accessibility features and proper touch target sizing.

🏁 Script executed:

#!/bin/bash
# Find the btm_M typography definition to verify line height and size
ast-grep --pattern 'btm_M = TextStyle($$$)'

Length of output: 0

🏁 Script executed:

#!/bin/bash
# Search for btm_M definition in the codebase
rg -n 'btm_M' --type=kt -C3

Length of output: 26

🏁 Script executed:

#!/bin/bash
# Search for Typography or TextStyle definitions
rg -n 'object.*[Tt]ypography|val.*[Tt]ypography' --type=kt -A5 | head -50

Length of output: 26

🏁 Script executed:

#!/bin/bash
# Find HsLinkTheme definition to understand the design system
fd -e 'kt' -x rg -l 'HsLinkTheme' | head -10

Length of output: 925

🏁 Script executed:

#!/bin/bash
# Search for btm_M definition without file type restriction
rg -n 'btm_M' app/src/main/java/com/hsLink/hslink/core/designsystem/ -C3

Length of output: 3809

🏁 Script executed:

#!/bin/bash
# Find theme or typography related files in designsystem
fd 'theme|typography|style' app/src/main/java/com/hsLink/hslink/core/designsystem/ -type f

Length of output: 170

🏁 Script executed:

#!/bin/bash
# Search for HsLinkTheme definition
rg -n 'object HsLinkTheme|class HsLinkTheme' app/src/main/java/com/hsLink/hslink/core/designsystem/ -C5

Length of output: 1108

🏁 Script executed:

#!/bin/bash
# Get complete btm_M definition from Type.kt
rg -n 'btm_M = TextStyle' app/src/main/java/com/hsLink/hslink/core/designsystem/theme/Type.kt -A6

Length of output: 229

Action buttons fall short of accessibility touch target minimum.

The button height is approximately 46.dp (22.sp lineHeight from btm_M + 24.dp vertical padding), which is 2.dp below the recommended 48.dp minimum touch target size per Material Design accessibility guidelines.

Consider either increasing vertical padding to 13.dp (making total height ~48.dp) or switching to Material3 Button or TextButton components, which provide built-in accessibility features and proper touch target sizing.

🤖 Prompt for AI Agents 
In
app/src/main/java/com/hsLink/hslink/core/designsystem/component/HsLinkDialog.kt
around lines 55-92 the custom action button boxes produce an approximate 46.dp
height which is below the 48.dp accessibility touch target; either increase the
vertical padding to 13.dp for both action boxes (so total height ≈48.dp) or
replace the Box+Text combos with Material3 Button/TextButton components (or
apply Modifier.minimumInteractiveComponentSize(48.dp)) to ensure the touch
target meets 48.dp while preserving current colors, shapes and typography.

}
}
}

@Preview(showBackground = true)
@Composable
private fun HsLinkDialogPreview() {
HsLinkTheme {
HsLinkDialog(
title = "글쓰기를 종료하시겠습니까?",
message = "작성 중인 내용이 저장되지 않습니다.",
confirmText = "나가기",
dismissText = "취소하기",
onConfirm = {},
onDismiss = {}
)
}
}
12 changes: 7 additions & 5 deletions app/src/main/java/com/hsLink/hslink/core/designsystem/component/HsLinkTextField.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -93,11 +93,13 @@ fun HsLinkTextField(
)
}
}
Icon(
imageVector = ImageVector.vectorResource(id = leadingIconRes ?: 0),
contentDescription = null,
tint = Color.Unspecified
)
leadingIconRes?.let { iconRes ->
Icon(
imageVector = ImageVector.vectorResource(id = iconRes),
contentDescription = null,
tint = Color.Unspecified
)
}
}
}
)
Expand Down
13 changes: 10 additions & 3 deletions app/src/main/java/com/hsLink/hslink/core/designsystem/component/HsLinkTopBar.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@ import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import com.hsLink.hslink.R
import com.hsLink.hslink.core.designsystem.theme.HsLinkTheme
import com.hsLink.hslink.core.util.noRippleClickable

@Composable
fun HsLinkTopBar(
Expand All @@ -25,6 +26,9 @@ fun HsLinkTopBar(
@DrawableRes rightIconFirst: Int? = null,
@DrawableRes rightIconSecond: Int? = null,
@DrawableRes leftIcon: Int? = null,
onRightIconFirstClick: () -> Unit = {},
onRightIconSecondClick: () -> Unit = {},
onLeftIconClick: () -> Unit = {}
) {
Row(
modifier = modifier
Expand All @@ -36,7 +40,8 @@ fun HsLinkTopBar(
leftIcon?.let {
Icon(
imageVector = ImageVector.vectorResource(id = it),
contentDescription = "leftIcon"
contentDescription = "leftIcon",
modifier = Modifier.noRippleClickable(onClick = onLeftIconClick)
)
}

Expand All @@ -47,14 +52,16 @@ fun HsLinkTopBar(
rightIconFirst?.let {
Icon(
imageVector = ImageVector.vectorResource(id = it),
contentDescription = "rightIconFirst"
contentDescription = "rightIconFirst",
modifier = Modifier.noRippleClickable(onClick = onRightIconFirstClick)
)
}

rightIconSecond?.let {
Icon(
imageVector = ImageVector.vectorResource(id = it),
contentDescription = "rightIconSecond"
contentDescription = "rightIconSecond",
modifier = Modifier.noRippleClickable(onClick = onRightIconSecondClick)
)
}
}
Expand Down
21 changes: 21 additions & 0 deletions app/src/main/java/com/hsLink/hslink/data/local/PostDetail.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
package com.hsLink.hslink.data.local

data class PostDetail(
val id: String,
val authorName: String,
val authorMajor: String,
val boardType: String,
val timeAgo: String,
val title: String,
val content: String,
val isMyPost: Boolean,
val comments: List<Comment>
)

data class Comment(
val id: String,
val authorName: String,
val timeAgo: String,
val content: String,
val isMyComment: Boolean
)
27 changes: 0 additions & 27 deletions app/src/main/java/com/hsLink/hslink/presentation/community/CommunityScreen.kt
View file
Open in desktop

This file was deleted.

93 changes: 93 additions & 0 deletions app/src/main/java/com/hsLink/hslink/presentation/community/component/main/CommentItem.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,93 @@
package com.hsLink.hslink.presentation.community.component

import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
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.graphics.Color
import androidx.compose.ui.graphics.vector.ImageVector
import androidx.compose.ui.res.vectorResource
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import com.hsLink.hslink.R
import com.hsLink.hslink.core.designsystem.theme.HsLinkTheme
import com.hsLink.hslink.core.util.noRippleClickable

@Composable
fun CommentItem(
authorName: String,
timeAgo: String,
content: String,
isMyComment: Boolean,
onDeleteClick: () -> Unit,
modifier: Modifier = Modifier
) {
Row(
modifier = modifier
.fillMaxWidth()
.padding(horizontal = 16.dp, vertical = 12.dp),
horizontalArrangement = Arrangement.SpaceBetween,
verticalAlignment = Alignment.Top
) {
Column(
modifier = Modifier.weight(1f),
verticalArrangement = Arrangement.spacedBy(4.dp)
) {
Row(
horizontalArrangement = Arrangement.spacedBy(8.dp),
verticalAlignment = Alignment.CenterVertically
) {
Text(
text = authorName,
color = HsLinkTheme.colors.Grey700,
style = HsLinkTheme.typography.title_14Strong
)

Text(
text = timeAgo,
color = HsLinkTheme.colors.Grey400,
style = HsLinkTheme.typography.caption_12Normal
)
}

Text(
text = content,
color = HsLinkTheme.colors.Grey600,
style = HsLinkTheme.typography.body_14Normal
)
}

if (isMyComment) {
Icon(
imageVector = ImageVector.vectorResource(id = R.drawable.ic_community_kebab),
contentDescription = "댓글 삭제",
tint = Color.Unspecified,
modifier = Modifier
.size(24.dp)
.noRippleClickable(onClick = onDeleteClick)
)
}
}
}

@Preview(showBackground = true)
@Composable
private fun CommentItemPreview() {
HsLinkTheme {
CommentItem(
authorName = "송효재",
timeAgo = "21학번",
content = "자소서 어떻게 작성하셨나요? 주로 보는 인재상이 있는지 궁금합니다.",
isMyComment = true,
onDeleteClick = {}
)
}
}
Loading