Updated on 2026-08-14

This commit is contained in:
Tangem 2023-07-13 08:59:18 +05:00
parent d9b3679274
commit 8a46d815b9
10 changed files with 74 additions and 91 deletions

View file

@ -1,4 +1,4 @@
package com.tangem.feature.wallet.presentation.wallet.ui.components.singlecurrency
package com.tangem.core.ui.components.marketprice
import androidx.compose.foundation.Image
import androidx.compose.foundation.background
@ -17,22 +17,17 @@ 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.R
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]
* @see <a href =
* "https://www.figma.com/file/14ISV23YB1yVW1uNVwqrKv/Android?type=design&node-id=1217-922&mode=design&t=t1PxyisyGJSwzQwg-4"
* >Figma component</a>
*/
@Composable
internal fun WalletMarketplaceBlock(state: WalletMarketplaceBlockState, modifier: Modifier = Modifier) {
fun MarketPriceBlock(state: MarketPriceBlockState, modifier: Modifier = Modifier) {
var rootWidth by remember { mutableStateOf(value = 0) }
Column(
modifier = modifier
@ -54,12 +49,12 @@ internal fun WalletMarketplaceBlock(state: WalletMarketplaceBlockState, modifier
)
when (state) {
is WalletMarketplaceBlockState.Loading -> {
is MarketPriceBlockState.Loading -> {
RectangleShimmer(
modifier = Modifier.size(width = TangemTheme.dimens.size158, height = TangemTheme.dimens.size20),
)
}
is WalletMarketplaceBlockState.Content -> {
is MarketPriceBlockState.Content -> {
Price(
config = state,
priceWidthDp = with(LocalDensity.current) { rootWidth.div(other = 2).toDp() },
@ -70,7 +65,7 @@ internal fun WalletMarketplaceBlock(state: WalletMarketplaceBlockState, modifier
}
@Composable
private fun Price(config: WalletMarketplaceBlockState.Content, priceWidthDp: Dp) {
private fun Price(config: MarketPriceBlockState.Content, priceWidthDp: Dp) {
Row(
modifier = Modifier,
verticalAlignment = Alignment.CenterVertically,
@ -124,35 +119,44 @@ private fun PriceChangeInPercent(config: PriceChangeConfig) {
@Preview
@Composable
private fun Preview_MarketplaceBlock_Light(
@PreviewParameter(WalletMarketplaceStateProvider::class)
state: WalletMarketplaceBlockState,
private fun Preview_MarketPriceBlock_Light(
@PreviewParameter(WalletMarketPriceBlockStateProvider::class)
state: MarketPriceBlockState,
) {
TangemTheme(isDark = false) {
WalletMarketplaceBlock(state = state)
MarketPriceBlock(state = state)
}
}
@Preview
@Composable
private fun Preview_MarketplaceBlock_Dark(
@PreviewParameter(WalletMarketplaceStateProvider::class)
state: WalletMarketplaceBlockState,
private fun Preview_MarketPriceBlock_Dark(
@PreviewParameter(WalletMarketPriceBlockStateProvider::class)
state: MarketPriceBlockState,
) {
TangemTheme(isDark = true) {
WalletMarketplaceBlock(state = state)
MarketPriceBlock(state = state)
}
}
private class WalletMarketplaceStateProvider : CollectionPreviewParameterProvider<WalletMarketplaceBlockState>(
private class WalletMarketPriceBlockStateProvider : CollectionPreviewParameterProvider<MarketPriceBlockState>(
collection = listOf(
WalletPreviewData.marketplaceBlockContent,
WalletPreviewData.marketplaceBlockContent.copy(
MarketPriceBlockState.Content(
currencyName = "BTC",
price = "98900",
priceChangeConfig = PriceChangeConfig(
valueInPercent = "5.16%",
type = PriceChangeConfig.Type.DOWN,
),
),
WalletMarketplaceBlockState.Loading(currencyName = "BTC"),
MarketPriceBlockState.Content(
currencyName = "BTC",
price = "98900",
priceChangeConfig = PriceChangeConfig(
valueInPercent = "10.89%",
type = PriceChangeConfig.Type.UP,
),
),
MarketPriceBlockState.Loading(currencyName = "BTC"),
),
)

View file

@ -0,0 +1,17 @@
package com.tangem.core.ui.components.marketprice
import androidx.compose.runtime.Immutable
@Immutable
sealed interface MarketPriceBlockState {
val currencyName: String
data class Loading(override val currencyName: String) : MarketPriceBlockState
data class Content(
override val currencyName: String,
val price: String,
val priceChangeConfig: PriceChangeConfig,
) : MarketPriceBlockState
}

View file

@ -0,0 +1,9 @@
package com.tangem.core.ui.components.marketprice
data class PriceChangeConfig(val valueInPercent: String, val type: Type) {
/** Price changing type */
enum class Type {
UP, DOWN
}
}

View file

@ -1,8 +1,9 @@
package com.tangem.feature.wallet.presentation.common
import com.tangem.core.ui.R
import com.tangem.core.ui.components.marketprice.MarketPriceBlockState
import com.tangem.core.ui.components.marketprice.PriceChangeConfig
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
@ -204,15 +205,6 @@ 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,
@ -300,6 +292,13 @@ internal object WalletPreviewData {
),
notifications = persistentListOf(WalletNotification.LikeTangemApp(onClick = {})),
buttons = manageButtons,
marketplaceBlockState = marketplaceBlockContent,
marketPriceBlockState = MarketPriceBlockState.Content(
currencyName = "BTC",
price = "98900.12$",
priceChangeConfig = PriceChangeConfig(
valueInPercent = "5.16%",
type = PriceChangeConfig.Type.UP,
),
),
)
}

View file

@ -28,11 +28,11 @@ import androidx.constraintlayout.compose.Dimension
import coil.compose.SubcomposeAsyncImage
import coil.request.ImageRequest
import com.tangem.core.ui.components.*
import com.tangem.core.ui.components.marketprice.PriceChangeConfig
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

View file

@ -1,15 +0,0 @@
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
}
}

View file

@ -2,6 +2,7 @@ package com.tangem.feature.wallet.presentation.common.state
import androidx.annotation.DrawableRes
import androidx.compose.runtime.Immutable
import com.tangem.core.ui.components.marketprice.PriceChangeConfig
/** Token item state */
@Immutable

View file

@ -1,33 +0,0 @@
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)
}

View file

@ -1,5 +1,6 @@
package com.tangem.feature.wallet.presentation.wallet.state
import com.tangem.core.ui.components.marketprice.MarketPriceBlockState
import kotlinx.collections.immutable.ImmutableList
/**
@ -49,7 +50,7 @@ internal sealed class WalletStateHolder(
* @property contentItems content items
* @property notifications notifications
* @property buttons manage buttons
* @property marketplaceBlockState marketplace block state
* @property marketPriceBlockState market price block state
*/
data class SingleCurrencyContent(
override val onBackClick: () -> Unit,
@ -58,6 +59,6 @@ internal sealed class WalletStateHolder(
override val contentItems: ImmutableList<WalletContentItemState.SingleCurrencyItem>,
override val notifications: ImmutableList<WalletNotification>,
val buttons: ImmutableList<WalletManageButton>,
val marketplaceBlockState: WalletMarketplaceBlockState,
val marketPriceBlockState: MarketPriceBlockState,
) : WalletStateHolder(onBackClick, topBarConfig, walletsListConfig, contentItems, notifications)
}

View file

@ -18,6 +18,7 @@ import androidx.compose.ui.tooling.preview.PreviewParameter
import androidx.compose.ui.tooling.preview.datasource.CollectionPreviewParameterProvider
import com.tangem.core.ui.components.buttons.actions.ActionButtonConfig
import com.tangem.core.ui.components.buttons.actions.RoundedActionButton
import com.tangem.core.ui.components.marketprice.MarketPriceBlock
import com.tangem.core.ui.components.notifications.Notification
import com.tangem.core.ui.components.transactions.Transaction
import com.tangem.core.ui.res.TangemTheme
@ -33,7 +34,6 @@ 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.utils.changeWalletAnimator
@ -94,8 +94,8 @@ internal fun WalletScreen(state: WalletStateHolder) {
if (state is WalletStateHolder.SingleCurrencyContent) {
item {
WalletMarketplaceBlock(
state = state.marketplaceBlockState,
MarketPriceBlock(
state = state.marketPriceBlockState,
modifier = changeableItemModifier
.padding(top = TangemTheme.dimens.spacing14)
.padding(horizontal = TangemTheme.dimens.spacing16),