From 796fd7de6462abdef39119293d4702aa084f558c Mon Sep 17 00:00:00 2001 From: Milan Cerovsky Date: Wed, 18 Dec 2024 19:20:32 +0100 Subject: [PATCH] App bar status updated --- .../ui/design/component/ZashiMainTopAppBar.kt | 71 +++++++++++++++---- .../viewmodel/ZashiMainTopAppBarViewModel.kt | 28 ++++++-- .../fixture/ZashiMainTopAppBarStateFixture.kt | 1 + .../main/res/ui/common/values-es/strings.xml | 2 + .../src/main/res/ui/common/values/strings.xml | 2 + 5 files changed, 85 insertions(+), 19 deletions(-) diff --git a/ui-design-lib/src/main/java/co/electriccoin/zcash/ui/design/component/ZashiMainTopAppBar.kt b/ui-design-lib/src/main/java/co/electriccoin/zcash/ui/design/component/ZashiMainTopAppBar.kt index c020162c..54d03e69 100644 --- a/ui-design-lib/src/main/java/co/electriccoin/zcash/ui/design/component/ZashiMainTopAppBar.kt +++ b/ui-design-lib/src/main/java/co/electriccoin/zcash/ui/design/component/ZashiMainTopAppBar.kt @@ -3,6 +3,7 @@ package co.electriccoin.zcash.ui.design.component import androidx.compose.animation.Crossfade import androidx.compose.foundation.Image import androidx.compose.foundation.clickable +import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.Spacer import androidx.compose.foundation.layout.WindowInsets @@ -14,18 +15,24 @@ import androidx.compose.foundation.layout.size import androidx.compose.foundation.layout.systemBars import androidx.compose.foundation.layout.width import androidx.compose.foundation.shape.RoundedCornerShape +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.ColorFilter import androidx.compose.ui.res.painterResource +import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.unit.dp import co.electriccoin.zcash.ui.design.R import co.electriccoin.zcash.ui.design.component.ZashiMainTopAppBarState.AccountType import co.electriccoin.zcash.ui.design.newcomponent.PreviewScreens import co.electriccoin.zcash.ui.design.theme.ZcashTheme import co.electriccoin.zcash.ui.design.theme.colors.ZashiColors +import co.electriccoin.zcash.ui.design.theme.typography.ZashiTypography +import co.electriccoin.zcash.ui.design.util.StringResource +import co.electriccoin.zcash.ui.design.util.getValue +import co.electriccoin.zcash.ui.design.util.stringRes @Composable fun ZashiMainTopAppBar( @@ -34,22 +41,34 @@ fun ZashiMainTopAppBar( ) { if (state == null) return - ZashiSmallTopAppBar( - windowInsets = WindowInsets.systemBars.only(WindowInsetsSides.Top), - hamburgerMenuActions = { - if (showHideBalances) { - Crossfade(state.balanceVisibilityButton, label = "") { - ZashiIconButton(it) + Box { + ZashiSmallTopAppBar( + windowInsets = WindowInsets.systemBars.only(WindowInsetsSides.Top), + hamburgerMenuActions = { + if (showHideBalances) { + Crossfade(state.balanceVisibilityButton, label = "") { + ZashiIconButton(it) + } + Spacer(Modifier.width(4.dp)) } - Spacer(Modifier.width(4.dp)) - } - ZashiIconButton(state.settingsButton) - Spacer(Modifier.width(20.dp)) - }, - navigationAction = { - AccountSwitch(state.accountSwitchState) - }, - ) + ZashiIconButton(state.settingsButton) + Spacer(Modifier.width(20.dp)) + }, + navigationAction = { + AccountSwitch(state.accountSwitchState) + }, + ) + + if (state.subtitle != null) { + Text( + modifier = Modifier.align(Alignment.BottomCenter), + text = state.subtitle.getValue().uppercase(), + style = ZashiTypography.textXs, + fontWeight = FontWeight.Normal, + color = ZashiColors.Text.textQuaternary + ) + } + } } @Composable @@ -108,6 +127,7 @@ data class ZashiMainTopAppBarState( val accountSwitchState: AccountSwitchState, val balanceVisibilityButton: IconButtonState, val settingsButton: IconButtonState, + val subtitle: StringResource? ) { enum class AccountType { ZASHI, @@ -134,6 +154,7 @@ private fun ZashiMainTopAppBarPreview() = ), balanceVisibilityButton = IconButtonState(R.drawable.ic_app_bar_balances_hide) {}, settingsButton = IconButtonState(R.drawable.ic_app_bar_settings) {}, + subtitle = null ) ) } @@ -152,6 +173,26 @@ private fun KeystoneMainTopAppBarPreview() = ), balanceVisibilityButton = IconButtonState(R.drawable.ic_app_bar_balances_hide) {}, settingsButton = IconButtonState(R.drawable.ic_app_bar_settings) {}, + subtitle = null + ) + ) + } + +@PreviewScreens +@Composable +private fun MainTopAppBarWithSubtitlePreview() = + ZcashTheme { + ZashiMainTopAppBar( + state = + ZashiMainTopAppBarState( + accountSwitchState = + AccountSwitchState( + accountType = AccountType.KEYSTONE, + onAccountTypeClick = {}, + ), + balanceVisibilityButton = IconButtonState(R.drawable.ic_app_bar_balances_hide) {}, + settingsButton = IconButtonState(R.drawable.ic_app_bar_settings) {}, + subtitle = stringRes("Subtitle") ) ) } diff --git a/ui-lib/src/main/java/co/electriccoin/zcash/ui/common/viewmodel/ZashiMainTopAppBarViewModel.kt b/ui-lib/src/main/java/co/electriccoin/zcash/ui/common/viewmodel/ZashiMainTopAppBarViewModel.kt index 2dca3c63..1cc45456 100644 --- a/ui-lib/src/main/java/co/electriccoin/zcash/ui/common/viewmodel/ZashiMainTopAppBarViewModel.kt +++ b/ui-lib/src/main/java/co/electriccoin/zcash/ui/common/viewmodel/ZashiMainTopAppBarViewModel.kt @@ -8,9 +8,11 @@ import co.electriccoin.zcash.preference.model.entry.BooleanPreferenceDefault import co.electriccoin.zcash.ui.NavigationRouter import co.electriccoin.zcash.ui.NavigationTargets.SETTINGS import co.electriccoin.zcash.ui.common.model.KeystoneAccount +import co.electriccoin.zcash.ui.common.model.TopAppBarSubTitleState import co.electriccoin.zcash.ui.common.model.WalletAccount import co.electriccoin.zcash.ui.common.model.ZashiAccount import co.electriccoin.zcash.ui.common.usecase.ObserveSelectedWalletAccountUseCase +import co.electriccoin.zcash.ui.common.usecase.ObserveWalletStateUseCase import co.electriccoin.zcash.ui.design.R import co.electriccoin.zcash.ui.design.component.AccountSwitchState import co.electriccoin.zcash.ui.design.component.IconButtonState @@ -31,14 +33,19 @@ import kotlinx.coroutines.launch class ZashiMainTopAppBarViewModel( observeSelectedWalletAccount: ObserveSelectedWalletAccountUseCase, + observeWalletState: ObserveWalletStateUseCase, private val standardPreferenceProvider: StandardPreferenceProvider, private val navigationRouter: NavigationRouter, ) : ViewModel() { private val isHideBalances: StateFlow = booleanStateFlow(StandardPreferenceKeys.IS_HIDE_BALANCES) val state = - combine(observeSelectedWalletAccount.require(), isHideBalances) { currentAccount, isHideBalances -> - createState(currentAccount, isHideBalances) + combine( + observeSelectedWalletAccount.require(), + isHideBalances, + observeWalletState() + ) { currentAccount, isHideBalances, walletState -> + createState(currentAccount, isHideBalances, walletState) }.stateIn( scope = viewModelScope, started = SharingStarted.WhileSubscribed(ANDROID_STATE_FLOW_TIMEOUT), @@ -47,7 +54,8 @@ class ZashiMainTopAppBarViewModel( private fun createState( currentAccount: WalletAccount, - isHideBalances: Boolean? + isHideBalances: Boolean?, + topAppBarSubTitleState: TopAppBarSubTitleState ) = ZashiMainTopAppBarState( accountSwitchState = AccountSwitchState( @@ -74,7 +82,19 @@ class ZashiMainTopAppBarViewModel( icon = R.drawable.ic_app_bar_settings, onClick = ::onSettingsClicked, contentDescription = stringRes(co.electriccoin.zcash.ui.R.string.settings_menu_content_description) - ) + ), + subtitle = + when (topAppBarSubTitleState) { + TopAppBarSubTitleState.Disconnected -> + stringRes( + co.electriccoin.zcash.ui.R.string.disconnected_label_new, + ) + TopAppBarSubTitleState.Restoring -> + stringRes( + co.electriccoin.zcash.ui.R.string.restoring_wallet_label_new, + ) + TopAppBarSubTitleState.None -> null + } ) private fun onAccountTypeClicked() = navigationRouter.forward(AccountList) diff --git a/ui-lib/src/main/java/co/electriccoin/zcash/ui/fixture/ZashiMainTopAppBarStateFixture.kt b/ui-lib/src/main/java/co/electriccoin/zcash/ui/fixture/ZashiMainTopAppBarStateFixture.kt index f4734e10..41d3f706 100644 --- a/ui-lib/src/main/java/co/electriccoin/zcash/ui/fixture/ZashiMainTopAppBarStateFixture.kt +++ b/ui-lib/src/main/java/co/electriccoin/zcash/ui/fixture/ZashiMainTopAppBarStateFixture.kt @@ -27,5 +27,6 @@ object ZashiMainTopAppBarStateFixture { accountSwitchState = accountSwitchState, balanceVisibilityButton = balanceVisibilityButton, settingsButton = settingsButton, + subtitle = null ) } diff --git a/ui-lib/src/main/res/ui/common/values-es/strings.xml b/ui-lib/src/main/res/ui/common/values-es/strings.xml index a136b22e..a9519301 100644 --- a/ui-lib/src/main/res/ui/common/values-es/strings.xml +++ b/ui-lib/src/main/res/ui/common/values-es/strings.xml @@ -15,7 +15,9 @@ No se pudo iniciar la aplicación de correo electrónico. [Restaurando tu billetera…] + Restaurando tu billetera… [Desconectado…] + Desconectado… No se pudo iniciar la aplicación de Google Play Store… Aviso diff --git a/ui-lib/src/main/res/ui/common/values/strings.xml b/ui-lib/src/main/res/ui/common/values/strings.xml index 0de4a773..95fdd0c0 100644 --- a/ui-lib/src/main/res/ui/common/values/strings.xml +++ b/ui-lib/src/main/res/ui/common/values/strings.xml @@ -15,7 +15,9 @@ Unable to launch email app. [Restoring Your Wallet…] + Restoring Your Wallet… [Disconnected…] + Disconnected… Unable to launch Google Play Store app… Heads up