feat: update on ramp provider list UI

bmc08gt · bmc08gt · commit 2003062c9735 · 2025-09-26T17:09:49.000-04:00
Signed-off-by: Brandon McAnsh &lt;git@bmcreations.dev&gt;
diff --git a/apps/flipcash/app/src/main/kotlin/com/flipcash/app/internal/ui/navigation/AppScreenContent.kt b/apps/flipcash/app/src/main/kotlin/com/flipcash/app/internal/ui/navigation/AppScreenContent.kt
@@ -168,6 +168,10 @@ internal fun AppScreenContent(content: @Composable () -> Unit) {
             MyAccountScreen()
         }
 
+        register<AppRoute.Menu.Deposit> {
+            DepositScreen()
+        }
+
         register<AppRoute.Menu.BackupKey> {
             BackupKeyScreen()
         }
@@ -176,10 +180,6 @@ internal fun AppScreenContent(content: @Composable () -> Unit) {
             AdvancedFeaturesScreen()
         }
 
-        register<AppRoute.Advanced.Deposit> {
-            DepositScreen()
-        }
-
         register<AppRoute.Advanced.PoolList> {
             PoolListScreen()
         }
diff --git a/apps/flipcash/core/src/main/kotlin/com/flipcash/app/core/AppRoute.kt b/apps/flipcash/core/src/main/kotlin/com/flipcash/app/core/AppRoute.kt
@@ -97,6 +97,7 @@ sealed interface AppRoute : ScreenProvider, Parcelable {
     @Parcelize
     sealed interface Menu: AppRoute {
         data object MyAccount : Menu
+        data object Deposit : Menu
         data object BackupKey : Menu
         data object AppSettings : Menu
         data object AdvancedFeatures : Menu
@@ -106,6 +107,5 @@ sealed interface AppRoute : ScreenProvider, Parcelable {
     @Parcelize
     sealed interface Advanced: AppRoute {
         data object PoolList : Advanced
-        data object Deposit : Transfers
     }
 }
diff --git a/apps/flipcash/core/src/main/kotlin/com/flipcash/app/core/transfers/TransferDirection.kt b/apps/flipcash/core/src/main/kotlin/com/flipcash/app/core/transfers/TransferDirection.kt
@@ -27,7 +27,7 @@ sealed interface TransferDirection : Parcelable {
 
     data object Incoming : TransferDirection {
         @IgnoredOnParcel
-        override val nextScreen: AppRoute = AppRoute.Advanced.Deposit
+        override val nextScreen: AppRoute = AppRoute.Menu.Deposit
         override val title: String
             @Composable get() = stringResource(R.string.title_depositUsdc)
         override val description: String
diff --git a/apps/flipcash/core/src/main/res/drawable/ic_usdc_on_solana.xml b/apps/flipcash/core/src/main/res/drawable/ic_usdc_on_solana.xml
@@ -0,0 +1,38 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:aapt="http://schemas.android.com/aapt"
+    android:width="144dp"
+    android:height="144dp"
+    android:viewportWidth="144"
+    android:viewportHeight="144">
+  <path
+      android:pathData="M65,128.29C100.55,128.29 129.15,99.69 129.15,64.15C129.15,28.6 100.55,0 65,0C29.45,0 0.85,28.6 0.85,64.15C0.85,99.69 29.45,128.29 65,128.29Z"
+      android:fillColor="#2775CA"/>
+  <path
+      android:pathData="M77.3,20.05C77.56,18.98 78.63,18.44 79.7,18.98C94.4,23.79 106.16,35.28 110.98,50.52C119,75.91 105.1,102.9 79.7,110.92C79.43,111.19 78.9,111.19 78.63,111.19C77.56,110.92 77.03,110.12 77.03,109.05V105.31C77.03,103.97 77.56,103.17 78.63,102.63C89.59,98.62 98.41,90.07 102.42,78.85C110.17,58.27 99.48,35.01 78.63,27.53C77.83,26.99 77.03,25.93 77.03,24.86V21.11C77.03,20.58 77.03,20.31 77.3,20.05ZM51.37,18.71C52.44,18.98 52.97,19.78 52.97,20.85V24.59C52.97,25.93 52.44,26.73 51.37,27.26C40.41,31.27 31.59,39.82 27.58,51.05C19.83,71.63 30.52,94.88 51.37,102.37C52.17,102.9 52.97,103.97 52.97,104.77V108.51C52.97,109.05 52.97,109.32 52.7,109.58C52.44,110.65 51.37,111.19 50.3,110.65C35.33,105.84 23.83,94.35 19.02,79.38C11,53.99 24.9,26.99 50.3,18.98C50.57,18.71 51.1,18.71 51.37,18.71ZM66.87,32.61C68.21,32.88 69.01,33.68 69.01,34.75V41.16C75.16,41.7 79.97,46.24 81.04,52.12V52.39C81.04,53.46 80.24,54.26 79.17,54.26H74.89C74.09,54.26 73.29,53.72 73.02,52.92C71.68,48.91 69.01,47.31 64.2,47.31C58.85,47.31 56.18,49.71 56.18,53.46C56.18,57.2 57.78,59.34 65.8,60.41C77.03,61.74 82.64,64.95 82.64,74.3C82.64,81.52 77.3,87.13 69.28,88.47V94.89C69.01,96.22 68.21,97.02 67.14,97.02H63.13C61.79,96.76 60.99,95.95 60.99,94.89V88.47C52.17,87.13 47.89,82.32 46.82,75.64V75.37C46.82,74.3 47.63,73.5 48.69,73.5H53.24C54.04,73.5 54.84,74.04 55.11,75.11C55.91,79.12 58.32,82.06 65.27,82.06C70.35,82.06 74.09,79.12 74.09,74.84C74.09,70.56 71.68,68.96 64.2,67.62C52.97,66.29 47.63,62.81 47.63,53.99C47.63,47.31 52.7,41.96 60.72,40.9V34.75C60.99,33.41 61.79,32.61 62.86,32.61H66.87Z"
+      android:fillColor="#ffffff"/>
+  <path
+      android:pathData="M118.55,119.01m-22.18,0a22.18,22.18 0,1 1,44.37 0a22.18,22.18 0,1 1,-44.37 0"
+      android:strokeWidth="5.16914"
+      android:fillColor="#ffffff">
+    <aapt:attr name="android:strokeColor">
+      <gradient
+          android:startX="118.55"
+          android:startY="99.41"
+          android:endX="118.55"
+          android:endY="138.61"
+          android:type="linear">
+        <item android:offset="0" android:color="#FF001A0C"/>
+        <item android:offset="1" android:color="#FF001A0C"/>
+      </gradient>
+    </aapt:attr>
+  </path>
+  <path
+      android:pathData="M129.45,123.45C129.78,123.45 129.95,123.85 129.71,124.08L126.16,127.64C126.02,127.77 125.83,127.85 125.64,127.85H107.64C107.57,127.85 107.5,127.83 107.43,127.79C107.37,127.75 107.33,127.69 107.3,127.62C107.27,127.56 107.26,127.48 107.28,127.41C107.29,127.34 107.33,127.27 107.38,127.22L110.93,123.67C111.07,123.53 111.26,123.45 111.46,123.45H129.45Z"
+      android:fillColor="#001A0C"/>
+  <path
+      android:pathData="M125.64,116.77C125.83,116.77 126.02,116.85 126.16,116.99L129.71,120.54C129.95,120.78 129.78,121.17 129.45,121.17H111.46C111.26,121.17 111.07,121.09 110.93,120.96L107.38,117.4C107.33,117.35 107.29,117.28 107.28,117.21C107.26,117.14 107.27,117.07 107.3,117C107.33,116.93 107.37,116.87 107.43,116.83C107.5,116.79 107.57,116.77 107.64,116.77H125.64Z"
+      android:fillColor="#001A0C"/>
+  <path
+      android:pathData="M129.45,110.18C129.78,110.18 129.95,110.57 129.71,110.81L126.16,114.36C126.02,114.5 125.83,114.58 125.64,114.58H107.64C107.57,114.58 107.5,114.56 107.43,114.51C107.37,114.47 107.33,114.42 107.3,114.35C107.27,114.28 107.26,114.21 107.28,114.14C107.29,114.07 107.33,114 107.38,113.95L110.93,110.39L110.93,110.39C111.07,110.25 111.26,110.18 111.46,110.18H129.45Z"
+      android:fillColor="#001A0C"/>
+</vector>
diff --git a/apps/flipcash/core/src/main/res/values/strings.xml b/apps/flipcash/core/src/main/res/values/strings.xml
@@ -400,4 +400,6 @@
 
     <string name="action_sendAsLink">Send as a Link</string>
 
+    <string name="subtitle_addUsdcToWallet">Add Solana USDC to your Flipcash wallet</string>
+
 </resources>
diff --git a/apps/flipcash/features/advanced/src/main/kotlin/com/flipcash/app/advanced/internal/AdvancedFeatureMenuItems.kt b/apps/flipcash/features/advanced/src/main/kotlin/com/flipcash/app/advanced/internal/AdvancedFeatureMenuItems.kt
@@ -8,16 +8,6 @@ import com.flipcash.app.core.AppRoute
 import com.flipcash.app.menu.FullMenuItem
 import com.flipcash.features.advanced.R
 
-internal data object Deposit : FullMenuItem<AdvancedFeaturesScreenViewModel.Event>() {
-    override val icon: Painter
-        @Composable get() = painterResource(R.drawable.ic_menu_deposit)
-    override val name: String
-        @Composable get() = stringResource(R.string.title_depositUsdc)
-    override val action: AdvancedFeaturesScreenViewModel.Event = AdvancedFeaturesScreenViewModel.Event.OpenScreen(
-        AppRoute.OnRamp.ProviderList(AppRoute.Sheets.Menu)
-    )
-}
-
 internal data object Pools : FullMenuItem<AdvancedFeaturesScreenViewModel.Event>() {
     override val icon: Painter
         @Composable get() = painterResource(R.drawable.ic_flipcash_pools)
diff --git a/apps/flipcash/features/advanced/src/main/kotlin/com/flipcash/app/advanced/internal/AdvancedFeaturesScreenViewModel.kt b/apps/flipcash/features/advanced/src/main/kotlin/com/flipcash/app/advanced/internal/AdvancedFeaturesScreenViewModel.kt
@@ -14,7 +14,6 @@ import kotlinx.coroutines.flow.map
 import javax.inject.Inject
 
 private val FullMenuList = buildList {
-    add(Deposit)
     add(Pools)
 }
 
diff --git a/apps/flipcash/features/menu/src/main/kotlin/com/flipcash/app/menu/internal/MenuItems.kt b/apps/flipcash/features/menu/src/main/kotlin/com/flipcash/app/menu/internal/MenuItems.kt
@@ -27,6 +27,16 @@ internal data object MyAccount : FullMenuItem<MenuScreenViewModel.Event>() {
     )
 }
 
+internal data object Deposit : FullMenuItem<MenuScreenViewModel.Event>() {
+    override val icon: Painter
+        @Composable get() = painterResource(R.drawable.ic_menu_deposit)
+    override val name: String
+        @Composable get() = stringResource(R.string.title_depositUsdc)
+    override val action: MenuScreenViewModel.Event = MenuScreenViewModel.Event.OpenScreen(
+        AppRoute.OnRamp.ProviderList(AppRoute.Sheets.Menu)
+    )
+}
+
 internal data object AdvancedFeatures : FullMenuItem<MenuScreenViewModel.Event>() {
     override val icon: Painter
         @Composable get() = painterResource(R.drawable.ic_advanced_features)
diff --git a/apps/flipcash/features/menu/src/main/kotlin/com/flipcash/app/menu/internal/MenuScreenViewModel.kt b/apps/flipcash/features/menu/src/main/kotlin/com/flipcash/app/menu/internal/MenuScreenViewModel.kt
@@ -37,6 +37,7 @@ import javax.inject.Inject
 
 private val FullMenuList = buildList {
     add(MyAccount)
+    add(Deposit)
     add(AppSettings)
     add(AdvancedFeatures)
     add(SwitchAccount)
diff --git a/apps/flipcash/features/onramp/src/main/kotlin/com/flipcash/app/onramp/OnRampProviderListScreen.kt b/apps/flipcash/features/onramp/src/main/kotlin/com/flipcash/app/onramp/OnRampProviderListScreen.kt
@@ -44,7 +44,7 @@ class OnRampProviderListScreen(
     override val key: ScreenKey = uniqueScreenKey
 
     override val name: String
-        @Composable get() = stringResource(R.string.title_selectMethod)
+        @Composable get() = stringResource(R.string.title_depositUsdc)
 
     @Composable
     override fun ModalContent() {
diff --git a/apps/flipcash/features/onramp/src/main/kotlin/com/flipcash/app/onramp/internal/OnRampViewModel.kt b/apps/flipcash/features/onramp/src/main/kotlin/com/flipcash/app/onramp/internal/OnRampViewModel.kt
@@ -71,7 +71,7 @@ internal data class AmountEntryState(
 private val DefaultOnRampOptions = listOf(
     OnRampProviderItem(
         provider = OnRampProvider.ManualDeposit,
-        destination = OnRampProviderDestination.Screen(AppRoute.Advanced.Deposit)
+        destination = OnRampProviderDestination.Screen(AppRoute.Menu.Deposit)
     )
 )
 
@@ -292,7 +292,7 @@ internal class OnRampViewModel @Inject constructor(
                                 destination = when (provider) {
                                     OnRampProvider.ManualDeposit ->
                                         OnRampProviderDestination.Screen(
-                                            AppRoute.Advanced.Deposit
+                                            AppRoute.Menu.Deposit
                                         )
 
                                     is OnRampProvider.Coinbase -> {
diff --git a/apps/flipcash/features/onramp/src/main/kotlin/com/flipcash/app/onramp/internal/screens/OnRampProviderListScreenContent.kt b/apps/flipcash/features/onramp/src/main/kotlin/com/flipcash/app/onramp/internal/screens/OnRampProviderListScreenContent.kt
@@ -1,11 +1,15 @@
 package com.flipcash.app.onramp.internal.screens
 
 import androidx.compose.foundation.Image
+import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxSize
 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.lazy.LazyColumn
@@ -18,12 +22,20 @@ import androidx.compose.runtime.getValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
+import androidx.compose.ui.util.fastForEach
 import androidx.lifecycle.compose.collectAsStateWithLifecycle
+import com.flipcash.app.core.AppRoute
 import com.flipcash.app.onramp.internal.OnRampViewModel
+import com.flipcash.app.onramp.internal.data.OnRampProviderDestination
 import com.flipcash.app.onramp.internal.data.OnRampProviderItem
+import com.flipcash.app.theme.FlipcashDesignSystem
 import com.flipcash.features.onramp.R
+import com.flipcash.services.internal.model.thirdparty.OnRampProvider
 import com.getcode.theme.CodeTheme
+import com.getcode.theme.extraSmall
 import com.getcode.ui.core.rememberedClickable
 
 @Composable
@@ -46,7 +58,27 @@ private fun OnRampProviderListScreenContent(
     LazyColumn(
         modifier = Modifier.fillMaxSize(),
         contentPadding = PaddingValues(horizontal = CodeTheme.dimens.inset),
+        verticalArrangement = Arrangement.spacedBy(CodeTheme.dimens.grid.x3)
     ) {
+        item {
+            Column(
+                modifier = Modifier.fillParentMaxWidth(),
+                verticalArrangement = Arrangement.spacedBy(CodeTheme.dimens.grid.x7),
+                horizontalAlignment = Alignment.CenterHorizontally,
+            ) {
+                Spacer(Modifier.height(CodeTheme.dimens.grid.x4))
+                Image(
+                    painter = painterResource(id = R.drawable.ic_usdc_on_solana),
+                    contentDescription = null
+                )
+                Text(
+                    text = stringResource(R.string.subtitle_addUsdcToWallet),
+                    style = CodeTheme.typography.textMedium,
+                    color = CodeTheme.colors.textSecondary,
+                )
+                Spacer(Modifier.height(CodeTheme.dimens.grid.x1))
+            }
+        }
         items(state.providers) { provider ->
             OnRampProviderCell(
                 provider = provider,
@@ -66,10 +98,14 @@ private fun OnRampProviderCell(
 ) {
     Row(
         modifier = modifier
+            .background(
+                color = CodeTheme.colors.surfaceVariant,
+                shape = CodeTheme.shapes.extraSmall,
+            )
             .rememberedClickable(onClick = onClick)
             .padding(
-                horizontal = CodeTheme.dimens.grid.x2,
-                vertical = CodeTheme.dimens.grid.x4,
+                horizontal = CodeTheme.dimens.grid.x4,
+                vertical = CodeTheme.dimens.grid.x5,
             ),
         horizontalArrangement = Arrangement.spacedBy(CodeTheme.dimens.grid.x3),
         verticalAlignment = Alignment.CenterVertically,
@@ -93,4 +129,27 @@ private fun OnRampProviderCell(
             tint = CodeTheme.colors.secondary,
         )
     }
+}
+
+@Composable
+@Preview
+private fun ProviderCellPreview() {
+    FlipcashDesignSystem {
+        Column(
+            modifier = Modifier
+                .fillMaxSize()
+                .background(CodeTheme.colors.background)
+                .padding(horizontal = CodeTheme.dimens.inset),
+            verticalArrangement = Arrangement.spacedBy(CodeTheme.dimens.grid.x3)
+        ) {
+            OnRampProvider.types.fastForEach {
+                OnRampProviderCell(
+                    provider = OnRampProviderItem(
+                        provider = it,
+                        destination = OnRampProviderDestination.Screen(AppRoute.OnRamp.AmountEntry),
+                    ),
+                ) { }
+            }
+        }
+    }
 }
diff --git a/services/flipcash/src/main/kotlin/com/flipcash/services/internal/model/thirdparty/OnRampProvider.kt b/services/flipcash/src/main/kotlin/com/flipcash/services/internal/model/thirdparty/OnRampProvider.kt
@@ -15,6 +15,15 @@ sealed interface OnRampProvider {
     data object Phantom: OnRampProvider, ThirdParty, UsesDeeplinks
     data object Solflare: OnRampProvider, ThirdParty, UsesDeeplinks
     data object Backpack: OnRampProvider, ThirdParty, UsesDeeplinks
+
+    companion object {
+        val types: List<OnRampProvider.Defined> = listOf(
+            Phantom,
+            Solflare,
+            Backpack,
+            ManualDeposit
+        )
+    }
 }
 
 enum class OnRampType {

Original file line number	Diff line number	Diff line change
`@@ -168,6 +168,10 @@ internal fun AppScreenContent(content: @Composable () -> Unit) {`
`168`	`168`	`MyAccountScreen()`
`169`	`169`	`}`
`170`	`170`
	`171`	`+ register<AppRoute.Menu.Deposit> {`
	`172`	`+ DepositScreen()`
	`173`	`+ }`
	`174`	`+`
`171`	`175`	`register<AppRoute.Menu.BackupKey> {`
`172`	`176`	`BackupKeyScreen()`
`173`	`177`	`}`
`@@ -176,10 +180,6 @@ internal fun AppScreenContent(content: @Composable () -> Unit) {`
`176`	`180`	`AdvancedFeaturesScreen()`
`177`	`181`	`}`
`178`	`182`
`179`		`- register<AppRoute.Advanced.Deposit> {`
`180`		`- DepositScreen()`
`181`		`- }`
`182`		`-`
`183`	`183`	`register<AppRoute.Advanced.PoolList> {`
`184`	`184`	`PoolListScreen()`
`185`	`185`	`}`
Original file line number	Diff line number	Diff line change
`@@ -97,6 +97,7 @@ sealed interface AppRoute : ScreenProvider, Parcelable {`
`97`	`97`	`@Parcelize`
`98`	`98`	`sealed interface Menu: AppRoute {`
`99`	`99`	`data object MyAccount : Menu`
	`100`	`+ data object Deposit : Menu`
`100`	`101`	`data object BackupKey : Menu`
`101`	`102`	`data object AppSettings : Menu`
`102`	`103`	`data object AdvancedFeatures : Menu`
`@@ -106,6 +107,5 @@ sealed interface AppRoute : ScreenProvider, Parcelable {`
`106`	`107`	`@Parcelize`
`107`	`108`	`sealed interface Advanced: AppRoute {`
`108`	`109`	`data object PoolList : Advanced`
`109`		`- data object Deposit : Transfers`
`110`	`110`	`}`
`111`	`111`	`}`
Original file line number	Diff line number	Diff line change
`@@ -14,7 +14,6 @@ import kotlinx.coroutines.flow.map`
`14`	`14`	`import javax.inject.Inject`
`15`	`15`
`16`	`16`	`private val FullMenuList = buildList {`
`17`		`- add(Deposit)`
`18`	`17`	`add(Pools)`
`19`	`18`	`}`
`20`	`19`