diff --git a/apps/flipcash/core/src/main/res/drawable/ic_bill_previews.webp b/apps/flipcash/core/src/main/res/drawable/ic_bill_previews.webp new file mode 100644 index 000000000..e1bfd1d23 Binary files /dev/null and b/apps/flipcash/core/src/main/res/drawable/ic_bill_previews.webp differ diff --git a/apps/flipcash/core/src/main/res/values/strings.xml b/apps/flipcash/core/src/main/res/values/strings.xml index 4c1be43c1..af3c0de19 100644 --- a/apps/flipcash/core/src/main/res/values/strings.xml +++ b/apps/flipcash/core/src/main/res/values/strings.xml @@ -494,7 +494,7 @@ Retry Unable To Load - Currencies + Discover Currencies Discover Currencies Popular New @@ -508,6 +508,7 @@ No currencies have been created in the last week No popular currencies right now Create Your Own Currency + Create a currency in minutes and immediately use it as cash Not Yet Available Check back soon @@ -632,4 +633,6 @@ Less fee Net amount Amount in %1$s + + Leaderboard \ No newline at end of file diff --git a/apps/flipcash/features/balance/src/main/kotlin/com/flipcash/app/balance/internal/BalanceScreenContent.kt b/apps/flipcash/features/balance/src/main/kotlin/com/flipcash/app/balance/internal/BalanceScreenContent.kt index 7ad43b43d..1d8f4087b 100644 --- a/apps/flipcash/features/balance/src/main/kotlin/com/flipcash/app/balance/internal/BalanceScreenContent.kt +++ b/apps/flipcash/features/balance/src/main/kotlin/com/flipcash/app/balance/internal/BalanceScreenContent.kt @@ -119,7 +119,6 @@ private fun BalanceScreenContent( contentPadding = PaddingValues(), text = stringResource(R.string.action_discoverCurrencies), shape = CircleShape, - buttonState = ButtonState.Filled ) } } @@ -144,6 +143,7 @@ private fun BalanceScreenContent( .padding(bottom = CodeTheme.dimens.grid.x3) .navigationBarsPadding(), text = stringResource(R.string.action_discoverCurrencies), + buttonState = ButtonState.Filled10, onClick = { dispatchEvent( BalanceViewModel.Event.OpenScreen(AppRoute.Token.Discovery) diff --git a/apps/flipcash/features/discovery/src/main/kotlin/com/flipcash/app/discovery/internal/TokenDiscoveryScreenContent.kt b/apps/flipcash/features/discovery/src/main/kotlin/com/flipcash/app/discovery/internal/TokenDiscoveryScreenContent.kt index a1690056a..fbc65225b 100644 --- a/apps/flipcash/features/discovery/src/main/kotlin/com/flipcash/app/discovery/internal/TokenDiscoveryScreenContent.kt +++ b/apps/flipcash/features/discovery/src/main/kotlin/com/flipcash/app/discovery/internal/TokenDiscoveryScreenContent.kt @@ -60,39 +60,7 @@ private fun TokenDiscoveryScreenContent( dispatch: (TokenDiscoveryViewModel.Event) -> Unit ) { val listState = rememberLazyListState() - CodeScaffold( - bottomBar = { - if (state.createEnabled) { - Box { - var buttonHeight by remember { mutableStateOf(0.dp) } - Box( - modifier = Modifier - .fillMaxWidth() - .height(buttonHeight) - .drawWithGradient( - color = CodeTheme.colors.background, - startY = { 0f }, - endY = { size.height * 0.38f } - ) - ) - CodeButton( - modifier = Modifier - .fillMaxWidth() - .measured { buttonHeight = it.height } - .navigationBarsPadding() - .padding(horizontal = CodeTheme.dimens.inset) - .padding( - top = CodeTheme.dimens.grid.x9, - bottom = CodeTheme.dimens.grid.x3 - ), - text = stringResource(R.string.action_createYourOwnCurrency), - ) { - dispatch(TokenDiscoveryViewModel.Event.CreateCurrency) - } - } - } - }, - ) { padding -> + CodeScaffold { padding -> AnimatedContent( targetState = state.tokens, transitionSpec = { fadeIn(tween()) togetherWith fadeOut(tween()) }, diff --git a/apps/flipcash/features/discovery/src/main/kotlin/com/flipcash/app/discovery/internal/components/TokenLeaderboard.kt b/apps/flipcash/features/discovery/src/main/kotlin/com/flipcash/app/discovery/internal/components/TokenLeaderboard.kt index a86f7ba70..9e83a5356 100644 --- a/apps/flipcash/features/discovery/src/main/kotlin/com/flipcash/app/discovery/internal/components/TokenLeaderboard.kt +++ b/apps/flipcash/features/discovery/src/main/kotlin/com/flipcash/app/discovery/internal/components/TokenLeaderboard.kt @@ -22,6 +22,7 @@ import androidx.compose.ui.unit.dp import com.flipcash.app.core.data.Loadable import com.flipcash.app.core.data.isLoaded import com.flipcash.app.discovery.internal.TokenDiscoveryViewModel +import com.flipcash.app.tokens.ui.CurrencyCreatorUpsellCard import com.flipcash.features.discovery.R import com.getcode.opencode.model.financial.Token import com.getcode.opencode.model.ui.DiscoverCategory @@ -103,6 +104,13 @@ internal fun TokenLeaderboard( is Loadable.Loaded -> { val results = tokens.data + // currency creator upsell card + item { + CurrencyCreatorUpsellCard(modifier = Modifier.fillParentMaxWidth()) { + dispatch(TokenDiscoveryViewModel.Event.CreateCurrency) + } + } + if (results.isEmpty()) { item { Box( @@ -135,6 +143,19 @@ internal fun TokenLeaderboard( } } } else { + // leaderboard header + item { + Text( + modifier = Modifier.padding( + top = CodeTheme.dimens.inset, + bottom = CodeTheme.dimens.grid.x1, + ), + text = stringResource(R.string.title_leaderboard), + style = CodeTheme.typography.textLarge, + color = CodeTheme.colors.textMain, + ) + } + itemsIndexed( items = tokens.data, key = { _, t -> t.address.base58() }, diff --git a/apps/flipcash/shared/tokens/src/main/kotlin/com/flipcash/app/tokens/ui/CurrencyCreatorUpsellCard.kt b/apps/flipcash/shared/tokens/src/main/kotlin/com/flipcash/app/tokens/ui/CurrencyCreatorUpsellCard.kt new file mode 100644 index 000000000..672c5f01e --- /dev/null +++ b/apps/flipcash/shared/tokens/src/main/kotlin/com/flipcash/app/tokens/ui/CurrencyCreatorUpsellCard.kt @@ -0,0 +1,105 @@ +package com.flipcash.app.tokens.ui + +import androidx.compose.foundation.Image +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.padding +import androidx.compose.foundation.layout.requiredSize +import androidx.compose.material.icons.Icons +import androidx.compose.material.icons.automirrored.filled.ArrowForward +import androidx.compose.material3.Icon +import androidx.compose.material3.Surface +import androidx.compose.material3.Text +import androidx.compose.runtime.Composable +import androidx.compose.runtime.getValue +import androidx.compose.runtime.mutableStateOf +import androidx.compose.runtime.remember +import androidx.compose.runtime.setValue +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.layout.onSizeChanged +import androidx.compose.ui.platform.LocalDensity +import androidx.compose.ui.res.painterResource +import androidx.compose.ui.res.stringResource +import androidx.compose.ui.tooling.preview.Preview +import androidx.compose.ui.tooling.preview.PreviewWrapper +import androidx.compose.ui.unit.dp +import com.flipcash.app.theme.FlipcashThemeWrapper +import com.flipcash.shared.tokens.R +import com.getcode.theme.CodeTheme + +@Composable +fun CurrencyCreatorUpsellCard( + modifier: Modifier = Modifier, + onClick: () -> Unit, +) { + Surface( + modifier = modifier, + color = CodeTheme.colors.surfaceVariant, + contentColor = CodeTheme.colors.textMain, + shape = CodeTheme.shapes.medium, + tonalElevation = 0.dp, + shadowElevation = 0.dp, + onClick = onClick + ) { + Box(modifier = Modifier.fillMaxWidth()) { + val density = LocalDensity.current + var imageWidth by remember { mutableStateOf(0.dp) } + + Column( + modifier = Modifier + .fillMaxWidth() + .padding( + start = CodeTheme.dimens.grid.x3, + top = CodeTheme.dimens.grid.x3, + ), + verticalArrangement = Arrangement.spacedBy(CodeTheme.dimens.grid.x1), + ) { + Row( + modifier = Modifier.fillMaxWidth(), + verticalAlignment = Alignment.CenterVertically, + horizontalArrangement = Arrangement.spacedBy(CodeTheme.dimens.grid.x2) + ) { + Text( + text = stringResource(R.string.action_createYourOwnCurrency), + style = CodeTheme.typography.screenTitle, + color = CodeTheme.colors.textMain, + ) + Icon( + modifier = Modifier.requiredSize(CodeTheme.dimens.staticGrid.x4), + imageVector = Icons.AutoMirrored.Default.ArrowForward, + contentDescription = null, + tint = CodeTheme.colors.textMain, + ) + } + + Text( + modifier = Modifier.padding(end = imageWidth), + text = stringResource(R.string.subtitle_createYourOwnCurrency), + style = CodeTheme.typography.textSmall, + color = CodeTheme.colors.textSecondary, + ) + } + + Image( + modifier = Modifier + .align(Alignment.BottomEnd) + .onSizeChanged { size -> + imageWidth = with(density) { size.width.toDp() } + }, + painter = painterResource(R.drawable.ic_bill_previews), + contentDescription = null, + ) + } + } +} + +@Preview +@PreviewWrapper(FlipcashThemeWrapper::class) +@Composable +private fun Preview_CurrencyCreatorUpsellCard() { + CurrencyCreatorUpsellCard() { } +} \ No newline at end of file