diff --git a/gravatar-ui/src/main/java/com/gravatar/ui/components/atomic/AboutMe.kt b/gravatar-ui/src/main/java/com/gravatar/ui/components/atomic/AboutMe.kt index c7b61e62..8c196e98 100644 --- a/gravatar-ui/src/main/java/com/gravatar/ui/components/atomic/AboutMe.kt +++ b/gravatar-ui/src/main/java/com/gravatar/ui/components/atomic/AboutMe.kt @@ -1,7 +1,9 @@ package com.gravatar.ui.components.atomic +import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier +import androidx.compose.ui.text.style.TextOverflow import androidx.compose.ui.tooling.preview.Preview import com.gravatar.api.models.UserProfile @@ -10,19 +12,27 @@ import com.gravatar.api.models.UserProfile * * @param profile The user's profile information * @param modifier Composable modifier - * @param maxLines The maximum number of lines to display before truncating the text - * @param dialogContent The content to display in a dialog when the truncated text is clicked + * @param content Composable to display the user's about me description */ @Composable public fun AboutMe( profile: UserProfile, modifier: Modifier = Modifier, - maxLines: Int = 2, - dialogContent: @Composable ((String) -> Unit)? = { DefaultDialogContent(text = it) }, + content: @Composable ((String, Modifier) -> Unit) = { userInfo, contentModifier -> + AboutMeDefaultContent(userInfo, contentModifier) + }, ) { - ExpandableText(profile.aboutMe.orEmpty(), modifier, maxLines, dialogContent) + content(profile.aboutMe.orEmpty(), modifier) } +@Composable +private fun AboutMeDefaultContent(userInfo: String, modifier: Modifier) = Text( + userInfo, + modifier = modifier, + maxLines = 2, + overflow = TextOverflow.Ellipsis, +) + @Preview @Composable private fun AboutMePreview() { diff --git a/gravatar-ui/src/main/java/com/gravatar/ui/components/atomic/ExpandableText.kt b/gravatar-ui/src/main/java/com/gravatar/ui/components/atomic/ExpandableText.kt deleted file mode 100644 index 7fbd80cb..00000000 --- a/gravatar-ui/src/main/java/com/gravatar/ui/components/atomic/ExpandableText.kt +++ /dev/null @@ -1,99 +0,0 @@ -package com.gravatar.ui.components.atomic - -import androidx.compose.foundation.clickable -import androidx.compose.foundation.layout.Row -import androidx.compose.foundation.layout.fillMaxWidth -import androidx.compose.foundation.layout.padding -import androidx.compose.foundation.layout.wrapContentSize -import androidx.compose.foundation.shape.RoundedCornerShape -import androidx.compose.material3.Card -import androidx.compose.material3.Icon -import androidx.compose.material3.Text -import androidx.compose.runtime.Composable -import androidx.compose.runtime.getValue -import androidx.compose.runtime.mutableStateOf -import androidx.compose.runtime.remember -import androidx.compose.runtime.setValue -import androidx.compose.ui.Modifier -import androidx.compose.ui.res.painterResource -import androidx.compose.ui.text.style.TextAlign -import androidx.compose.ui.text.style.TextOverflow -import androidx.compose.ui.tooling.preview.Preview -import androidx.compose.ui.unit.dp -import androidx.compose.ui.window.Dialog -import com.gravatar.ui.R - -@Composable -internal fun ExpandableText( - text: String, - modifier: Modifier = Modifier, - maxLines: Int = 2, - dialogContent: @Composable ((String) -> Unit)? = { DefaultDialogContent(it) }, -) { - var showDialog by remember { mutableStateOf(false) } - var clickableText by remember { mutableStateOf(false) } - - Text( - text = text, - modifier = modifier.clickable(enabled = clickableText) { - showDialog = true - }, - maxLines = maxLines, - onTextLayout = { textLayoutResult -> - clickableText = textLayoutResult.hasVisualOverflow - }, - overflow = TextOverflow.Ellipsis, - ) - if (showDialog) { - Dialog(onDismissRequest = { showDialog = false }) { - dialogContent?.invoke(text) - } - } -} - -/** - * Default dialog content for the [ExpandableText] composable. - * - * @param text The original text to be expanded in the dialog - */ -@Composable -public fun DefaultDialogContent(text: String) { - Card( - modifier = Modifier.wrapContentSize(), - shape = RoundedCornerShape(16.dp), - ) { - Text( - text = text, - modifier = Modifier - .padding(16.dp) - .fillMaxWidth() - .wrapContentSize(), - textAlign = TextAlign.Start, - ) - } -} - -@Preview -@Composable -private fun ExpandableTextPreview() { - ExpandableText("Text that \ncan be expanded \nby clicking on it.") -} - -@Preview -@Composable -private fun ExpandableTextPreviewWithDialogContent() { - ExpandableText("Text that \ncan be expanded \nby clicking on it.") { text -> - Card( - modifier = Modifier.wrapContentSize(), - shape = RoundedCornerShape(16.dp), - ) { - Row(modifier = Modifier.padding(8.dp)) { - Icon( - painter = painterResource(R.drawable.gravatar_icon), - contentDescription = "", - ) - Text("$text\n\nThis demonstrates how to pass a custom dialog content to the ExpandableText.") - } - } - } -} diff --git a/gravatar-ui/src/main/java/com/gravatar/ui/components/atomic/Location.kt b/gravatar-ui/src/main/java/com/gravatar/ui/components/atomic/Location.kt index f8780009..a6adf2f9 100644 --- a/gravatar-ui/src/main/java/com/gravatar/ui/components/atomic/Location.kt +++ b/gravatar-ui/src/main/java/com/gravatar/ui/components/atomic/Location.kt @@ -1,7 +1,9 @@ package com.gravatar.ui.components.atomic +import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier +import androidx.compose.ui.text.style.TextOverflow import androidx.compose.ui.tooling.preview.Preview import com.gravatar.api.models.UserProfile @@ -11,19 +13,27 @@ import com.gravatar.api.models.UserProfile * * @param profile The user's profile information * @param modifier Composable modifier - * @param maxLines Maximum number of lines to display - * @param dialogContent Content to display in a dialog when the text is clicked + * @param content Composable to display the user location */ @Composable public fun Location( profile: UserProfile, modifier: Modifier = Modifier, - maxLines: Int = 1, - dialogContent: @Composable ((String) -> Unit)? = { DefaultDialogContent(text = it) }, + content: @Composable ((String, Modifier) -> Unit) = { location, contentModifier -> + LocationDefaultContent(location, contentModifier) + }, ) { - ExpandableText(profile.currentLocation.orEmpty(), modifier, maxLines, dialogContent) + content(profile.currentLocation.orEmpty(), modifier) } +@Composable +private fun LocationDefaultContent(location: String, modifier: Modifier) = Text( + location, + modifier = modifier, + maxLines = 1, + overflow = TextOverflow.Ellipsis, +) + @Preview @Composable private fun LocationPreview() { diff --git a/gravatar-ui/src/main/java/com/gravatar/ui/components/atomic/UserInfo.kt b/gravatar-ui/src/main/java/com/gravatar/ui/components/atomic/UserInfo.kt index 7cb2612d..737f8418 100644 --- a/gravatar-ui/src/main/java/com/gravatar/ui/components/atomic/UserInfo.kt +++ b/gravatar-ui/src/main/java/com/gravatar/ui/components/atomic/UserInfo.kt @@ -1,7 +1,9 @@ package com.gravatar.ui.components.atomic +import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier +import androidx.compose.ui.text.style.TextOverflow import androidx.compose.ui.tooling.preview.Preview import com.gravatar.api.models.UserProfile import com.gravatar.extensions.formattedUserInfo @@ -13,21 +15,27 @@ import com.gravatar.extensions.formattedUserInfo * * @param profile The user's profile information * @param modifier Composable modifier - * @param maxLines The maximum number of lines to display before truncating the text - * @param dialogContent The content to display in a dialog when the truncated text is clicked + * @param content Composable to display the formatted user information */ @Composable public fun UserInfo( profile: UserProfile, modifier: Modifier = Modifier, - maxLines: Int = 2, - dialogContent: @Composable ((String) -> Unit)? = { DefaultDialogContent(text = it) }, + content: @Composable ((String, Modifier) -> Unit) = { userInfo, contentModifier -> + UserInfoDefaultContent(userInfo, contentModifier) + }, ) { - // TODO this doesn't work with one Text field due. If the job_title and the company line is too long, - // it will to break the layout - ExpandableText(profile.formattedUserInfo(), modifier, maxLines, dialogContent) + content(profile.formattedUserInfo(), modifier) } +@Composable +private fun UserInfoDefaultContent(userInfo: String, modifier: Modifier) = Text( + userInfo, + modifier = modifier, + maxLines = 2, + overflow = TextOverflow.Ellipsis, +) + @Preview @Composable private fun UserInfoPreview() {