Updated on 2026-08-14
This commit is contained in:
parent
ac121ce008
commit
941baf081b
13 changed files with 237 additions and 11 deletions
|
|
@ -18,9 +18,11 @@ dependencies {
|
|||
|
||||
/** Common */
|
||||
implementation(projects.common.routing)
|
||||
implementation(projects.common.ui)
|
||||
|
||||
/** Features api */
|
||||
implementation(projects.features.tangempay.onboarding.api)
|
||||
implementation(projects.features.kyc.api)
|
||||
|
||||
/** Compose */
|
||||
implementation(deps.compose.foundation)
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@ import com.tangem.features.tangempay.components.TangemPayOnboardingComponent
|
|||
import com.tangem.features.tangempay.ui.TangemPayOnboardingScreenState
|
||||
import com.tangem.utils.coroutines.CoroutineDispatcherProvider
|
||||
import kotlinx.coroutines.flow.MutableStateFlow
|
||||
import kotlinx.coroutines.flow.asStateFlow
|
||||
import kotlinx.coroutines.flow.StateFlow
|
||||
import javax.inject.Inject
|
||||
|
||||
@Stable
|
||||
|
|
@ -21,8 +21,6 @@ internal class TangemPayOnboardingModel @Inject constructor(
|
|||
@Suppress("UnusedPrivateMember")
|
||||
private val params = paramsContainer.require<TangemPayOnboardingComponent.Params>()
|
||||
|
||||
private val _screenState: MutableStateFlow<TangemPayOnboardingScreenState> = MutableStateFlow(getInitState())
|
||||
val screenState = _screenState.asStateFlow()
|
||||
|
||||
private fun getInitState() = TangemPayOnboardingScreenState
|
||||
val screenState: StateFlow<TangemPayOnboardingScreenState>
|
||||
field = MutableStateFlow(TangemPayOnboardingScreenState())
|
||||
}
|
||||
|
|
@ -1,15 +1,17 @@
|
|||
package com.tangem.features.tangempay.ui
|
||||
|
||||
import android.content.res.Configuration
|
||||
import androidx.compose.foundation.layout.fillMaxSize
|
||||
import androidx.compose.foundation.layout.padding
|
||||
import androidx.compose.foundation.layout.statusBarsPadding
|
||||
import androidx.compose.material3.Scaffold
|
||||
import androidx.compose.runtime.Composable
|
||||
import androidx.compose.ui.Modifier
|
||||
import androidx.compose.ui.tooling.preview.Preview
|
||||
import com.tangem.core.ui.R
|
||||
import com.tangem.core.ui.components.appbar.AppBarWithBackButton
|
||||
import com.tangem.core.ui.res.TangemThemePreview
|
||||
|
||||
@Suppress("UnusedPrivateMember")
|
||||
@Composable
|
||||
internal fun TandemPayOnboardingScreen(state: TangemPayOnboardingScreenState, modifier: Modifier = Modifier) {
|
||||
Scaffold(
|
||||
|
|
@ -18,14 +20,25 @@ internal fun TandemPayOnboardingScreen(state: TangemPayOnboardingScreenState, mo
|
|||
AppBarWithBackButton(
|
||||
modifier = Modifier.statusBarsPadding(),
|
||||
onBackClick = {},
|
||||
text = "",
|
||||
iconRes = R.drawable.ic_back_24,
|
||||
)
|
||||
},
|
||||
content = { paddingValues ->
|
||||
val contentModifier = Modifier
|
||||
.padding(paddingValues)
|
||||
.fillMaxSize()
|
||||
TangemPayOnboardingContent(
|
||||
modifier = Modifier
|
||||
.padding(paddingValues)
|
||||
.fillMaxSize(),
|
||||
state = state,
|
||||
)
|
||||
},
|
||||
)
|
||||
}
|
||||
|
||||
@Preview(showBackground = true)
|
||||
@Preview(showBackground = true, uiMode = Configuration.UI_MODE_NIGHT_YES)
|
||||
@Composable
|
||||
private fun PreviewDarkTheme() {
|
||||
TangemThemePreview {
|
||||
TandemPayOnboardingScreen(state = TangemPayOnboardingScreenState())
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,48 @@
|
|||
package com.tangem.features.tangempay.ui
|
||||
|
||||
import androidx.annotation.DrawableRes
|
||||
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.unit.dp
|
||||
import com.tangem.core.ui.extensions.TextReference
|
||||
import com.tangem.core.ui.extensions.resolveReference
|
||||
import com.tangem.core.ui.res.TangemTheme
|
||||
|
||||
@Composable
|
||||
internal fun TangemPayOnboardingBlock(
|
||||
@DrawableRes painterRes: Int,
|
||||
titleRef: TextReference,
|
||||
descriptionRef: TextReference,
|
||||
modifier: Modifier = Modifier,
|
||||
) {
|
||||
Row(
|
||||
modifier = modifier
|
||||
.padding(start = 32.dp, end = 32.dp),
|
||||
) {
|
||||
Icon(
|
||||
painter = painterResource(id = painterRes),
|
||||
contentDescription = null,
|
||||
modifier = Modifier
|
||||
.width(24.dp)
|
||||
.height(24.dp),
|
||||
)
|
||||
Column(
|
||||
modifier = Modifier.padding(start = 12.dp),
|
||||
) {
|
||||
Text(
|
||||
text = titleRef.resolveReference(),
|
||||
style = TangemTheme.typography.subtitle1,
|
||||
color = TangemTheme.colors.text.primary1,
|
||||
)
|
||||
Text(
|
||||
text = descriptionRef.resolveReference(),
|
||||
style = TangemTheme.typography.body2,
|
||||
color = TangemTheme.colors.text.secondary,
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,36 @@
|
|||
package com.tangem.features.tangempay.ui
|
||||
|
||||
import androidx.compose.runtime.Composable
|
||||
import androidx.compose.ui.Modifier
|
||||
import androidx.compose.ui.unit.dp
|
||||
import com.tangem.core.ui.R
|
||||
import com.tangem.core.ui.components.SpacerH
|
||||
import com.tangem.core.ui.extensions.TextReference
|
||||
|
||||
@Composable
|
||||
internal fun TangemPayOnboardingBLocks(modifier: Modifier = Modifier) {
|
||||
TangemPayOnboardingBlock(
|
||||
modifier = modifier,
|
||||
painterRes = R.drawable.ic_security_check_22,
|
||||
titleRef = TextReference.Res(R.string.tangempay_onboarding_security_title),
|
||||
descriptionRef = TextReference.Res(R.string.tangempay_onboarding_security_description),
|
||||
)
|
||||
|
||||
SpacerH(18.dp)
|
||||
|
||||
TangemPayOnboardingBlock(
|
||||
modifier = modifier,
|
||||
painterRes = R.drawable.ic_shopping_basket_22,
|
||||
titleRef = TextReference.Res(R.string.tangempay_onboarding_purchases_title),
|
||||
descriptionRef = TextReference.Res(R.string.tangempay_onboarding_purchases_description),
|
||||
)
|
||||
|
||||
SpacerH(18.dp)
|
||||
|
||||
TangemPayOnboardingBlock(
|
||||
modifier = modifier,
|
||||
painterRes = R.drawable.ic_credit_card_add_22,
|
||||
titleRef = TextReference.Res(R.string.tangempay_onboarding_pay_title),
|
||||
descriptionRef = TextReference.Res(R.string.tangempay_onboarding_pay_description),
|
||||
)
|
||||
}
|
||||
|
|
@ -0,0 +1,80 @@
|
|||
package com.tangem.features.tangempay.ui
|
||||
|
||||
import androidx.compose.foundation.Image
|
||||
import androidx.compose.foundation.layout.*
|
||||
import androidx.compose.material3.CircularProgressIndicator
|
||||
import androidx.compose.material3.Text
|
||||
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.text.style.TextAlign
|
||||
import androidx.compose.ui.unit.dp
|
||||
import com.tangem.common.ui.navigationButtons.NavigationButton
|
||||
import com.tangem.common.ui.navigationButtons.NavigationPrimaryButton
|
||||
import com.tangem.core.ui.components.SpacerH
|
||||
import com.tangem.core.ui.extensions.resourceReference
|
||||
import com.tangem.core.ui.extensions.stringResourceSafe
|
||||
import com.tangem.core.ui.res.TangemTheme
|
||||
import com.tangem.features.tangempay.onboarding.impl.R
|
||||
|
||||
@Composable
|
||||
internal fun TangemPayOnboardingContent(state: TangemPayOnboardingScreenState, modifier: Modifier = Modifier) {
|
||||
if (state.fullScreenLoading) {
|
||||
Box(
|
||||
modifier = modifier.fillMaxSize(),
|
||||
contentAlignment = Alignment.Center,
|
||||
) {
|
||||
CircularProgressIndicator(
|
||||
modifier = Modifier,
|
||||
color = TangemTheme.colors.icon.primary1,
|
||||
)
|
||||
}
|
||||
} else {
|
||||
Column(
|
||||
modifier
|
||||
.fillMaxSize()
|
||||
.navigationBarsPadding(),
|
||||
) {
|
||||
Column(
|
||||
modifier = Modifier
|
||||
.weight(1f)
|
||||
.padding(top = 24.dp, bottom = 32.dp),
|
||||
horizontalAlignment = Alignment.CenterHorizontally,
|
||||
) {
|
||||
Image(
|
||||
painter = painterResource(id = R.drawable.img_tangem_pay_onboarding),
|
||||
contentDescription = null,
|
||||
modifier = Modifier
|
||||
.height(250.dp)
|
||||
.fillMaxWidth(),
|
||||
)
|
||||
|
||||
Text(
|
||||
text = stringResourceSafe(R.string.tangempay_onboarding_title),
|
||||
style = TangemTheme.typography.h2,
|
||||
color = TangemTheme.colors.text.primary1,
|
||||
textAlign = TextAlign.Center,
|
||||
)
|
||||
|
||||
SpacerH(32.dp)
|
||||
|
||||
TangemPayOnboardingBLocks()
|
||||
}
|
||||
|
||||
NavigationPrimaryButton(
|
||||
modifier = Modifier
|
||||
.imePadding()
|
||||
.padding(start = 16.dp, end = 16.dp, bottom = 16.dp)
|
||||
.fillMaxWidth(),
|
||||
primaryButton = NavigationButton(
|
||||
textReference = resourceReference(R.string.tangempay_onboarding_get_card_button_text),
|
||||
iconRes = R.drawable.ic_tangem_24,
|
||||
isIconVisible = true,
|
||||
showProgress = state.buttonLoading,
|
||||
onClick = {},
|
||||
),
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,3 +1,9 @@
|
|||
package com.tangem.features.tangempay.ui
|
||||
|
||||
internal object TangemPayOnboardingScreenState
|
||||
import javax.annotation.concurrent.Immutable
|
||||
|
||||
@Immutable
|
||||
internal data class TangemPayOnboardingScreenState(
|
||||
val fullScreenLoading: Boolean = true,
|
||||
val buttonLoading: Boolean = false,
|
||||
)
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 479 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 192 KiB |
Loading…
Add table
Add a link
Reference in a new issue