Lemmy/Raccoon
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

enhancement: text formatting and comment layout (#87)

Browse Source 
* enhancement: better selection and cursor handling in text formatting

* enhancement: comment card spacing
This commit is contained in:
Diego Beraldin 2023-10-29 22:03:04 +01:00 committed by GitHub
parent e85ed03be8
commit f8250b31d2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 105 additions and 101 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
core-commonui/src/commonMain/kotlin/com/github/diegoberaldin/raccoonforlemmy/core/commonui/components/CollapsedCommentCard.kt
View File

@ -97,7 +97,7 @@ fun CollapsedCommentCard(
} }
Box( Box(
modifier = Modifier modifier = Modifier
.padding(top = Spacing.xs) .padding(top = Spacing.xxs)
.width(barWidth) .width(barWidth)
.height(commentHeight.toLocalDp()) .height(commentHeight.toLocalDp())
.background(color = barColor) .background(color = barColor)

10
core-commonui/src/commonMain/kotlin/com/github/diegoberaldin/raccoonforlemmy/core/commonui/components/CommentCard.kt
View File

@ -15,7 +15,6 @@ import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue import androidx.compose.runtime.setValue
import androidx.compose.ui.Modifier import androidx.compose.ui.Modifier
import androidx.compose.ui.layout.onGloballyPositioned import androidx.compose.ui.layout.onGloballyPositioned
import androidx.compose.ui.unit.Dp
import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.toSize import androidx.compose.ui.unit.toSize
import com.github.diegoberaldin.raccoonforlemmy.core.appearance.di.getThemeRepository import com.github.diegoberaldin.raccoonforlemmy.core.appearance.di.getThemeRepository
@ -78,7 +77,6 @@ fun CommentCard(
} }
) { ) {
CommunityAndCreatorInfo( CommunityAndCreatorInfo(
modifier = Modifier.padding(top = Spacing.xs),
iconSize = 20.dp, iconSize = 20.dp,
creator = comment.creator.takeIf { !hideAuthor }, creator = comment.creator.takeIf { !hideAuthor },
community = comment.community.takeIf { !hideCommunity }, community = comment.community.takeIf { !hideCommunity },
@ -117,18 +115,12 @@ fun CommentCard(
if (!hideIndent) { if (!hideIndent) {
Box( Box(
modifier = Modifier modifier = Modifier
.padding(top = Spacing.xs) .padding(top = Spacing.xxs)
.width(barWidth) .width(barWidth)
.height(commentHeight.toLocalDp()) .height(commentHeight.toLocalDp())
.background(color = barColor) .background(color = barColor)
) )
} }
} }
Box(
modifier = Modifier
.height(Dp.Hairline)
.fillMaxWidth()
.background(MaterialTheme.colorScheme.background)
)
} }
} }

93
core-commonui/src/commonMain/kotlin/com/github/diegoberaldin/raccoonforlemmy/core/commonui/components/TextFormattingBar.kt
View File

@ -32,15 +32,6 @@ fun TextFormattingBar(
Icon( Icon(
modifier = Modifier.onClick { modifier = Modifier.onClick {
val selection = textFieldValue.selection val selection = textFieldValue.selection
if (selection.length == 0) {
val newValue = textFieldValue.let {
it.copy(
text = it.text + "****",
selection = TextRange(it.text.length + 2),
)
}
onTextFieldValueChanged(newValue)
} else {
val newValue = textFieldValue.let { val newValue = textFieldValue.let {
val newText = buildString { val newText = buildString {
append(it.text.substring(0, selection.start)) append(it.text.substring(0, selection.start))
@ -59,10 +50,14 @@ fun TextFormattingBar(
) )
) )
} }
it.copy(text = newText) val newSelection = if (selection.length == 0) {
TextRange(index = selection.start + 2)
} else {
TextRange(start = it.selection.start + 2, end = it.selection.end + 2)
}
it.copy(text = newText, selection = newSelection)
} }
onTextFieldValueChanged(newValue) onTextFieldValueChanged(newValue)
}
}, },
imageVector = Icons.Default.FormatBold, imageVector = Icons.Default.FormatBold,
contentDescription = null, contentDescription = null,
@ -70,15 +65,6 @@ fun TextFormattingBar(
Icon( Icon(
modifier = Modifier.onClick { modifier = Modifier.onClick {
val selection = textFieldValue.selection val selection = textFieldValue.selection
if (selection.length == 0) {
val newValue = textFieldValue.let {
it.copy(
text = it.text + "**",
selection = TextRange(it.text.length + 1),
)
}
onTextFieldValueChanged(newValue)
} else {
val newValue = textFieldValue.let { val newValue = textFieldValue.let {
val newText = buildString { val newText = buildString {
append(it.text.substring(0, selection.start)) append(it.text.substring(0, selection.start))
@ -97,10 +83,14 @@ fun TextFormattingBar(
) )
) )
} }
it.copy(text = newText) val newSelection = if (selection.length == 0) {
TextRange(index = selection.start + 1)
} else {
TextRange(start = it.selection.start + 1, end = it.selection.end + 1)
}
it.copy(text = newText, selection = newSelection)
} }
onTextFieldValueChanged(newValue) onTextFieldValueChanged(newValue)
}
}, },
imageVector = Icons.Default.FormatItalic, imageVector = Icons.Default.FormatItalic,
contentDescription = null, contentDescription = null,
@ -108,15 +98,6 @@ fun TextFormattingBar(
Icon( Icon(
modifier = Modifier.onClick { modifier = Modifier.onClick {
val selection = textFieldValue.selection val selection = textFieldValue.selection
if (selection.length == 0) {
val newValue = textFieldValue.let {
it.copy(
text = it.text + "~~~~",
selection = TextRange(it.text.length + 2),
)
}
onTextFieldValueChanged(newValue)
} else {
val newValue = textFieldValue.let { val newValue = textFieldValue.let {
val newText = buildString { val newText = buildString {
append(it.text.substring(0, selection.start)) append(it.text.substring(0, selection.start))
@ -135,10 +116,14 @@ fun TextFormattingBar(
) )
) )
} }
it.copy(text = newText) val newSelection = if (selection.length == 0) {
TextRange(index = selection.start + 2)
} else {
TextRange(start = it.selection.start + 2, end = it.selection.end + 2)
}
it.copy(text = newText, selection = newSelection)
} }
onTextFieldValueChanged(newValue) onTextFieldValueChanged(newValue)
}
}, },
imageVector = Icons.Default.FormatStrikethrough, imageVector = Icons.Default.FormatStrikethrough,
contentDescription = null, contentDescription = null,
@ -153,10 +138,18 @@ fun TextFormattingBar(
Icon( Icon(
modifier = Modifier.onClick { modifier = Modifier.onClick {
val newValue = textFieldValue.let { val newValue = textFieldValue.let {
it.copy( val selection = it.selection
text = it.text + "[](url)", val newText = buildString {
selection = TextRange(it.text.length + 1), append(it.text.substring(0, selection.start))
append(" [](url)")
append(
it.text.substring(
selection.end,
it.text.length
) )
)
}
it.copy(text = newText, selection = TextRange(index = selection.start + 2))
} }
onTextFieldValueChanged(newValue) onTextFieldValueChanged(newValue)
}, },
@ -166,10 +159,30 @@ fun TextFormattingBar(
Icon( Icon(
modifier = Modifier.onClick { modifier = Modifier.onClick {
val newValue = textFieldValue.let { val newValue = textFieldValue.let {
it.copy( val selection = it.selection
text = it.text + "``", val newText = buildString {
selection = TextRange(it.text.length + 1), append(it.text.substring(0, selection.start))
append("`")
append(
it.text.substring(
selection.start,
selection.end
) )
)
append("`")
append(
it.text.substring(
selection.end,
it.text.length
)
)
}
val newSelection = if (selection.length == 0) {
TextRange(index = selection.start + 1)
} else {
TextRange(start = it.selection.start + 1, end = it.selection.end + 1)
}
it.copy(text = newText, selection = newSelection)
} }
onTextFieldValueChanged(newValue) onTextFieldValueChanged(newValue)
}, },
@ -181,7 +194,7 @@ fun TextFormattingBar(
val newValue = textFieldValue.let { val newValue = textFieldValue.let {
it.copy( it.copy(
text = it.text + "\n> ", text = it.text + "\n> ",
selection = TextRange(it.text.length + 3), selection = TextRange(index = it.text.length + 3),
) )
} }
onTextFieldValueChanged(newValue) onTextFieldValueChanged(newValue)

1
core-commonui/src/commonMain/kotlin/com/github/diegoberaldin/raccoonforlemmy/core/commonui/postdetail/PostDetailScreen.kt
View File

@ -666,7 +666,6 @@ class PostDetailScreen(
} else { } else {
CollapsedCommentCard( CollapsedCommentCard(
comment = comment, comment = comment,
modifier = Modifier.padding(vertical = Spacing.xs),
onToggleExpanded = { onToggleExpanded = {
model.reduce( model.reduce(
PostDetailMviModel.Intent.ToggleExpandComment( PostDetailMviModel.Intent.ToggleExpandComment(