Updated on 2026-08-14
This commit is contained in:
Tangem
parent
f8884d521f
commit
0c2999918a
4 changed files with 168 additions and 5 deletions
|
|
@ -2,15 +2,58 @@ package com.tangem.features.managetokens.component.preview
|
|||
|
||||
import androidx.compose.runtime.Composable
|
||||
import androidx.compose.ui.Modifier
|
||||
import androidx.compose.ui.graphics.Color
|
||||
import com.tangem.core.ui.components.currency.tokenicon.TokenIconState
|
||||
import com.tangem.core.ui.components.rows.model.ChainRowUM
|
||||
import com.tangem.core.ui.extensions.stringReference
|
||||
import com.tangem.features.managetokens.component.ManageTokensComponent
|
||||
import com.tangem.features.managetokens.entity.CurrencyItemUM
|
||||
import com.tangem.features.managetokens.entity.ManageTokensUM
|
||||
import com.tangem.features.managetokens.impl.R
|
||||
import com.tangem.features.managetokens.ui.ManageTokensScreen
|
||||
import kotlinx.collections.immutable.persistentListOf
|
||||
import kotlinx.collections.immutable.toImmutableList
|
||||
|
||||
internal class PreviewManageTokensComponent : ManageTokensComponent {
|
||||
|
||||
private val previewState: ManageTokensUM = ManageTokensUM(
|
||||
popBack = {},
|
||||
items = List(size = 30) { index ->
|
||||
if (index < 2) {
|
||||
CurrencyItemUM.Custom(
|
||||
id = index.toString(),
|
||||
model = ChainRowUM(
|
||||
name = stringReference("Custom $index"),
|
||||
type = stringReference("CM$index"),
|
||||
icon = TokenIconState.CustomTokenIcon(
|
||||
tint = Color.White,
|
||||
background = Color.Black,
|
||||
networkBadgeIconResId = R.drawable.img_eth_22,
|
||||
isGrayscale = false,
|
||||
showCustomBadge = true,
|
||||
),
|
||||
showCustom = true,
|
||||
),
|
||||
onRemoveClick = {},
|
||||
)
|
||||
} else {
|
||||
CurrencyItemUM.Basic(
|
||||
id = index.toString(),
|
||||
model = ChainRowUM(
|
||||
name = stringReference("Basic $index"),
|
||||
type = stringReference("BT$index"),
|
||||
icon = TokenIconState.CoinIcon(
|
||||
url = null,
|
||||
fallbackResId = R.drawable.img_btc_22,
|
||||
isGrayscale = false,
|
||||
showCustomBadge = false,
|
||||
),
|
||||
showCustom = false,
|
||||
),
|
||||
isExpanded = false,
|
||||
onExpandClick = {},
|
||||
)
|
||||
}
|
||||
}.toImmutableList(),
|
||||
)
|
||||
|
||||
@Composable
|
||||
|
|
|
|||
|
|
@ -0,0 +1,23 @@
|
|||
package com.tangem.features.managetokens.entity
|
||||
|
||||
import androidx.compose.runtime.Immutable
|
||||
import com.tangem.core.ui.components.rows.model.ChainRowUM
|
||||
|
||||
@Immutable
|
||||
internal sealed class CurrencyItemUM {
|
||||
|
||||
abstract val id: String
|
||||
|
||||
data class Basic(
|
||||
override val id: String,
|
||||
val model: ChainRowUM,
|
||||
val isExpanded: Boolean,
|
||||
val onExpandClick: () -> Unit,
|
||||
) : CurrencyItemUM()
|
||||
|
||||
data class Custom(
|
||||
override val id: String,
|
||||
val model: ChainRowUM,
|
||||
val onRemoveClick: () -> Unit,
|
||||
) : CurrencyItemUM()
|
||||
}
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
package com.tangem.features.managetokens.entity
|
||||
|
||||
import androidx.compose.runtime.Immutable
|
||||
import kotlinx.collections.immutable.ImmutableList
|
||||
|
||||
@Immutable
|
||||
internal data class ManageTokensUM(
|
||||
val popBack: () -> Unit,
|
||||
val items: ImmutableList<CurrencyItemUM>,
|
||||
)
|
||||
|
|
@ -2,14 +2,33 @@ package com.tangem.features.managetokens.ui
|
|||
|
||||
import android.content.res.Configuration
|
||||
import androidx.activity.compose.BackHandler
|
||||
import androidx.compose.animation.core.animateFloatAsState
|
||||
import androidx.compose.foundation.layout.fillMaxSize
|
||||
import androidx.compose.foundation.layout.fillMaxWidth
|
||||
import androidx.compose.foundation.layout.padding
|
||||
import androidx.compose.foundation.layout.size
|
||||
import androidx.compose.foundation.lazy.LazyColumn
|
||||
import androidx.compose.foundation.lazy.items
|
||||
import androidx.compose.material3.Icon
|
||||
import androidx.compose.material3.IconButton
|
||||
import androidx.compose.material3.Scaffold
|
||||
import androidx.compose.runtime.Composable
|
||||
import androidx.compose.runtime.getValue
|
||||
import androidx.compose.ui.Modifier
|
||||
import androidx.compose.ui.draw.rotate
|
||||
import androidx.compose.ui.res.painterResource
|
||||
import androidx.compose.ui.tooling.preview.Preview
|
||||
import com.tangem.core.ui.components.buttons.SecondarySmallButton
|
||||
import com.tangem.core.ui.components.buttons.SmallButtonConfig
|
||||
import com.tangem.core.ui.components.rows.ChainRow
|
||||
import com.tangem.core.ui.extensions.resourceReference
|
||||
import com.tangem.core.ui.res.TangemTheme
|
||||
import com.tangem.core.ui.res.TangemThemePreview
|
||||
import com.tangem.feature.managetokens.component.preview.PreviewManageTokensComponent
|
||||
import com.tangem.feature.managetokens.entity.ManageTokensUM
|
||||
import com.tangem.features.managetokens.component.preview.PreviewManageTokensComponent
|
||||
import com.tangem.features.managetokens.entity.CurrencyItemUM
|
||||
import com.tangem.features.managetokens.entity.ManageTokensUM
|
||||
import com.tangem.features.managetokens.impl.R
|
||||
import kotlinx.collections.immutable.ImmutableList
|
||||
|
||||
@Composable
|
||||
internal fun ManageTokensScreen(state: ManageTokensUM, modifier: Modifier = Modifier) {
|
||||
|
|
@ -17,12 +36,80 @@ internal fun ManageTokensScreen(state: ManageTokensUM, modifier: Modifier = Modi
|
|||
|
||||
Scaffold(
|
||||
modifier = modifier,
|
||||
content = {
|
||||
TODO("Not yet implemented")
|
||||
containerColor = TangemTheme.colors.background.primary,
|
||||
content = { innerPadding ->
|
||||
Currencies(
|
||||
modifier = Modifier
|
||||
.padding(innerPadding)
|
||||
.fillMaxSize(),
|
||||
items = state.items,
|
||||
)
|
||||
},
|
||||
)
|
||||
}
|
||||
|
||||
private const val CHEVRON_ROTATION_EXPANDED = 180f
|
||||
private const val CHEVRON_ROTATION_COLLAPSED = 0f
|
||||
|
||||
@Composable
|
||||
private fun Currencies(items: ImmutableList<CurrencyItemUM>, modifier: Modifier = Modifier) {
|
||||
LazyColumn(
|
||||
modifier = modifier,
|
||||
) {
|
||||
items(
|
||||
items = items,
|
||||
key = CurrencyItemUM::id,
|
||||
) { item ->
|
||||
when (item) {
|
||||
is CurrencyItemUM.Basic -> {
|
||||
ChainRow(
|
||||
modifier = Modifier.fillMaxWidth(),
|
||||
model = item.model,
|
||||
action = {
|
||||
IconButton(
|
||||
modifier = Modifier.size(TangemTheme.dimens.size32),
|
||||
onClick = item.onExpandClick,
|
||||
) {
|
||||
val rotation by animateFloatAsState(
|
||||
targetValue = if (item.isExpanded) {
|
||||
CHEVRON_ROTATION_EXPANDED
|
||||
} else {
|
||||
CHEVRON_ROTATION_COLLAPSED
|
||||
},
|
||||
label = "chevron_rotation",
|
||||
)
|
||||
|
||||
Icon(
|
||||
modifier = Modifier
|
||||
.rotate(rotation)
|
||||
.size(TangemTheme.dimens.size24),
|
||||
painter = painterResource(id = R.drawable.ic_chevron_24),
|
||||
tint = TangemTheme.colors.icon.informative,
|
||||
contentDescription = null,
|
||||
)
|
||||
}
|
||||
},
|
||||
)
|
||||
}
|
||||
is CurrencyItemUM.Custom -> {
|
||||
ChainRow(
|
||||
modifier = Modifier.fillMaxWidth(),
|
||||
model = item.model,
|
||||
action = {
|
||||
SecondarySmallButton(
|
||||
config = SmallButtonConfig(
|
||||
text = resourceReference(R.string.manage_tokens_remove),
|
||||
onClick = item.onRemoveClick,
|
||||
),
|
||||
)
|
||||
},
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// region Preview
|
||||
@Preview(showBackground = true, widthDp = 360, heightDp = 800)
|
||||
@Preview(showBackground = true, widthDp = 360, heightDp = 800, uiMode = Configuration.UI_MODE_NIGHT_YES)
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue