Updated on 2026-08-14

2023-07-04 17:52:15 +08:00 · 2023-07-04 17:52:15 +08:00 · baf5a717e6
commit baf5a717e6
parent 9aeba5bbda
17 changed files with 408 additions and 136 deletions
--- a/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/common/WalletPreviewData.kt
+++ b/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/common/WalletPreviewData.kt
@ -2,6 +2,7 @@ package com.tangem.feature.wallet.presentation.common

 import com.tangem.core.ui.R
 import com.tangem.core.ui.components.transactions.TransactionState
+import com.tangem.feature.wallet.presentation.common.state.PriceChangeConfig
 import com.tangem.feature.wallet.presentation.common.state.TokenItemState
 import com.tangem.feature.wallet.presentation.common.state.TokenItemState.TokenOptionsState
 import com.tangem.feature.wallet.presentation.organizetokens.DraggableItem
@ -70,9 +71,9 @@ internal object WalletPreviewData {
        hasPending = true,
        tokenOptions = TokenOptionsState.Visible(
            fiatAmount = "321 $",
-            priceChange = TokenOptionsState.PriceChange(
-                valuePercent = "2%",
-                type = TokenOptionsState.PriceChange.Type.UP,
+            priceChange = PriceChangeConfig(
+                valueInPercent = "2%",
+                type = PriceChangeConfig.Type.UP,
            ),
        ),
    )
@ -86,9 +87,9 @@ internal object WalletPreviewData {
        amount = "5,412 MATIC",
        hasPending = true,
        tokenOptions = TokenOptionsState.Hidden(
-            priceChange = TokenOptionsState.PriceChange(
-                valuePercent = "2%",
-                type = TokenOptionsState.PriceChange.Type.UP,
+            priceChange = PriceChangeConfig(
+                valueInPercent = "2%",
+                type = PriceChangeConfig.Type.UP,
            ),
        ),
    )
@ -203,6 +204,15 @@ internal object WalletPreviewData {
        WalletManageButton.CopyAddress(onClick = {}),
    )

+    val marketplaceBlockContent = WalletMarketplaceBlockState.Content(
+        currencyName = "BTC",
+        price = "0.11$",
+        priceChangeConfig = PriceChangeConfig(
+            valueInPercent = "5.16%",
+            type = PriceChangeConfig.Type.UP,
+        ),
+    )
+
    val multicurrencyWalletScreenState = WalletStateHolder.MultiCurrencyContent(
        onBackClick = {},
        topBarConfig = walletTopBarConfig,
@ -271,7 +281,7 @@ internal object WalletPreviewData {
        walletsListConfig = walletListConfig,
        contentItems = persistentListOf(
            WalletContentItemState.SingleCurrencyItem.Title(onExploreClick = {}),
-            WalletContentItemState.SingleCurrencyItem.TransactionGroupTitle("Today"),
+            WalletContentItemState.SingleCurrencyItem.GroupTitle("Today"),
            WalletContentItemState.SingleCurrencyItem.Transaction(
                TransactionState.Sending(
                    address = "33BddS...ga2B",
@ -279,7 +289,7 @@ internal object WalletPreviewData {
                    timestamp = "8:41",
                ),
            ),
-            WalletContentItemState.SingleCurrencyItem.TransactionGroupTitle("Yesterday"),
+            WalletContentItemState.SingleCurrencyItem.GroupTitle("Yesterday"),
            WalletContentItemState.SingleCurrencyItem.Transaction(
                TransactionState.Sending(
                    address = "33BddS...ga2B",
@ -290,5 +300,6 @@ internal object WalletPreviewData {
        ),
        notifications = persistentListOf(WalletNotification.LikeTangemApp(onClick = {})),
        buttons = manageButtons,
+        marketplaceBlockState = marketplaceBlockContent,
    )
 }
--- a/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/common/component/TokenItem.kt
+++ b/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/common/component/TokenItem.kt
@ -32,6 +32,7 @@ import com.tangem.core.ui.res.TangemTheme
 import com.tangem.core.ui.res.TangemTypography
 import com.tangem.feature.wallet.impl.R
 import com.tangem.feature.wallet.presentation.common.WalletPreviewData
+import com.tangem.feature.wallet.presentation.common.state.PriceChangeConfig
 import com.tangem.feature.wallet.presentation.common.state.TokenItemState
 import com.tangem.feature.wallet.presentation.common.state.TokenItemState.TokenOptionsState
 import org.burnoutcrew.reorderable.ReorderableLazyListState
@ -318,7 +319,7 @@ private fun TokenTitleAmountBlock(title: String, amount: String?, hasPending: Bo
@Composable
 private fun TokenFiatPercentageBlock(
    fiatAmount: String,
-    priceChange: TokenOptionsState.PriceChange,
+    priceChange: PriceChangeConfig,
    modifier: Modifier = Modifier,
 ) {
    Column(modifier = modifier.requiredWidth(IntrinsicSize.Max)) {
@ -336,11 +337,11 @@ private fun TokenFiatPercentageBlock(
            val iconChangeArrow: Int
            val changeTextColor: Color
            when (priceChange.type) {
-                TokenOptionsState.PriceChange.Type.UP -> {
+                PriceChangeConfig.Type.UP -> {
                    iconChangeArrow = R.drawable.img_arrow_up_8
                    changeTextColor = TangemTheme.colors.text.accent
                }
-                TokenOptionsState.PriceChange.Type.DOWN -> {
+                PriceChangeConfig.Type.DOWN -> {
                    iconChangeArrow = R.drawable.img_arrow_down_8
                    changeTextColor = TangemTheme.colors.text.warning
                }
@ -353,7 +354,7 @@ private fun TokenFiatPercentageBlock(
            SpacerW4()
            Text(
                modifier = Modifier.align(Alignment.CenterVertically),
-                text = priceChange.valuePercent,
+                text = priceChange.valueInPercent,
                style = TangemTypography.body2,
                color = changeTextColor,
            )
--- a/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/common/state/PriceChangeConfig.kt
+++ b/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/common/state/PriceChangeConfig.kt
@ -0,0 +1,15 @@
+package com.tangem.feature.wallet.presentation.common.state
+
+/**
+ * Price changing config
+ *
+ * @property valueInPercent value in percent
+ * @property type           type [Type]
+ */
+internal data class PriceChangeConfig(val valueInPercent: String, val type: Type) {
+
+    /** Price changing type */
+    enum class Type {
+        UP, DOWN
+    }
+}
--- a/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/common/state/TokenItemState.kt
+++ b/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/common/state/TokenItemState.kt
@ -2,7 +2,6 @@ package com.tangem.feature.wallet.presentation.common.state

 import androidx.annotation.DrawableRes
 import androidx.compose.runtime.Immutable
-import com.tangem.feature.wallet.presentation.common.state.TokenItemState.TokenOptionsState.PriceChange.Type

 /** Token item state */
@Immutable
@ -85,27 +84,13 @@ internal sealed interface TokenItemState {
         * @property fiatAmount fiat amount of token
         * @property priceChange value of price changing
         */
-        data class Visible(val fiatAmount: String, val priceChange: PriceChange) : TokenOptionsState
+        data class Visible(val fiatAmount: String, val priceChange: PriceChangeConfig) : TokenOptionsState

        /**
         * Hidden token options state
         *
         * @property priceChange value of price changing
         */
-        data class Hidden(val priceChange: PriceChange) : TokenOptionsState
-
-        /**
-         * Price changing option state
-         *
-         * @property valuePercent value in percent
-         * @property type         type [Type]
-         */
-        data class PriceChange(val valuePercent: String, val type: Type) {
-
-            /** Price changing type */
-            enum class Type {
-                UP, DOWN
-            }
-        }
+        data class Hidden(val priceChange: PriceChangeConfig) : TokenOptionsState
    }
 }
--- a/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/wallet/state/WalletContentItemState.kt
+++ b/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/wallet/state/WalletContentItemState.kt
@ -39,11 +39,11 @@ internal sealed interface WalletContentItemState {
        data class Title(val onExploreClick: () -> Unit) : SingleCurrencyItem

        /**
-         * Transaction group title item
+         * Group title item
         *
         * @property title title
         */
-        data class TransactionGroupTitle(val title: String) : SingleCurrencyItem
+        data class GroupTitle(val title: String) : SingleCurrencyItem

        /**
         * Transaction item
--- a/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/wallet/state/WalletMarketplaceBlockState.kt
+++ b/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/wallet/state/WalletMarketplaceBlockState.kt
@ -0,0 +1,33 @@
+package com.tangem.feature.wallet.presentation.wallet.state
+
+import com.tangem.feature.wallet.presentation.common.state.PriceChangeConfig
+
+/**
+ * Wallet marketplace component state
+ *
+ * @property currencyName currency name
+ *
+[REDACTED_AUTHOR]
+ */
+internal sealed class WalletMarketplaceBlockState(open val currencyName: String) {
+
+    /**
+     * Loading state
+     *
+     * @property currencyName currency name
+     */
+    data class Loading(override val currencyName: String) : WalletMarketplaceBlockState(currencyName = currencyName)
+
+    /**
+     * Content state
+     *
+     * @property currencyName      currency name
+     * @property price             price
+     * @property priceChangeConfig price change config
+     */
+    data class Content(
+        override val currencyName: String,
+        val price: String,
+        val priceChangeConfig: PriceChangeConfig,
+    ) : WalletMarketplaceBlockState(currencyName = currencyName)
+}
--- a/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/wallet/state/WalletStateHolder.kt
+++ b/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/wallet/state/WalletStateHolder.kt
@ -43,12 +43,13 @@ internal sealed class WalletStateHolder(
    /**
     * Single currency wallet content state
     *
-     * @property onBackClick       lambda be invoked when back button is clicked
-     * @property topBarConfig      top bar config
-     * @property walletsListConfig wallets list config
-     * @property contentItems      content items
-     * @property notifications     notifications
-     * @property buttons           manage buttons
+     * @property onBackClick           lambda be invoked when back button is clicked
+     * @property topBarConfig          top bar config
+     * @property walletsListConfig     wallets list config
+     * @property contentItems          content items
+     * @property notifications         notifications
+     * @property buttons               manage buttons
+     * @property marketplaceBlockState marketplace block state
     */
    data class SingleCurrencyContent(
        override val onBackClick: () -> Unit,
@ -57,5 +58,6 @@ internal sealed class WalletStateHolder(
        override val contentItems: ImmutableList<WalletContentItemState.SingleCurrencyItem>,
        override val notifications: ImmutableList<WalletNotification>,
        val buttons: ImmutableList<WalletManageButton>,
+        val marketplaceBlockState: WalletMarketplaceBlockState,
    ) : WalletStateHolder(onBackClick, topBarConfig, walletsListConfig, contentItems, notifications)
 }
--- a/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/wallet/ui/WalletScreen.kt
+++ b/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/wallet/ui/WalletScreen.kt
@ -5,15 +5,14 @@ import androidx.compose.animation.*
 import androidx.compose.foundation.*
 import androidx.compose.foundation.layout.*
 import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.foundation.lazy.items
 import androidx.compose.foundation.lazy.itemsIndexed
 import androidx.compose.foundation.lazy.rememberLazyListState
 import androidx.compose.material3.*
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
-import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.tooling.preview.datasource.CollectionPreviewParameterProvider
@ -27,12 +26,14 @@ import com.tangem.feature.wallet.presentation.common.WalletPreviewData
 import com.tangem.feature.wallet.presentation.common.component.NetworkGroupItem
 import com.tangem.feature.wallet.presentation.common.component.TokenItem
 import com.tangem.feature.wallet.presentation.wallet.state.WalletContentItemState
-import com.tangem.feature.wallet.presentation.wallet.state.WalletManageButtons
 import com.tangem.feature.wallet.presentation.wallet.state.WalletStateHolder
 import com.tangem.feature.wallet.presentation.wallet.ui.components.WalletTopBar
 import com.tangem.feature.wallet.presentation.wallet.ui.components.WalletsList
+import com.tangem.feature.wallet.presentation.wallet.ui.components.singlecurrency.TransactionsBlockGroupTitle
+import com.tangem.feature.wallet.presentation.wallet.ui.components.singlecurrency.TransactionsBlockTitle
+import com.tangem.feature.wallet.presentation.wallet.ui.components.singlecurrency.WalletManageButtons
+import com.tangem.feature.wallet.presentation.wallet.ui.components.singlecurrency.WalletMarketplaceBlock
 import com.tangem.feature.wallet.presentation.wallet.ui.decorations.walletContentItemDecoration
-import com.tangem.feature.wallet.presentation.wallet.ui.decorations.walletNotificationDecoration
 import com.tangem.feature.wallet.presentation.wallet.ui.utils.changeWalletAnimator

 /**
@ -79,19 +80,27 @@ internal fun WalletScreen(state: WalletStateHolder) {
                }
            }

-            itemsIndexed(
+            items(
                items = state.notifications,
-                itemContent = { index, item ->
+                itemContent = { item ->
                    Notification(
                        state = item.state,
-                        modifier = changeableItemModifier.walletNotificationDecoration(
-                            currentIndex = index,
-                            lastIndex = state.notifications.lastIndex,
-                        ),
+                        modifier = changeableItemModifier
+                            .padding(horizontal = TangemTheme.dimens.spacing16)
+                            .padding(bottom = TangemTheme.dimens.spacing14),
                    )
                },
            )

+            if (state is WalletStateHolder.SingleCurrencyContent) {
+                item {
+                    WalletMarketplaceBlock(
+                        state = state.marketplaceBlockState,
+                        modifier = changeableItemModifier.padding(horizontal = TangemTheme.dimens.spacing16),
+                    )
+                }
+            }
+
            itemsIndexed(
                items = state.contentItems,
                key = { index, item ->
@ -99,7 +108,7 @@ internal fun WalletScreen(state: WalletStateHolder) {
                        is WalletContentItemState.MultiCurrencyItem.NetworkGroupTitle -> item.networkName
                        is WalletContentItemState.MultiCurrencyItem.Token -> item.state.id
                        is WalletContentItemState.SingleCurrencyItem.Title -> index
-                        is WalletContentItemState.SingleCurrencyItem.TransactionGroupTitle -> item.title
+                        is WalletContentItemState.SingleCurrencyItem.GroupTitle -> item.title
                        is WalletContentItemState.SingleCurrencyItem.Transaction -> index
                    }
                },
@ -138,10 +147,10 @@ private fun ContentItem(item: WalletContentItemState, modifier: Modifier = Modif
            TokenItem(state = item.state, modifier = modifier)
        }
        is WalletContentItemState.SingleCurrencyItem.Title -> {
-            SingleCurrencyTitle(config = item, modifier = modifier)
+            TransactionsBlockTitle(config = item, modifier = modifier)
        }
-        is WalletContentItemState.SingleCurrencyItem.TransactionGroupTitle -> {
-            TransactionGroupTitle(config = item, modifier = modifier)
+        is WalletContentItemState.SingleCurrencyItem.GroupTitle -> {
+            TransactionsBlockGroupTitle(config = item, modifier = modifier)
        }
        is WalletContentItemState.SingleCurrencyItem.Transaction -> {
            Transaction(state = item.state, modifier = modifier)
@ -149,64 +158,6 @@ private fun ContentItem(item: WalletContentItemState, modifier: Modifier = Modif
    }
 }

-@Composable
-private fun SingleCurrencyTitle(
-    config: WalletContentItemState.SingleCurrencyItem.Title,
-    modifier: Modifier = Modifier,
-) {
-    Row(
-        modifier = modifier
-            .background(TangemTheme.colors.background.primary)
-            .fillMaxWidth()
-            .padding(top = TangemTheme.dimens.spacing12)
-            .padding(horizontal = TangemTheme.dimens.spacing16),
-        horizontalArrangement = Arrangement.SpaceBetween,
-    ) {
-        Text(
-            text = stringResource(id = R.string.common_transactions),
-            color = TangemTheme.colors.text.tertiary,
-            style = TangemTheme.typography.subtitle2,
-        )
-
-        Row(
-            modifier = Modifier.clickable(onClick = config.onExploreClick),
-            horizontalArrangement = Arrangement.spacedBy(space = TangemTheme.dimens.spacing4),
-        ) {
-            Icon(
-                painter = painterResource(id = R.drawable.ic_compass_24),
-                contentDescription = null,
-                modifier = Modifier.size(size = TangemTheme.dimens.size18),
-                tint = TangemTheme.colors.icon.informative,
-            )
-            Text(
-                text = stringResource(id = R.string.common_explorer),
-                color = TangemTheme.colors.text.tertiary,
-                style = TangemTheme.typography.subtitle2,
-            )
-        }
-    }
-}
-
-@Composable
-private fun TransactionGroupTitle(
-    config: WalletContentItemState.SingleCurrencyItem.TransactionGroupTitle,
-    modifier: Modifier = Modifier,
-) {
-    Text(
-        text = config.title,
-        modifier = modifier
-            .background(TangemTheme.colors.background.primary)
-            .fillMaxWidth()
-            .padding(
-                horizontal = TangemTheme.dimens.spacing16,
-                vertical = TangemTheme.dimens.spacing14,
-            ),
-        color = TangemTheme.colors.text.tertiary,
-        textAlign = TextAlign.Start,
-        style = TangemTheme.typography.body2,
-    )
-}
-
@Composable
 private fun OrganizeTokensButton(onClick: () -> Unit, modifier: Modifier = Modifier) {
    RoundedActionButton(
--- a/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/wallet/ui/components/singlecurrency/TransactionsBlockGroupTitle.kt
+++ b/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/wallet/ui/components/singlecurrency/TransactionsBlockGroupTitle.kt
@ -0,0 +1,54 @@
+package com.tangem.feature.wallet.presentation.wallet.ui.components.singlecurrency
+
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.padding
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.text.style.TextAlign
+import androidx.compose.ui.tooling.preview.Preview
+import com.tangem.core.ui.res.TangemTheme
+import com.tangem.feature.wallet.presentation.wallet.state.WalletContentItemState
+
+/**
+ * Transactions block group title
+ *
+ * @param config   config
+ * @param modifier modifier
+ */
+@Composable
+internal fun TransactionsBlockGroupTitle(
+    config: WalletContentItemState.SingleCurrencyItem.GroupTitle,
+    modifier: Modifier = Modifier,
+) {
+    Text(
+        text = config.title,
+        modifier = modifier
+            .background(TangemTheme.colors.background.primary)
+            .fillMaxWidth()
+            .padding(
+                horizontal = TangemTheme.dimens.spacing16,
+                vertical = TangemTheme.dimens.spacing14,
+            ),
+        color = TangemTheme.colors.text.tertiary,
+        textAlign = TextAlign.Start,
+        style = TangemTheme.typography.body2,
+    )
+}
+
+@Preview
+@Composable
+private fun Preview_TransactionsBlockGroupTitle_Light() {
+    TangemTheme(isDark = false) {
+        TransactionsBlockGroupTitle(config = WalletContentItemState.SingleCurrencyItem.GroupTitle(title = "Today"))
+    }
+}
+
+@Preview
+@Composable
+private fun Preview_TransactionsBlockGroupTitle_Dark() {
+    TangemTheme(isDark = true) {
+        TransactionsBlockGroupTitle(config = WalletContentItemState.SingleCurrencyItem.GroupTitle(title = "Today"))
+    }
+}
--- a/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/wallet/ui/components/singlecurrency/TransactionsBlockTitle.kt
+++ b/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/wallet/ui/components/singlecurrency/TransactionsBlockTitle.kt
@ -0,0 +1,79 @@
+package com.tangem.feature.wallet.presentation.wallet.ui.components.singlecurrency
+
+import androidx.compose.foundation.background
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.*
+import androidx.compose.material3.Icon
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.tooling.preview.Preview
+import com.tangem.core.ui.res.TangemTheme
+import com.tangem.feature.wallet.impl.R
+import com.tangem.feature.wallet.presentation.wallet.state.WalletContentItemState
+
+/**
+ * Transactions block title
+ *
+ * @param config   config
+ * @param modifier modifier
+ */
+@Composable
+internal fun TransactionsBlockTitle(
+    config: WalletContentItemState.SingleCurrencyItem.Title,
+    modifier: Modifier = Modifier,
+) {
+    Row(
+        modifier = modifier
+            .background(TangemTheme.colors.background.primary)
+            .fillMaxWidth()
+            .padding(top = TangemTheme.dimens.spacing12)
+            .padding(horizontal = TangemTheme.dimens.spacing16),
+        horizontalArrangement = Arrangement.SpaceBetween,
+    ) {
+        Text(
+            text = stringResource(id = R.string.common_transactions),
+            color = TangemTheme.colors.text.tertiary,
+            style = TangemTheme.typography.subtitle2,
+        )
+
+        Row(
+            modifier = Modifier.clickable(onClick = config.onExploreClick),
+            horizontalArrangement = Arrangement.spacedBy(space = TangemTheme.dimens.spacing4),
+        ) {
+            Icon(
+                painter = painterResource(id = R.drawable.ic_compass_24),
+                contentDescription = null,
+                modifier = Modifier.size(size = TangemTheme.dimens.size18),
+                tint = TangemTheme.colors.icon.informative,
+            )
+            Text(
+                text = stringResource(id = R.string.common_explorer),
+                color = TangemTheme.colors.text.tertiary,
+                style = TangemTheme.typography.subtitle2,
+            )
+        }
+    }
+}
+
+@Preview
+@Composable
+private fun Preview_TransactionsBlockTitle_Light() {
+    TangemTheme(isDark = false) {
+        TransactionsBlockTitle(
+            config = WalletContentItemState.SingleCurrencyItem.Title(onExploreClick = {}),
+        )
+    }
+}
+
+@Preview
+@Composable
+private fun Preview_TransactionsBlockTitle_Dark() {
+    TangemTheme(isDark = true) {
+        TransactionsBlockTitle(
+            config = WalletContentItemState.SingleCurrencyItem.Title(onExploreClick = {}),
+        )
+    }
+}
--- a/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/wallet/ui/components/singlecurrency/WalletManageButtons.kt
+++ b/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/wallet/ui/components/singlecurrency/WalletManageButtons.kt
@ -1,4 +1,4 @@
-package com.tangem.feature.wallet.presentation.wallet.state
+package com.tangem.feature.wallet.presentation.wallet.ui.components.singlecurrency

 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.*
@ -13,6 +13,7 @@ import androidx.compose.ui.tooling.preview.datasource.CollectionPreviewParameter
 import com.tangem.core.ui.components.buttons.actions.ActionButton
 import com.tangem.core.ui.res.TangemTheme
 import com.tangem.feature.wallet.presentation.common.WalletPreviewData
+import com.tangem.feature.wallet.presentation.wallet.state.WalletManageButton
 import kotlinx.collections.immutable.ImmutableList

 /**
--- a/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/wallet/ui/components/singlecurrency/WalletMarketplaceBlock.kt
+++ b/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/wallet/ui/components/singlecurrency/WalletMarketplaceBlock.kt
@ -0,0 +1,158 @@
+package com.tangem.feature.wallet.presentation.wallet.ui.components.singlecurrency
+
+import androidx.compose.foundation.Image
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.*
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material.Text
+import androidx.compose.runtime.*
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.layout.onSizeChanged
+import androidx.compose.ui.platform.LocalDensity
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.res.stringResource
+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 com.tangem.core.ui.components.RectangleShimmer
+import com.tangem.core.ui.res.TangemTheme
+import com.tangem.feature.wallet.impl.R
+import com.tangem.feature.wallet.presentation.common.WalletPreviewData
+import com.tangem.feature.wallet.presentation.common.state.PriceChangeConfig
+import com.tangem.feature.wallet.presentation.wallet.state.WalletMarketplaceBlockState
+
+/**
+ * Wallet marketplace block
+ *
+ * @param state state
+ *
+[REDACTED_AUTHOR]
+ */
+@Composable
+internal fun WalletMarketplaceBlock(state: WalletMarketplaceBlockState, modifier: Modifier = Modifier) {
+    var rootWidth by remember { mutableStateOf(value = 0) }
+    Column(
+        modifier = modifier
+            .background(
+                color = TangemTheme.colors.background.primary,
+                shape = RoundedCornerShape(TangemTheme.dimens.radius14),
+            )
+            .heightIn(min = TangemTheme.dimens.size70)
+            .fillMaxWidth()
+            .padding(all = TangemTheme.dimens.spacing14)
+            .onSizeChanged { rootWidth = it.width },
+        verticalArrangement = Arrangement.spacedBy(TangemTheme.dimens.spacing6),
+        horizontalAlignment = Alignment.Start,
+    ) {
+        Text(
+            text = stringResource(id = R.string.wallet_marketplace_block_title, state.currencyName),
+            color = TangemTheme.colors.text.tertiary,
+            style = TangemTheme.typography.subtitle2,
+        )
+
+        when (state) {
+            is WalletMarketplaceBlockState.Loading -> {
+                RectangleShimmer(
+                    modifier = Modifier.size(width = TangemTheme.dimens.size158, height = TangemTheme.dimens.size20),
+                )
+            }
+            is WalletMarketplaceBlockState.Content -> {
+                Price(
+                    config = state,
+                    priceWidthDp = with(LocalDensity.current) { rootWidth.div(other = 2).toDp() },
+                )
+            }
+        }
+    }
+}
+
+@Composable
+private fun Price(config: WalletMarketplaceBlockState.Content, priceWidthDp: Dp) {
+    Row(
+        modifier = Modifier,
+        verticalAlignment = Alignment.CenterVertically,
+        horizontalArrangement = Arrangement.spacedBy(space = TangemTheme.dimens.spacing8),
+    ) {
+        Text(
+            text = config.price,
+            modifier = Modifier.widthIn(max = priceWidthDp),
+            color = TangemTheme.colors.text.primary1,
+            overflow = TextOverflow.Ellipsis,
+            maxLines = 1,
+            style = TangemTheme.typography.body2,
+        )
+
+        PriceChangeInPercent(config.priceChangeConfig)
+
+        Text(
+            text = stringResource(id = R.string.wallet_marketprice_block_update_time),
+            color = TangemTheme.colors.text.tertiary,
+            style = TangemTheme.typography.body2,
+        )
+    }
+}
+
+@Composable
+private fun PriceChangeInPercent(config: PriceChangeConfig) {
+    Row(
+        verticalAlignment = Alignment.CenterVertically,
+        horizontalArrangement = Arrangement.spacedBy(space = TangemTheme.dimens.spacing4),
+    ) {
+        Image(
+            painter = painterResource(
+                id = when (config.type) {
+                    PriceChangeConfig.Type.UP -> R.drawable.img_arrow_up_8
+                    PriceChangeConfig.Type.DOWN -> R.drawable.img_arrow_down_8
+                },
+            ),
+            contentDescription = null,
+        )
+
+        Text(
+            text = config.valueInPercent,
+            color = when (config.type) {
+                PriceChangeConfig.Type.UP -> TangemTheme.colors.text.accent
+                PriceChangeConfig.Type.DOWN -> TangemTheme.colors.text.warning
+            },
+            style = TangemTheme.typography.body2,
+        )
+    }
+}
+
+@Preview
+@Composable
+private fun Preview_MarketplaceBlock_Light(
+    @PreviewParameter(WalletMarketplaceStateProvider::class)
+    state: WalletMarketplaceBlockState,
+) {
+    TangemTheme(isDark = false) {
+        WalletMarketplaceBlock(state = state)
+    }
+}
+
+@Preview
+@Composable
+private fun Preview_MarketplaceBlock_Dark(
+    @PreviewParameter(WalletMarketplaceStateProvider::class)
+    state: WalletMarketplaceBlockState,
+) {
+    TangemTheme(isDark = true) {
+        WalletMarketplaceBlock(state = state)
+    }
+}
+
+private class WalletMarketplaceStateProvider : CollectionPreviewParameterProvider<WalletMarketplaceBlockState>(
+    collection = listOf(
+        WalletPreviewData.marketplaceBlockContent,
+        WalletPreviewData.marketplaceBlockContent.copy(
+            priceChangeConfig = PriceChangeConfig(
+                valueInPercent = "5.16%",
+                type = PriceChangeConfig.Type.DOWN,
+            ),
+        ),
+        WalletMarketplaceBlockState.Loading(currencyName = "BTC"),
+    ),
+)
--- a/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/wallet/ui/decorations/WalletNotificationDecoration.kt
+++ b/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/wallet/ui/decorations/WalletNotificationDecoration.kt
@ -1,24 +0,0 @@
-package com.tangem.feature.wallet.presentation.wallet.ui.decorations
-
-import androidx.compose.foundation.layout.padding
-import androidx.compose.ui.Modifier
-import androidx.compose.ui.composed
-import com.tangem.core.ui.res.TangemTheme
-
-/**
- * Wallet notification decoration
- *
- * @param currentIndex current index
- * @param lastIndex    last index
- *
-[REDACTED_AUTHOR]
- */
-internal fun Modifier.walletNotificationDecoration(currentIndex: Int, lastIndex: Int): Modifier = composed {
-    val modifierWithHorizontalPadding = this.padding(horizontal = TangemTheme.dimens.spacing16)
-
-    if (currentIndex != lastIndex) {
-        modifierWithHorizontalPadding.padding(bottom = TangemTheme.dimens.spacing14)
-    } else {
-        modifierWithHorizontalPadding
-    }
-}
--- a/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/wallet/ui/utils/WalletContentItemAnimator.kt
+++ b/features/wallet/impl/src/main/java/com/tangem/feature/wallet/presentation/wallet/ui/utils/WalletContentItemAnimator.kt
@ -12,7 +12,7 @@ import androidx.compose.ui.composed
 import androidx.compose.ui.draw.alpha
 import androidx.compose.ui.unit.dp

-private const val ANIMATION_MAX_OFFSET = 80
+private const val ANIMATION_MAX_OFFSET_IN_DP = 80
 private const val ANIMATION_MAX_ALPHA = 1f

 /**
@ -46,7 +46,7 @@ internal fun Modifier.changeWalletAnimator(lazyListState: LazyListState) = compo
                walletItemSize - walletItemOffset
            }

-            ANIMATION_MAX_OFFSET.dp / walletItemSize * position
+            ANIMATION_MAX_OFFSET_IN_DP.dp / walletItemSize * position
        }
    }