From 126900b6ffc4b4f52e0b813e0a08cc51149b18b9 Mon Sep 17 00:00:00 2001 From: Tangem Date: Fri, 9 Dec 2022 13:30:44 +0300 Subject: [PATCH] Updated on 2026-08-14 --- .../WallectSelectorScreenContent.kt | 251 +++++++++++------- .../com/tangem/core/ui/res/TangemDimens.kt | 1 + 2 files changed, 158 insertions(+), 94 deletions(-) diff --git a/app/src/main/java/com/tangem/tap/features/walletSelector/ui/components/WallectSelectorScreenContent.kt b/app/src/main/java/com/tangem/tap/features/walletSelector/ui/components/WallectSelectorScreenContent.kt index 106ff7f37b..5e972b5dfc 100644 --- a/app/src/main/java/com/tangem/tap/features/walletSelector/ui/components/WallectSelectorScreenContent.kt +++ b/app/src/main/java/com/tangem/tap/features/walletSelector/ui/components/WallectSelectorScreenContent.kt @@ -1,11 +1,23 @@ package com.tangem.tap.features.walletSelector.ui.components -import androidx.compose.foundation.* -import androidx.compose.foundation.layout.* +import androidx.compose.foundation.ExperimentalFoundationApi +import androidx.compose.foundation.background +import androidx.compose.foundation.combinedClickable +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.fillMaxWidth +import androidx.compose.foundation.layout.height +import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.layout.size +import androidx.compose.foundation.rememberScrollState +import androidx.compose.foundation.verticalScroll import androidx.compose.material.Icon import androidx.compose.material.IconButton import androidx.compose.material.Text import androidx.compose.runtime.Composable +import androidx.compose.runtime.derivedStateOf import androidx.compose.runtime.getValue import androidx.compose.runtime.remember import androidx.compose.runtime.rememberUpdatedState @@ -15,7 +27,11 @@ 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 com.tangem.core.ui.components.* +import com.tangem.core.ui.components.PrimaryButton +import com.tangem.core.ui.components.SecondaryButtonIconRight +import com.tangem.core.ui.components.SpacerH16 +import com.tangem.core.ui.components.SpacerH24 +import com.tangem.core.ui.components.SpacerWMax import com.tangem.core.ui.components.atoms.Hand import com.tangem.core.ui.res.TangemTheme import com.tangem.tap.features.details.ui.cardsettings.resolveReference @@ -35,31 +51,16 @@ internal fun WalletSelectorScreenContent( onEditSelectedWalletClick: () -> Unit, onDeleteSelectedWalletsClick: () -> Unit, ) { - val editingWalletsSize by rememberUpdatedState(newValue = state.editingWalletsIds.size) - Column(modifier = modifier) { - Hand() - SpacerH12() - if (editingWalletsSize > 0) { - EditWalletsBar( - modifier = Modifier - .padding(horizontal = TangemTheme.dimens.spacing16) - .fillMaxWidth(), - editingWalletsSize = editingWalletsSize, - onClearSelectedClick = onClearSelectedClick, - onEditSelectedWalletClick = onEditSelectedWalletClick, - onDeleteSelectedWalletsClick = onDeleteSelectedWalletsClick, - ) - } else { - Text( - modifier = Modifier.fillMaxWidth(), - text = stringResource(R.string.user_wallet_list_title), - style = TangemTheme.typography.subtitle1, - color = TangemTheme.colors.text.primary1, - textAlign = TextAlign.Center, - ) - } - SpacerH12() + Header( + modifier = Modifier + .padding(horizontal = TangemTheme.dimens.spacing16) + .fillMaxWidth(), + editingWalletsIds = state.editingWalletsIds, + onClearSelectedClick = onClearSelectedClick, + onEditSelectedWalletClick = onEditSelectedWalletClick, + onDeleteSelectedWalletsClick = onDeleteSelectedWalletsClick, + ) Column( modifier = Modifier .verticalScroll( @@ -76,28 +77,15 @@ internal fun WalletSelectorScreenContent( onWalletLongClick = onWalletLongClick, ) SpacerH24() - if (state.isLocked) { - PrimaryButton( - modifier = Modifier - .padding(horizontal = TangemTheme.dimens.spacing16) - .fillMaxWidth(), - text = stringResource( - id = R.string.user_wallet_list_unlock_all, - stringResource(id = R.string.common_biometrics), - ), - showProgress = state.showUnlockProgress, - onClick = onUnlockClick, - ) - SpacerH12() - } - SecondaryButtonIconRight( + Footer( modifier = Modifier .padding(horizontal = TangemTheme.dimens.spacing16) .fillMaxWidth(), - text = stringResource(R.string.user_wallet_list_add_button), - showProgress = state.showAddCardProgress, - icon = painterResource(id = R.drawable.ic_tangem), - onClick = onAddCardClick, + isLocked = state.isLocked, + showUnlockProgress = state.showUnlockProgress, + showAddCardProgress = state.showAddCardProgress, + onUnlockClick = onUnlockClick, + onAddCardClick = onAddCardClick, ) SpacerH16() } @@ -105,62 +93,42 @@ internal fun WalletSelectorScreenContent( } @Composable -private fun EditWalletsBar( +private fun Header( modifier: Modifier = Modifier, - editingWalletsSize: Int, + editingWalletsIds: List, onClearSelectedClick: () -> Unit, onEditSelectedWalletClick: () -> Unit, onDeleteSelectedWalletsClick: () -> Unit, ) { - val showEditAction = remember(editingWalletsSize) { editingWalletsSize in 1 until 2 } - Row( - modifier = modifier - .padding(vertical = TangemTheme.dimens.spacing8) - .fillMaxWidth(), - verticalAlignment = Alignment.CenterVertically, - ) { - IconButton( - modifier = Modifier.size(TangemTheme.dimens.size32), - onClick = onClearSelectedClick, + val editingWalletsSize by rememberUpdatedState(newValue = editingWalletsIds.size) + val hasEditingWallets by remember { + derivedStateOf { editingWalletsSize > 0 } + } + + Column(modifier = modifier) { + Hand() + Box( + modifier = Modifier + .fillMaxWidth() + .height(TangemTheme.dimens.size44), + contentAlignment = Alignment.Center, ) { - Icon( - modifier = Modifier.size(TangemTheme.dimens.size24), - painter = painterResource(id = R.drawable.ic_close), - tint = TangemTheme.colors.icon.primary1, - contentDescription = "Unselect wallets", - ) - } - SpacerW16() - Text( - text = stringResource(id = R.string.user_wallet_list_editing_count, editingWalletsSize), - style = TangemTheme.typography.subtitle1, - color = TangemTheme.colors.text.primary1, - ) - SpacerWMax() - if (showEditAction) { - IconButton( - modifier = Modifier.size(TangemTheme.dimens.size32), - onClick = onEditSelectedWalletClick, - ) { - Icon( - modifier = Modifier.size(TangemTheme.dimens.size24), - painter = painterResource(id = R.drawable.ic_pencil_outline_24), - tint = TangemTheme.colors.icon.primary1, - contentDescription = "Edit wallet name", + if (hasEditingWallets) { + EditWalletsBar( + modifier = Modifier.fillMaxWidth(), + editingWalletsSize = editingWalletsSize, + onClearSelectedClick = onClearSelectedClick, + onEditSelectedWalletClick = onEditSelectedWalletClick, + onDeleteSelectedWalletsClick = onDeleteSelectedWalletsClick, + ) + } else { + Text( + text = stringResource(R.string.user_wallet_list_title), + style = TangemTheme.typography.subtitle1, + color = TangemTheme.colors.text.primary1, + textAlign = TextAlign.Center, ) } - SpacerW8() - } - IconButton( - modifier = Modifier.size(TangemTheme.dimens.size32), - onClick = onDeleteSelectedWalletsClick, - ) { - Icon( - modifier = Modifier.size(TangemTheme.dimens.size24), - painter = painterResource(id = R.drawable.ic_trash), - tint = TangemTheme.colors.icon.warning, - contentDescription = "Delete selected wallets", - ) } } } @@ -208,6 +176,101 @@ private fun WalletsList( } } +@Composable +private fun Footer( + modifier: Modifier = Modifier, + isLocked: Boolean, + showUnlockProgress: Boolean, + showAddCardProgress: Boolean, + onUnlockClick: () -> Unit, + onAddCardClick: () -> Unit, +) { + Column( + modifier = modifier, + verticalArrangement = Arrangement.spacedBy(TangemTheme.dimens.spacing12), + ) { + if (isLocked) { + PrimaryButton( + modifier = Modifier.fillMaxWidth(), + text = stringResource( + id = R.string.user_wallet_list_unlock_all, + stringResource(id = R.string.common_biometrics), + ), + showProgress = showUnlockProgress, + onClick = onUnlockClick, + ) + } + SecondaryButtonIconRight( + modifier = Modifier.fillMaxWidth(), + text = stringResource(R.string.user_wallet_list_add_button), + showProgress = showAddCardProgress, + icon = painterResource(id = R.drawable.ic_tangem), + onClick = onAddCardClick, + ) + } +} + +@Composable +private fun EditWalletsBar( + modifier: Modifier = Modifier, + editingWalletsSize: Int, + onClearSelectedClick: () -> Unit, + onEditSelectedWalletClick: () -> Unit, + onDeleteSelectedWalletsClick: () -> Unit, +) { + val showEditAction by remember(editingWalletsSize) { + derivedStateOf { editingWalletsSize in 1 until 2 } + } + + Row( + modifier = modifier, + verticalAlignment = Alignment.CenterVertically, + horizontalArrangement = Arrangement.spacedBy(TangemTheme.dimens.spacing12), + ) { + IconButton( + modifier = Modifier.size(TangemTheme.dimens.size32), + onClick = onClearSelectedClick, + ) { + Icon( + modifier = Modifier.size(TangemTheme.dimens.size24), + painter = painterResource(id = R.drawable.ic_close), + tint = TangemTheme.colors.icon.primary1, + contentDescription = "Unselect wallets", + ) + } + Text( + text = stringResource(id = R.string.user_wallet_list_editing_count, editingWalletsSize), + style = TangemTheme.typography.subtitle1, + color = TangemTheme.colors.text.primary1, + ) + SpacerWMax() + if (showEditAction) { + IconButton( + modifier = Modifier.size(TangemTheme.dimens.size32), + onClick = onEditSelectedWalletClick, + ) { + Icon( + modifier = Modifier.size(TangemTheme.dimens.size24), + painter = painterResource(id = R.drawable.ic_pencil_outline_24), + tint = TangemTheme.colors.icon.primary1, + contentDescription = "Change wallet name", + ) + } + } + IconButton( + modifier = Modifier.size(TangemTheme.dimens.size32), + onClick = onDeleteSelectedWalletsClick, + ) { + Icon( + modifier = Modifier.size(TangemTheme.dimens.size24), + painter = painterResource(id = R.drawable.ic_trash), + tint = TangemTheme.colors.icon.warning, + contentDescription = "Delete selected wallets", + ) + } + } +} + // region Preview @Composable private fun WalletSelectorScreenContentSample( diff --git a/core/ui/src/main/java/com/tangem/core/ui/res/TangemDimens.kt b/core/ui/src/main/java/com/tangem/core/ui/res/TangemDimens.kt index 5b111b5e96..6fdc0363f4 100644 --- a/core/ui/src/main/java/com/tangem/core/ui/res/TangemDimens.kt +++ b/core/ui/src/main/java/com/tangem/core/ui/res/TangemDimens.kt @@ -40,6 +40,7 @@ data class TangemDimens internal constructor( val size32: Dp = 32.dp, val size40: Dp = 40.dp, val size42: Dp = 42.dp, + val size44: Dp = 44.dp, val size48: Dp = 48.dp, val size56: Dp = 56.dp, val size62: Dp = 62.dp,