Lemmy/Raccoon
1
0
Fork 0
mirror of https://github.com/LiveFastEatTrashRaccoon/RaccoonForLemmy.git synced 2025-02-03 16:47:40 +01:00
Code Issues Packages Projects Releases Wiki Activity

fix: remove glitch in compact mode and add placeholders for users and communities; closes #47

Browse Source
This commit is contained in:
Diego Beraldin 2023-10-08 19:52:14 +02:00
parent 31981cd2e6
commit f4149a2041
17 changed files with 166 additions and 160 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
core-commonui/components/src/androidMain/kotlin/com/github/diegoberaldin/raccoonforlemmy/core/commonui/components/CustomImage.kt
View File

@ -15,6 +15,7 @@ import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.ColorFilter
import androidx.compose.ui.graphics.FilterQuality
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.text.style.TextOverflow
import coil.compose.AsyncImage
import coil.compose.AsyncImagePainter
import com.github.diegoberaldin.raccoonforlemmy.resources.MR
@ -25,6 +26,7 @@ actual fun CustomImage(
modifier: Modifier,
url: String,
autoload: Boolean,
loadButtonContent: @Composable (() -> Unit)?,
contentDescription: String?,
quality: FilterQuality,
contentScale: ContentScale,
@ -82,7 +84,15 @@ actual fun CustomImage(
shouldBeRendered = true
},
) {
Text(text = stringResource(MR.strings.button_load))
if (loadButtonContent != null) {
loadButtonContent?.invoke()
} else {
Text(
text = stringResource(MR.strings.button_load),
maxLines = 1,
overflow = TextOverflow.Ellipsis,
)
}
}
}
}

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

@ -14,6 +14,7 @@ expect fun CustomImage(
modifier: Modifier = Modifier,
url: String,
autoload: Boolean = true,
loadButtonContent: @Composable (() -> Unit)? = null,
contentDescription: String? = null,
quality: FilterQuality = FilterQuality.Medium,
contentScale: ContentScale = ContentScale.Fit,

12
core-commonui/components/src/iosMain/kotlin/com/github/diegoberaldin/raccoonforlemmy/core/commonui/components/CustomImage.kt
View File

@ -15,6 +15,7 @@ import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.ColorFilter
import androidx.compose.ui.graphics.FilterQuality
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.text.style.TextOverflow
import com.github.diegoberaldin.raccoonforlemmy.resources.MR
import dev.icerock.moko.resources.compose.stringResource
import io.kamel.image.KamelImage
@ -25,6 +26,7 @@ actual fun CustomImage(
modifier: Modifier,
url: String,
autoload: Boolean,
loadButtonContent: @Composable (() -> Unit)?,
contentDescription: String?,
quality: FilterQuality,
contentScale: ContentScale,
@ -63,7 +65,15 @@ actual fun CustomImage(
shouldBeRendered = true
},
) {
Text(text = stringResource(MR.strings.button_load))
if (loadButtonContent != null) {
loadButtonContent?.invoke()
} else {
Text(
text = stringResource(MR.strings.button_load),
maxLines = 1,
overflow = TextOverflow.Ellipsis,
)
}
}
}
}

3
core-commonui/src/commonMain/kotlin/com/github/diegoberaldin/raccoonforlemmy/core/commonui/communitydetail/CommunityDetailScreen.kt
View File

@ -296,6 +296,9 @@ class CommunityDetailScreen(
},
)
}
item {
Spacer(modifier = Modifier.height(Spacing.m))
}
if (uiState.posts.isEmpty() && uiState.loading) {
items(5) {
PostCardPlaceholder(

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

@ -24,7 +24,6 @@ import com.github.diegoberaldin.raccoonforlemmy.domain.lemmy.data.UserModel
fun CommunityAndCreatorInfo(
modifier: Modifier = Modifier,
autoLoadImages: Boolean = true,
small: Boolean = false,
community: CommunityModel? = null,
creator: UserModel? = null,
onOpenCommunity: ((CommunityModel) -> Unit)? = null,
@ -36,45 +35,69 @@ fun CommunityAndCreatorInfo(
val creatorName = creator?.name.orEmpty()
val creatorAvatar = creator?.avatar.orEmpty()
val creatorHost = creator?.host.orEmpty()
val iconSize = if (small) 20.dp else 32.dp
val iconSize = 32.dp
Row(
modifier = modifier,
verticalAlignment = Alignment.CenterVertically,
horizontalArrangement = Arrangement.spacedBy(Spacing.s)
) {
if (communityIcon.isNotEmpty() && autoLoadImages) {
CustomImage(
modifier = Modifier
.onClick {
if (communityIcon.isNotEmpty()) {
if (autoLoadImages) {
CustomImage(
modifier = Modifier
.onClick {
if (community != null) {
onOpenCommunity?.invoke(community)
}
}
.padding(Spacing.xxxs)
.size(iconSize)
.clip(RoundedCornerShape(iconSize / 2)),
url = communityIcon,
quality = FilterQuality.Low,
contentDescription = null,
contentScale = ContentScale.FillBounds,
)
} else {
PlaceholderImage(
modifier = Modifier.onClick {
if (community != null) {
onOpenCommunity?.invoke(community)
}
}
.padding(Spacing.xxxs)
.size(iconSize)
.clip(RoundedCornerShape(iconSize / 2)),
url = communityIcon,
quality = FilterQuality.Low,
contentDescription = null,
contentScale = ContentScale.FillBounds,
)
} else if (creatorAvatar.isNotEmpty() && autoLoadImages) {
CustomImage(
modifier = Modifier
.onClick {
},
size = 32.dp,
title = communityName,
)
}
} else if (creatorAvatar.isNotEmpty()) {
if (autoLoadImages) {
CustomImage(
modifier = Modifier
.onClick {
if (creator != null) {
onOpenCreator?.invoke(creator)
}
}
.padding(Spacing.xxxs)
.size(iconSize)
.clip(RoundedCornerShape(iconSize / 2)),
url = creatorAvatar,
quality = FilterQuality.Low,
contentDescription = null,
contentScale = ContentScale.FillBounds,
)
} else {
PlaceholderImage(
modifier = Modifier.onClick {
if (creator != null) {
onOpenCreator?.invoke(creator)
}
}
.padding(Spacing.xxxs)
.size(iconSize)
.clip(RoundedCornerShape(iconSize / 2)),
url = creatorAvatar,
quality = FilterQuality.Low,
contentDescription = null,
contentScale = ContentScale.FillBounds,
)
},
size = iconSize,
title = creatorName,
)
}
}
Column(
modifier = Modifier.padding(vertical = Spacing.xxxs),

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

@ -1,6 +1,5 @@
package com.github.diegoberaldin.raccoonforlemmy.core.commonui.components
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
@ -125,19 +124,10 @@ fun CommunityHeader(
contentScale = ContentScale.FillBounds,
)
} else {
Box(
modifier = Modifier.padding(Spacing.xxxs).size(avatarSize).background(
color = MaterialTheme.colorScheme.primary,
shape = RoundedCornerShape(avatarSize / 2),
),
contentAlignment = Alignment.Center,
) {
Text(
text = community.name.firstOrNull()?.toString().orEmpty().uppercase(),
style = MaterialTheme.typography.bodyLarge,
color = MaterialTheme.colorScheme.onBackground,
)
}
PlaceholderImage(
size = avatarSize,
title = community.name,
)
}
// textual data

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

@ -1,8 +1,6 @@
package com.github.diegoberaldin.raccoonforlemmy.core.commonui.components
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.padding
@ -50,20 +48,10 @@ fun CommunityItem(
contentScale = ContentScale.FillBounds,
)
} else {
Box(
modifier = Modifier.padding(Spacing.xxxs).size(iconSize)
.background(
color = MaterialTheme.colorScheme.primary,
shape = RoundedCornerShape(iconSize / 2),
),
contentAlignment = Alignment.Center,
) {
Text(
text = community.name.firstOrNull()?.toString().orEmpty().uppercase(),
style = MaterialTheme.typography.bodyLarge,
color = MaterialTheme.colorScheme.onPrimary,
)
}
PlaceholderImage(
size = iconSize,
title = community.name,
)
}
Column(
modifier = Modifier.padding(start = Spacing.xs),
@ -88,3 +76,5 @@ fun CommunityItem(
}
}
}

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

@ -1,8 +1,6 @@
package com.github.diegoberaldin.raccoonforlemmy.core.commonui.components
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.padding
@ -46,20 +44,10 @@ fun MultiCommunityItem(
contentScale = ContentScale.FillBounds,
)
} else {
Box(
modifier = Modifier.padding(Spacing.xxxs).size(iconSize)
.background(
color = MaterialTheme.colorScheme.primary,
shape = RoundedCornerShape(iconSize / 2),
),
contentAlignment = Alignment.Center,
) {
Text(
text = title.firstOrNull()?.toString().orEmpty().uppercase(),
style = MaterialTheme.typography.bodyLarge,
color = MaterialTheme.colorScheme.onPrimary,
)
}
PlaceholderImage(
size = iconSize,
title = title,
)
}
Column(
modifier = Modifier.padding(start = Spacing.xs),

38
core-commonui/src/commonMain/kotlin/com/github/diegoberaldin/raccoonforlemmy/core/commonui/components/PlaceholderImage.kt Normal file
View File

@ -0,0 +1,38 @@
package com.github.diegoberaldin.raccoonforlemmy.core.commonui.components
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.unit.Dp
import com.github.diegoberaldin.raccoonforlemmy.core.appearance.theme.Spacing
@Composable
fun PlaceholderImage(
modifier: Modifier = Modifier,
size: Dp,
title: String,
) {
Box(
modifier = modifier
.padding(Spacing.xxxs)
.size(size)
.background(
color = MaterialTheme.colorScheme.primary,
shape = RoundedCornerShape(size / 2),
),
contentAlignment = Alignment.Center,
) {
Text(
text = title.firstOrNull()?.toString().orEmpty().uppercase(),
style = MaterialTheme.typography.bodyLarge,
color = MaterialTheme.colorScheme.onPrimary,
)
}
}

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

@ -10,6 +10,9 @@ import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.heightIn
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.Icon
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Download
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.surfaceColorAtElevation
import androidx.compose.runtime.Composable
@ -146,7 +149,6 @@ private fun CompactPost(
verticalArrangement = Arrangement.spacedBy(Spacing.xxxs),
) {
CommunityAndCreatorInfo(
small = true,
community = post.community,
creator = post.creator.takeIf { !hideAuthor },
onOpenCommunity = onOpenCommunity,
@ -163,6 +165,9 @@ private fun CompactPost(
maxHeight = Dp.Unspecified,
imageUrl = post.imageUrl,
autoLoadImages = autoLoadImages,
loadButtonContent = @Composable {
Icon(imageVector = Icons.Default.Download, contentDescription = null)
},
blurred = blurNsfw && post.nsfw,
onImageClick = onImageClick,
)

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

@ -26,6 +26,7 @@ fun PostCardImage(
modifier: Modifier = Modifier,
imageUrl: String,
autoLoadImages: Boolean = true,
loadButtonContent: @Composable (() -> Unit)? = null,
minHeight: Dp = 200.dp,
maxHeight: Dp = Dp.Unspecified,
blurred: Boolean = false,
@ -41,6 +42,7 @@ fun PostCardImage(
},
url = imageUrl,
autoload = autoLoadImages,
loadButtonContent = loadButtonContent,
contentDescription = null,
contentScale = ContentScale.FillWidth,
onFailure = {

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

@ -1,6 +1,5 @@
package com.github.diegoberaldin.raccoonforlemmy.core.commonui.components
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
@ -133,24 +132,10 @@ fun UserHeader(
contentScale = ContentScale.FillBounds,
)
} else {
Box(
modifier = Modifier
.padding(Spacing.xxxs)
.size(avatarSize)
.background(
color = MaterialTheme.colorScheme.primary,
shape = RoundedCornerShape(avatarSize / 2),
),
contentAlignment = Alignment.Center,
) {
Text(
text = user.name.firstOrNull()?.toString()
.orEmpty()
.uppercase(),
style = MaterialTheme.typography.bodyLarge,
color = MaterialTheme.colorScheme.onBackground,
)
}
PlaceholderImage(
size = avatarSize,
title = user.name,
)
}
// textual data

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

@ -1,8 +1,6 @@
package com.github.diegoberaldin.raccoonforlemmy.core.commonui.components
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
@ -47,20 +45,10 @@ fun UserItem(
contentScale = ContentScale.FillBounds,
)
} else {
Box(
modifier = Modifier.padding(Spacing.xxxs).size(iconSize)
.background(
color = MaterialTheme.colorScheme.primary,
shape = RoundedCornerShape(iconSize / 2),
),
contentAlignment = Alignment.Center,
) {
Text(
text = name.firstOrNull()?.toString().orEmpty().uppercase(),
style = MaterialTheme.typography.bodyLarge,
color = MaterialTheme.colorScheme.onPrimary,
)
}
PlaceholderImage(
size = iconSize,
title = name,
)
}
Text(

35
core-commonui/src/commonMain/kotlin/com/github/diegoberaldin/raccoonforlemmy/core/commonui/drawer/ModalDrawerContent.kt
View File

@ -64,6 +64,7 @@ import com.github.diegoberaldin.raccoonforlemmy.core.architecture.bindToLifecycl
import com.github.diegoberaldin.raccoonforlemmy.core.commonui.components.CommunityItem
import com.github.diegoberaldin.raccoonforlemmy.core.commonui.components.CustomImage
import com.github.diegoberaldin.raccoonforlemmy.core.commonui.components.MultiCommunityItem
import com.github.diegoberaldin.raccoonforlemmy.core.commonui.components.PlaceholderImage
import com.github.diegoberaldin.raccoonforlemmy.core.commonui.di.getDrawerCoordinator
import com.github.diegoberaldin.raccoonforlemmy.core.commonui.di.getModalDrawerViewModel
import com.github.diegoberaldin.raccoonforlemmy.core.utils.onClick
@ -255,19 +256,10 @@ private fun DrawerHeader(
contentScale = ContentScale.FillBounds,
)
} else {
Box(
modifier = Modifier.padding(Spacing.xxxs).size(avatarSize).background(
color = MaterialTheme.colorScheme.primary,
shape = RoundedCornerShape(avatarSize / 2),
),
contentAlignment = Alignment.Center,
) {
Text(
text = user.name.firstOrNull()?.toString().orEmpty().uppercase(),
style = MaterialTheme.typography.bodyLarge,
color = MaterialTheme.colorScheme.onBackground,
)
}
PlaceholderImage(
size = avatarSize,
title = user.name,
)
}
Column(
@ -298,19 +290,10 @@ private fun DrawerHeader(
}
} else {
val anonymousTitle = stringResource(MR.strings.navigation_drawer_anonymous)
Box(
modifier = Modifier.padding(Spacing.xxxs).size(avatarSize).background(
color = MaterialTheme.colorScheme.primary,
shape = RoundedCornerShape(avatarSize / 2),
),
contentAlignment = Alignment.Center,
) {
Text(
text = anonymousTitle.firstOrNull()?.toString().orEmpty().uppercase(),
style = MaterialTheme.typography.bodyLarge,
color = MaterialTheme.colorScheme.onPrimary,
)
}
PlaceholderImage(
size = avatarSize,
title = anonymousTitle,
)
Column(
verticalArrangement = Arrangement.spacedBy(Spacing.xxxs),
) {

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

@ -241,6 +241,7 @@ class UserDetailScreen(
) {
UserHeader(
user = uiState.user,
autoLoadImages = uiState.autoLoadImages,
options = listOf(stringResource(MR.strings.community_detail_block)),
onOpenImage = { url ->
navigator?.push(ZoomableImageScreen(url))

32
feature-inbox/src/commonMain/kotlin/com/github/diegoberaldin/raccoonforlemmy/feature/inbox/messages/ChatCard.kt
View File

@ -1,8 +1,6 @@
package com.github.diegoberaldin.raccoonforlemmy.feature.inbox.messages
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.padding
@ -23,6 +21,7 @@ import androidx.compose.ui.text.style.TextOverflow
import androidx.compose.ui.unit.dp
import com.github.diegoberaldin.raccoonforlemmy.core.appearance.theme.Spacing
import com.github.diegoberaldin.raccoonforlemmy.core.commonui.components.CustomImage
import com.github.diegoberaldin.raccoonforlemmy.core.commonui.components.PlaceholderImage
import com.github.diegoberaldin.raccoonforlemmy.core.utils.DateTime
import com.github.diegoberaldin.raccoonforlemmy.core.utils.onClick
import com.github.diegoberaldin.raccoonforlemmy.domain.lemmy.data.UserModel
@ -71,26 +70,15 @@ internal fun ChatCard(
contentScale = ContentScale.FillBounds,
)
} else {
Box(
modifier = Modifier
.padding(Spacing.xxxs)
.size(iconSize)
.background(
color = MaterialTheme.colorScheme.primary,
shape = RoundedCornerShape(iconSize / 2),
).onClick {
if (user != null) {
onOpenUser?.invoke(user)
}
},
contentAlignment = Alignment.Center,
) {
Text(
text = creatorName.firstOrNull()?.toString().orEmpty().uppercase(),
style = MaterialTheme.typography.bodyLarge,
color = MaterialTheme.colorScheme.onPrimary,
)
}
PlaceholderImage(
modifier = Modifier.onClick {
if (user != null) {
onOpenUser?.invoke(user)
}
},
size = iconSize,
title = creatorName,
)
}
Column(

1
feature-profile/src/commonMain/kotlin/com/github/diegoberaldin/raccoonforlemmy/feature/profile/logged/ProfileLoggedScreen.kt
View File

@ -96,6 +96,7 @@ internal object ProfileLoggedScreen : Tab {
) {
UserHeader(
user = user,
autoLoadImages = uiState.autoLoadImages,
onOpenImage = { url ->
navigator?.push(ZoomableImageScreen(url))
},