From d808fbe88108b3fd55f837845846914dd7286d9e Mon Sep 17 00:00:00 2001 From: Tangem Date: Thu, 19 Feb 2026 20:33:29 +0500 Subject: [PATCH] Updated on 2026-08-14 --- .../core/ui/ds/row/TangemRowContainer.kt | 4 +- .../img_nft_empty_collection.webp | Bin 0 -> 2684 bytes .../drawable/ic_chevron_small_right_24.xml | 12 + .../drawable/img_nft_empty_collection.webp | Bin 0 -> 3910 bytes .../RemoveNFTCollectionsTransformer.kt | 7 +- .../SetNFTCollectionsTransformer.kt | 11 +- .../wallet/ui/components/WalletNFTItem2.kt | 422 ++++++++++++++++++ 7 files changed, 452 insertions(+), 4 deletions(-) create mode 100644 core/ui/src/main/res/drawable-night/img_nft_empty_collection.webp create mode 100644 core/ui/src/main/res/drawable/ic_chevron_small_right_24.xml create mode 100644 core/ui/src/main/res/drawable/img_nft_empty_collection.webp create mode 100644 features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/wallet/ui/components/WalletNFTItem2.kt diff --git a/core/ui/src/main/java/com/tangem/core/ui/ds/row/TangemRowContainer.kt b/core/ui/src/main/java/com/tangem/core/ui/ds/row/TangemRowContainer.kt index b1a24c2067..553edfc0e9 100644 --- a/core/ui/src/main/java/com/tangem/core/ui/ds/row/TangemRowContainer.kt +++ b/core/ui/src/main/java/com/tangem/core/ui/ds/row/TangemRowContainer.kt @@ -16,7 +16,7 @@ import kotlin.math.max /** * A custom layout composable that arranges its children in a row with specific layout IDs. */ -internal enum class TangemRowLayoutId { +enum class TangemRowLayoutId { HEAD, START_TOP, END_TOP, START_BOTTOM, END_BOTTOM, TAIL, EXTRA_TOP } @@ -29,7 +29,7 @@ internal enum class TangemRowLayoutId { */ @Suppress("LongMethod") @Composable -internal fun TangemRowContainer( +fun TangemRowContainer( modifier: Modifier = Modifier, contentPadding: PaddingValues = PaddingValues(TangemTheme.dimens2.x3), content: @Composable () -> Unit, diff --git a/core/ui/src/main/res/drawable-night/img_nft_empty_collection.webp b/core/ui/src/main/res/drawable-night/img_nft_empty_collection.webp new file mode 100644 index 0000000000000000000000000000000000000000..8844ed902d756d8d62bf3c5c8503108d36f386ee GIT binary patch literal 2684 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 qn*3B4VMQ5M=f%N_&?V3AwTNj0002#qX2FI literal 0 HcmV?d00001 diff --git a/core/ui/src/main/res/drawable/ic_chevron_small_right_24.xml b/core/ui/src/main/res/drawable/ic_chevron_small_right_24.xml new file mode 100644 index 0000000000..6ee9686437 --- /dev/null +++ b/core/ui/src/main/res/drawable/ic_chevron_small_right_24.xml @@ -0,0 +1,12 @@ + + + diff --git a/core/ui/src/main/res/drawable/img_nft_empty_collection.webp b/core/ui/src/main/res/drawable/img_nft_empty_collection.webp new file mode 100644 index 0000000000000000000000000000000000000000..9d18888c548da0ff01bb1ed8177827c92243b753 GIT binary patch literal 3910 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 walletUM.copy( + nftState = WalletNFTItemUM.Hidden, + ) + is WalletUM.Locked -> walletUM + } } } \ No newline at end of file diff --git a/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/wallet/state/transformers/SetNFTCollectionsTransformer.kt b/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/wallet/state/transformers/SetNFTCollectionsTransformer.kt index 10a816e576..caa9d7ec25 100644 --- a/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/wallet/state/transformers/SetNFTCollectionsTransformer.kt +++ b/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/wallet/state/transformers/SetNFTCollectionsTransformer.kt @@ -30,7 +30,16 @@ internal class SetNFTCollectionsTransformer( } override fun transform(walletUM: WalletUM): WalletUM { - return walletUM // todo redesign main + return when (walletUM) { + is WalletUM.Content -> walletUM.copy( + nftState = when { + nftCollections.allLoadedCollectionsEmpty() -> + WalletNFTItemUM.Empty(onItemClick) + else -> createContentNFTItemUM(onItemClick) + }, + ) + is WalletUM.Locked -> walletUM + } } private fun createContentNFTItemUM(onItemClick: () -> Unit): WalletNFTItemUM.Content { diff --git a/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/wallet/ui/components/WalletNFTItem2.kt b/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/wallet/ui/components/WalletNFTItem2.kt new file mode 100644 index 0000000000..8759ecdf11 --- /dev/null +++ b/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/wallet/ui/components/WalletNFTItem2.kt @@ -0,0 +1,422 @@ +package com.tangem.feature.wallet.presentation.wallet.ui.components + +import android.content.res.Configuration +import androidx.compose.foundation.Image +import androidx.compose.foundation.background +import androidx.compose.foundation.layout.* +import androidx.compose.foundation.shape.RoundedCornerShape +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.draw.clip +import androidx.compose.ui.graphics.vector.ImageVector +import androidx.compose.ui.layout.layoutId +import androidx.compose.ui.res.painterResource +import androidx.compose.ui.res.vectorResource +import androidx.compose.ui.text.style.TextOverflow +import androidx.compose.ui.tooling.preview.Preview +import androidx.compose.ui.tooling.preview.PreviewParameter +import androidx.compose.ui.tooling.preview.datasource.CollectionPreviewParameterProvider +import androidx.compose.ui.unit.dp +import androidx.compose.ui.zIndex +import coil.compose.SubcomposeAsyncImage +import com.tangem.core.ui.R +import com.tangem.core.ui.components.RectangleShimmer +import com.tangem.core.ui.components.TextShimmer +import com.tangem.core.ui.components.text.applyBladeBrush +import com.tangem.core.ui.ds.row.TangemRowContainer +import com.tangem.core.ui.ds.row.TangemRowLayoutId +import com.tangem.core.ui.extensions.clickableSingle +import com.tangem.core.ui.extensions.stringResourceSafe +import com.tangem.core.ui.res.TangemTheme +import com.tangem.core.ui.res.TangemThemePreviewRedesign +import com.tangem.feature.wallet.presentation.wallet.state.model.WalletNFTItemUM +import com.tangem.feature.wallet.presentation.wallet.state.model.WalletNFTItemUM.Content.CollectionPreview +import kotlinx.collections.immutable.ImmutableList +import kotlinx.collections.immutable.persistentListOf + +@Composable +internal fun WalletNFTItem2(state: WalletNFTItemUM, modifier: Modifier = Modifier) { + val nftModifier = modifier + .clip(RoundedCornerShape(18.dp)) + .background(TangemTheme.colors2.surface.level3) + when (state) { + is WalletNFTItemUM.Hidden -> Unit + is WalletNFTItemUM.Empty -> WalletNFTItemEmpty( + modifier = nftModifier, + onClick = state.onItemClick, + ) + is WalletNFTItemUM.Failed -> WalletNFTItemFailed(modifier = nftModifier) + is WalletNFTItemUM.Loading -> WalletNFTItemLoading(modifier = nftModifier) + + is WalletNFTItemUM.Content -> WalletNFTItemContent( + state = state, + onClick = state.onItemClick, + modifier = nftModifier, + ) + } +} + +@Composable +private fun WalletNFTItemEmpty(onClick: () -> Unit, modifier: Modifier = Modifier) { + TangemRowContainer( + modifier = modifier.clickableSingle( + onClick = onClick, + ), + ) { + Image( + painter = painterResource(R.drawable.img_nft_empty_collection), + contentDescription = null, + modifier = Modifier + .size(TangemTheme.dimens2.x10) + .layoutId(TangemRowLayoutId.HEAD), + ) + Text( + text = stringResourceSafe(R.string.nft_wallet_title), + style = TangemTheme.typography2.bodySemibold16, + color = TangemTheme.colors2.text.neutral.primary, + maxLines = 1, + overflow = TextOverflow.Ellipsis, + modifier = Modifier + .layoutId(TangemRowLayoutId.START_TOP) + .padding(start = TangemTheme.dimens2.x2), + ) + Text( + text = stringResourceSafe(R.string.nft_wallet_receive_nft), + style = TangemTheme.typography2.captionSemibold12, + color = TangemTheme.colors2.text.neutral.secondary, + maxLines = 1, + overflow = TextOverflow.Ellipsis, + modifier = Modifier + .layoutId(TangemRowLayoutId.START_BOTTOM) + .padding(start = TangemTheme.dimens2.x2), + ) + Icon( + imageVector = ImageVector.vectorResource(R.drawable.ic_chevron_small_right_24), + contentDescription = null, + tint = TangemTheme.colors2.graphic.neutral.tertiaryConstant, + modifier = Modifier.layoutId(TangemRowLayoutId.TAIL), + ) + } +} + +@Composable +private fun WalletNFTItemContent(state: WalletNFTItemUM.Content, onClick: () -> Unit, modifier: Modifier = Modifier) { + TangemRowContainer( + modifier = modifier.clickableSingle( + onClick = onClick, + ), + ) { + Box(modifier = Modifier.layoutId(TangemRowLayoutId.HEAD)) { + CollectionsPreviews( + previews = state.previews, + ) + } + Text( + text = stringResourceSafe(R.string.nft_wallet_title), + style = TangemTheme.typography2.bodySemibold16.applyBladeBrush( + isEnabled = state.isFlickering, + textColor = TangemTheme.colors2.text.neutral.primary, + ), + maxLines = 1, + overflow = TextOverflow.Ellipsis, + modifier = Modifier + .layoutId(TangemRowLayoutId.START_TOP) + .padding(horizontal = TangemTheme.dimens2.x2), + ) + Text( + text = stringResourceSafe( + id = R.string.nft_wallet_count, + state.allAssetsCount, + state.collectionsCount, + ), + style = TangemTheme.typography2.captionSemibold12.applyBladeBrush( + isEnabled = state.isFlickering, + textColor = TangemTheme.colors2.text.neutral.secondary, + ), + maxLines = 1, + overflow = TextOverflow.Ellipsis, + modifier = Modifier + .layoutId(TangemRowLayoutId.START_BOTTOM) + .padding(horizontal = TangemTheme.dimens2.x2), + ) + Icon( + imageVector = ImageVector.vectorResource(R.drawable.ic_chevron_small_right_24), + contentDescription = null, + tint = TangemTheme.colors2.graphic.neutral.tertiaryConstant, + modifier = Modifier.layoutId(TangemRowLayoutId.TAIL), + ) + } +} + +@Composable +private fun WalletNFTItemFailed(modifier: Modifier = Modifier) { + TangemRowContainer( + modifier = modifier, + ) { + Box( + modifier = Modifier + .layoutId(TangemRowLayoutId.HEAD) + .size(TangemTheme.dimens2.x10) + .clip(RoundedCornerShape(TangemTheme.dimens2.x3)) + .background(TangemTheme.colors2.skeleton.backgroundPrimary), + contentAlignment = Alignment.Center, + ) { + Icon( + modifier = Modifier.size(TangemTheme.dimens2.x5), + painter = painterResource(R.drawable.ic_error_sync_24), + tint = TangemTheme.colors.icon.informative, + contentDescription = null, + ) + } + Text( + text = stringResourceSafe(R.string.nft_wallet_title), + style = TangemTheme.typography2.bodySemibold16, + color = TangemTheme.colors2.text.neutral.primary, + maxLines = 1, + overflow = TextOverflow.Ellipsis, + modifier = Modifier + .layoutId(TangemRowLayoutId.START_TOP) + .padding(start = TangemTheme.dimens2.x2), + ) + Text( + text = stringResourceSafe(R.string.nft_wallet_unable_to_load), + style = TangemTheme.typography2.captionSemibold12, + color = TangemTheme.colors2.text.neutral.secondary, + maxLines = 1, + overflow = TextOverflow.Ellipsis, + modifier = Modifier + .layoutId(TangemRowLayoutId.START_BOTTOM) + .padding(start = TangemTheme.dimens2.x2), + ) + } +} + +@Composable +private fun WalletNFTItemLoading(modifier: Modifier = Modifier) { + TangemRowContainer( + modifier = modifier, + ) { + Box( + modifier = Modifier + .size(TangemTheme.dimens2.x10) + .clip(RoundedCornerShape(TangemTheme.dimens2.x3)) + .background(TangemTheme.colors2.skeleton.backgroundPrimary) + .layoutId(TangemRowLayoutId.HEAD), + ) + TextShimmer( + style = TangemTheme.typography2.bodySemibold16, + radius = TangemTheme.dimens2.x25, + + modifier = Modifier + .layoutId(TangemRowLayoutId.START_TOP) + .padding(start = TangemTheme.dimens2.x2) + .width(TangemTheme.dimens.size110), + ) + TextShimmer( + style = TangemTheme.typography2.captionSemibold12, + radius = TangemTheme.dimens2.x25, + modifier = Modifier + .layoutId(TangemRowLayoutId.START_BOTTOM) + .padding(start = TangemTheme.dimens2.x2) + .width(TangemTheme.dimens.size80), + ) + } +} + +@Composable +@Suppress("MagicNumber", "ReusedModifierInstance") +private fun BoxScope.CollectionsPreviews(previews: ImmutableList, modifier: Modifier = Modifier) { + val modifiers = when (previews.size) { + 1 -> previews1Modifiers() + 2 -> previews2Modifiers() + 3 -> previews3Modifiers() + else -> previews4Modifiers() + } + Box( + modifier = modifier + .size(TangemTheme.dimens2.x10), + ) { + previews.take(modifiers.size).forEachIndexed { index, s -> + val previewModifier = modifiers[index] + when (s) { + is CollectionPreview.Image -> { + SubcomposeAsyncImage( + modifier = previewModifier, + model = s.url, + loading = { + RectangleShimmer() + }, + error = { + Box( + modifier = previewModifier.background(TangemTheme.colors2.surface.level2), + ) + }, + contentDescription = null, + ) + } + is CollectionPreview.More -> { + Icon( + modifier = previewModifier + .background(TangemTheme.colors2.surface.level2), + imageVector = ImageVector.vectorResource(R.drawable.ic_nft_preview_more_16), + tint = TangemTheme.colors2.text.neutral.secondary, + contentDescription = null, + ) + } + } + } + } +} + +@Composable +private fun previews1Modifiers(): List = listOf( + Modifier + .size(TangemTheme.dimens2.x10) + .clip(RoundedCornerShape(TangemTheme.dimens2.x3)), +) + +@Composable +private fun BoxScope.previews2Modifiers(): List = listOf( + Modifier + .padding(start = TangemTheme.dimens2.x0_5, top = TangemTheme.dimens2.x0_5) + .size(TangemTheme.dimens2.x6) + .clip(RoundedCornerShape(TangemTheme.dimens2.x2)) + .align(Alignment.TopStart), + Modifier + .zIndex(1f) + .padding(TangemTheme.dimens2.x0_5) + .clip(RoundedCornerShape(topStart = 10.dp)) + .background(TangemTheme.colors2.surface.level3) + .padding(start = TangemTheme.dimens2.x0_5, top = TangemTheme.dimens2.x0_5) + .size(TangemTheme.dimens2.x6) + .clip(RoundedCornerShape(TangemTheme.dimens2.x2)) + .align(Alignment.BottomEnd), +) + +@Composable +private fun BoxScope.previews3Modifiers(): List = listOf( + Modifier + .padding(start = 3.dp, top = 3.dp) + .size(17.8.dp) + .clip(RoundedCornerShape(6.dp)) + .align(Alignment.TopStart), + Modifier + .zIndex(1f) + .padding(top = 10.dp, end = 1.dp) + .clip(RoundedCornerShape(8.dp)) + .background(TangemTheme.colors2.surface.level3) + .padding(TangemTheme.dimens2.x0_5) + .size(18.dp) + .clip(RoundedCornerShape(6.dp)) + .align(Alignment.TopEnd), + Modifier + .padding(start = 9.dp, top = 2.dp) + .size(14.dp) + .clip(RoundedCornerShape(4.dp)) + .align(Alignment.BottomStart), +) + +@Composable +private fun BoxScope.previews4Modifiers(): List = listOf( + Modifier + .clip(RoundedCornerShape(6.dp)) + .size(18.dp) + .align(Alignment.TopStart), + Modifier + .clip(RoundedCornerShape(6.dp)) + .size(18.dp) + .align(Alignment.TopEnd), + Modifier + .clip(RoundedCornerShape(6.dp)) + .size(18.dp) + .align(Alignment.BottomStart), + Modifier + .clip(RoundedCornerShape(6.dp)) + .size(18.dp) + .align(Alignment.BottomEnd), +) + +@Preview(widthDp = 360) +@Preview(widthDp = 360, uiMode = Configuration.UI_MODE_NIGHT_YES) +@Composable +private fun Preview_WalletNFTItem(@PreviewParameter(WalletNFTItemProvider2::class) state: WalletNFTItemUM) { + TangemThemePreviewRedesign { + WalletNFTItem2( + state = state, + modifier = Modifier + .background(TangemTheme.colors2.surface.level1), + ) + } +} + +private class WalletNFTItemProvider2 : CollectionPreviewParameterProvider( + collection = listOf( + WalletNFTItemUM.Empty( + onItemClick = { }, + ), + WalletNFTItemUM.Loading, + WalletNFTItemUM.Failed, + WalletNFTItemUM.Content( + previews = persistentListOf( + CollectionPreview.Image("img1"), + ), + allAssetsCount = 125, + collectionsCount = 11, + noCollectionAssetsCount = 0, + isFlickering = true, + onItemClick = { }, + ), + WalletNFTItemUM.Content( + previews = persistentListOf( + CollectionPreview.Image("img1"), + CollectionPreview.Image("img2"), + ), + allAssetsCount = 125, + collectionsCount = 11, + noCollectionAssetsCount = 0, + isFlickering = false, + onItemClick = { }, + ), + WalletNFTItemUM.Content( + previews = persistentListOf( + CollectionPreview.Image("img1"), + CollectionPreview.Image("img2"), + CollectionPreview.Image("img3"), + ), + allAssetsCount = 125, + collectionsCount = 11, + noCollectionAssetsCount = 0, + isFlickering = false, + onItemClick = { }, + ), + WalletNFTItemUM.Content( + previews = persistentListOf( + CollectionPreview.Image("img1"), + CollectionPreview.Image("img2"), + CollectionPreview.Image("img3"), + CollectionPreview.Image("img4"), + ), + allAssetsCount = 125, + collectionsCount = 11, + noCollectionAssetsCount = 0, + isFlickering = false, + onItemClick = { }, + ), + WalletNFTItemUM.Content( + previews = persistentListOf( + CollectionPreview.Image("img1"), + CollectionPreview.Image("img2"), + CollectionPreview.Image("img3"), + CollectionPreview.More, + ), + allAssetsCount = 125, + collectionsCount = 11, + isFlickering = true, + noCollectionAssetsCount = 0, + onItemClick = { }, + ), + ), +) \ No newline at end of file